Apelo: Dark Mode 🌑

O TabNews está bonito no design e tbm acertou na diagramação com as fontes, tamanho, espaçamento, tabulação, etc, já que é focado na leitura... mas está gerando um certo incômodo na leitura prolongada por causa do fundo branco ☀

Normal: Normal

Acredito que isso seria mitigado com a aplicação de um estilo mais dark.. o amado dark mode 🥰

Algumas extensões para navegador propôem resolver esse impasse e até estão dando conta do recado, mas não da forma que o nativo faria.

Testando o Super Dark Mode apesar de funcionar bem para outras páginas, descobri que aqui funciona parcialmente, deixando os links visitados com um tom de laranja escuro os títulos em tom verde e outros partes com um tom fraco demais ou forte demais...

Super Dark Mode: Super Dark Mode

O Dark Reader deu maior satisfação, aproxima bastando ao visual do github, com tons de cinza, calibrado para um bom constraste na leitura e com links nas cores mais 'padrão'.

Dark Reader: Dark Reader

Falta uma melhoria no uso da tag 'code' o code e no uso de linguagem como o ```js```

Testando com a linguagem javaScript, o estilo até destaca funções, arr, object, palavras reservadas e etc, mas não atende muito bem com o vermelho e roxo... e parece misturar variárvel com string.

É incomparável ao que alcançamos com o Prettier no Vscode, claro

const testStr = 'Testando aqui'

const doFn = () => { console.log(testStr) }

const newArr = [1, 2, 3, 'Texto']

const newObj = { id: 1, name: 'Fulano'}

array.filter(item => {
 item.classList.add('ativo')
})
 
document.querySelector('.teste')

json:

{ 
  {"nome": "Fulano" },
  {"nome": "Fulaninho" }
}

com Dark Reader Dark Reader

Desejamos o bom e velho dark mode nativo e preparado com todo gosto e carinho que o site foi feito.

  • Att 29/11 Segue tab com beta do dakmode funcionando, porém com um pequeno problema de piscar o fundo. Existe uma issue lidando com a questão aqui Aqui o @lucasalberto01 diz ter resolvido o problema na PR #916.

image

Peço colaboração pra levantar essa bandeira 😊😉

Opa, tudo bem?

A galera já está engajada pra fazer esse Dark mode funcionar, você pode acompanhar o processo nesse PR:

https://github.com/filipedeschamps/tabnews.com.br/pull/377

Acho que estão tendo algumas dificuldades com especificidades, mas a barreira específica está descrita aqui:

https://github.com/filipedeschamps/tabnews.com.br/pull/377#issuecomment-1324385682

Perfeito espero que passem logo desta barreira
bora lá comunidade! ganbate! \o\

Dark mode é fundamental pra gente que é que nem vampiro kkkkkk

Boa, primeira coisa que pensei quando entrei no site, acho que estamos voltando aos anos 80 as telas daquelas pcs de letra verde... rs, que nada, nao acho legal ver o povo olhando para o celular parecendo uma lanterna no escuro... fico pensando, se eu fizer isso fico cego uns 2 dias... por incrivel que pareça sempre dei muita enfasse a isso ainda mais agora, ajuda muito.

Dark mode e barra de pesquisa! A primeira coisa que tentei procurar pra clicar foi uma barra de pesquisa... hehe, mas acredito que irão implementar isso em breve.

Outra coisa que eu quero mais até que essas duas coisas é uma opção para salvar artigos para ler depois, usar recursos externos do navegador para salvar os artigos é realmente incômodo. Percebo também que um filtro de conteúdo e tags seriam importantes, já que já há inúmeros artigos como esse, sugerindo coisas pro site que geralmente são sempre as mesmas coisas: Dark Mode, Barra de Pesquisa e mais formas de filtrar o conteúdo. Além de outras inúmeras sugestões sobre pessoas farmando TabCoins e etc.

