Štýly

Táto stránka je tu, aby predstavila štýly pre štandardné prvky strany, ako sú typografia, prvky formulára a ikony. Tieto sú pevne zakódované v alternatívnom súbore šablóny strany s názvom page.styles.liquid.


Typografia

Nadpis jeden

Druhý okruh

Okruh tri

Štvrtý okruh

Piaty okruh
Šiesty okruh

NADPIS H1

NADPIS H2

Nadpis H3

Nadpis H4

NADPIS H5
Nadpis H6

Zrejme sme dosiahli veľkú výšku v atmosfére, pretože obloha bola mŕtva čierna a hviezdy prestali blikať. Tou istou ilúziou, ktorá dvíha horizont mora na úroveň diváka na svahu, bol sobolí oblak pod ním vysypaný a zdalo sa, že auto sa vznáša uprostred obrovskej tmavej gule, ktorej horná polovica bola posiata striebrom. Pri pohľade do tmavej priepasti dole som uvidel rudé svetlo prúdiace cez trhlinu v oblakoch.

Dostávajte náš newsletter a objavujte naše príbehy, zbierky a prekvapenia.

  • Nové v
  • Výpredaj a špeciálne ponuky
  • Ženy
  • Muži
  • Topánky
  • Tašky a príslušenstvo
  • Najlepšie značky
  • Lookbook
  • Lorem ipsum dolor sit amet
  • Conse ctetur adipisicing elit sed do
  • Eiusmod tempor
  • Incididunt ut labore et dolore magna
  • Ut enim ad minim veniam
  • Tkanina 1: 100% polyester
  • Látka 2: 100% polyester,Podšívka: 100% polyester
  • tkanina 3: 75% polyester, 20% viskóza, 5% elastan
  1. tkanina 1: 75% polyester, 20% viskóza, 5% elastan
  2. Látka 2: 100% polyester,Podšívka: 100% polyester
  3. Tkanina 3: 100% polyester

Nadpisy RTE

Prvá položka RTE

Druhá položka RTE

Tretia položka RTE

Štvrtý okruh RTE

Piata položka RTE
Šiesty nadpis RTE

Odsekoch

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper.

Suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat.

Štýly písania

Blokové kvóty

Eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Nam liber tempor cum soluta nobis eleifend option congue nihil imperdiet doming id quod mazim placerat facer possim assum.

Autor citátu

Zoznamov

Ul (predvolené)
  • Jeden
  • Dva
  • Tri
  • Štyri
Číselná odrážka Ol (predvolené)
  1. Jeden
  2. Dva
  3. Tri
  4. Štyri
Podradené zoznamy (ak sa zhodujú so štýlmi RTE)
  • Jeden
  • Dva
  • Tri, so zoznamom detí
    • Prvá podpoložka
    • Druhá podpoložka
    • Tretia podpoložka so zoznamom podradených položiek
      • Položka tretej úrovne
      • Ďalšia položka tretej úrovne
  • Štyri

Responzívne tabuľky

OBJEDNAŤ DÁTUM STAV PLATBY STAV FULFILLMANT CELKOM
#1001 Decembra 22, 2015 Autorizovaný Nenaplnené $43.03
#1002 Decembra 23, 2015 Autorizovaný Nenaplnené $44.03
#1003 Decembra 24, 2015 Autorizovaný Nenaplnené $45.03
#1004 Decembra 25, 2015 Autorizovaný Nenaplnené $46.03
#1005 Decembra 26, 2015 Autorizovaný Nenaplnené $47.03
#1006 Decembra 27, 2015 Autorizovaný Nenaplnené $48.03

Formuláre

Predvolené prvky formulára

Neviditeľné štítky

Pridanie triedy skrytý štítok na štítok, ktorý ho vizuálne skryje a zároveň ho oprístupní aplikáciám na čítanie z obrazovky. Použite tlačidlo Zástupný symbol atribút ako viditeľný štítok.

Nota:Zástupný symbol atribút funguje iba v IE10+, takže neviditeľné štítky sú v IE9 a nižšie zakázané.


Vertikálne formuláre (zákazník, kontakt atď.)

V Slate na to neexistujú žiadne štýly, ale používajú sa vo väčšine tém. Štýlové prvky vo vnútri formulára / divu s triedou "form-vertikála", aby ste tu videli svoje štýly.

Triedu nemôžete pridať priamo k väčšine prvkov tekutej formy (napr. {% formulár "kontakt" %}). Namiesto toho zabaľte formulár do ponoru s triedou .form-vertikálne na dosiahnutie rovnakého účinku.

Začiarkavacie políčka

Rádia

Poznámky a chyby formulára

V Slate neexistujú žiadne štýly poznámok, ale bežne sa pridávajú na spracovanie chýb formulára. Príklady štýlov:

    .note {
      padding: 20px;
      border: 1px solid #ccc;
    }

    .note--success {
      border-color: green;
      background-color: lightgreen;
    }

    .note--error {
      border-color: red;
      background-color: lightred;
    }
  

Príklad použitia:

    {% if form.posted_successfully? %}
    <p class="note note--success">Thanks for submitting the form</p>
    {% endif %}

    {% if form.errors %}
    <div class="note note--error">
    {{ form.errors | default_errors }}
    </div>
    {% endif %}
  
Toto je štandardná poznámka
Toto je správa o úspechu

Toto je chybové hlásenie.

  • Odrážky môžu ponúknuť lepší prehľad o chybe

Tlačidlá

Predvolené tlačidlo

Predvolené tlačidlo (bez predvolených nastavení)

Tlačidlo je vypnuté

Predvolené tlačidlo vypnuté

Široké tlačidlo

Široké predvolené tlačidlo


Rôzne prvky

Horizontálne pravidlá

Neexistujú žiadne predvolené nastavenia Hr štýly v Slate, ale tieto sú bežné, ktoré treba pridať.

Predvolený Hr


Neviditeľný hr.hr-jasné