02.06 Boxy – S pozadím
Zdrojové CSS: /src/css/molecules/box/_bg.scss
Defaultní
Curabitur eu neque a felis dictum iaculis. Curabitur sodales dui sit amet mi. Donec cursus sapien et neque. Aenean nisi sapien sagittis a eleifend sed, tristique pretium, enim.
Ukázka s větším písmem
Stejné jako výchozí molekula, jen je uvnitř použita classa big z SK mini frameworku.
Curabitur eu neque a felis dictum iaculis. Curabitur sodales dui sit amet mi. Donec cursus sapien et neque. Aenean nisi sapien sagittis a eleifend sed, tristique pretium, enim.
Ukázka s menším odsazením
Molekula vycházející z defaultní molekuly. Pro menší odsazení je potřeba přidat modifikátor box-bg--medium na .box-bg.
Curabitur eu neque a felis dictum iaculis. Curabitur sodales dui sit amet mi. Donec cursus sapien et neque. Aenean nisi sapien sagittis a eleifend sed, tristique pretium, enim.
Ukázka s nejmenším odsazením
Molekula vycházející z defaultní molekuly. Pro malé odsazení je potřeba přidat modifikátor box-bg--small na .box-bg.
Curabitur eu neque a felis dictum iaculis. Curabitur sodales dui sit amet mi. Donec cursus sapien et neque. Aenean nisi sapien sagittis a eleifend sed, tristique pretium, enim.
Ukázka s barevným (primárním) pozadím a bílým textem
Molekula vycházející z defaultní molekuly. Pro jiný barevný podklad je potřeba přidat modifikátory box-bg--primary a box-bg--color-light na .box-bg. Ukázka je připravena pro všechna nadefinovaná odsazení.
Curabitur eu neque a felis dictum iaculis. Curabitur sodales dui sit amet mi. Donec cursus sapien et neque. Aenean nisi sapien sagittis a eleifend sed, tristique pretium, enim.
Curabitur eu neque a felis dictum iaculis. Curabitur sodales dui sit amet mi. Donec cursus sapien et neque. Aenean nisi sapien sagittis a eleifend sed, tristique pretium, enim.
Curabitur eu neque a felis dictum iaculis. Curabitur sodales dui sit amet mi. Donec cursus sapien et neque. Aenean nisi sapien sagittis a eleifend sed, tristique pretium, enim.
Ukázka na celou šířku
Molekula vycházející z defaultní molekuly. Pro správné zobrazení je potřeba přidat modifikátor box-bg--full na .box-bg a dovnitř vložit .row-main, který se stará o vycentrování obsahu.
Curabitur eu neque a felis dictum iaculis. Curabitur sodales dui sit amet mi. Donec cursus sapien et neque. Aenean nisi sapien sagittis a eleifend sed, tristique pretium, enim.
Barevné varianty
Molekula vycházející z defaultní molekuly. Pro jiný barevný podklad dle barev fakult je potřeba přidat modifikátor box-bg--* (zkratka fakulty) a případně box-bg--color-light (pro změnu barvy) na .box-bg.
Curabitur eu neque a felis dictum iaculis. Curabitur sodales dui sit amet mi. Donec cursus sapien et neque. Aenean nisi sapien sagittis a eleifend sed, tristique pretium, enim.
box-bg--primary box-bg--color-light
Curabitur eu neque a felis dictum iaculis. Curabitur sodales dui sit amet mi. Donec cursus sapien et neque. Aenean nisi sapien sagittis a eleifend sed, tristique pretium, enim.
box-bg--muni box-bg--color-light
Curabitur eu neque a felis dictum iaculis. Curabitur sodales dui sit amet mi. Donec cursus sapien et neque. Aenean nisi sapien sagittis a eleifend sed, tristique pretium, enim.
box-bg--law box-bg--color-light
Curabitur eu neque a felis dictum iaculis. Curabitur sodales dui sit amet mi. Donec cursus sapien et neque. Aenean nisi sapien sagittis a eleifend sed, tristique pretium, enim.
box-bg--med box-bg--color-light
Curabitur eu neque a felis dictum iaculis. Curabitur sodales dui sit amet mi. Donec cursus sapien et neque. Aenean nisi sapien sagittis a eleifend sed, tristique pretium, enim.
box-bg--sci box-bg--color-light
Curabitur eu neque a felis dictum iaculis. Curabitur sodales dui sit amet mi. Donec cursus sapien et neque. Aenean nisi sapien sagittis a eleifend sed, tristique pretium, enim.
box-bg--fi
Curabitur eu neque a felis dictum iaculis. Curabitur sodales dui sit amet mi. Donec cursus sapien et neque. Aenean nisi sapien sagittis a eleifend sed, tristique pretium, enim.
box-bg--fss box-bg--color-light
Curabitur eu neque a felis dictum iaculis. Curabitur sodales dui sit amet mi. Donec cursus sapien et neque. Aenean nisi sapien sagittis a eleifend sed, tristique pretium, enim.
box-bg--fsps box-bg--color-light
Curabitur eu neque a felis dictum iaculis. Curabitur sodales dui sit amet mi. Donec cursus sapien et neque. Aenean nisi sapien sagittis a eleifend sed, tristique pretium, enim.
box-bg--phil box-bg--color-light
Curabitur eu neque a felis dictum iaculis. Curabitur sodales dui sit amet mi. Donec cursus sapien et neque. Aenean nisi sapien sagittis a eleifend sed, tristique pretium, enim.
box-bg--ped
Curabitur eu neque a felis dictum iaculis. Curabitur sodales dui sit amet mi. Donec cursus sapien et neque. Aenean nisi sapien sagittis a eleifend sed, tristique pretium, enim.
box-bg--econ box-bg--color-light
Curabitur eu neque a felis dictum iaculis. Curabitur sodales dui sit amet mi. Donec cursus sapien et neque. Aenean nisi sapien sagittis a eleifend sed, tristique pretium, enim.
box-bg--pharm box-bg--color-light
Curabitur eu neque a felis dictum iaculis. Curabitur sodales dui sit amet mi. Donec cursus sapien et neque. Aenean nisi sapien sagittis a eleifend sed, tristique pretium, enim.
box-bg--dark box-bg--color-light
Curabitur eu neque a felis dictum iaculis. Curabitur sodales dui sit amet mi. Donec cursus sapien et neque. Aenean nisi sapien sagittis a eleifend sed, tristique pretium, enim.
box-bg--color box-bg--color-light
Curabitur eu neque a felis dictum iaculis. Curabitur sodales dui sit amet mi. Donec cursus sapien et neque. Aenean nisi sapien sagittis a eleifend sed, tristique pretium, enim.
box-bg--grey-dark
Curabitur eu neque a felis dictum iaculis. Curabitur sodales dui sit amet mi. Donec cursus sapien et neque. Aenean nisi sapien sagittis a eleifend sed, tristique pretium, enim.
box-bg--grey-light
Curabitur eu neque a felis dictum iaculis. Curabitur sodales dui sit amet mi. Donec cursus sapien et neque. Aenean nisi sapien sagittis a eleifend sed, tristique pretium, enim.
box-bg--white
Curabitur eu neque a felis dictum iaculis. Curabitur sodales dui sit amet mi. Donec cursus sapien et neque. Aenean nisi sapien sagittis a eleifend sed, tristique pretium, enim.
box-bg--white-border
Curabitur eu neque a felis dictum iaculis. Curabitur sodales dui sit amet mi. Donec cursus sapien et neque. Aenean nisi sapien sagittis a eleifend sed, tristique pretium, enim.
box-bg--muni-border
Výchozí molekula pro zobrazení nějakého obsahu / molekuly na barevném podkladu. Do .box-bg lze vkládat libovolné komponenty z frameworku.