# Tema Ar
**URL:** https://meta.discourse.org/t/air-theme/197703
**Category:** Theme
**Tags:** air-theme
**Created:** [Julho 20, 2021, 8:24pm UTC](https://meta.discourse.org/t/air-theme/197703 "2021-07-20T20:24:30Z")
**Posts on this page:** 20
**Page:** 17
### Author:  [@Heliosurge](https://meta.discourse.org/u/Heliosurge)
#### Post date: [Agosto 23, 2024, 12:56am UTC](https://meta.discourse.org/t/air-theme/197703/527 "2024-08-23T00:56:36Z")
Você criou um novo componente de tema e o adicionou a este tema, o tema Air?
Você viu minhas modificações acima. Você está tentando substituir partes das configurações do tema ou, como na minha postagem acima, adicionar modificações/correções?
---
### Author:  [@dviedma](https://meta.discourse.org/u/dviedma)
#### Post date: [Agosto 23, 2024, 4:20pm UTC](https://meta.discourse.org/t/air-theme/197703/528 "2024-08-23T16:20:28Z")
Obrigado, Dan! Consegui descobrir como adicionar um novo componente e, em seguida, adicionar CSS personalizado lá.
---
### Author:  [@Heliosurge](https://meta.discourse.org/u/Heliosurge)
#### Post date: [Agosto 23, 2024, 5:43pm UTC](https://meta.discourse.org/t/air-theme/197703/529 "2024-08-23T17:43:28Z")
Se você quiser substituir uma configuração. Use "!important"
Por exemplo
```plaintext
.some-selector {
padding-top: 2.5em !important;
{
```
Ainda estou aprendendo. O Discourse é bem diversificado.
---
### Author:  [@musicmaker3112](https://meta.discourse.org/u/musicmaker3112)
#### Post date: [Setembro 5, 2024, 4:51am UTC](https://meta.discourse.org/t/air-theme/197703/530 "2024-09-05T04:51:23Z")
Obrigado pelo ótimo tema. Tudo funciona. Mas tenho a pergunta de como posso mudar a imagem de fundo?
Obrigado pela ajuda.
---
### Author:  [@Vaping\_Community](https://meta.discourse.org/u/Vaping_Community)
#### Post date: [Setembro 19, 2024, 2:27am UTC](https://meta.discourse.org/t/air-theme/197703/531 "2024-09-19T02:27:41Z")
Crie um componente de tema e adicione-o com sua imagem de fundo
```css
html .background-container {
position: fixed;
top: 0;
left: 0;
height: 100vh;
width: 100vw;
background-image: url();
background-size: cover;
opacity: 1;
/* background: linear-gradient(90deg, var(--tertiary-hover) 0%, var(--tertiary) 100%); */
clip-path: unset;
background-color: var(--secondary) !important;
}
```
> [@Developing Discourse Themes & Theme Components](https://meta.discourse.org/t/beginners-guide-to-developing-discourse-themes/93648):
>
> Discourse Themes and Theme Components can be used to customize the look, feel and functionality of Discourse’s frontend. This section of the developer guides aims to provide all the reference materials you need to develop simple themes for a single site, right up to complex open-source theme components. This introduction aims to provide a map of all the tools and APIs for theme development. If you prefer a step-by-step tutorial for theme development, jump straight to: Themes vs. Theme Compon…
---
### Author:  [@Liseré](https://meta.discourse.org/u/Liser%C3%A9)
#### Post date: [Outubro 3, 2024, 10:21am UTC](https://meta.discourse.org/t/air-theme/197703/532 "2024-10-03T10:21:28Z")
Olá pessoal,
Existe alguma forma de adicionar alguns links externos no cabeçalho, perto do logo?
Obrigado!
---
### Author:  [@Heliosurge](https://meta.discourse.org/u/Heliosurge)
#### Post date: [Outubro 3, 2024, 3:27pm UTC](https://meta.discourse.org/t/air-theme/197703/533 "2024-10-03T15:27:35Z")
Existe este aqui
> [@Custom Header Links (icons)](https://meta.discourse.org/t/custom-header-links-icons/86307):
>
> discourse2Summary Custom Header Links (icons) will allow you to easily add linked icons to the Discourse header.eyeglassesPreview [Preview on Discourse Theme Creator](https://discourse.theme-creator.io/theme/Discourse/custom-header-links-icons)hammer_and_wrenchRepository Link [https://github.com/discourse/discourse-icon-header-links](https://github.com/discourse/discourse-icon-header-links)open_bookNew to Discourse Themes? [Beginner’s guide to using Discourse Themes](https://meta.discourse.org/t/beginners-guide-to-using-discourse-themes/91966) Install this theme component Features Screenshots Desktop Mobile Settings This component includes a …
E
> [@down\_arrow Dropdown Header](https://meta.discourse.org/t/dropdown-header/226170):
>
> mag Overview This theme component allows you to add links with text, icons, and dropdowns to the native header of your Discourse site. Bug reports, feature requests, and PRs are most welcome; sponsorship enables work on this component to be prioritised by the Pavilion team. computer Code [View the GitHub Repo](https://github.com/paviliondev/discourse-dropdown-header)gear Settings There are a variety of settings you can configure to customize the component, including link customizations, icon sourcing, adding link security, positioning…
Também existe um que adiciona uma barra com menus suspensos abaixo do cabeçalho do site
> [@Header Submenus](https://meta.discourse.org/t/header-submenus/94584/67):
>
> Nice update Joe, I’ve only run into two problems on mobile. You can no longer scroll side to side if you have a lot of menu items. When you tap an item in the dropdown, the dropdown stays open
---
### Author:  [@Liseré](https://meta.discourse.org/u/Liser%C3%A9)
#### Post date: [Outubro 3, 2024, 4:49pm UTC](https://meta.discourse.org/t/air-theme/197703/534 "2024-10-03T16:49:30Z")
Olá,
Muito obrigado por reservar um tempo para responder.
Eu estava usando este, mas não fiquei totalmente satisfeito: [Custom Top Navigation Links](https://meta.discourse.org/t/custom-top-navigation-links/87225)
Sua segunda sugestão é exatamente o que eu preciso, estou muito feliz com o resultado.
Muito obrigado pela sua ajuda!
---
### Author:  [@Liseré](https://meta.discourse.org/u/Liser%C3%A9)
#### Post date: [Outubro 4, 2024, 1:19pm UTC](https://meta.discourse.org/t/air-theme/197703/535 "2024-10-04T13:19:13Z")
Olá a todos,
Desculpem esta mensagem dupla, mas existe uma forma de mostrar as subcategorias tanto no desktop como no telemóvel e, ao mesmo tempo, exibir os títulos completos das categorias no telemóvel quando estes são um pouco longos?
A minha configuração é CATEGORY BOXES WITH SUBCATEGORIES, mas sem usar Modern Category + Group Boxes.
O resultado é ótimo no desktop e no telemóvel quando uso a versão desktop. Mas com a versão mobile não se consegue ler o final de alguns títulos de categoria.
Muito obrigado pela vossa ajuda!
---
### Author:  [@Heliosurge](https://meta.discourse.org/u/Heliosurge)
#### Post date: [Outubro 4, 2024, 5:12pm UTC](https://meta.discourse.org/t/air-theme/197703/536 "2024-10-04T17:12:36Z")
Você pode postar um ss?
---
### Author:  [@Liseré](https://meta.discourse.org/u/Liser%C3%A9)
#### Post date: [Outubro 4, 2024, 5:28pm UTC](https://meta.discourse.org/t/air-theme/197703/537 "2024-10-04T17:28:50Z")
Claro, por favor, encontre em anexo 2 capturas de tela do meu iPhone, uma versão mobile e uma versão desktop.
---
### Author:  [@Heliosurge](https://meta.discourse.org/u/Heliosurge)
#### Post date: [Outubro 4, 2024, 5:48pm UTC](https://meta.discourse.org/t/air-theme/197703/538 "2024-10-04T17:48:12Z")
Vejo subcategorias aparecendo em ambos. Você gostaria de ter a descrição da categoria em ambos? Ou espelhar o desktop sem descrição?
---
### Author:  [@Liseré](https://meta.discourse.org/u/Liser%C3%A9)
#### Post date: [Outubro 4, 2024, 5:58pm UTC](https://meta.discourse.org/t/air-theme/197703/539 "2024-10-04T17:58:31Z")
Desculpe se não fui claro.
Gostaria de ver os títulos completos das categorias.
Por exemplo, na versão desktop, você tem «Discussions Générales sur la mode», mas na versão mobile, você tem apenas «Discussions Générales».
---
### Author:  [@Heliosurge](https://meta.discourse.org/u/Heliosurge)
#### Post date: [Outubro 4, 2024, 6:05pm UTC](https://meta.discourse.org/t/air-theme/197703/540 "2024-10-04T18:05:06Z")
Não tenho certeza do código CSS de imediato. Mas você deve conseguir fazer com que o título da categoria quebre a linha como na primeira imagem que você postou.
Talvez tente inspecionar o elemento no desktop para ver se consegue identificar o CSS usado para quebrar o nome da categoria em 2 linhas.
---
### Author:  [@Liseré](https://meta.discourse.org/u/Liser%C3%A9)
#### Post date: [Outubro 5, 2024, 10:13am UTC](https://meta.discourse.org/t/air-theme/197703/541 "2024-10-05T10:13:12Z")
Tentei alguns CSS com ChatGPT e Claude, por exemplo:
.category-box-heading,
.category-box-heading a,
.category-box-heading h3 {
max-width: 100%;
width: 100%;
display: block;
word-break: break-word;
overflow-wrap: break-word;
white-space: normal !important;
overflow: visible !important;
text-overflow: clip !important;
line-height: 1.4;
padding: 5px 0;
}
.parent-box-link {
display: block;
width: 100%;
}
@media screen and (max-width: 767px) {
.category-box-heading h3 {
font-size: 16px; /\* Ajuste este valor conforme necessário \*/
}
}
Mas não está funcionando.
Existe alguma maneira de forçar a visualização desktop no celular? Seria perfeito ter a descrição e as subcategorias.
Obrigado!
---
### Author:  [@Jagster](https://meta.discourse.org/u/Jagster)
#### Post date: [Outubro 5, 2024, 11:06am UTC](https://meta.discourse.org/t/air-theme/197703/542 "2024-10-05T11:06:11Z")
Você já tentou ver como fica a visualização de desktop em um celular? Não é muito bom em alguns celulares.
---
### Author:  [@Liseré](https://meta.discourse.org/u/Liser%C3%A9)
#### Post date: [Outubro 5, 2024, 12:52pm UTC](https://meta.discourse.org/t/air-theme/197703/543 "2024-10-05T12:52:00Z")
Obrigado pela sua resposta.
Acabei de tentar em 2 iPhones e foi assim.
Que é exatamente o que eu estou procurando.
Idealmente, eu gostaria que meus usuários tivessem essa visualização diretamente, sem mexer nas configurações.
---
### Author:  [@Heliosurge](https://meta.discourse.org/u/Heliosurge)
#### Post date: [Outubro 6, 2024, 12:16am UTC](https://meta.discourse.org/t/air-theme/197703/544 "2024-10-06T00:16:57Z")
Desative seu componente personalizado. Crie um novo componente de teste em CSS móvel, tente isto
```plaintext
.category-box-heading h3 {
//* Talvez você precise descomentar as 2 linhas abaixo.
// Overflow: unset !important;
// Text-overflow: unset !important;
text-wrap: balance !important;
}
```
Tenho certeza de que você não precisará de nenhuma outra modificação de CSS.
Acabei de testar. Não está funcionando com meu trecho também.
---
### Author:  [@inlann](https://meta.discourse.org/u/inlann)
#### Post date: [Outubro 11, 2024, 9:43am UTC](https://meta.discourse.org/t/air-theme/197703/545 "2024-10-11T09:43:00Z")
Versão mais recente do código eficaz:
```css
.full-width .contents .topic-list thead th.posts {
width: 10%;
}
.full-width .contents .topic-list thead th.activity {
width: 10%;
order: 4;
}
th.num.views {
width: 10%;
order: 3;
display: block;
}
.full-width .contents .topic-list tbody tr:not(.topic-list-item-separator) td.posts {
width: 10%;
order: 2;
}
.full-width .contents .topic-list tbody tr:not(.topic-list-item-separator) td.age {
width: 10%;
order: 4;
}
.topic-list .views {
width: 10% !important;
order: 3 !important;
display: flex !important;
visibility: visible !important;
justify-content: center;
}
.full-width .contents .topic-list tbody tr:not(.topic-list-item-separator) td.views {
width: 10% !important;
order: 3 !important;
display: flex !important;
justify-content: center;
align-items: center;
}
```
---
### Author:  [@newadda](https://meta.discourse.org/u/newadda)
#### Post date: [Novembro 9, 2024, 2:27pm UTC](https://meta.discourse.org/t/air-theme/197703/548 "2024-11-09T14:27:15Z")
Tenho duas perguntas:
1. Como fazer a largura do tema ser em página inteira?
2. Como reduzir o tamanho da fonte da mensagem de boas-vindas padrão na página inicial (Captura de tela anexada).
Alguém pode me ajudar com isso?
[Página anterior](https://meta.discourse.org/t/air-theme/197703.md?page=16)
[Próxima página](https://meta.discourse.org/t/air-theme/197703.md?page=18)