Esse tema do Dark Reader combinaria muito com esta plataforma, isso realmente é uma ótima ideia. #dark_reader

Dark mode é vida! É amado por nós e por nossos olhos... Passamos diversas horas em frente a essa telinha e o dark mode nos ajuda a não cansar tanto os olhos. Além de que torna muito mais agradável para ler. Não vejo a hora de termos o dark mode aqui no TabNews.

Concordo, dark mode é vida! Nós programadores teríamos uma visão muito pior se não fosse pelos terminais e IDEs com seus "dark-modes"... O Tabnews merece o mesmo tratamento, e junto com uma boa função de busca, considero o darkmode com altíssima prioridade! Cadê nossos front-ends pra ajudar com isso? Infelizmente sou uma negação, se não tentaria ajudar...

Creio que um sistema de temas seria uma boa para o TabNews, onde poderia ter os principais temas usados no dia a dia dos devs (Como o tema dracula, por exemplo), e talvez com a possibilidade de importar novos temas para cada usuário.

Um dark mode uma barra de pesquisa ajudaria muito kkk

Rapaz, seria fantástico um Dark Mode. Quando cheguei aqui fiquei até surpreso por não ter.

Apoiado 100%. Dark Mode é vida. Impossível codar em uma IDE sem estar no Dark hahahaha 😊

otima sugestão, seria maravilhoso, darkmode cansa muito menos a leitura e visualização!

Eu só colocaria nessa proposta Dark um pouco mais de contraste entre os elementos (Título e subtítulo).

TabNews precisa urgente de um dark mode! Gosto muito do site!

Brilhou demais xD

Eu particularmente não gosto de páginas em dark mode, pq pra mim fica mais estranho e parece desorganizado visualmente, mas apoio ter a opção para quem quiser mudar.

O legal e ter a opção de pode ou não ativar o modo noturno, para agradar o máximo de pessoas

gostei da tag "apelo" 😂

apoio demais, o darkmode é essencial para esse site de site, onde se le muito.

Opa! Eu estou acostumado a fazer o Dark Mode o Tailwindcss, mas adoraria ajudar mesmo que vocês estejam usando outra ferramenta para CSS ou CSS nativo mesmo!

O projeto é literalmente open source. Invés de um apelo e feature requests, por que não fazer uma mobilização para colocar isso em prática? Fica aí a ideia, independente de especialidades, é um aprendizado e oportunidade de contribuição.

Realmente... a primeira coisa que fiz quando criei meu perfil foi procurar o dark mode, para nos devs que passamos o dia inteiro desenvolvendo acredito que o dark mode seja uma necessidade kkkkkkk

seria perfeito, principalmente na versão mobile.

darkmode cansa bem menos a leitura!

Com o Dark mode minha visao agradece

Estou trabalhando num clone do tabnews e ja tem dark mode. Esta faltando bastante coisa ainda, quem quiser contribuir tmj

https://retabnews.vercel.app/user/felipefarinha/apelo-dark-mode

Você não poderia colocar essa alteração direto no tabnews? nós da comunidade podemos editar o código fonte do site live? tem aguma equipe que possamos mandar pra eles colocarem? todas as alterações passam por uma única pessoa? sei que se todos pudessem alterar ao mesmo tempo ia ser uma bagunça, porem acho que seria legal abrir um local pra poder enviarmos as mudanças para uma equipe testar
Ja tem alguns PRs na espera, mas estao com dificuldades por conta de libs de terceiros
Por que não envia essa alteração ao próprio repositório do TabNews para que a alteração seja feita sobre o site original?
https://www.tabnews.com.br/franklinjavier/b1e46b93-26d0-4dbb-95ee-32a58f504a36 Outra coisa, é sempre bom ter esses side-projects pra por em prática os estudos.

Cookie de apoio.

Apoio o dark mode como um recurso de facil acesso. Mas de forma paliativa caso queiram para quem usa o OPERA GX que nem no meu caso vc consegue forçar o dark mode com o botão direito na página. Já para o chrome tem extenções que o fazem, mas costumam bugar, por isso opto pelo opera por enquanto.

