extends ../layout/main

block variables
	- var title = 'Типографика';
	- var h1 = 'Типографика';


block breadcrumb
	-
		var breadcrumbs=[
			{href:'/',name:'Главная'},
			{href:'#',name:'Типографика'},
		];

	+breadcrumbs(breadcrumbs)

block content
	section.st-width
		p
			a(href='#') Это стандартная ссылка

		p Сайт рыбатекст поможет дизайнеру, верстальщику, вебмастеру сгенерировать несколько абзацев более менее осмысленного текста рыбы на русском языке, а начинающему оратору отточить навык публичных выступлений в домашних условиях. При создании генератора мы использовали небезизвестный универсальный код речей. Текст генерируется абзацами случайным образом от двух до десяти предложений в абзаце, что позволяет сделать текст более привлекательным и живым для визуально-слухового восприятия.

		p По своей сути рыбатекст является альтернативой традиционному lorem ipsum, который вызывает у некторых людей недоумение при попытках прочитать рыбу текст. В отличии от lorem ipsum, текст рыба на русском языке наполнит любой макет непонятным смыслом и придаст неповторимый колорит советских времен.

		br
		br
		div.h2 Доп. классы для текста
		p <span class="code">text-left</span> Выравнивание текста по левому краю
		p <span class="code">text-center</span> Выравнивание текста по центру
		p <span class="code">text-right</span> Выравнивание текста по правому краю
		p <span class="code">text-justify</span> Выравнивание текста по ширине
		p <span class="code">text-uppercase</span> Все символы текста становятся прописными (верхний регистр)
		p <span class="code">text-bold</span> Жирный текст

		br
		br
		div.h2 Заголовки
		h1 Заголовок - h1
		h2 Заголовок - h2
		h3 Заголовок - h3
		h4 Заголовок - h4
		h5 Заголовок - h5

		br
		p.h1 Это класс с названием h1
		p.h2 Это класс с названием h2
		p.h3 Это класс с названием h3
		p.h4 Это класс с названием h4
		p.h5 Это класс с названием h5

		br
		br
		br
		div.h2 Кнопки
		a.btn(href='#') Кнопка
		br
		br
		a.btn.btn_border(href='#') Кнопка
		br
		br
		div(style="background: var(--color-primary); padding: 20px")
		a.btn.btn_white(href='#') Кнопка

		br
		br
		div.h2 Иконки
		.type-icon
			.type-icon__item
				.type-icon__img
					+svg('ic-twitter','ic-twitter', '17', '14')
				.type-icon__name ic-twitter