CSS Brasil

23 Apr 2025 20:17

@jonathansilva0x00, para você que gosta de compor e testar cores.


Web/CSS/color_value/oklch

CSS Brasil

18 Apr 2025 19:49

Vi você fazer a pergunta em outro grupo, e uma pessoa no outro grupo deu uma solução muito boa e simples (ao meu ver): tenha 2 SVG da ilustração/ícone, uma para tema claro outro para tema escuro e faça o comparativo dentro a propriedade src de Image (componente do Next).

CSS Brasil

18 Apr 2025 01:15

Depois que eu converti o svg em tsx podi trabalhar tranquilamente com as classes do Tailwind.
Obrigado aí.

CSS Brasil

17 Apr 2025 22:24

Classes TW são classes CSS. :)

Mas se está dizendo fora do esquema TW, talvez seja o caso de rever sua stack.

CSS Brasil

17 Apr 2025 22:20

Tenta aí. Se mesmo assim não der, tem boi na linha.

CSS Brasil

17 Apr 2025 22:20

Séra que é necessário usar o SVG como componente para que as classes do Tailwind funcionem?

CSS Brasil

17 Apr 2025 22:16

const ComplexIcon = () => {
  return (
    <svg 
      xmlns="http://www.w3.org/2000/svg" 
      width="24" 
      height="24" 
      viewBox="0 0 24 24"
    >
      <path 
        d="M12 2L2 7l10 5 10-5-10-5z" 
        className="fill-blue-500 dark:fill-blue-300" 
      />
      <path 
        d="M2 17l10 5 10-5" 
        className="fill-gray-700 dark:fill-gray-300" 
      />
      <circle 
        cx="12" 
        cy="12" 
        r="3" 
        className="fill-red-500 dark:fill-red-300" 
      />
    </svg>
  )
}

CSS Brasil

17 Apr 2025 22:14

E cada elemento possuí um estilo diferente.

CSS Brasil

17 Apr 2025 22:13

Se eu usar o componente de imagem, acredito que o SVG será tratado como um elemento.

CSS Brasil

17 Apr 2025 22:11

Se tá com Next + TW, qual seria o motivo de não usar <Image> nem classes TW?

CSS Brasil

17 Apr 2025 22:09

Estou querendo criar as classes de tema claro e escuro dentro do código do arquivo svg.

CSS Brasil

17 Apr 2025 22:03

E estou importando e utilizando ele dentro do <Header>

CSS Brasil

17 Apr 2025 22:02

Como estou em projeto em Nextjs o arquivo do SVG está na pasta "data".

CSS Brasil

17 Apr 2025 22:00

Seria criado por mim?

CSS Brasil

17 Apr 2025 21:56

As classes estão dentro da tag style.

CSS Brasil

22 Apr 2025 22:27

Provavelmente, não tem resposta "certa" para isso; vai depender do site.

Mas acredito quase todos vão ter, pelo menos:

- LGPD - Conformidade:
- Checkbox com consentimento nos formulários
- Explicação clara do uso dos dados
- Página com canal de solicitação de exclusão/alteração de dados
- Política de Privacidade
- Política de Cookies (pode ser parte da de privacidade ou separada)

CSS Brasil

18 Apr 2025 19:34

Olá pessoal, tudo bem ? Como exatamente e o que precisa para deixar um site 100% completo ? Quando falo completo, não me refiro só ao site em si com fotos, textos, páginas, formulário de contato, etc, e sim a páginas como política de privacidade, termos de uso, LGPD e o que mais precisar para deixar um site completo além dessas informações, para entregar para o cliente de forma completa sem faltar nada, por favor.

Pois apesar de estar em alguns grupos de programação a um bom tempo, eu ainda não sou programador, meu trabalho atual é de móveis planejados e quero me encaixar na área de programação mas para isso eu preciso saber como fazer do jeito certo e completo, por isso estou aqui no grupo solicitando essa ajuda, obrigado.

CSS Brasil

18 Apr 2025 01:13

Kkkk, seria apenas uma exceção usar classes pessoais ao invés das classes do Tailwind🤡

CSS Brasil

17 Apr 2025 22:21

Séra que não dar de fazer a alternacia com classes css?

CSS Brasil

17 Apr 2025 22:20

Acho que talvez seja isso

CSS Brasil

17 Apr 2025 22:17

O problema é que as classes de fill do Tailwind não estavam funcionando dentro do código do SVG. Então continuei com o estilo sendo aplicado através de classes css.

CSS Brasil

17 Apr 2025 22:15

Acho que não tenho problema em usar as classes TW.

CSS Brasil

17 Apr 2025 22:14

E dentro do SVG tenho três elementos.

CSS Brasil

17 Apr 2025 22:12

Dentro do arquivo SVG tenho três elementos e cada elemento é de uma cor diferente.

CSS Brasil

17 Apr 2025 22:09

Dentro da tag style

CSS Brasil

17 Apr 2025 22:05

Estou usando ele diretamente dentro do Header sem referencia-lo dentro de Image

CSS Brasil

17 Apr 2025 22:03

import Image from 'next/image';

const ThemeAwareSVG = () => {
  return (
    <div className="[&>svg]:fill-black [&>svg]:dark:fill-white [&>svg]:stroke-black [&>svg]:dark:stroke-white">
      <Image 
        src="/path/to/your-icon.svg" 
        width={24} 
        height={24} 
        alt="Icon" 
      />
    </div>
  )
}

CSS Brasil

17 Apr 2025 22:01

Você escreve a tag <svg> diretamente? Tipo <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24"...>?

CSS Brasil

17 Apr 2025 21:57

Ai quero o suporte entre tema claro e escuro.

CSS Brasil

17 Apr 2025 21:56

Não estou usando classe TW