Cara, sinto necessidade também de uma opção dark para o site. Por enquanto estou me virrando com o Dark Reader - que uso no meu navegador pra tudo, e desabilito só para os sites que disponibilizam o modo dark nativamente.

Sigo no aguardo para essa implementação em uma atualização breve do TabNews.

Seria perfeito mesmo, realmente o modo claro incomoda muito, cansa as vistas principalmente em ambientes escuros, como a maioria de nos programadores ficamos, creio que isso virá em breve, seria perfeito.

Levando em consideração que o fórum é acessado por programadores, que trabalham por várias e várias horas na frente de uma tela durante o seu dia, o acesso ao fórum sem dark mode por muito tempo pode ocasionar em uma vista cansada para os usuários, é extremamente necessário o dark mode e com urgência!!

Concorde plenamente! Tenho fotofobia e o modo escuro com extensão do google buga as vezes. Seria bem legal ter essa opção no tabnews.

Utilizo o DarkReader e é incrivel, claro que dark mode nativo sempre será melhor. mas com o darkreader pode customizar do teu jeito, deixar as palavras com negrito, com fundo escuro e texto mais branco, ajuda bastante no descanso ocular e facil leitura, na extensão do darkReader tem a opção de customizar do jeito que você quiser, muito boa eu recomendo enquanto isso

Instalei aqui e deu certo, só não gostei que ele ativa em todos! Mas qualquer coisa desativo quando estiver criando algo para um cliente! Valeu pela a dica, não tinha passado pela minha cabeça de ir atrás de extensão para isso!
Você pode deixar isso automatizado para ativar em apenas alguns sites, ou exluir apenas alguns sites, só ir em configuração da extensão.

De fato o dark mode é muito necessário, gostei muito do tabNews e já o adicionei a minha rotina diaria, sempre bom estar em contato com pessoas que desejam estudar e evoluir sempre. Ainda mais com um produto com uma proposta interessante como essa.

Modo Dark urgente!!!

Apesar de utilizar o Opera GX que possue uma função que força páginas escuras, ter isso nativo seria muito bom. Ideia ótima 👍

Meus olhos agradecem.

Por min nem teria modo claro pra começo de conversa

Espero que eles implementem logo essa feature pois ja deixei de usar uma plataforma por não ter essa opção

Dark mode é vida! Eu não consigo mais utilizar nenhum tipo de aplicativo e/ou site sem essa função. Espero que implementem logo.

tambem nao vivo sem meu vscode é sempre no dark mode

Todo o site tá muito lindo, espero que o dark mode saia o quanto antes de fato é bem cansativo olhar para esse fundo branco.

Vai ficar showw dms.

É essencial. Tanto que muitos resolvem o problema com as extenssões. Mas sempre bom ter algo nativo.

Utilizo o Opera Touch no celular. Ele oferece uma opção de páginas escuras que na minha visão ficaria perfeito para o site. Vou ficar devendo o print para comparação.

Faz pouco mais de 10 minutos que me cadastrei e quando bati o olho no seu post entendi o que estava achando estranho. É uma ótima ideia é seria muito top conseguir configurar o estilo que mais lhe agrada para leitura. Top demais 😍

Eu apoio totalmente, hoje em dia é muito comum e acho que ajuda muito na usabilidade da plataforma.

Apoio demais a ideia! Obrigado pela iniciativa.

Sim, concordo plenamente

Estou 100% apoiando!!! Ficaria Lindo tudo modo escuro.

o modo escuro com o darkreader ficou show! Ter um toggle e deixar default no dark seria super bacana.

Vai ficar mais tranquilo quando você passar mais tempo lendo!

