Este mini tutorial tem como intuito instruir para customização do Twitter através de um Arc Boost no Arc Browser.

**Captura de exemplo:**

![Screenshot Twitter Minimalista](https://res.cloudinary.com/dwbfowm1d/image/upload/v1679770171/snippets/arc/twitter-minimalist_arc-boost_ecobyd.png)

Comece basicamente abrindo o __Spotlight__ do seu Arc Browser através do comando ``cmd + T`` e escreva ``New Boost``, após simplesmente aperte ``enter`` e você terá acesso ao **Criador de Boost's**.

No criador de Boost's você deve selecionar a opção ``Style`` pois vamos realizar apenas customização de estilos. Após isso você terá a opção de alterar um único website(A specific website) ou todos websites(All websites).

- O ``A specific website`` ira inserir suas customizações apenas nos websites que você definir.
- O ``All websites`` ira inserir suas customizações em todos os websites que acessamos.
<br />
No nosso caso iremos escolher a opção ``A specific website``, após iremos inserir o link do twitter, e com isso seremos direcionados à uma area de código no qual você vai inserir o código a seguir:

```css:style.css
[data-testid="tweetText"] {
  line-height: 150% !important;
}

.r-m5arl1 {
  width: 0px !important;
}

body {
  background-color: #0f0f0f !important;
}

[data-testid="primaryColumn"], .r-kemksi, .r-5zmot  {
  background-color: #0f0f0f !important;
}

header[role="banner"] > div > div > div,
header[role="banner"] > div > div > div > div:first-child {
  display: flex;
  justify-content: center;
  align-items: center;
  width: fit-content;
}

[data-testid="tweet"] {
  margin-top: 8px !important;
  margin-bottom: 8px !important;
  padding: 8px 16px 8px 16px  !important;
  border-radius: 12px !important;
  position: relative !important;
  background: linear-gradient(to right bottom, #0f0f0f, #1b1b1b) !important;
  height: -moz-fit-content !important;
  height: fit-content !important;
  display: flex !important;
  flex-direction: column!important;
  border: 2px solid hsla(0,0%,100%,.05) !important;
  background-clip: padding-box;
  box-shadow: 0px 1px 0px -1px #313131,
              0px 1px 1px -1px #313131,
              0px 1px 2px -1px #313131,
              0px 2px 4px -2px #313131,
              0px 3px 6px -3px #313131,
              inset 0px 0px 0px 1px var(--tw-shadow-color),
              inset 0px 1px 0px var(--tw-shadow-color) !important;
}

.css-18t94o4.css-1dbjc4n.r-l5o3uw.r-sdzlij.r-1uusn97.r-1777fci.r-1ny4l3l.r-ymttw5.r-oyd9sg.r-o7ynqc.r-6416eg {
  background-color: rgb(0, 0, 0, 0.3) !important;
  box-shadow: inset 0 0 2000px rgba(0, 0, 0, .1) !important;
  backdrop-filter: blur(4px)  !important;
}

.r-1vtznih {
  background-color: rgb(0, 0, 0, 0.7) !important;
}

.r-luusn97 {
  box-shadow: inset 0 0 2000px rgba(0, 0, 0, .3) !important;
  backdrop-filter: blur(10px)  !important;
}

.r-5kkj8d, .r-qklmqi {
  border-top-width: 0px !important;
  border-bottom-width: 0px !important;
}

.css-1dbjc4n.r-1oszu61.r-1igl3o0.r-rull8r.r-qklmqi.r-2sztyj.r-1efd50x.r-5kkj8d.r-1ta3fxp.r-18u37iz.r-h3s6tt.r-a2tzq0.r-3qxfft.r-s1qlax {
  height: 36px !important;
}

.r-qo02w8 {
  box-shadow: 0px 1px 0px -1px #313131,
              0px 1px 1px -1px #313131,
              0px 1px 2px -1px #313131,
              0px 2px 4px -2px #313131,
              0px 3px 6px -3px #313131,
              inset 0px 0px 0px 1px var(--tw-shadow-color),
              inset 0px 1px 0px var(--tw-shadow-color) !important;
}


.r-1q9bdsx {
  border: 1.5px solid hsla(0,0%,50%,.05) !important;
}

.r-1f1sjgu {
  padding-top: 16px !important;
  padding-bottom: 16px !important;
}
```

## Uma dica extra:

Além desta customização tenho um Plugin para Google Chrome instalado no meu Arc Browser que me permite realizar mais customizações complexas de uma forma intuitiva, assim complementando o __"Tema aplicado"__.

Você pode encontrar este plugin através [deste link](https://typefully.com/minimal-twitter), baixar e usar gratuitamente.

Arc Browser Boost para melhorar o design do Twitter

Snippets

Arc Boost: Twiter Minimalista

Aprenda com o Mestre você também

Mestre é o um espaço para todas as nossas ideias. Eventualmente, ele terá centenas de vídeos premium e uma comunidade próspera, mas agora é o começo!

Snippets

Arc Boost: Twiter Minimalista

Aprenda com o Mestre você também

Mestre é o um espaço para todas as nossas ideias. Eventualmente, ele terá centenas de vídeos premium e uma comunidade próspera, mas agora é o começo!

Acesso total a todos os vídeos do Mestre

Comunidade Discord

Resumos de vídeo com trechos de código

Código fonte