02.20 Pro neslyšící
Zdrojové CSS: /src/css/molecules/box/_deaf.scss
Zdrojové JS: /src/js/components/deaf.coffee
Defaultní
Heading 1 Zobrazit videa ve znakovém jazyku
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.
Nulla facilisi. Sed interdum orci interdum sapien. Nulla quam. 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. Proin pulvinar sollicitudin augue. Vivamus ac lorem. Quisque ut ipsum. Vivamus in pede quis erat condimentum adipiscing. Curabitur risus erat, scelerisque sit amet, mollis id, consectetuer eu, neque. Sed vitae risus sed enim fermentum venenatis.
Nulla facilisi. Sed interdum orci interdum sapien. Nulla quam. 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. Proin pulvinar sollicitudin augue. Vivamus ac lorem. Quisque ut ipsum. Vivamus in pede quis erat condimentum adipiscing. Curabitur risus erat, scelerisque sit amet, mollis id, consectetuer eu, neque.
Výchozí molekula s obsahem pro neslyšící. Pro tuto molekulu slouží div.box-deaf
Obsah, kde je potřeba tato funkčnost se obalí do div.box-deaf. Jednotlivé části, které mají audio alternativu se obalí do .box-deaf__content a hned na začátek se vloží odkaz pro přehrátí. V poslední řadě se někde umístí ikonka a.box-deaf__toggle, na kterou je navázán JavaScript, který zobrazuje ikonky s alternativním obsahem, v našem případě je vloženo do nadpisu.