Não é bem assim, pra algumas pessoas tema escuro é acessibilidade, no meu eu tenho que reduzir o brilho o maximo possível pra conseguir usar se não meus olhos começam a lacrimejar, e isso não é questão de costume, é sensibilidade a luz...
Entendi, no meu caso me sinto melhor com Dark Mode.

Sempre quando eu entro em um site novo, eu verifico se o próprio tem DarkMode. Creio que seria uma ótima adição para o TabNews.

Apoiado, eu sinto muita dor de cabeça ao usar fundo branco, dark mode melhora nossa qualidade de vida!

Poderia também ser um tema mais cinza ao invés de fundo preto. Talvez algo como o nosso Darkula do Vscode ficaria legal.

Sim, podemos ter opções de diferentes temas, eu mesmo se soubesse e pudesse eu criava um fork tentando adicionar esta feature ver se trazem oficialmente, com certeza teremos pessoas ajudando com isso.

Mais que necessário, hoje em dia não é só questão de economia de energia mas um visual mais agradável aos olhos. Eu que fico quase 12 horas por dia na frente do computador, e uso óculos a muito tempo, sinto muita diferença com o Dark Mode. Tem meu total apoio.

dark mode é vida, que venha logo!!

Ótima colocação, acho que a maioria dos dev usam praticamente tudo em dark mode. Com certeza o dark mode já está nos planos, nos restas esperar.

é só mudar a cor de fundo para #404040 que já vai ajudar muito; BORA!

Como usuário de Dark Mode em tudo, eu endosso esse tab

alguem que sabe programar podis testar pra ver se da pra implementar diretamente no codigo da pagina e deixar que o usuario possa escolher o tema

Notei tambem a otimização para celular, escrever artigos no celular esta um pouco ruim, mais como esta no começo veremos mais otimizacoes com o passar do tempo, tenho certeza.

Bacana! Acredito que a maioria dos programadores e pessoas da tecnologia optam pelo DarkMode! Agora é só implementa e amar ainda mais!

Tem o apoio de todos kkkkkk

SIM, o dark mode é essencial pra muito tempo de leitura

Opções são sempre bem vindas, mas não desfaçam o light mode porque é melhor em termos de acuidade visual. Segue abaixo uma pesquisa feita pelo Nielsen Group. https://www.nngroup.com/articles/dark-mode/

Apoiado! Seria interessante o sol e a lua responsivos no cantinho hehe. Abraço!

Acho que esse pensamento foi unânime kkkk
Sim! Sería praticíssimo!

essa e a feature mais esperada!!

Dark Mode...muito top, uso em tudo hoje. Mas estamos falando do TabNews...vai além da curva. Que tal um tema customizável onde cada usuário pode definir algumas particularidades como cores, fontes, backgrounds, animações e isso seria salvo nos cookies (por exemplo) ou armazenado junto ao contexto do user environment, na nuvem. Penso que inicialmente, cores já fariam toda diferença. E acredito que as demais funcionalidades customizáveis poderiam ser adicionadas com o decorrer do tempo...delicinha 🤤🤤🤤

Ansioso pra ver o que a comunidade vai criar em cima disso.

Seria ótimo um dark mode, foi a primeira coisa que verifiquei e tentei contribuir, baixei o código para tentar implementar, achei um pouco complicado devido a estrutura atual, e como o frontend não é minha especilidade, acabei não podendo ajudar.

Da mesma forma poderia existir um "orange mode" ou "green mode" ... o céu é limite!!!

Sim! Acho que se o fizesse o dark mode estilo github ficaria supinpa.

super apoio, atualmente uso darkmode em todos as aplicações possiveis pois me sinto mais confortavel para leitura.

Sem dúvidas, Dark mode será sempre bem vindo ótima iniciativa !!!

Uso a configuração "Auto dark mode for web contents" do chrome, ele da um contraste bem da hr, alem de poder escolher se quer aplicar o dark mode em imagens tambem ou não.. Nem percebi que aqui não tinha dark mode kk Mas seria legal ss algo nativo.

A barra de pesquisa também faz muita falata! :sweat:

