1. Przyciski.

Przycisk


Jeśli chcesz wyświetlić link (lub inny znacznik) jako przycisk, użyj klasy button

<a class="button" href="#">Przycisk</a>


Dla przycisku w kolorze akcentu, dodaj klasę button--acc

Przycisk

<a class="button button--acc" href="#">Przycisk</a>



2. Przycisk z ikoną.

Przycisk

Użyj następującego kodu:

<a class="button button-with-icon">
   <em class="button__icon fas fa-question"></em>Przycisk
</a>


Klasy fas fa-question należy zastąpić klasą fontawesome żądanej ikony. Ikony są dostępne przez fontawesome 5 (dostępne są solid, regular, light i brands).



3. Mały przycisk.

Przycisk

Użyj klasy .small dla miniaturowego przycisku:

<a class="button small" href="#">Przycisk</a>



4. Link "Czytaj dalej".

Czytaj dalej

Aby uzyskać stylizowany link do innej strony, użyj kodu:

<a class="show-all" href="#">
    Czytaj dalej 
    <i class="button-more fal fa-long-arrow-right"></i>
</a>


W przypadku linku koloru bazowego należy użyć klasy bs-color:

Czytaj dalej


W przypadku linku z kolorem akcentującym należy użyć klasy ac-color:

Czytaj dalej



5. Link z kropkowanym podkreśleniem.

Link       Link

Ten rodzaj linku może być użyty do akcji, takiej jak otwarcie okna modalnego. Do tych pierwszych użyj klasy link-action:

<a href="#" class="link-action">Link</a>


W przypadku drugiego użyj klasy half-link.

Dla koloru bazowego lub akcentowego należy użyć klas bs-color lub ac-color.

Link      Link



6. Link z ikoną.

Ссылка

Użyj kodu na link z ikoną:

<a href="#" class="link-action-icon">
    <i class="fas fa-question icon"></i><span class="link-action-icon__title">Ссылка</span>
</a>


Klasa fas fa-question powinna być zastąpiona klasą pożądanej ikony fontawesome. Ikony dostępne są pod linkiem.



Błąd w tekście? Zaznacz ją myszką i kliknij Ctrl + F1 lub kliknij na ten blok!