j1-template 2021.0.6 → 2021.0.11
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/_includes/themes/j1/procedures/global/attributes_loader.proc +2 -2
- data/assets/data/menu.html +4 -4
- data/assets/themes/j1/adapter/js/fam.js +59 -27
- data/assets/themes/j1/adapter/js/j1.js +3 -2
- data/assets/themes/j1/adapter/js/themer.js +47 -23
- data/assets/themes/j1/adapter/js/toccer.js +97 -18
- data/assets/themes/j1/core/css/icon-fonts/fontawesome.css +299 -12
- data/assets/themes/j1/core/css/icon-fonts/fontawesome.min.css +1 -1
- data/assets/themes/j1/core/css/themes/uno-light/bootstrap.css +92 -81
- data/assets/themes/j1/core/css/themes/uno-light/bootstrap.min.css +1 -1
- data/assets/themes/j1/core/fonts/fontawesome_5/fonts/eot/fa-brands-400.eot +0 -0
- data/assets/themes/j1/core/fonts/fontawesome_5/fonts/eot/fa-regular-400.eot +0 -0
- data/assets/themes/j1/core/fonts/fontawesome_5/fonts/eot/fa-solid-900.eot +0 -0
- data/assets/themes/j1/core/fonts/fontawesome_5/fonts/fa-brands-400.woff +0 -0
- data/assets/themes/j1/core/fonts/fontawesome_5/fonts/fa-brands-400.woff2 +0 -0
- data/assets/themes/j1/core/fonts/fontawesome_5/fonts/fa-regular-400.woff +0 -0
- data/assets/themes/j1/core/fonts/fontawesome_5/fonts/fa-regular-400.woff2 +0 -0
- data/assets/themes/j1/core/fonts/fontawesome_5/fonts/fa-solid-900.woff +0 -0
- data/assets/themes/j1/core/fonts/fontawesome_5/fonts/fa-solid-900.woff2 +0 -0
- data/assets/themes/j1/core/fonts/fontawesome_5/fonts/svg/fa-brands-400.svg +855 -597
- data/assets/themes/j1/core/fonts/fontawesome_5/fonts/svg/fa-regular-400.svg +94 -96
- data/assets/themes/j1/core/fonts/fontawesome_5/fonts/svg/fa-solid-900.svg +1272 -771
- data/assets/themes/j1/core/fonts/fontawesome_5/fonts/ttf/fa-brands-400.ttf +0 -0
- data/assets/themes/j1/core/fonts/fontawesome_5/fonts/ttf/fa-regular-400.ttf +0 -0
- data/assets/themes/j1/core/fonts/fontawesome_5/fonts/ttf/fa-solid-900.ttf +0 -0
- data/assets/themes/j1/modules/justifiedGallery/LICENSE +1 -1
- data/assets/themes/j1/modules/justifiedGallery/README.md +5 -3
- data/assets/themes/j1/modules/justifiedGallery/_versions/v3.8.0/js/{jquery.justifiedGallery.js → justifiedGallery.js} +145 -145
- data/assets/themes/j1/modules/justifiedGallery/_versions/v3.8.0/js/{jquery.justifiedGallery.min.js → justifiedGallery.min.js} +1 -2
- data/assets/themes/j1/modules/justifiedGallery/js/justifiedGallery.js +69 -53
- data/assets/themes/j1/modules/justifiedGallery/js/justifiedGallery.min.js +2 -2
- data/lib/j1/commands/generate.rb +5 -4
- data/lib/j1/version.rb +1 -1
- data/lib/j1_app/j1_auth_manager/auth_manager.rb +15 -0
- data/lib/starter_web/Gemfile +1 -1
- data/lib/starter_web/_config.yml +8 -6
- data/lib/starter_web/_data/apps/justified_gallery.yml +41 -13
- data/lib/starter_web/_data/asciidoc2pdf/themes/j1-theme.yml +225 -188
- data/lib/starter_web/_data/blocks/banner.yml +19 -7
- data/lib/starter_web/_data/blocks/panel.yml +1 -1
- data/lib/starter_web/_data/modules/defaults/navigator.yml +1 -1
- data/lib/starter_web/_data/modules/defaults/toccer.yml +3 -3
- data/lib/starter_web/_data/modules/fam.yml +8 -0
- data/lib/starter_web/_data/modules/navigator_menu.yml +28 -10
- data/lib/starter_web/_includes/attributes.asciidoc +43 -13
- data/lib/starter_web/_plugins/asciidoctor-extensions/fab-icon-inline.rb +1 -1
- data/lib/starter_web/_plugins/lunr_index.rb +1 -1
- data/lib/starter_web/assets/images/collections/blog/featured/markus-spiske-2.jpg +0 -0
- data/lib/starter_web/assets/images/collections/blog/featured/staticgen.jpg +0 -0
- data/lib/starter_web/assets/images/modules/attics/florian-olivo-1920x1280.jpg +0 -0
- data/lib/starter_web/assets/images/modules/attics/joel-filipe-1920x1280.jpg +0 -0
- data/lib/starter_web/assets/images/modules/attics/markus-spiske3-1920x1280.jpg +0 -0
- data/lib/starter_web/assets/images/modules/attics/nicola-styles-1920x1280.jpg +0 -0
- data/lib/starter_web/assets/images/modules/attics/{runner-1920x1200-bw.jpg → runner-1920x1200.jpg} +0 -0
- data/lib/starter_web/assets/images/modules/attics/{the-place-1920x1280-bw.jpg → the-place-1920x1280.jpg} +0 -0
- data/lib/starter_web/assets/images/modules/gallery/old_times/colored/image_01.jpg +0 -0
- data/lib/starter_web/assets/images/modules/gallery/old_times/image_01.jpg +0 -0
- data/lib/starter_web/assets/images/modules/gallery/old_times/image_02.jpg +0 -0
- data/lib/starter_web/assets/images/modules/gallery/old_times/image_03.jpg +0 -0
- data/lib/starter_web/assets/images/modules/gallery/old_times/image_04.jpg +0 -0
- data/lib/starter_web/assets/images/modules/icons/d1/scalable/d1.svg +1 -1
- data/lib/starter_web/assets/images/pages/panels/florian-olivo-1920x800.jpg +0 -0
- data/lib/starter_web/assets/images/pages/panels/responsive-text-1920x800.jpg +0 -0
- data/lib/starter_web/assets/images/pages/skeleton/annie-spratt-1920x1280.jpg +0 -0
- data/lib/starter_web/assets/images/pages/skeleton/antonino-visalli-1920x1280.jpg +0 -0
- data/lib/starter_web/assets/images/pages/skeleton/humble-lamb-1920x1280.jpg +0 -0
- data/lib/starter_web/assets/images/pages/skeleton/library-1920x1280.jpg +0 -0
- data/lib/starter_web/assets/images/pages/skeleton/romain-vignes-1920x1280.jpg +0 -0
- data/lib/starter_web/assets/images/pages/skeleton/sigmund-1920x1280.jpg +0 -0
- data/lib/starter_web/assets/images/pages/writers_guide/1280px-PDCA_Process.png +0 -0
- data/lib/starter_web/assets/images/pages/writers_guide/annie-spratt-1920x1280.jpg +0 -0
- data/lib/starter_web/assets/images/pages/writers_guide/deming-cycle.png +0 -0
- data/lib/starter_web/assets/images/pages/writers_guide/humble-lamb-1920x1280.jpg +0 -0
- data/lib/starter_web/assets/images/pages/writers_guide/john-schnobrich-1920x1280.jpg +0 -0
- data/lib/starter_web/assets/images/pages/writers_guide/sigmund-1920x1280.jpg +0 -0
- data/lib/starter_web/collections/posts/public/featured/_posts/{0000-00-00-welcome-to-j1-template.adoc.erb → 0000-00-00-welcome-to-j1.adoc.erb} +29 -13
- data/lib/starter_web/collections/posts/public/featured/_posts/{2020-05-01-top-open-source-static-site-generators.adoc → 2020-05-01-top-site-generators.adoc} +10 -15
- data/lib/starter_web/collections/posts/public/featured/_posts/2020-06-01-about-cookies.adoc +58 -54
- data/lib/starter_web/collections/posts/public/series/_posts/2020-01-01-post-test-series.adoc +1 -1
- data/lib/starter_web/collections/posts/public/series/_posts/2020-01-02-post-test-series.adoc +1 -1
- data/lib/starter_web/collections/posts/public/series/_posts/2020-01-03-post-test-series.adoc +1 -1
- data/lib/starter_web/collections/posts/public/series/_posts/2020-01-04-post-test-series.adoc +1 -1
- data/lib/starter_web/dot.gitignore +2 -3
- data/lib/starter_web/index.html +10 -12
- data/lib/starter_web/package.json +1 -1
- data/lib/starter_web/pages/public/about/about_site.adoc +15 -1811
- data/lib/starter_web/pages/public/asciidoc_skeletons/_templates/asciidoc-extensions/blindtext.asciidoc +11 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/_templates/asciidoc-extensions/font_icons.asciidoc +23 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/_templates/asciidoc-extensions/gallery.asciidoc +5 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/_templates/asciidoc-extensions/lightbox.asciidoc +7 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/_templates/documents/chapter_document.asciidoc +9 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/_templates/documents/entry_document.asciidoc +3 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/_templates/images/image.asciidoc +6 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/_templates/tables/table_2_column.asciidoc +12 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/_templates/tables/table_2_column_options.asciidoc +30 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/_templates/tables/table_3_column.asciidoc +16 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/_templates/tables/table_4_column.asciidoc +25 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/book/000_intro.adoc +61 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/book/100_chapter.adoc +58 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/book/200_chapter.adoc +59 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/book/900_references.adoc +68 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/book/_includes/attributes.asciidoc +68 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/book/_includes/documents/000_intro.asciidoc +33 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/book/_includes/documents/100_chapter.asciidoc +7 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/book/_includes/documents/100_chapter/100_chapter_document.asciidoc +21 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/book/_includes/documents/100_chapter/110_chapter_document.asciidoc +36 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/book/_includes/documents/200_chapter.asciidoc +5 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/book/_includes/documents/200_chapter/200_chapter_document.asciidoc +53 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/book/_includes/documents/900_references.asciidoc +23 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/book/_includes/documents/900_references/000_intro.asciidoc +23 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/book/_includes/documents/900_references/100_chapter_document.asciidoc +33 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/book/_includes/documents/900_references/200_chapter_document.asciidoc +26 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/book/_includes/documents/900_references/900_sources.asciidoc +81 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/book/_includes/documents/tables/110_material_design_icons.asciidoc +102 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/book/a2p.bat +28 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/book/a2p.sh +26 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/book/book.a2p +114 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/book/book.adoc +128 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/book/book.pdf +5440 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/multi-document/100_chapter.asciidoc +60 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/multi-document/200_chapter.asciidoc +59 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/multi-document/_includes/attributes.asciidoc +63 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/multi-document/_includes/documents/100_chapter.asciidoc +53 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/multi-document/_includes/documents/200_chapter.asciidoc +53 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/multi-document/_includes/documents/tables/110_material_design_icons.asciidoc +102 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/multi-document/multi.adoc +84 -0
- data/lib/starter_web/pages/public/asciidoc_skeletons/simple-document/simple.adoc +236 -0
- data/lib/starter_web/pages/public/learn/roundtrip/100_present_images.adoc +5 -6
- data/lib/starter_web/pages/public/learn/roundtrip/100_present_videos.adoc +1 -1
- data/lib/starter_web/pages/public/learn/roundtrip/200_typography.adoc +1 -269
- data/lib/starter_web/pages/public/learn/roundtrip/300_icon_fonts.adoc +205 -90
- data/lib/starter_web/pages/public/learn/roundtrip/400_asciidoc_extensions.adoc +5 -15
- data/lib/starter_web/pages/public/learn/roundtrip/410_bs_modals_extentions.adoc +4 -5
- data/lib/starter_web/pages/public/learn/roundtrip/420_responsive_tables_extensions.adoc +1 -54
- data/lib/starter_web/pages/public/learn/roundtrip/500_themes.adoc +47 -39
- data/lib/starter_web/pages/public/learn/roundtrip/600_quicksearch.adoc +17 -1
- data/lib/starter_web/pages/public/learn/roundtrip/_includes/attributes.asciidoc +1 -1
- data/lib/starter_web/pages/public/learn/roundtrip/_includes/documents/{410_table_3_column.asciidoc → 410_table_bs_modal_examples.asciidoc} +0 -0
- data/lib/starter_web/pages/public/learn/roundtrip/_includes/documents/tables/bs_modal_examples.asciidoc +47 -0
- data/lib/starter_web/pages/public/learn/where_to_go.adoc +25 -50
- data/lib/starter_web/pages/public/panels/intro_panel/panel.adoc +67 -36
- data/lib/starter_web/pages/public/previewer/_includes/tables/rouge/200_rouge_attributes.asciidoc +1 -1
- data/lib/starter_web/pages/public/previewer/bootstrap_theme.adoc +15 -15
- data/lib/starter_web/pages/public/previewer/mdi_icons_preview.adoc +1 -1
- data/lib/starter_web/pages/public/previewer/rouge.adoc +33 -24
- data/lib/starter_web/pages/public/previewer/twitter_emoji_preview.adoc +1 -1
- data/lib/starter_web/utilsrv/_defaults/package.json +1 -1
- data/lib/starter_web/utilsrv/package.json +1 -1
- metadata +75 -39
- data/assets/themes/j1/modules/justifiedGallery/_versions/v3.8.0/justifiedGallery.min.zip +0 -0
- data/assets/themes/j1/modules/justifiedGallery/_versions/v3.8.0/justifiedGallery.zip +0 -0
- data/assets/themes/j1/modules/justifiedGallery/_versions/v4.0.0/css/justifiedGallery.css +0 -110
- data/assets/themes/j1/modules/justifiedGallery/_versions/v4.0.0/css/justifiedGallery.min.css +0 -110
- data/assets/themes/j1/modules/justifiedGallery/_versions/v4.0.0/css/theme/uno.css +0 -23
- data/assets/themes/j1/modules/justifiedGallery/_versions/v4.0.0/js/jquery.justifiedGallery.js +0 -1229
- data/assets/themes/j1/modules/justifiedGallery/_versions/v4.0.0/js/jquery.justifiedGallery.min.js +0 -8
- data/assets/themes/j1/modules/twemoji/js/LICENSE +0 -21
- data/lib/j1/templates/posts/0000-00-00-welcome-to-j1-template.adoc.erb +0 -72
- data/lib/starter_web/collections/posts/public/featured/_posts/2020-04-01-confusion-about-base-url.adoc +0 -118
- data/lib/starter_web/pages/public/about/become_a_patron.adoc +0 -71
- data/lib/starter_web/pages/public/learn/kickstarter/web_in_a_day/100_meet_and_greet_jekyll.adoc +0 -79
- data/lib/starter_web/pages/public/learn/kickstarter/web_in_a_day/200_preparations.adoc +0 -77
- data/lib/starter_web/pages/public/learn/kickstarter/web_in_a_day/300_first_awesome_web.adoc +0 -75
- data/lib/starter_web/pages/public/learn/kickstarter/web_in_a_day/_includes/attributes.asciidoc +0 -176
- data/lib/starter_web/pages/public/learn/kickstarter/web_in_a_day/_includes/documents/100_meet_and_greet_jekyll.asciidoc +0 -31
- data/lib/starter_web/pages/public/learn/kickstarter/web_in_a_day/_includes/documents/200_preparations.asciidoc +0 -14
- data/lib/starter_web/pages/public/learn/kickstarter/web_in_a_day/_includes/documents/300_first_awesome_web.asciidoc +0 -11
- data/lib/starter_web/pages/public/learn/kickstarter/web_in_a_day/_includes/parts.asciidoc +0 -193
- data/lib/starter_web/pages/public/learn/kickstarter/web_in_a_day/_includes/tables/debug_variables.asciidoc +0 -47
- data/lib/starter_web/pages/public/learn/kickstarter/web_in_a_day/_includes/tables/readme +0 -1
- data/lib/starter_web/pages/public/learn/roundtrip/610_fam.adoc +0 -294
- data/lib/starter_web/pages/public/learn/roundtrip/_includes/tables/readme +0 -0
- data/lib/starter_web/pages/public/legal/de/100_impress.adoc +0 -98
- data/lib/starter_web/pages/public/legal/de/200_terms_of_use.adoc +0 -55
- data/lib/starter_web/pages/public/legal/de/300_privacy.adoc +0 -295
- data/lib/starter_web/pages/public/legal/de/400_license_agreement.adoc +0 -395
- data/lib/starter_web/pages/public/legal/de/500_support.adoc +0 -20
- data/lib/starter_web/pages/public/legal/en/400_license_agreement.adoc +0 -441
- data/lib/starter_web/pages/public/legal/en/500_support.adoc +0 -27
@@ -36,7 +36,7 @@ resource_options:
|
|
36
36
|
// Enable the Liquid Preprocessor
|
37
37
|
:page-liquid:
|
38
38
|
|
39
|
-
// Set
|
39
|
+
// Set (local) page attributes here
|
40
40
|
// -----------------------------------------------------------------------------
|
41
41
|
// :page--attr: <attr-value>
|
42
42
|
:images-dir: {imagesdir}/pages/roundtrip/100_present_images
|
@@ -72,7 +72,8 @@ Framework*. See section <<Iconify Icons>> for more information.
|
|
72
72
|
|
73
73
|
== Material Design Icons
|
74
74
|
|
75
|
-
The primary icon-set for J1 Template is
|
75
|
+
The primary icon-set for J1 Template is
|
76
|
+
link:{mdi-home}[Material Design Icons, {browser-window--new}],
|
76
77
|
because it is extremely rich set providing more than 5900+ icons for the
|
77
78
|
current version (v5.9.55). From a design perspective, _MDI_ has an excellen
|
78
79
|
*Material Design* support an comes with the original icon set created by
|
@@ -80,8 +81,8 @@ _Google_ build-in.
|
|
80
81
|
|
81
82
|
_Material Design Icons_ (MDI) is a beneficial design resource for Web Design
|
82
83
|
that is based on _Google_'s Material Design. _MDI_ is a community-driven
|
83
|
-
project to create an increased number of icons based on _Google_'s official
|
84
|
-
and MD style specification.
|
84
|
+
project to create an increased number of icons based on _Google_'s official
|
85
|
+
repository and MD style specification.
|
85
86
|
|
86
87
|
.Material Design Icons
|
87
88
|
[cols="2a,3a,4a,^", options="header", width="100%", role="rtable mt-3"]
|
@@ -90,7 +91,11 @@ and MD style specification.
|
|
90
91
|
|
91
92
|
|1x
|
92
93
|
|no modifier set
|
93
|
-
|All
|
94
|
+
|All icons can be found for preview at the
|
95
|
+
link:{url-material-design-icons--cheatsheet}[MDI Cheatsheet, {browser-window--new}]
|
96
|
+
page online. +
|
97
|
+
|
98
|
+
No modifiers +
|
94
99
|
[source, adoc, role="noclip"]
|
95
100
|
----
|
96
101
|
mdi:account[1x]
|
@@ -99,7 +104,11 @@ mdi:account[1x]
|
|
99
104
|
|
100
105
|
|3x
|
101
106
|
|no modifier set
|
102
|
-
|All
|
107
|
+
|All icons can be found for preview at the
|
108
|
+
link:{url-material-design-icons--cheatsheet}[MDI Cheatsheet, {browser-window--new}]
|
109
|
+
page online. +
|
110
|
+
|
111
|
+
No modifiers +
|
103
112
|
[source, adoc, role="noclip"]
|
104
113
|
----
|
105
114
|
mdi:account[3x]
|
@@ -108,7 +117,11 @@ mdi:account[3x]
|
|
108
117
|
|
109
118
|
|5x
|
110
119
|
|no modifier set
|
111
|
-
|All
|
120
|
+
|All icons can be found for preview at the
|
121
|
+
link:{url-material-design-icons--cheatsheet}[MDI Cheatsheet, {browser-window--new}]
|
122
|
+
page online. +
|
123
|
+
|
124
|
+
No modifiers +
|
112
125
|
[source, adoc, role="noclip"]
|
113
126
|
----
|
114
127
|
mdi:account[5x]
|
@@ -117,7 +130,11 @@ mdi:account[5x]
|
|
117
130
|
|
118
131
|
|5x
|
119
132
|
|`mdi-rotate-45`
|
120
|
-
|
|
133
|
+
|All icons can be found for preview at the
|
134
|
+
link:{url-material-design-icons--cheatsheet}[MDI Cheatsheet, {browser-window--new}]
|
135
|
+
page online. +
|
136
|
+
|
137
|
+
Rotate 45 degrees +
|
121
138
|
[source, adoc, role="noclip"]
|
122
139
|
----
|
123
140
|
mdi:account[5x mdi-rotate-45]
|
@@ -126,7 +143,11 @@ mdi:account[5x mdi-rotate-45]
|
|
126
143
|
|
127
144
|
|5x
|
128
145
|
|`mdi-rotate-315`
|
129
|
-
|
|
146
|
+
|All icons can be found for preview at the
|
147
|
+
link:{url-material-design-icons--cheatsheet}[MDI Cheatsheet, {browser-window--new}]
|
148
|
+
page online. +
|
149
|
+
|
150
|
+
Rotate 315 degrees +
|
130
151
|
[source, adoc, role="noclip"]
|
131
152
|
----
|
132
153
|
mdi:account[5x mdi-rotate-315]
|
@@ -136,7 +157,11 @@ mdi:account[5x mdi-rotate-315]
|
|
136
157
|
|5x
|
137
158
|
|`mdi-light` +
|
138
159
|
`mdi-flip-v`
|
139
|
-
|
|
160
|
+
|All icons can be found for preview at the
|
161
|
+
link:{url-material-design-icons--cheatsheet}[MDI Cheatsheet, {browser-window--new}]
|
162
|
+
page online. +
|
163
|
+
|
164
|
+
Colour set to (md) light-grey and flipped vertical +
|
140
165
|
[source, adoc, role="noclip"]
|
141
166
|
----
|
142
167
|
mdi:alert[5x mdi-light mdi-flip-v]
|
@@ -145,7 +170,11 @@ mdi:alert[5x mdi-light mdi-flip-v]
|
|
145
170
|
|
146
171
|
|5x
|
147
172
|
|`md-indigo`
|
148
|
-
|
|
173
|
+
|All icons can be found for preview at the
|
174
|
+
link:{url-material-design-icons--cheatsheet}[MDI Cheatsheet, {browser-window--new}]
|
175
|
+
page online. +
|
176
|
+
|
177
|
+
Colour set to (md) indigo +
|
149
178
|
[source, adoc, role="noclip"]
|
150
179
|
----
|
151
180
|
mdi:alert[5x md-indigo]
|
@@ -154,7 +183,11 @@ mdi:alert[5x md-indigo]
|
|
154
183
|
|
155
184
|
|5x
|
156
185
|
|`md-pink`
|
157
|
-
|
|
186
|
+
|All icons can be found for preview at the
|
187
|
+
link:{url-material-design-icons--cheatsheet}[MDI Cheatsheet, {browser-window--new}]
|
188
|
+
page online. +
|
189
|
+
|
190
|
+
Colour set to (md) pink +
|
158
191
|
[source, adoc, role="noclip"]
|
159
192
|
----
|
160
193
|
mdi:alert[5x md-pink]
|
@@ -163,7 +196,11 @@ mdi:alert[5x md-pink]
|
|
163
196
|
|
164
197
|
|5x
|
165
198
|
|`mdi-spin`
|
166
|
-
|
|
199
|
+
|All icons can be found for preview at the
|
200
|
+
link:{url-material-design-icons--cheatsheet}[MDI Cheatsheet, {browser-window--new}]
|
201
|
+
page online. +
|
202
|
+
|
203
|
+
Added animation of type rotate (spin) +
|
167
204
|
[source, adoc, role="noclip"]
|
168
205
|
----
|
169
206
|
mdi:loading[5x mdi-spin]
|
@@ -173,7 +210,11 @@ mdi:loading[5x mdi-spin]
|
|
173
210
|
|5x
|
174
211
|
|`md-red-900` +
|
175
212
|
`mdi-pulsed`
|
176
|
-
|
|
213
|
+
|All icons can be found for preview at the
|
214
|
+
link:{url-material-design-icons--cheatsheet}[MDI Cheatsheet, {browser-window--new}]
|
215
|
+
page online. +
|
216
|
+
|
217
|
+
Colour set to (md) color dark-red and added animation of type pulsed +
|
177
218
|
[source, adoc, role="noclip"]
|
178
219
|
----
|
179
220
|
mdi:heart[5x md-red-900 mdi-pulsed]
|
@@ -182,9 +223,10 @@ mdi:heart[5x md-red-900 mdi-pulsed]
|
|
182
223
|
|
183
224
|
|===============================================================================
|
184
225
|
|
185
|
-
NOTE: Using Material Design Icons with Asciidoc is quite easy as an inline
|
186
|
-
`mdi:` is available to place icons where ever you want. See more about
|
187
|
-
this in section
|
226
|
+
NOTE: Using Material Design Icons with Asciidoc is quite easy as an inline
|
227
|
+
macro `mdi:` is available to place icons where ever you want. See more about
|
228
|
+
this in section
|
229
|
+
link:{roundtrip-asciidoc-extensions}#icon-fonts[Asciidoc Extensions]
|
188
230
|
|
189
231
|
_MDI_ is a growing collection to allow designers and developers targeting
|
190
232
|
various platforms to download icons in the format, color and size they need
|
@@ -194,37 +236,101 @@ the official set created by _Google_.
|
|
194
236
|
_J1 Template_ supports the full set of _MDI_ for the Web (Webfont, WOFF). The
|
195
237
|
icon set is fully integrated and can be used out-of-the-box.
|
196
238
|
|
197
|
-
For MDI a Preview Page is available to explore what can be done base on the
|
198
|
-
J1 implementation regarding sizes, colours, animations etc. Go for the
|
199
|
-
link:{previewer-mdi}[Preview Page, {browser-window--new}] and check-out what's
|
200
|
-
possible using MDI font icons!
|
201
|
-
|
202
239
|
== FontAwesome Icons
|
203
240
|
|
204
|
-
|
205
|
-
by
|
206
|
-
Bootstrap V3
|
207
|
-
frameworks used for web development. Today,
|
241
|
+
_FontAwesome_ is a font and icon toolkit based on CSS. It was initially created
|
242
|
+
by _Dave Gandy_. The previous *version 4* was mainly for the use with Twitter
|
243
|
+
Bootstrap *V3*. The new version *V5*, released in December 2017, is focussing
|
244
|
+
all frameworks used for web development. Today, the *free FA* icon set comes
|
245
|
+
with 1400+ icons included.
|
208
246
|
|
209
|
-
|
210
|
-
|
211
|
-
|
212
|
-
Since version 5, the icon set comes in two packages: FontAwesome Free
|
213
|
-
and the proprietary FontAwesome Pro version available for a license fee.
|
247
|
+
Since version 5, the icon set comes in two packages: FontAwesome *Free*
|
248
|
+
and the proprietary, commercial FontAwesome *Pro* version but requires a
|
249
|
+
license fee to pay.
|
214
250
|
|
215
251
|
The free versions (all releases up to 4 and the free version for 5) are
|
216
252
|
available under SIL Open Font License 1.1, Creative Commons Attribution 4.0,
|
217
253
|
and the MIT License.
|
218
|
-
====
|
219
254
|
|
220
|
-
|
255
|
+
FontAwesome V5 meets the Material Design idea (of _Google_) and in comparison
|
256
|
+
to Version 4, the current version is much more than a face-lifting. Version 5
|
257
|
+
comes with more than 2300+ icons, but many of them are available with the Pro
|
258
|
+
license only. For the Free version, only a subset of 900+ icons is available.
|
259
|
+
|
260
|
+
NOTE: The CSS styles for FontAwesome V5 has been extended for J1 Template to
|
261
|
+
the same classes (and their respective names) as for other Font Icon sets.
|
262
|
+
Already existing styles like `fa-flip-vertical` are available as `fa-flip-v`
|
263
|
+
as well.
|
264
|
+
|
265
|
+
You can checkout what icons available at
|
266
|
+
link:{fontawesome-icons}[FontAwesome Icons, {browser-window--new}].
|
267
|
+
_FontAwesome_ V5 is fully integrated - no need for additional resources to
|
268
|
+
load. But in comparison to Version 4, a lot of differences needs to be
|
269
|
+
noticed.
|
270
|
+
|
271
|
+
If you haven't used V5 yet, it is highly recommended to visit the
|
272
|
+
link:{fontawesome-get-started}[Get started, {browser-window--new}] pages to
|
273
|
+
learn the basics and features and styles.
|
274
|
+
|
275
|
+
With version V5 of _FontAwesome_, the icon set is split in two general parts:
|
276
|
+
|
277
|
+
* standard icons (symbols) indicated by *FAS*
|
278
|
+
* brand icons (icons for companies and brands) indicated by *FAB*
|
279
|
+
|
280
|
+
NOTE: Using FontAwesome with Asciidoc is quite easy as two inline macros
|
281
|
+
`fab:` and `fas:` are available to place icons where ever you want. See more
|
282
|
+
about this in section
|
283
|
+
link:{roundtrip-asciidoc-extensions}#icon-fonts[Asciidoc Extensions]
|
284
|
+
|
285
|
+
Find below examples of both and the use with J1 Template.
|
286
|
+
|
287
|
+
=== Brand icons
|
288
|
+
|
289
|
+
.FontAwesome Icons (FAB)
|
290
|
+
[cols="2a,3a,4a,^", options="header", width="100%", role="rtable mt-3"]
|
291
|
+
|===============================================================================
|
292
|
+
|Size |Modifier |Markup |Render
|
293
|
+
|
294
|
+
|2x
|
295
|
+
|no modifier set
|
296
|
+
|All icons can be found for preview at the
|
297
|
+
link:{fontawesome-icons}[FA Gallery, {browser-window--new}] page online. +
|
298
|
+
|
299
|
+
No modifiers +
|
300
|
+
[source, adoc, role="noclip"]
|
301
|
+
----
|
302
|
+
fab:google[2x]
|
303
|
+
----
|
304
|
+
^|fab:google[2x]
|
305
|
+
|
306
|
+
|5x
|
307
|
+
|`md-blue`
|
308
|
+
|All icons can be found for preview at the
|
309
|
+
link:{fontawesome-icons}[FA Gallery, {browser-window--new}] page online. +
|
310
|
+
|
311
|
+
Color blue +
|
312
|
+
[source, adoc, role="noclip"]
|
313
|
+
----
|
314
|
+
fab:blogger[5x md-blue]
|
315
|
+
----
|
316
|
+
|fab:blogger[5x md-blue]
|
317
|
+
|
318
|
+
|===============================================================================
|
319
|
+
|
320
|
+
|
321
|
+
=== Standard icons
|
322
|
+
|
323
|
+
.FontAwesome Icons (FAS)
|
221
324
|
[cols="2a,3a,4a,^", options="header", width="100%", role="rtable mt-3"]
|
222
325
|
|===============================================================================
|
223
326
|
|Size |Modifier |Markup |Render
|
224
327
|
|
225
328
|
|1x
|
226
329
|
|no modifier set
|
227
|
-
|All
|
330
|
+
|All icons can be found for preview at the
|
331
|
+
link:{fontawesome-icons}[FA Gallery, {browser-window--new}] page online. +
|
332
|
+
|
333
|
+
No modifiers +
|
228
334
|
[source, adoc, role="noclip"]
|
229
335
|
----
|
230
336
|
fas:user[1x]
|
@@ -233,7 +339,10 @@ fas:user[1x]
|
|
233
339
|
|
234
340
|
|3x
|
235
341
|
|no modifier set
|
236
|
-
|All
|
342
|
+
|All icons can be found for preview at the
|
343
|
+
link:{fontawesome-icons}[FA Gallery, {browser-window--new}] page online. +
|
344
|
+
|
345
|
+
No modifiers +
|
237
346
|
[source, adoc, role="noclip"]
|
238
347
|
----
|
239
348
|
fas:user[3x]
|
@@ -242,7 +351,10 @@ fas:user[3x]
|
|
242
351
|
|
243
352
|
|5x
|
244
353
|
|no modifier set
|
245
|
-
|All
|
354
|
+
|All icons can be found for preview at the
|
355
|
+
link:{fontawesome-icons}[FA Gallery, {browser-window--new}] page online. +
|
356
|
+
|
357
|
+
No modifiers +
|
246
358
|
[source, adoc, role="noclip"]
|
247
359
|
----
|
248
360
|
fas:user[5x]
|
@@ -251,7 +363,10 @@ fas:user[5x]
|
|
251
363
|
|
252
364
|
|5x
|
253
365
|
|`fa-rotate-90`
|
254
|
-
|
|
366
|
+
|All icons can be found for preview at the
|
367
|
+
link:{fontawesome-icons}[FA Gallery, {browser-window--new}] page online. +
|
368
|
+
|
369
|
+
Rotate 90 degrees +
|
255
370
|
[source, adoc, role="noclip"]
|
256
371
|
----
|
257
372
|
fas:user[5x fa-rotate-90]
|
@@ -261,7 +376,10 @@ fas:user[5x fa-rotate-90]
|
|
261
376
|
|5x
|
262
377
|
|`mdi-light` +
|
263
378
|
`fa-flip-v`
|
264
|
-
|
|
379
|
+
|All icons can be found for preview at the
|
380
|
+
link:{fontawesome-icons}[FA Gallery, {browser-window--new}] page online. +
|
381
|
+
|
382
|
+
Colour set to MDI Light (Grey) and flipped vertical +
|
265
383
|
[source, adoc, role="noclip"]
|
266
384
|
----
|
267
385
|
fas:exclamation-triangle[5x mdi-light fa-flip-v]
|
@@ -270,7 +388,10 @@ fas:exclamation-triangle[5x mdi-light fa-flip-v]
|
|
270
388
|
|
271
389
|
|5x
|
272
390
|
|`md-indigo`
|
273
|
-
|
|
391
|
+
|All icons can be found for preview at the
|
392
|
+
link:{fontawesome-icons}[FA Gallery, {browser-window--new}] page online. +
|
393
|
+
|
394
|
+
Colour set to MDI Indigo +
|
274
395
|
[source, adoc, role="noclip"]
|
275
396
|
----
|
276
397
|
fas:alert[5x md-indigo]
|
@@ -279,7 +400,10 @@ fas:alert[5x md-indigo]
|
|
279
400
|
|
280
401
|
|5x
|
281
402
|
|`md-pink`
|
282
|
-
|
|
403
|
+
|All icons can be found for preview at the
|
404
|
+
link:{fontawesome-icons}[FA Gallery, {browser-window--new}] page online. +
|
405
|
+
|
406
|
+
Colour set to MDI Pink +
|
283
407
|
[source, adoc, role="noclip"]
|
284
408
|
----
|
285
409
|
fas:alert[5x md-pink]
|
@@ -288,7 +412,10 @@ fas:alert[5x md-pink]
|
|
288
412
|
|
289
413
|
|5x
|
290
414
|
|`fa-spin`
|
291
|
-
|
|
415
|
+
|All icons can be found for preview at the
|
416
|
+
link:{fontawesome-icons}[FA Gallery, {browser-window--new}] page online. +
|
417
|
+
|
418
|
+
Added animation of type Rotate (Spin) +
|
292
419
|
[source, adoc, role="noclip"]
|
293
420
|
----
|
294
421
|
fas:circle-notch[5x fa-spin]
|
@@ -298,7 +425,10 @@ fas:circle-notch[5x fa-spin]
|
|
298
425
|
|5x
|
299
426
|
|`md-red-900` +
|
300
427
|
`md-red-900` `fa-pulsed`
|
301
|
-
|
|
428
|
+
|All icons can be found for preview at the
|
429
|
+
link:{fontawesome-icons}[FA Gallery, {browser-window--new}] page online. +
|
430
|
+
|
431
|
+
Colour set to MDI Dark Red and added animation of type Pulsed +
|
302
432
|
[source, adoc, role="noclip"]
|
303
433
|
----
|
304
434
|
fas:heart[5x md-red-900 fa-pulsed]
|
@@ -307,46 +437,25 @@ fas:heart[5x md-red-900 fa-pulsed]
|
|
307
437
|
|
308
438
|
|===============================================================================
|
309
439
|
|
310
|
-
NOTE: Using FontAwesome with Asciidoc is quite easy as two inline macros
|
311
|
-
`fas:` and `fas:` are available to place icons where ever you want. See more about
|
312
|
-
this in section link:{roundtrip-asciidoc-extensions}#icon-fonts[Asciidoc Extensions]
|
313
|
-
|
314
|
-
FontAwesome V5 meets the Material Design idea (of _Google_) and in comparison
|
315
|
-
to Version 4, the current version is much more than a face-lifting. Version 5
|
316
|
-
comes with more than 2300+ icons, but many of them are available with the Pro
|
317
|
-
license only. For the Free version, only a subset of 900+ icons is available.
|
318
|
-
|
319
|
-
NOTE: The CSS styles for FontAwesome V5 has been extended for J1 Template to
|
320
|
-
the same classes (and their respective names) as for other Font Icon sets.
|
321
|
-
Already existing styles like `fa-flip-vertical` are available as `fa-flip-v`
|
322
|
-
as well. See all types that can be used with the MDI
|
323
|
-
link:{previewer-mdi}[Preview Page, {browser-window--new}].
|
324
|
-
|
325
|
-
You can checkout what icons available at link:{fontawesome-icons}[FontAwesome Icons,
|
326
|
-
{browser-window--new}]. _FontAwesome_ V5 is fully integrated - no need for
|
327
|
-
additional resources to load. But in comparison to Version 4, a lot of
|
328
|
-
differences needs to be noticed.
|
329
|
-
|
330
|
-
If you haven't used V5 yet, it is highly recommended to visit the
|
331
|
-
link:{fontawesome-get-started}[Get started, {browser-window--new}] pages to learn
|
332
|
-
the basics and features and styles.
|
333
|
-
|
334
440
|
|
335
441
|
== Iconify Icons
|
336
442
|
|
337
|
-
MDI and FA are rich icon
|
338
|
-
|
339
|
-
icons
|
340
|
-
|
341
|
-
|
342
|
-
|
343
|
-
OpenSource icon framework that makes it possible to use icons from different
|
344
|
-
icon sets using one syntax.
|
443
|
+
MDI and FA are rich icon sets but designed for general use. Sometimes icons
|
444
|
+
are missing in one of these fonts like specific brand or theme icons. An
|
445
|
+
interesting solution for using font icons from a remote repository is
|
446
|
+
link:{iconify-home}[Iconify, {browser-window--new}]. Iconify is a so-called
|
447
|
+
unified OpenSource icon framework that makes it possible to use icons from
|
448
|
+
different icon sets using one (unified) syntax.
|
345
449
|
|
346
450
|
To access that framework, a Javascript client is needed. For J1 Template, the
|
347
|
-
client is
|
348
|
-
|
349
|
-
|
451
|
+
client is build-in and is loaded if Iconify is requested as a resource. To see
|
452
|
+
what icon sets available with that framework, check the page
|
453
|
+
link:{iconify-icon-sets}[Iconify Icon Sets, {browser-window--new}].
|
454
|
+
|
455
|
+
NOTE: Using Iconify icons with J1 Template is quite easy. An Asciidoctor
|
456
|
+
inline macro `iconify:` (Asciidoctor Extension) is available to place icons
|
457
|
+
where ever you want. See more about this in section
|
458
|
+
link:{roundtrip-asciidoc-extensions}#icon-fonts[Asciidoc Extensions]
|
350
459
|
|
351
460
|
Currently, over 40,000 vector icons are available for many different use cases.
|
352
461
|
Find some examples below.
|
@@ -358,21 +467,27 @@ Find some examples below.
|
|
358
467
|
|
359
468
|
|3x
|
360
469
|
|no modifier set
|
361
|
-
|All
|
470
|
+
|All icons can be found for preview at
|
471
|
+
link:{iconify-brand-icons}[SVG Logos, {browser-window--new}] page online. +
|
472
|
+
|
473
|
+
No modifiers +
|
362
474
|
[source, adoc, role="noclip"]
|
363
475
|
----
|
364
476
|
iconify:logos:opensource[3x]
|
365
477
|
----
|
366
478
|
^|iconify:logos:opensource[3x]
|
367
479
|
|
368
|
-
|
|
480
|
+
|3x
|
369
481
|
|no modifier set
|
370
|
-
|All
|
482
|
+
|All icons can be found for preview at
|
483
|
+
link:{iconify-brand-icons}[SVG Logos, {browser-window--new}] page online. +
|
484
|
+
|
485
|
+
No modifiers +
|
371
486
|
[source, adoc, role="noclip"]
|
372
487
|
----
|
373
|
-
iconify:logos:
|
488
|
+
iconify:logos:asciidoctor[3x]
|
374
489
|
----
|
375
|
-
^|iconify:logos:
|
490
|
+
^|iconify:logos:asciidoctor[3x]
|
376
491
|
|
377
492
|
|===============================================================================
|
378
493
|
|
@@ -383,7 +498,10 @@ iconify:logos:atom[5x]
|
|
383
498
|
|
384
499
|
|3x
|
385
500
|
|no modifier set
|
386
|
-
|All
|
501
|
+
|All icons can be found for preview at
|
502
|
+
link:{iconify-medical-icons}[Medical Icons, {browser-window--new}] page online. +
|
503
|
+
|
504
|
+
No modifiers +
|
387
505
|
[source, adoc, role="noclip"]
|
388
506
|
----
|
389
507
|
iconify:medical-icon:i-ear-nose-throat[3x]
|
@@ -392,7 +510,10 @@ iconify:medical-icon:i-ear-nose-throat[3x]
|
|
392
510
|
|
393
511
|
|5x
|
394
512
|
|`md-red-900`
|
395
|
-
|All
|
513
|
+
|All icons can be found for preview at
|
514
|
+
link:{iconify-medical-icons}[Medical Icons, {browser-window--new}] page online. +
|
515
|
+
|
516
|
+
Color (md) red +
|
396
517
|
[source, adoc, role="noclip"]
|
397
518
|
----
|
398
519
|
iconify:medical-icon:i-ear-nose-throat[5x md-red-900]
|
@@ -401,19 +522,13 @@ iconify:medical-icon:i-ear-nose-throat[5x md-red-900]
|
|
401
522
|
|
402
523
|
|===============================================================================
|
403
524
|
|
404
|
-
NOTE: Using Iconify icons with Asciidoc is quite easy as an inline macro
|
405
|
-
`iconify:` is available to place icons where ever you want. See more about
|
406
|
-
this in section link:{roundtrip-asciidoc-extensions}#icon-fonts[Asciidoc Extensions]
|
407
525
|
|
408
526
|
== Whats next
|
409
527
|
|
410
528
|
Have you've enjoyed the possibilities J1 offers for managing and
|
411
529
|
manipulating Font Icons. Do you think these Icons sets can fit your needs?
|
412
|
-
|
413
530
|
Using Iconify, for all topics an icon font should be found. And it's simple,
|
414
531
|
isn't it?
|
415
532
|
|
416
|
-
We hope so.
|
417
|
-
|
418
533
|
To check more features of the template, go for the link:{roundtrip-asciidoc-extensions}[
|
419
534
|
Asciidoc extensions] made for J1!
|