Esse exemplo do DarkReader ficou show de bola. Vale lembrar que o navegador Opera tem a opção nativa de forçar dark theme nas páginas, que fica muito bom, por sinal. Mas ter essa opção dentro do próprio site seria excelente.

Tem meu apoio e admiração pela a iniciativa!

#querodarkmod

pode ser como sugestão também a paleta de cores ser igual da famosa dracula aí seria show show show e porquê não tudo ser voltado nessa paleta!

https://draculatheme.com/visual-studio-code

Sensacional!!!!! Ajudou demais!!

Por ser um site com o público alvo sendo programadores e areas semelhantes seria uma boa ter uma boa diversidade de temas como os do windows.

Também sou um adepto de Dark Mode e acho uma ótima ideia ter essa opção aqui. Acho que a maioria dos aplicativos/navegadores e sites/blogs com ampla leitura estão se adaptando para oferecer essa opção de Dark Mode né. Isso ajuda até na leitura noturna, já que a tlea branca pode doer a vista. Hoje em dia passamos tantas horas na frente da tela que todo tipo de adaptação é válida!

De fato! O Dark Mode permite não apenas uma melhor visualização, como também aumenta a durabilidade dos usuários na plataforma.

Estava pensando justamente nisso, costumo parar pra ler pelo final da noite 23h, a vista já ta cansada do dia todo, o fundo branco ataca muito a vista dessa forma. como é um ambiente para desenvolvedores, acredito que seria interessante além de disponibilizar o "Modo Dark", poderia ter um pequeno seletor para poder mudar o tom e assim se ajustar.

Algo parecido com o Adobe Colors no qual baseado em uma cor, e ele ajusta as demais.

O meu navegador deve ter algum problema da vusualização, apesar de conseguir ver bem outros sites. Pena que não sei com colocar uma imagem da minha tela aqui na caixa de comentários.

Fala, `ngomatec`! Você pode fazer um screenshot da sua tela e salvá-lo. Após isso, você pode seguir os passos dessa publicação: [Formas de hospedar suas imagens para postar aqui no Tabnews](https://www.tabnews.com.br/portaldev/formas-de-hospedar-suas-imagens-para-postar-aqui-no-tabnews).
Muito obrigado Gabriel Sozinho vou aprender agora mesmo.

Só de pensar que antigamente, a classe trabalhadora de menor nível em TI tinha atribuido o dia a dia com "Tela Preta".

Realmente, dark mode é vida e ajuda na leitura... Principalmente pra gente que já fica, pelo menos, 8 horas por dia na frente das telas...

Ideia totalmente apoiada, depois de algumas horas os olhos doem, o tema dark será bem vindo, espero que prossigam com essa proposta e não demore muito

Eu também acho! Hoje é difícil ver alguma coisa sem o tema dark, o escuro deixa melhor para ler.

concordo com o site ter dark mode é incrivel,maravilhoso,lindo ter o dark mode ou darkzinho aqui nesse site tão especial.

O dark mode e uma aba de favoritos, pra conseguir salvar os posts mais interessantes e poder rever quando possível

Creio que colocarão em breve, a final, é impossível ficar sem kkkkk O complicado é a flashbang de noite

Excelente sugestão. Quando se passa muito tempo na frente da tela, ter o modo "dark" ajuda na prevenção do cansaço dos olhos.

Seria maravilhoso ver isso no futuro!

Já existe um PR a muito tempo no TN, mas nós estamos com problemas principalmente com o ByteMD (editor e visualizador de markdown) com syntax highlighting nos snippets de codigo.

Uma sugestão seria uma opção de personalização com vários tipos de temas, como é nos editores de código por exemplo, seria fantástico.

Um ideia também seria ter um "dim dark mode". Com uma cor mais acinzentada

Concordo plenamente! Muito bom!!

Concordo plenamente!!! Fiquei surpreso de não ter KKK.

Ajudaria muito

Nossa salvaria demais, pra leitura seria bem melhor.

Ótima Sugestão felipefarina!

Meu Dark Reader estava ativo quando acessei o site pela primeira vez e não percebi que não tinha a opção dark mode. Fui mostrar para um amigo no celular dele e ai vi o site com as cores padrão. Claro, esse site é um lugar para pessoas que querem compartilhar conteúdo relacionado à tecnologia, que geralmente conhecem maneiras de dar algum descanço para os olhos, porém, acho muito importante investir em um sistema de temas nativo no site. Qualidade e conforto!

Aconteceu o mesmo comigo. Gostei muito de como as cores do Dark Reader ficaram.
conforto sempre é bom e agradavel, espero que chegue o dark mode logo logo

Dark mode faz toda diferença 🙏

Eu não sou muito fã do dark mode, mas o dark reader realmente resultou em um design muito bonito e agradável. Até pra quem gosta de economia de energia ou de ler a noite, essa opção será muito útil.

Isso é algo que merece bastante atenção da comunidade, o tema branco é bonito, mas o preto é sensacional

Muito necessário!

Sempre bom um dark mode!!!

Com certeza essa opção deve ser implementada, ficar vendo tudo branco acaba machucando os olhosm principalmente para nós que ficamos muito tempo na frente do computador

Visita a URL <browser_name>:flags (e.g. edge:flags, brave:flags) e habilita a flag "Auto Dark Mode for Web Contents", recomendo selecionar "Enabled with selective inversion of non-image elements".

O resultado é um dark mode bem clean sem alterar muito nos sites que já estiverem escuros, sem necessidade de uso de extensão.

Exemplo

vou fazer esta mudança e ver se melhora pois prefiro o modo dark.
Realmente fica espetacular, vou até fazer a remoção da minha extensão.
Realmente seria uma ótima adição para esse site, sempre utilizo o dark e é um pouco estranho entrar em um site sem essa função. Espero que eles adicionem!
Booa Usar o nativo já traz mais facilidade e menos chance de ficar zoado.
Post sensacional, espero que abram uma issue no github do projeto com essa sugestão.
Realmente é necessario.

Francamente eu não entendo nada de programação, mas achei a ideia maravilhosa. Tô aqui pela promessa de uma comunidade massa, e até agora é uma que está sendo comprida. Um Dark Mode ajudaria bastante na minha miopia

Sim Por favor

Parece que eles usaram uma biblioteca chamada Primer React, que basicamente é o design system do Github. Nesta parte da documentação explica como configurar e alternar entre temas: https://primer.style/react/theming#setting-color-schemes Parece fácil de ser implementado.

Realmente o modo dark ajusta bastante na leitura, principalmente para pessoas que possuem sensibilidade, como eu, com a luz emitida pelas telas. Vou estudar o código para ver como posso contribuir com essa funcionalidade.

O lorenzowb já deu uma boa informação de como está essa feature.

Eu adoraria um dark mode com o estilo "Dracula" do Zeno Rocha.

Site do Dracula Theme

Além de ser incrivel juntar dois projetos de dois Brasileiros geniais rsrsr

O OPera GX também tem uma função de forçar a página escura, ativei assim que entrei no site, mas seria uma feature legal pro site ter um swapper com ambas as opções.

Sim amigo meus olhos doem

Muito boa ideia, afinal o que seria de nós devs sem um darkmodezinho haha

Concordo que deve haver mais opções, mas a experiência de leitura em Dark Mode é horrível.

Olá Edersonfrazao! Tudo bem? Como muitos colegas comentaram, o lance do dark mode tem muito a ver com acessibilidade, dependendo do tempo de exposição ao site nesse tema claro, muitas pessoas com sensibilidade podem vir a passar mal, o dark mode suavizaria isso, permitindo que o usuário possa consumir o conteúdo (que pode ser longo) sem se sentir cansado ou enjoado, como é o meu caso oajdkajdkajd