Autor Zpráva
Acer1968
Profil
Zdravím.
Asi spousta z Vás zná Pixyho Paletton. www.paletton.com

Z něho si mohu udělat export vybraných barev do CSS, například takhle:

/* CSS - Cascading Style Sheet */
/* Palette color codes */
/* Palette URL: http://paletton.com/#uid=1000u0kllllaFw0g0qFqFg0w0aF */

/* Feel free to copy&paste color codes to your application */


/* As hex codes */

.color-primary-0 { color: #AA3939 }    /* Main Hlavní barva */
.color-primary-1 { color: #FFAAAA }
.color-primary-2 { color: #D46A6A }
.color-primary-3 { color: #801515 }
.color-primary-4 { color: #550000 }

/* Generated by Paletton.com © 2002-2014 */
/* http://paletton.com */

Chápu, že když si píšu vlastní HTML, tak jednoduše dám třeba
<div class="color-primary-0">
  Tady chci změnit barvu textu i barvu pozadí.
</div>

a barva textu se změní.

Pokud bych chtěl takhle jednoduše měnit i barvu pozadí, už bych si musel udělat jiné CSS třídy, třeba:
.bg-color-primary-0 { background-color: #AA3939 }    /* Main Hlavní barva */

A pak je zápis
<div class="color-primary-4 bg-color-primary-0">
  Tady chci změnit barvu textu i barvu pozadí.
</div>
taky jasný a mám jinou barvu textu i pozadí u toho prvku.

Ale co když NEMÁM MOŽNOST měnit HTML a jediná možnost je si zjistit nějakou třídu a té pak změnit vlastnost pomocí CSS??? Pak asi s takovýmhle zápisem v CSS neuspěji:
HTML:
<div class="nejakatrida">
  Tady chci změnit barvu textu i barvu pozadí.
</div>
CSS:
.nejakatrida {
              .bg-color-primary-0;
}

To bych musel prohnat nějakým CSS preprocesorem, že?

Pak tedy nechápu, k čemu mi ten seznam barev z Palettonu je, když pak stejně budu muset v CSS otrocky dávat HEX nebo RGBA kódy do vlastností color a background-color k těm vybraným třídám v CSS :-( Nebo jak to mám chápat?

Díky
Petr V.
Keeehi
Profil
Ano, když nemáš možnost měnit HTML, pak to budeš muset otrocky přepsat.

Acer1968:
Pak tedy nechápu, k čemu mi ten seznam barev z Palettonu je
To je pro ty, co možnost měnit HTML mají ;)

Všeobecně: to že nějaký výtvor něco umí a tobě je to k ničemu neznamená, že to je k ničemu všem. A i kdyby bylo, tak co. Nikdo tě to nenutí ani používat ani chápat.
Tomáš123
Profil
Acer1968:
Priamo sa to netýka tvojej otázky, ale v oblasti vecí, ktoré sú predurčené byť v kóde často menené sa oplatí ich zápis centralizovať.

#content, #aside, #content a, ... {
  color: #AA3939;
}
..., ..., ... {
  background-color: #FFAAAA;
}

Nebudeš mať triedu pre farbu, ale prepísaním jedinej hodnoty zmeníš všetky výskyty (čo mimochodom dokáže väčšina editor strednej a vyššej triedy).

Bez CSS preprocesora a možnosti zmeny HTML kódu je to, myslím, jediné riešenie. Predchádza tiež veľkému množstvu tried v HTML.
Tomášeek
Profil
Tomáš123:
Bez CSS preprocesora a možnosti zmeny HTML kódu je to, myslím, jediné riešenie.
Další možností je hromadné najití a nahrazení v souboru/souborech.

V textových editorech (a že by to měly umět snad všechny normální) to bude pod zkratkou Cmd+Alt+F, ev. Cmd+H, pod Windows asi Ctrl+H nebo Ctrl+F.

PS. je to jen řešení, pokud se bavíme o projektu bez preprocesorů, typicky malé nebo začátečnické projekty. Velký projekt v pure-CSS jsem už dlouho neviděl, a že jsem jich viděl docela dost, od různých dodavatelů :-)
Acer1968
Profil
Tomáš123:
Ano, takhle jsem to musel vyřešit. Je otázka, co je lepší, jestli mít všechny vlastnosti třídy pohromadě, nebo jestli mít pohromadě všechny třídy se stejnou vlastností :-(
Bubák
Profil
Acer1968:
Je otázka, co je lepší, jestli mít všechny vlastnosti třídy pohromadě, nebo jestli mít pohromadě všechny třídy se stejnou vlastností
Podle vkusu a zvyklostí každého soudruha kodéra.
Acer1968
Profil
Keeehi:
Já přece netvrdím, že ten výtvor od Pixyho je k ničemu. Naopak si myslím, že je super, když něco takového vzniklo. Jen prostě se snažím najít co nejsnazší řešení, pokud si odtamtud přidám ten seznam barev do CSS, nemohu měnit HTML, a nepoužívám preprocesor. Samozřejmě, že zápis
.nejakatrida {
              .bg-color-primary-0;
}
by se mi líbil ze všeho nejvíce :-)

PV

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: