DSpace VSB-TUO Mirage T10:51:43Z. Downloaded from DSpace VSB-TUO

Rozměr: px

Začít zobrazení ze stránky:

Download "DSpace VSB-TUO Mirage T10:51:43Z. Downloaded from DSpace VSB-TUO"

Bedřich Marek
před 7 lety
Počet zobrazení:

1 DSpace VSB-TUO þÿ P r i n c i p y v d e c k é k o m u n i k a c e / P r i n c i p l e s o þÿ f sd csi ep na tci e f i c 5 c( ow mo mr kus nh ioc p a) t, i o1n , V` B - T U O Mirage T10:51:43Z Downloaded from DSpace VSB-TUO

2 DSpace 5 - Mirage 2 Bc. Rostislav Novák

3 Obsah 1)Popis Mirage2 2)Instalace 3)Struktura 4)Provedení změn 5)Odkazy pro čerpání informací

4 Popis Mirage2

5 Popis Mirage2 1)Mirage2 2)Ukázky vzhledu 3)Ukázka mobilního vzhledu 4)Proč používat Mirage2 5)Mirage2 vs Mirage1

6 Mirage2 Proč vznikl Mirage2 Založeno na Bootstrap3, SASS, Obsahuje Javascript task runery Vývojový/produkční mód

7 Ukázka vzhledu

8 Ukázka mobilního vzhledu

9 Ukázka tabletového vzhledu

10 Proč používat Mirage2 Responzivní design Vždy aktuální technologie Snadnější úpravy Potřebná znalost k úpravám stejná jako v Mirage1

11 Mirage2 vs Mirage1 Mirage2 Vychází z Mirage1 Vždy aktuální knihovny frameworky Jiná myšlenka změn Úpravy stejné jako v Mirage1 Někdy problém s nasazením Mobilní verze Mirage1 Implicitně v DSpace Zastaralé knihovny a frameworky Úpravy trvají delší dobu než v Mirage2 Nemá mobilní verzi

12 Instalace

13 Instalace 1) Jak nainstalovat Mirage2 2) Programy, které používá Mirage2 3) Možné problémy při instalaci 4) Špatná instalace Mirage2

14 Jak nainstalovat Mirage2 Mirage2 se musí nechat sestavit Volba pro sestavení s DSpace5: -Dmirage2.on=true -Dmirage2.deps.included=false Po sestavení ant update Výsledný Mirage2 najdeme ve složce témat Mirage1 Zapnout v xmlui.xconf

15 Node Bower Grunt Ruby Compass Programy, které používá Mirage2

16 Možné problémy při instalaci Vždy po ant update se přepíše nastavení v xmlui.xconf Doporučuji sestavovat s naisntalovanými programy Sestavení musí být spuštěno pod neroot uživatelem Při špatně sestaveném Mirage2 sestavení DSpace nehodí chybu Někdy se nesestaví správně

17 Špatně nainstalován Mirage2

18 Struktura

19 Struktura Ve složce Mirage2 images <- Obrázky scripts <- Obsahuje všechny skripty Javascriptu. scripts.xml <- Obsahuje importy všech skriptů, které se mají použít. styles <- Složka se všemi *.scss soubory. vendor <- Složka potřebných souborů pro Mirage2. xsl <- Složka se všemi xsl soubory.

20 Provedení změn

21 Provedení změn 1) Myšlenka změn 2) Doporučená cesta x Nedoporučená cesta 3) Provedení CSS změn 4) Ukázka změny Bootstrap proměnné a CSS 5) Provedení změny v Javascriptu 6) Ukázka přidání Javascriptu 7) Provedení změny XSL 8) Ukázka změny XSL

22 Myšlenka změn Měnit jen málo souborů a pokud možno pouze svoje. Možnost zapnutí si vývojového módu. Možnost vytvářet více témat najednou pomocí odlišností.

23 Doporučená/Nedoporučená cesta Měnit pouze svoje vytvořené soubory. Minimálně měnit základní soubory. Neměnit soubory jako v Mirage1. (Úprava základních souborů/přepisování priorit.)

24 Provedení CSS změn Mirage2 obsahuje v základu dvě barevné schéma. Všechny stylesheety v SASS (scss soubory). Lze použít jen klasické CSS. compass watch styles <- Složka se všemi *.scss soubory. main.scss <- Obsahuje importy všech scss souborů. _style.scss <- Soubor pro naše úpravy. main.css <- Zminimalizované všechny scss soubory.

25 Ukázka přidání/změna CSS Editace souboru _style.scss Hned vidět změny -> compass watch Je možnost i vytvoři jiné scss soubory, ale pak musí být importovány v _main.scss Ukázka...

26 Ukázka změny Bootstrap proměnné Editace souboru _bootstrap_variables.scss Hned vidět změny -> compass watch Je lepší měnit barvy (pokud to lze) přes tyto proměnné Ukázka...

27 Provedení změny Javascriptu Skript vlastní soubor Import v scripts.xml Možný problém, že se při sestavení zasekne a nezapíšou se ostatní skripty do theme.js scripts <- Obsahuje všechny skripty Javascriptu. theme.js <- Zminimalizované skripty. scripts.xml <- Obsahuje importy všech skriptů, které se mají použít.

28 Přidání skriptu Napsat skript do vlastního souboru Přidat do importu Nechat se sestavit (Nedoporučená, ale jistá cesta) Přidání rovnou do zminimalizovaného theme.js Ukázka...

29 Provedení XSL změny Jiné než v Mirage1 Krok před všemi transformacemi xsl <- Složka se všemi xsl soubory. preprocess.xsl <- Soubor pro naše úpravy. theme.xsl <- Obsahuje všechny importy xsl tranformací. Tip: Používat /DRI a?xml

30 Ukázka změny XSL Přidání potřebných xsl příkazů do preprocess.xsl Ukázka...

31 Odkazy

32 Odkazy o Mirage2 Officiální web k Mirage2 GitHub k Mirage2 Wiki k Mirage2 ization Bootstrap proměnné

33 Děkuji za pozornost

Podobné dokumenty

þÿ O k t á v o d i g i t á l n í k n i h o v n a F F

þÿ O k t á v o d i g i t á l n í k n i h o v n a F F DSpace VSB-TUO http://www.dspace.vsb.cz þÿ PY í s p v k y z e s e t k á n í e s k ý c h u~ i v a t e lo s y s þÿ t épy m u í sd p S vp ka y c e 5./ sc eo tnk fá en rí e nec se k ýp ca h p eu~ r s i vf