Diskusia – 3. diel - Dátové typy v SASS

Späť

Upozorňujeme, že diskusie pod našimi online kurzami sú nemoderované a primárne slúžia na získavanie spätnej väzby pre budúce vylepšenie kurzov. Pre študentov našich rekvalifikačných kurzov ponúkame možnosť priameho kontaktu s lektormi a študijným referentom pre osobné konzultácie a podporu v rámci ich štúdia. Toto je exkluzívna služba, ktorá zaisťuje kvalitnú a cielenú pomoc v prípade akýchkoľvek otázok alebo projektov.

Komentáre

Honza Bittner

Tvůrce

Honza Bittner:2.10.2014 17:54

Článek byl přepsán a upraven.

Odpovedať

2.10.2014 17:54

FIT ČVUT alumnus :-) Sleduj mě na https://twitter.com/tenhobi a ptej se na cokoli na https://github.com/tenhobi/ama.

Člen

:3.7.2016 8:37

min(7px, 23px) => 23px
OPRAVA: max(7px, 23px) => 23px

Odpovedať

3.7.2016 8:37

Lucie Fiedlerová

Člen

Lucie Fiedlerová:11.9.2017 17:01

Kromě funkce max je ještě třeba opravit:
map-values("alfa": "hodnotaAlfy", "beta": "hodnotaBety") => "alfa", "beta"
OPRAVA: map-values("alfa": "hodnotaAlfy", "beta": "hodnotaBety") => "hodnotaAlfy", "hodnotaBety"

Jinak díky za článek.

Odpovedať

11.9.2017 17:01

Honza Bittner

Tvůrce

Honza Bittner:11.9.2017 17:12

Díky. Opravím.

Odpovedať

11.9.2017 17:12

FIT ČVUT alumnus :-) Sleduj mě na https://twitter.com/tenhobi a ptej se na cokoli na https://github.com/tenhobi/ama.

Patrik Pastor

Člen

Patrik Pastor:3.3.2019 22:47

Čau, mohl bys mi prosím vysvětlit příklad 2 ? Proč převádíš čísla na stringy, když stringy nejde dělit?, Nechápu

Odpovedať

3.3.2019 22:47

Honza Bittner

Tvůrce

Honza Bittner:4.3.2019 12:14

Je to tam popsané, ale zkusím trochu jinak. Když se podíváš na font property, např. na https://www.w3schools.com/…ont_font.asp, tak vidíš, že jedna z syntaxí pro zápis hodnot je s použitím lomítka. (To se občas používá i u jiných vlastností.).

V tomto případně, pokud chceme nastavit vlastnost line-height z vlastnosti font, používá se syntaxe font-size/line-height. Jelikož by se normálním použitím proměnných vynutilo dělení, vkládáme obsah jako string, který nám zaručí, že ve výsledku bude formát jako 15px/22px např.

Jinými slovy:

font: 16px/18px;

je stejné jako

font-size: 16px;
line-height: 18px;

Odpovedať

4.3.2019 12:14

FIT ČVUT alumnus :-) Sleduj mě na https://twitter.com/tenhobi a ptej se na cokoli na https://github.com/tenhobi/ama.

Jakub Podskalský

Člen

Jakub Podskalský:19.5.2019 16:28

Zdravím, rád bych upozornil na chybu v článku: ne map-values("alfa": "hodnotaAlfy", "beta": "hodnotaBety") => "alfa", "beta", ale map-values("alfa": "hodnotaAlfy", "beta": "hodnotaBety") => "hodnotaAlfy", "hodnotaBety".
Na tuhle opravu jsi už jednomu komentujícímu nade mnou odepsal, že opravíš... Ale bylo to v roce 2017, takže jsi zřejmě zapomněl. Ale stává se, jen upozorňuji, aby to nepletlo nové čtenáře.

Odpovedať

19.5.2019 16:28

Václav Dachs

Člen

Václav Dachs:31.10.2019 17:16

Podle příkladu 1 by měl být text odstavce na webové stránce (následujícího html kódu) obarven červeně (viz následující kód scss). Z nějakého důvodu tomu tak není. můžete prosím poradit?

<!DOCTYPE html>
<html lang="cs-cz">
<head>
        <meta charset="utf-8"/>
        <link rel="stylesheet" type="text/css" href="css/pokus.css"/>
        <title>Pokus</title>
</head>
<body>
        <h1>Pokus</h1>
        <p>Tento text by měl být červený.</p>
</body>
</html>

následuje kód z scss souboru

$barva-nadpisu: #8F8F8F;
$min: min(7px, 15px, 3px);

h1 {
        color: $barva-nadpisu;
}

p {
        @if $min == 3px {
                color: #FF0000;
        }
}

Odpovedať

31.10.2019 17:16

S úsměvem jde všechno lépe :-)

Honza Bittner

Tvůrce

Honza Bittner:31.10.2019 17:32

Sass, jelikož je v "novém" CSS funkce min/max, tak pokud je syntaxe validní pro CSS, přenechá jí na zpracování CSS, výsledek je tedy např. "min(7px, 15px, 3px)". Pokud se využívá nějaká proměnná, např., tak to zpracuje Sass a výsledek bude hodnota (např. "3px").

Viz https://sass-lang.com/…al-functions#…

A na tvojí otázku: jelikož se tedy pak porovnává min(7px, 15px, 3px) a 3px, tak nedojde ke shodě a nic se nevygeneruje.

Editované 31.10.2019 17:33

Odpovedať

31.10.2019 17:32

FIT ČVUT alumnus :-) Sleduj mě na https://twitter.com/tenhobi a ptej se na cokoli na https://github.com/tenhobi/ama.

Václav Dachs

Člen

Václav Dachs:31.10.2019 18:22

Aha, ok. Už to funguje. Dík

Odpovedať

31.10.2019 18:22

S úsměvem jde všechno lépe :-)

Robíme čo je v našich silách, aby bola tunajšia diskusia čo najkvalitnejšia. Preto do nej tiež môžu prispievať len registrovaní členovia. Pre zapojenie sa do diskusie sa zaloguj. Ak ešte nemáš účet, zaregistruj sa, je to zadarmo.

Zatiaľ nikto nevložil komentár - buď prvý!