j1-template 2022.4.7 → 2022.4.10
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/blocks/footer/boxes/contacts_box.proc +3 -3
- data/_includes/themes/j1/blocks/footer/boxes/legal_statements.proc +7 -7
- data/_includes/themes/j1/blocks/footer/boxes/links_box.proc +1 -1
- data/_includes/themes/j1/blocks/footer/boxes/news_box.proc +1 -1
- data/_includes/themes/j1/modules/attics/generator.html +7 -7
- data/_includes/themes/j1/modules/navigator/generator.html +30 -30
- data/_includes/themes/j1/procedures/global/create_bs_button.proc +1 -1
- data/_includes/themes/j1/procedures/posts/collate_timeline.proc +1 -1
- data/assets/data/authclient.html +16 -14
- data/assets/data/banner.html +6 -2
- data/assets/data/carousel.json +10 -0
- data/assets/data/cookieconsent.html +3 -1
- data/assets/data/fab.html +27 -12
- data/assets/data/footer.html +10 -10
- data/assets/data/galleries.json +7 -0
- data/assets/data/gallery_customizer.html +13 -10
- data/assets/data/iso-639-language-codes-flags.json +9 -0
- data/assets/data/iso-639-language-codes.json +9 -0
- data/assets/data/j1_config.json +8 -2
- data/assets/data/masterslider.html +342 -0
- data/assets/data/mdi_icons.json +5 -0
- data/assets/data/mdil_icons.json +5 -0
- data/assets/data/menu.html +56 -53
- data/assets/data/mmenu.html +44 -40
- data/assets/data/mmenu_sidebar.html +15 -13
- data/assets/data/mmenu_toc.html +11 -8
- data/assets/data/nbinteract.html +3 -2
- data/assets/data/panel.html +16 -14
- data/assets/data/private.json +2 -2
- data/assets/data/quicklinks.html +11 -9
- data/assets/data/rtext_resizer.html +11 -7
- data/assets/data/themes.bootswatch.json +4 -0
- data/assets/data/themes.json +4 -0
- data/assets/data/translator.html +3 -1
- data/assets/data/twa_v1.json +6 -0
- data/assets/themes/j1/adapter/js/advertising.js +2 -0
- data/assets/themes/j1/adapter/js/algolia.js +3 -1
- data/assets/themes/j1/adapter/js/analytics.js +2 -0
- data/assets/themes/j1/adapter/js/asciidoctor.js +16 -0
- data/assets/themes/j1/adapter/js/attic.js +5 -4
- data/assets/themes/j1/adapter/js/bmd.js +16 -0
- data/assets/themes/j1/adapter/js/carousel.js +8 -7
- data/assets/themes/j1/adapter/js/clipboard.js +2 -1
- data/assets/themes/j1/adapter/js/comments.js +2 -0
- data/assets/themes/j1/adapter/js/cookieConsent.js +3 -1
- data/assets/themes/j1/adapter/js/customFunctions.js +3 -1
- data/assets/themes/j1/adapter/js/customModule.js +5 -3
- data/assets/themes/j1/adapter/js/dropdowns.js +3 -1
- data/assets/themes/j1/adapter/js/fab.js +3 -1
- data/assets/themes/j1/adapter/js/framer.js +3 -1
- data/assets/themes/j1/adapter/js/j1.js +25 -19
- data/assets/themes/j1/adapter/js/justifiedGallery.js +3 -1
- data/assets/themes/j1/adapter/js/justifiedGalleryCustomizer.js +2 -0
- data/assets/themes/j1/adapter/js/lightbox.js +3 -1
- data/assets/themes/j1/adapter/js/logger.js +2 -0
- data/assets/themes/j1/adapter/js/lunr.js +2 -0
- data/assets/themes/j1/adapter/js/masterslider.js +529 -0
- data/assets/themes/j1/adapter/js/mmenu.js +2 -0
- data/assets/themes/j1/adapter/js/navigator.js +716 -72
- data/assets/themes/j1/adapter/js/nbinteract.js +10 -8
- data/assets/themes/j1/adapter/js/rangeSlider.js +3 -1
- data/assets/themes/j1/adapter/js/rouge.js +7 -0
- data/assets/themes/j1/adapter/js/rtable.js +3 -1
- data/assets/themes/j1/adapter/js/rtextResizer.js +2 -1
- data/assets/themes/j1/adapter/js/scroller.js +2 -0
- data/assets/themes/j1/adapter/js/themer.js +26 -34
- data/assets/themes/j1/adapter/js/toccer.js +24 -78
- data/assets/themes/j1/adapter/js/translator.js +3 -1
- data/assets/themes/j1/core/css/animate.css +1282 -504
- data/assets/themes/j1/core/css/animate.min.css +1 -1
- data/assets/themes/j1/core/css/themes/bootstrap/bootstrap.css +1938 -1379
- data/assets/themes/j1/core/css/themes/bootstrap/bootstrap.min.css +3 -3
- data/assets/themes/j1/core/css/themes/theme_vapor/bootstrap.css +1939 -1380
- data/assets/themes/j1/core/css/themes/theme_vapor/bootstrap.min.css +3 -3
- data/assets/themes/j1/core/css/themes/unodark/bootstrap.css +2189 -1486
- data/assets/themes/j1/core/css/themes/unodark/bootstrap.min.css +3 -3
- data/assets/themes/j1/core/css/themes/unolight/bootstrap.css +2168 -1502
- data/assets/themes/j1/core/css/themes/unolight/bootstrap.min.css +10 -9
- data/assets/themes/j1/core/js/template.js +3 -3
- data/assets/themes/j1/core/js/template.min.js +1 -1
- data/assets/themes/j1/core/js/template.min.js.map +1 -1
- data/assets/themes/j1/modules/cookieConsent/js/cookieConsent.js +2 -2
- data/assets/themes/j1/modules/cookieConsent/js/cookieConsent.min.js +1 -1
- data/assets/themes/j1/modules/lightbox/js/lightbox.js +1 -1
- data/assets/themes/j1/modules/lightbox/js/lightbox.min.js +1 -1
- data/assets/themes/j1/modules/masterslider/css/blank.gif +0 -0
- data/assets/themes/j1/modules/masterslider/css/common/grab.cur +0 -0
- data/assets/themes/j1/modules/masterslider/css/common/grab.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/common/grabbing.cur +0 -0
- data/assets/themes/j1/modules/masterslider/css/common/grabbing.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/common/loading-1-dark.gif +0 -0
- data/assets/themes/j1/modules/masterslider/css/common/loading-1.gif +0 -0
- data/assets/themes/j1/modules/masterslider/css/common/loading-2-dark.gif +0 -0
- data/assets/themes/j1/modules/masterslider/css/common/loading-2-light.gif +0 -0
- data/assets/themes/j1/modules/masterslider/css/common/loading-2.gif +0 -0
- data/assets/themes/j1/modules/masterslider/css/common/video-close-btn.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/masterslider.css +2637 -0
- data/assets/themes/j1/modules/masterslider/css/masterslider.min.css +2655 -0
- data/assets/themes/j1/modules/masterslider/css/skins/black-skin-1-retina.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/skins/black-skin-1.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/skins/black-skin-2-retina.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/skins/black-skin-2.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/skins/contrast-skin-retina.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/skins/contrast-skin.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/skins/light-skin-1-retina.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/skins/light-skin-1.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/skins/light-skin-2-retina.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/skins/light-skin-2.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/skins/light-skin-3-retina.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/skins/light-skin-3.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/skins/light-skin-4-retina.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/skins/light-skin-4.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/skins/light-skin-5-retina.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/skins/light-skin-5.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/skins/light-skin-6-retina.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/skins/light-skin-6.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/skins/metro-skin-retina.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/skins/metro-skin.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/skins/minimal.svg +11 -0
- data/assets/themes/j1/modules/masterslider/css/templates/device-skin.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/templates/display.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/templates/flat-display.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/templates/flat-laptop.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/templates/flat-phone-land.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/templates/flat-phone.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/templates/flat-tablet-land.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/templates/flat-tablet.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/templates/gallery-btns.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/templates/laptop.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/templates/phone-land.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/templates/phone.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/templates/staff-arrows.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/templates/tablet-land.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/templates/tablet.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/templates/vertical-arrows.png +0 -0
- data/assets/themes/j1/modules/masterslider/css/theme/uno.css +95 -0
- data/assets/themes/j1/modules/masterslider/css/theme/uno.min.css +95 -0
- data/assets/themes/j1/modules/masterslider/css/themes/ms-skin-sample.css +172 -0
- data/assets/themes/j1/modules/masterslider/css/themes/ms-skin-sample.min.css +172 -0
- data/assets/themes/j1/modules/masterslider/js/addons/masterslider.flickr.min.js +1 -0
- data/assets/themes/j1/modules/masterslider/js/addons/public.js +10 -0
- data/assets/themes/j1/modules/masterslider/js/masterslider.js +5544 -0
- data/assets/themes/j1/modules/masterslider/js/masterslider.min.js +11 -0
- data/assets/themes/j1/modules/masterslider/js/plugins/jquery.easing.js +211 -0
- data/assets/themes/j1/modules/masterslider/js/plugins/jquery.easing.min.js +51 -0
- data/assets/themes/j1/modules/mmenuLight/css/theme/uno/mmenu.css +3 -3
- data/assets/themes/j1/modules/mmenuLight/css/theme/uno/mmenu.min.css +1 -1
- data/assets/themes/j1/modules/rouge/css/uno.dark/theme.css +11 -11
- data/assets/themes/j1/modules/rouge/css/uno.light/theme.css +24 -18
- data/assets/themes/j1/modules/translator/js/translator.js +2 -2
- data/assets/themes/j1/modules/translator/js/translator.min.js +1 -1
- data/assets/themes/j1/modules/twemoji/js/picker/twemoji-picker.js +2 -2
- data/assets/themes/j1/modules/twemoji/js/picker/twemoji-picker.min.js +304 -1
- data/lib/j1/version.rb +1 -1
- data/lib/starter_web/Gemfile +1 -1
- data/lib/starter_web/_config.yml +2 -2
- data/lib/starter_web/_data/blocks/banner.yml +8 -5
- data/lib/starter_web/_data/blocks/footer.yml +1 -1
- data/lib/starter_web/_data/modules/attics.yml +16 -4
- data/lib/starter_web/_data/modules/defaults/attics.yml +12 -5
- data/lib/starter_web/_data/modules/defaults/lightbox.yml +1 -1
- data/lib/starter_web/_data/modules/defaults/masterslider.yml +235 -0
- data/lib/starter_web/_data/modules/defaults/navigator.yml +7 -5
- data/lib/starter_web/_data/modules/defaults/toccer.yml +1 -1
- data/lib/starter_web/_data/modules/fab.yml +39 -118
- data/lib/starter_web/_data/modules/lightbox.yml +4 -2
- data/lib/starter_web/_data/modules/masterslider.yml +1153 -0
- data/lib/starter_web/_data/modules/navigator_menu.yml +234 -5
- data/lib/starter_web/_data/resources.yml +166 -95
- data/lib/starter_web/_plugins/asciidoctor-extensions/masterslider-block.rb +47 -0
- data/lib/starter_web/_plugins/lunr_index.rb +1 -1
- data/lib/starter_web/assets/images/modules/masterslider/slider_1/cat-1.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_1/cat-2.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_1/cat-3.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_1/cat-4.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_1/cat-5.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_1/cat-6.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_1/cat-7.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_1/cat-8.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_10/panorama-bg-slide1.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_10/panorama-bg-slide2.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_2/andreas-brucker.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_2/denys-nevozhai-1.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_2/denys-nevozhai-2.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_2/luca-bravo.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_2/thomas-tucker.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_3/ms-free-food-family-2.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_3/ms-free-food-hamburger.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_3/ms-free-food-restaurant.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_4/ms-free-animals-1-100x80.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_4/ms-free-animals-1.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_4/ms-free-animals-2-100x80.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_4/ms-free-animals-2.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_4/ms-free-animals-3-100x80.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_4/ms-free-animals-3.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_4/ms-free-animals-4-100x80.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_4/ms-free-animals-4.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_4/ms-free-animals-5-100x80.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_4/ms-free-animals-5.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_4/ms-free-animals-6-100x80.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_4/ms-free-animals-6.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_4/ms-free-animals-7-100x80.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_4/ms-free-animals-7.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_5/ms-free-food-family-140x80.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_5/ms-free-food-family-2-140x80.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_5/ms-free-food-family-2.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_5/ms-free-food-family-3-140x80.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_5/ms-free-food-family-3.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_5/ms-free-food-family.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_5/ms-free-food-hamburger-140x80.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_5/ms-free-food-hamburger.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_5/ms-free-food-pizza-140x80.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_5/ms-free-food-pizza.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_5/ms-free-food-restaurant-140x80.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_5/ms-free-food-restaurant.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_5/ms-free-food-single-man-140x80.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_5/ms-free-food-single-man.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_5/ms-free-food-single-woman-140x80.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_5/ms-free-food-single-woman.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_5/ms-free-food-table-140x80.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_5/ms-free-food-table.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_5/ms-free-food-woman-hand-140x80.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_5/ms-free-food-woman-hand.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_6_7/6876385555_74a0d7d7ee_b.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_6_7/6876387431_d86867a3d9_b.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_6_7/6876388511_d618d53455_b.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_6_7/6876389463_db27a377e1_b.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_6_7/6876390339_2e4dd9dbbb_b.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_8/postslider-5-img-1.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_8/postslider-5-img-2.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_8/postslider-5-img-3.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_8/postslider6-bg-slide2-1024x622.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_9/1-2.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_9/5-2.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_9/6-2.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_9/6-3.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_9/8-1.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/slider_9/8.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/unify-examples/charity-white-tile-bg.png +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/unify-examples/fashion2-controller-arrow-next.png +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/unify-examples/fashion2-controller-arrow-prv.png +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/unify-examples/fashion2-img-slide1.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/unify-examples/fashion2-img-slide2.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/unify-examples/fashion2-img-slide3.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/wp-examples/ms-free-business-1.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/wp-examples/ms-free-business-2.jpg +0 -0
- data/lib/starter_web/assets/images/modules/masterslider/wp-examples/ms-free-business-3.jpg +0 -0
- data/lib/starter_web/index.html +0 -1
- data/lib/starter_web/package.json +1 -1
- data/lib/starter_web/pages/public/features/general.adoc +1 -1
- data/lib/starter_web/pages/public/jupyter/notebooks/textbooks/j1_circular_times_table.html +747 -747
- data/lib/starter_web/pages/public/jupyter/notebooks/textbooks/j1_climate_change_forecast.html +1250 -1250
- data/lib/starter_web/pages/public/jupyter/notebooks/textbooks/j1_docs_example_dynamic.html +186 -186
- data/lib/starter_web/pages/public/jupyter/notebooks/textbooks/j1_interactive_widgets.html +512 -512
- data/lib/starter_web/pages/public/jupyter/notebooks/textbooks/j1_nbi_widgets.html +629 -629
- data/lib/starter_web/pages/public/jupyter/notebooks/textbooks/j1_nbi_widgets_hist_chart.html +93 -93
- data/lib/starter_web/pages/public/jupyter/notebooks/textbooks/j1_nbi_widgets_question_multiple_choice.html +70 -70
- data/lib/starter_web/pages/public/jupyter/notebooks/textbooks/j1_nbi_widgets_question_short_answer.html +156 -156
- data/lib/starter_web/pages/public/jupyter/notebooks/textbooks/j1_odes_in_python.html +955 -955
- data/lib/starter_web/pages/public/learn/quickstart.adoc +1 -1
- data/lib/starter_web/pages/public/learn/roundtrip/100_present_images.adoc +90 -7
- 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 -1
- data/lib/starter_web/pages/public/learn/roundtrip/300_icon_fonts.adoc +1 -1
- data/lib/starter_web/pages/public/learn/roundtrip/400_asciidoc_extensions.adoc +1 -1
- data/lib/starter_web/pages/public/learn/roundtrip/410_bs_modals_extentions.adoc +1 -1
- data/lib/starter_web/pages/public/learn/roundtrip/420_responsive_tables_extensions.adoc +1 -1
- data/lib/starter_web/pages/public/learn/roundtrip/500_themes.adoc +1 -1
- data/lib/starter_web/pages/public/learn/roundtrip/600_quicksearch.adoc +1 -1
- data/lib/starter_web/pages/public/legal/de/100_copyright.adoc +1 -1
- data/lib/starter_web/pages/public/legal/de/100_impress.adoc +1 -1
- data/lib/starter_web/pages/public/legal/de/300_privacy.adoc +1 -1
- data/lib/starter_web/pages/public/legal/de/400_comment_policy.adoc +1 -1
- data/lib/starter_web/pages/public/legal/en/100_copyright.adoc +1 -1
- data/lib/starter_web/pages/public/legal/en/200_impress.adoc +1 -1
- data/lib/starter_web/pages/public/legal/en/300_privacy.adoc +1 -1
- data/lib/starter_web/pages/public/legal/en/400_comment_policy.adoc +1 -1
- data/lib/starter_web/pages/public/panels/intro_panel/panel.adoc +1 -1
- data/lib/starter_web/pages/public/plans/plans.adoc +1 -1
- data/lib/starter_web/pages/public/previewer/preview_bootstrap_theme.adoc +143 -132
- data/lib/starter_web/utilsrv/_defaults/package.json +1 -1
- data/lib/starter_web/utilsrv/package.json +1 -1
- metadata +143 -3
- data/_includes/themes/j1/procedures/global/create_bs_button.1.proc +0 -172
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
title: Theme Previewer
|
3
|
-
tagline:
|
4
|
-
date: 2020-
|
3
|
+
tagline: bootstrap v5 themes
|
4
|
+
date: 2020-01-01 00:00:00
|
5
5
|
description: >
|
6
6
|
Bootstrap is a HTML, CSS and JS Library that focuses on simplifying the
|
7
7
|
development of modern web pages. The primary purpose of applying a theme
|
@@ -39,13 +39,15 @@ categories: [ Previewer ]
|
|
39
39
|
tags: [ Bootstrap, Themes ]
|
40
40
|
|
41
41
|
scrollbar: false
|
42
|
-
fab_menu_id:
|
42
|
+
fab_menu_id: page_ctrl
|
43
43
|
|
44
44
|
permalink: /pages/public/previewer/theme/
|
45
45
|
regenerate: false
|
46
46
|
|
47
47
|
resources: [ animate, comments, clipboard, rouge ]
|
48
48
|
resource_options:
|
49
|
+
- toccer:
|
50
|
+
collapseDepth: 3
|
49
51
|
- attic:
|
50
52
|
slides:
|
51
53
|
- url: /assets/images/pages/roundtrip/themes-1920x1280-bw.jpg
|
@@ -154,7 +156,7 @@ A navbar is an elementary page element, usually integrated at the top of
|
|
154
156
|
your page for navigation. Bootstrap offers many navigation functions that
|
155
157
|
are minimized on smartphones and thus always remain easy to use.
|
156
158
|
|
157
|
-
mdi:bootstrap[
|
159
|
+
mdi:bootstrap[18px, mdi-md-deep-purple-400]
|
158
160
|
link:{url-bs-docs--components-navbar}[Bootstrap Docs {char-middot} Navbar, {browser-window--new}]
|
159
161
|
|
160
162
|
Theming the navbar has never been easier thanks to the combination of
|
@@ -166,44 +168,44 @@ colors. Then, customize with `.bg-*` utilities.
|
|
166
168
|
<div class="doc-example mb-3">
|
167
169
|
<nav class="navbar navbar-expand-lg navbar-dark bg-primary mb-3">
|
168
170
|
<div class="container-fluid">
|
169
|
-
<a class="navbar-brand" href="#">Navbar</a>
|
171
|
+
<a class="link-no-decoration navbar-brand" href="#">Navbar</a>
|
170
172
|
<button class="navbar-toggler" type="button" data-bs-toggle="collapse"
|
171
173
|
data-bs-target="#navbarColor01" aria-controls="navbarColor01"
|
172
174
|
aria-expanded="false" aria-label="Toggle navigation">
|
173
175
|
<span class="navbar-toggler-icon"></span>
|
174
176
|
</button>
|
175
177
|
|
176
|
-
<div class="collapse navbar-collapse" id="navbarColor01">
|
178
|
+
<div class="collapse navbar-collapse ml-2" id="navbarColor01">
|
177
179
|
<ul class="navbar-nav me-auto">
|
178
180
|
<li class="nav-item">
|
179
|
-
<a class="nav-link active" href="#">Home
|
181
|
+
<a class="link-no-decoration nav-link active" href="#">Home
|
180
182
|
<span class="visually-hidden">(current)</span>
|
181
183
|
</a>
|
182
184
|
</li>
|
183
185
|
<li class="nav-item">
|
184
|
-
<a class="nav-link" href="#">Features</a>
|
186
|
+
<a class="link-no-decoration nav-link" href="#">Features</a>
|
185
187
|
</li>
|
186
188
|
<li class="nav-item">
|
187
|
-
<a class="nav-link" href="#">Pricing</a>
|
189
|
+
<a class="link-no-decoration nav-link" href="#">Pricing</a>
|
188
190
|
</li>
|
189
191
|
<li class="nav-item">
|
190
|
-
<a class="nav-link" href="#">About</a>
|
192
|
+
<a class="link-no-decoration nav-link" href="#">About</a>
|
191
193
|
</li>
|
192
194
|
<li class="nav-item dropdown">
|
193
|
-
<a class="nav-link dropdown-toggle" data-bs-toggle="dropdown"
|
195
|
+
<a class="link-no-decoration nav-link dropdown-toggle" data-bs-toggle="dropdown"
|
194
196
|
href="#" role="button" aria-haspopup="true" aria-expanded="false">Dropdown</a>
|
195
197
|
<div class="dropdown-menu">
|
196
|
-
<a class="dropdown-item" href="#">Action</a>
|
197
|
-
<a class="dropdown-item" href="#">Another action</a>
|
198
|
-
<a class="dropdown-item" href="#">Something else here</a>
|
198
|
+
<a class="link-no-decoration dropdown-item" href="#">Action</a>
|
199
|
+
<a class="link-no-decoration dropdown-item" href="#">Another action</a>
|
200
|
+
<a class="link-no-decoration dropdown-item" href="#">Something else here</a>
|
199
201
|
<div class="dropdown-divider"></div>
|
200
|
-
<a class="dropdown-item" href="#">Separated link</a>
|
202
|
+
<a class="link-no-decoration dropdown-item" href="#">Separated link</a>
|
201
203
|
</div>
|
202
204
|
</li>
|
203
205
|
</ul>
|
204
206
|
<form class="d-flex">
|
205
|
-
<input class="form-control
|
206
|
-
<button class="btn btn-secondary
|
207
|
+
<input class="form-control mt-1" type="text" placeholder="Search">
|
208
|
+
<button class="btn btn-secondary btn-sm ml-1" type="submit">Search</button>
|
207
209
|
</form>
|
208
210
|
</div>
|
209
211
|
</div>
|
@@ -211,93 +213,95 @@ colors. Then, customize with `.bg-*` utilities.
|
|
211
213
|
|
212
214
|
<nav class="navbar navbar-expand-lg navbar-dark bg-dark mb-3">
|
213
215
|
<div class="container-fluid">
|
214
|
-
<a class="navbar-brand" href="#">Navbar</a>
|
216
|
+
<a class="link-no-decoration navbar-brand" href="#">Navbar</a>
|
215
217
|
<button class="navbar-toggler" type="button" data-bs-toggle="collapse"
|
216
218
|
data-bs-target="#navbarColor02" aria-controls="navbarColor02"
|
217
219
|
aria-expanded="false" aria-label="Toggle navigation">
|
218
220
|
<span class="navbar-toggler-icon"></span>
|
219
221
|
</button>
|
220
222
|
|
221
|
-
<div class="collapse navbar-collapse" id="navbarColor02">
|
223
|
+
<div class="collapse navbar-collapse ml-2" id="navbarColor02">
|
222
224
|
<ul class="navbar-nav me-auto">
|
223
225
|
<li class="nav-item">
|
224
|
-
<a class="nav-link active" href="#">Home
|
226
|
+
<a class="link-no-decoration nav-link active" href="#">Home
|
225
227
|
<span class="visually-hidden">(current)</span>
|
226
228
|
</a>
|
227
229
|
</li>
|
228
230
|
<li class="nav-item">
|
229
|
-
<a class="nav-link" href="#">Features</a>
|
231
|
+
<a class="link-no-decoration nav-link" href="#">Features</a>
|
230
232
|
</li>
|
231
233
|
<li class="nav-item">
|
232
|
-
<a class="nav-link" href="#">Pricing</a>
|
234
|
+
<a class="link-no-decoration nav-link" href="#">Pricing</a>
|
233
235
|
</li>
|
234
236
|
<li class="nav-item">
|
235
|
-
<a class="nav-link" href="#">About</a>
|
237
|
+
<a class="link-no-decoration nav-link" href="#">About</a>
|
236
238
|
</li>
|
237
239
|
<li class="nav-item dropdown">
|
238
|
-
<a class="nav-link dropdown-toggle" data-bs-toggle="dropdown"
|
240
|
+
<a class="link-no-decoration nav-link dropdown-toggle" data-bs-toggle="dropdown"
|
239
241
|
href="#" role="button" aria-haspopup="true" aria-expanded="false">Dropdown</a>
|
240
242
|
<div class="dropdown-menu">
|
241
|
-
<a class="dropdown-item" href="#">Action</a>
|
242
|
-
<a class="dropdown-item" href="#">Another action</a>
|
243
|
-
<a class="dropdown-item" href="#">Something else here</a>
|
243
|
+
<a class="link-no-decoration dropdown-item" href="#">Action</a>
|
244
|
+
<a class="link-no-decoration dropdown-item" href="#">Another action</a>
|
245
|
+
<a class="link-no-decoration dropdown-item" href="#">Something else here</a>
|
244
246
|
<div class="dropdown-divider"></div>
|
245
|
-
<a class="dropdown-item" href="#">Separated link</a>
|
247
|
+
<a class="link-no-decoration dropdown-item" href="#">Separated link</a>
|
246
248
|
</div>
|
247
249
|
</li>
|
248
250
|
</ul>
|
249
251
|
<form class="d-flex">
|
250
|
-
<input class="form-control
|
251
|
-
<button class="btn btn-secondary
|
252
|
+
<input class="form-control mt-1" type="text" placeholder="Search">
|
253
|
+
<button class="btn btn-secondary btn-sm ml-1" type="submit">Search</button>
|
252
254
|
</form>
|
253
255
|
</div>
|
254
256
|
</div>
|
255
257
|
</nav>
|
256
258
|
|
257
|
-
|
259
|
+
|
260
|
+
<nav class="navbar navbar-expand-lg navbar-light md-light">
|
258
261
|
<div class="container-fluid">
|
259
|
-
<a class="navbar-brand" href="#">Navbar</a>
|
262
|
+
<a class="link-no-decoration navbar-brand" href="#">Navbar</a>
|
260
263
|
<button class="navbar-toggler" type="button" data-bs-toggle="collapse"
|
261
264
|
data-bs-target="#navbarColor03" aria-controls="navbarColor03"
|
262
265
|
aria-expanded="false" aria-label="Toggle navigation">
|
263
266
|
<span class="navbar-toggler-icon"></span>
|
264
267
|
</button>
|
265
268
|
|
266
|
-
<div class="collapse navbar-collapse" id="navbarColor03">
|
269
|
+
<div class="collapse navbar-collapse ml-2" id="navbarColor03">
|
267
270
|
<ul class="navbar-nav me-auto">
|
268
271
|
<li class="nav-item">
|
269
|
-
<a class="nav-link active" href="#">Home
|
272
|
+
<a class="link-no-decoration nav-link active" href="#">Home
|
270
273
|
<span class="visually-hidden">(current)</span>
|
271
274
|
</a>
|
272
275
|
</li>
|
273
276
|
<li class="nav-item">
|
274
|
-
<a class="nav-link" href="#">Features</a>
|
277
|
+
<a class="link-no-decoration nav-link" href="#">Features</a>
|
275
278
|
</li>
|
276
279
|
<li class="nav-item">
|
277
|
-
<a class="nav-link" href="#">Pricing</a>
|
280
|
+
<a class="link-no-decoration nav-link" href="#">Pricing</a>
|
278
281
|
</li>
|
279
282
|
<li class="nav-item">
|
280
|
-
<a class="nav-link" href="#">About</a>
|
283
|
+
<a class="link-no-decoration nav-link" href="#">About</a>
|
281
284
|
</li>
|
282
285
|
<li class="nav-item dropdown">
|
283
|
-
<a class="nav-link dropdown-toggle" data-bs-toggle="dropdown"
|
286
|
+
<a class="link-no-decoration nav-link dropdown-toggle" data-bs-toggle="dropdown"
|
284
287
|
ref="#" role="button" aria-haspopup="true" aria-expanded="false">Dropdown</a>
|
285
288
|
<div class="dropdown-menu">
|
286
|
-
<a class="dropdown-item" href="#">Action</a>
|
287
|
-
<a class="dropdown-item" href="#">Another action</a>
|
288
|
-
<a class="dropdown-item" href="#">Something else here</a>
|
289
|
+
<a class="link-no-decoration dropdown-item" href="#">Action</a>
|
290
|
+
<a class="link-no-decoration dropdown-item" href="#">Another action</a>
|
291
|
+
<a class="link-no-decoration dropdown-item" href="#">Something else here</a>
|
289
292
|
<div class="dropdown-divider"></div>
|
290
|
-
<a class="dropdown-item" href="#">Separated link</a>
|
293
|
+
<a class="link-no-decoration dropdown-item" href="#">Separated link</a>
|
291
294
|
</div>
|
292
295
|
</li>
|
293
296
|
</ul>
|
294
297
|
<form class="d-flex">
|
295
|
-
<input class="form-control
|
296
|
-
<button class="btn btn-secondary
|
298
|
+
<input class="form-control mt-1" type="text" placeholder="Search">
|
299
|
+
<button class="btn btn-secondary btn-sm ml-1" type="submit">Search</button>
|
297
300
|
</form>
|
298
301
|
</div>
|
299
302
|
</div>
|
300
303
|
</nav>
|
304
|
+
|
301
305
|
</div>
|
302
306
|
++++
|
303
307
|
|
@@ -305,44 +309,44 @@ colors. Then, customize with `.bg-*` utilities.
|
|
305
309
|
----
|
306
310
|
<nav class="navbar navbar-expand-lg navbar-dark bg-primary">
|
307
311
|
<div class="container-fluid">
|
308
|
-
<a class="navbar-brand" href="#">Navbar</a>
|
312
|
+
<a class="link-no-decoration navbar-brand" href="#">Navbar</a>
|
309
313
|
<button class="navbar-toggler" type="button" data-bs-toggle="collapse"
|
310
314
|
data-bs-target="#navbarColor01" aria-controls="navbarColor01"
|
311
315
|
aria-expanded="false" aria-label="Toggle navigation">
|
312
316
|
<span class="navbar-toggler-icon"></span>
|
313
317
|
</button>
|
314
318
|
|
315
|
-
<div class="collapse navbar-collapse" id="navbarColor01">
|
319
|
+
<div class="collapse navbar-collapse ml-2" id="navbarColor01">
|
316
320
|
<ul class="navbar-nav me-auto">
|
317
321
|
<li class="nav-item">
|
318
|
-
<a class="nav-link active" href="#">Home
|
322
|
+
<a class="link-no-decoration nav-link active" href="#">Home
|
319
323
|
<span class="visually-hidden">(current)</span>
|
320
324
|
</a>
|
321
325
|
</li>
|
322
326
|
<li class="nav-item">
|
323
|
-
<a class="nav-link" href="#">Features</a>
|
327
|
+
<a class="link-no-decoration nav-link" href="#">Features</a>
|
324
328
|
</li>
|
325
329
|
<li class="nav-item">
|
326
|
-
<a class="nav-link" href="#">Pricing</a>
|
330
|
+
<a class="link-no-decoration nav-link" href="#">Pricing</a>
|
327
331
|
</li>
|
328
332
|
<li class="nav-item">
|
329
|
-
<a class="nav-link" href="#">About</a>
|
333
|
+
<a class="link-no-decoration nav-link" href="#">About</a>
|
330
334
|
</li>
|
331
335
|
<li class="nav-item dropdown">
|
332
|
-
<a class="nav-link dropdown-toggle" data-bs-toggle="dropdown"
|
336
|
+
<a class="link-no-decoration nav-link dropdown-toggle" data-bs-toggle="dropdown"
|
333
337
|
href="#" role="button" aria-haspopup="true" aria-expanded="false">Dropdown</a>
|
334
338
|
<div class="dropdown-menu">
|
335
|
-
<a class="dropdown-item" href="#">Action</a>
|
336
|
-
<a class="dropdown-item" href="#">Another action</a>
|
337
|
-
<a class="dropdown-item" href="#">Something else here</a>
|
339
|
+
<a class="link-no-decoration dropdown-item" href="#">Action</a>
|
340
|
+
<a class="link-no-decoration dropdown-item" href="#">Another action</a>
|
341
|
+
<a class="link-no-decoration dropdown-item" href="#">Something else here</a>
|
338
342
|
<div class="dropdown-divider"></div>
|
339
|
-
<a class="dropdown-item" href="#">Separated link</a>
|
343
|
+
<a class="link-no-decoration dropdown-item" href="#">Separated link</a>
|
340
344
|
</div>
|
341
345
|
</li>
|
342
346
|
</ul>
|
343
347
|
<form class="d-flex">
|
344
|
-
<input class="form-control
|
345
|
-
<button class="btn btn-secondary
|
348
|
+
<input class="form-control mt-1" type="text" placeholder="Search">
|
349
|
+
<button class="btn btn-secondary btn-sm ml-1" type="submit">Search</button>
|
346
350
|
</form>
|
347
351
|
</div>
|
348
352
|
</div>
|
@@ -371,7 +375,7 @@ Defining a standard button in Bootstrap is very simple: assign the CSS class
|
|
371
375
|
`.btn` to an HTML element. The following sections describe the different
|
372
376
|
types of available buttons and how they are to be defined.
|
373
377
|
|
374
|
-
mdi:bootstrap[
|
378
|
+
mdi:bootstrap[18px, mdi-md-deep-purple-400]
|
375
379
|
link:{url-bs-docs--components-buttons}[Bootstrap Docs {char-middot} Buttons, {browser-window--new}]
|
376
380
|
|
377
381
|
ifeval::[{buttons_active} == true]
|
@@ -388,6 +392,8 @@ a *ripple* effect is shown for feedback.
|
|
388
392
|
<button type="button" class="btn btn-info btn-raised">Info</button>
|
389
393
|
<button type="button" class="btn btn-warning btn-raised">Warning</button>
|
390
394
|
<button type="button" class="btn btn-danger btn-raised">Danger</button>
|
395
|
+
<button type="button" class="btn btn-light btn-raised">Light</button>
|
396
|
+
<button type="button" class="btn btn-dark btn-raised">Dark</button>
|
391
397
|
<button type="button" class="btn btn-link btn-raised">Link</button>
|
392
398
|
</div>
|
393
399
|
++++
|
@@ -400,6 +406,8 @@ a *ripple* effect is shown for feedback.
|
|
400
406
|
<button type="button" class="btn btn-info btn-raised">Info</button>
|
401
407
|
<button type="button" class="btn btn-warning btn-raised">Warning</button>
|
402
408
|
<button type="button" class="btn btn-danger btn-raised">Danger</button>
|
409
|
+
<button type="button" class="btn btn-light btn-raised">Light</button>
|
410
|
+
<button type="button" class="btn btn-dark btn-raised">Dark</button>
|
403
411
|
<button type="button" class="btn btn-link btn-raised">Link</button>
|
404
412
|
----
|
405
413
|
endif::[]
|
@@ -455,6 +463,7 @@ background images and colors on any button.
|
|
455
463
|
<button type="button" class="btn btn-outline-danger">Danger</button>
|
456
464
|
<button type="button" class="btn btn-outline-light">Light</button>
|
457
465
|
<button type="button" class="btn btn-outline-dark">Dark</button>
|
466
|
+
<button type="button" class="btn btn-outline-link">Link</button>
|
458
467
|
</div>
|
459
468
|
++++
|
460
469
|
|
@@ -468,6 +477,7 @@ background images and colors on any button.
|
|
468
477
|
<button type="button" class="btn btn-outline-danger">Danger</button>
|
469
478
|
<button type="button" class="btn btn-outline-light">Light</button>
|
470
479
|
<button type="button" class="btn btn-outline-dark">Dark</button>
|
480
|
+
<button type="button" class="btn btn-outline-link">Link</button>
|
471
481
|
----
|
472
482
|
endif::[]
|
473
483
|
|
@@ -484,10 +494,10 @@ In need of a button having a little menu, buttons with a (nested)
|
|
484
494
|
<div class="btn-group" role="group">
|
485
495
|
<button id="btnGroupDrop1" type="button"
|
486
496
|
class="btn btn-primary dropdown-toggle"
|
487
|
-
data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
|
497
|
+
data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">menu</button>
|
488
498
|
<div class="dropdown-menu" aria-labelledby="btnGroupDrop1" style="">
|
489
|
-
<a class="dropdown-item" href="#">Dropdown link</a>
|
490
|
-
<a class="dropdown-item" href="#">Dropdown link</a>
|
499
|
+
<a class="link-no-decoration dropdown-item" href="#">Dropdown link</a>
|
500
|
+
<a class="link-no-decoration dropdown-item" href="#">Dropdown link</a>
|
491
501
|
</div>
|
492
502
|
</div>
|
493
503
|
</div>
|
@@ -497,10 +507,10 @@ In need of a button having a little menu, buttons with a (nested)
|
|
497
507
|
<div class="btn-group" role="group">
|
498
508
|
<button id="btnGroupDrop2" type="button"
|
499
509
|
class="btn btn-success dropdown-toggle"
|
500
|
-
data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
|
510
|
+
data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">menu</button>
|
501
511
|
<div class="dropdown-menu" aria-labelledby="btnGroupDrop2" style="">
|
502
|
-
<a class="dropdown-item" href="#">Dropdown link</a>
|
503
|
-
<a class="dropdown-item" href="#">Dropdown link</a>
|
512
|
+
<a class="link-no-decoration dropdown-item" href="#">Dropdown link</a>
|
513
|
+
<a class="link-no-decoration dropdown-item" href="#">Dropdown link</a>
|
504
514
|
</div>
|
505
515
|
</div>
|
506
516
|
</div>
|
@@ -510,10 +520,10 @@ In need of a button having a little menu, buttons with a (nested)
|
|
510
520
|
<div class="btn-group" role="group">
|
511
521
|
<button id="btnGroupDrop3" type="button"
|
512
522
|
class="btn btn-info dropdown-toggle"
|
513
|
-
data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
|
523
|
+
data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">menu</button>
|
514
524
|
<div class="dropdown-menu" aria-labelledby="btnGroupDrop3" style="">
|
515
|
-
<a class="dropdown-item" href="#">Dropdown link</a>
|
516
|
-
<a class="dropdown-item" href="#">Dropdown link</a>
|
525
|
+
<a class="link-no-decoration dropdown-item" href="#">Dropdown link</a>
|
526
|
+
<a class="link-no-decoration dropdown-item" href="#">Dropdown link</a>
|
517
527
|
</div>
|
518
528
|
</div>
|
519
529
|
</div>
|
@@ -523,10 +533,10 @@ In need of a button having a little menu, buttons with a (nested)
|
|
523
533
|
<div class="btn-group" role="group">
|
524
534
|
<button id="btnGroupDrop4" type="button"
|
525
535
|
class="btn btn-danger dropdown-toggle"
|
526
|
-
data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
|
536
|
+
data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">menu</button>
|
527
537
|
<div class="dropdown-menu" aria-labelledby="btnGroupDrop4" style="">
|
528
|
-
<a class="dropdown-item" href="#">Dropdown link</a>
|
529
|
-
<a class="dropdown-item" href="#">Dropdown link</a>
|
538
|
+
<a class="link-no-decoration dropdown-item" href="#">Dropdown link</a>
|
539
|
+
<a class="link-no-decoration dropdown-item" href="#">Dropdown link</a>
|
530
540
|
</div>
|
531
541
|
</div>
|
532
542
|
</div>
|
@@ -542,11 +552,11 @@ In need of a button having a little menu, buttons with a (nested)
|
|
542
552
|
class="btn btn-primary dropdown-toggle"
|
543
553
|
data-bs-toggle="dropdown"
|
544
554
|
aria-haspopup="true"
|
545
|
-
aria-expanded="false">
|
555
|
+
aria-expanded="false">menu
|
546
556
|
</button>
|
547
557
|
<div class="dropdown-menu" aria-labelledby="btnGroupDrop1">
|
548
|
-
<a class="dropdown-item" href="#">Dropdown link</a>
|
549
|
-
<a class="dropdown-item" href="#">Dropdown link</a>
|
558
|
+
<a class="link-no-decoration dropdown-item" href="#">Dropdown link</a>
|
559
|
+
<a class="link-no-decoration dropdown-item" href="#">Dropdown link</a>
|
550
560
|
</div>
|
551
561
|
</div>
|
552
562
|
</div>
|
@@ -562,7 +572,7 @@ or inline. They do not lift, but *hightlighted* on mouse *hover* and *focussed*
|
|
562
572
|
on press.
|
563
573
|
|
564
574
|
++++
|
565
|
-
<div class="doc-example">
|
575
|
+
<div class="doc-example mt-2 mb-4">
|
566
576
|
<button type="button" class="btn btn-primary">Primary</button>
|
567
577
|
<button type="button" class="btn btn-secondary">Secondary</button>
|
568
578
|
<button type="button" class="btn btn-success">Success</button>
|
@@ -858,11 +868,11 @@ Floating Action Buttons are adopted navigation elements from mobile devices
|
|
858
868
|
buttons (FABs) for the web typically provide *additional* actions for a page,
|
859
869
|
for example, in-page navigation.
|
860
870
|
|
861
|
-
mdi:bootstrap[
|
871
|
+
mdi:bootstrap[18px, mdi-md-deep-purple-400]
|
862
872
|
https://material.io/components/buttons-floating-action-button/android#using-fabs[Google Material Design {char-middot} Floating action buttons, {browser-window--new}]
|
863
873
|
|
864
874
|
++++
|
865
|
-
<div class="doc-example">
|
875
|
+
<div class="doc-example mt-2 mb-4">
|
866
876
|
<button type="button" class="btn btn-fab btn-primary" aria-label="fab-button">
|
867
877
|
<i class="mdi mdi-plus"></i>
|
868
878
|
</button>
|
@@ -884,7 +894,7 @@ adding the additional CSS class `raised-zX`. J1 supports 25 levels of
|
|
884
894
|
raising HTML elements ranging from 0 to 24.
|
885
895
|
|
886
896
|
++++
|
887
|
-
<div class="doc-example">
|
897
|
+
<div class="doc-example mt-2 mb-4">
|
888
898
|
<button type="button" class="btn btn-fab btn-primary raised-z5 mr-3" aria-label="fab-button">
|
889
899
|
<i class="mdi mdi-plus"></i>
|
890
900
|
</button>
|
@@ -918,7 +928,7 @@ Draw *attention* to floating action buttons (FAB) with this subtle but
|
|
918
928
|
captivating effect.
|
919
929
|
|
920
930
|
++++
|
921
|
-
<div class="doc-example">
|
931
|
+
<div class="doc-example mt-2 mb-4">
|
922
932
|
<button type="button" class="btn btn-fab btn-primary pulsed-z3" aria-label="fab-button">
|
923
933
|
<i class="mdi mdi-plus"></i>
|
924
934
|
</button>
|
@@ -939,7 +949,7 @@ ifeval::[{fab_mini} == true]
|
|
939
949
|
A smaller sized, *mini* floating action button (FAB) is also available.
|
940
950
|
|
941
951
|
++++
|
942
|
-
<div class="doc-example">
|
952
|
+
<div class="doc-example mt-2 mb-4">
|
943
953
|
<button type="button" class="btn btn-fab btn-fab-sm btn-primary" aria-label="fab-button-small">
|
944
954
|
<i class="mdi mdi-plus"></i>
|
945
955
|
</button>
|
@@ -962,7 +972,7 @@ Mini FAB buttons can be *raised* as well by adding the additional CSS class
|
|
962
972
|
to 24.
|
963
973
|
|
964
974
|
++++
|
965
|
-
<div class="doc-example">
|
975
|
+
<div class="doc-example mt-2 mb-4">
|
966
976
|
<button type="button" class="btn btn-fab btn-fab-sm btn-primary raised-z5 mr-3" aria-label="fab-button">
|
967
977
|
<i class="mdi mdi-plus"></i>
|
968
978
|
</button>
|
@@ -991,7 +1001,7 @@ For floating action buttons (FAB), all Bootstrap button *color classes* can
|
|
991
1001
|
be applied.
|
992
1002
|
|
993
1003
|
++++
|
994
|
-
<div class="doc-example">
|
1004
|
+
<div class="doc-example mt-2 mb-4">
|
995
1005
|
<button type="button" class="btn btn-fab btn-primary" aria-label="fab-button-primary">
|
996
1006
|
<i class="mdi mdi-plus"></i>
|
997
1007
|
</button>
|
@@ -1048,7 +1058,7 @@ be applied.
|
|
1048
1058
|
----
|
1049
1059
|
|
1050
1060
|
++++
|
1051
|
-
<div class="doc-example">
|
1061
|
+
<div class="doc-example mt-2 mb-4">
|
1052
1062
|
<button type="button" class="btn btn-fab btn-fab-sm btn-primary" aria-label="fab-button-primary">
|
1053
1063
|
<i class="mdi mdi-plus"></i>
|
1054
1064
|
</button>
|
@@ -1112,7 +1122,7 @@ FAB Buttons look inactive by adding the `disabled` boolean attribute to the
|
|
1112
1122
|
`<button>` element.
|
1113
1123
|
|
1114
1124
|
++++
|
1115
|
-
<div class="doc-example">
|
1125
|
+
<div class="doc-example mt-2 mb-4">
|
1116
1126
|
<button type="button" class="btn btn-fab btn-primary disabled" aria-label="fab-button-primary">
|
1117
1127
|
<i class="mdi mdi-plus"></i>
|
1118
1128
|
</button>
|
@@ -1148,7 +1158,7 @@ FAB Buttons look inactive by adding the `disabled` boolean attribute to the
|
|
1148
1158
|
----
|
1149
1159
|
|
1150
1160
|
++++
|
1151
|
-
<div class="doc-example">
|
1161
|
+
<div class="doc-example mt-2 mb-4">
|
1152
1162
|
<button type="button" class="btn btn-fab btn-fab-sm btn-primary disabled" aria-label="fab-button-primary">
|
1153
1163
|
<i class="mdi mdi-plus"></i>
|
1154
1164
|
</button>
|
@@ -1197,7 +1207,7 @@ The base for all typography features is the default *font family*. J1 is using
|
|
1197
1207
|
different from the standard Bootstrap configuration using the font family of
|
1198
1208
|
*Helvetica* for the default.
|
1199
1209
|
|
1200
|
-
mdi:bootstrap[
|
1210
|
+
mdi:bootstrap[18px, mdi-md-deep-purple-400]
|
1201
1211
|
link:{url-bs-docs--content-typography}[Bootstrap Docs {char-middot} Typography, {browser-window--new}]
|
1202
1212
|
|
1203
1213
|
ifeval::[{typography_headings} == true]
|
@@ -1278,7 +1288,7 @@ Creating a design for tables is challenging. The approach used by J1 Template
|
|
1278
1288
|
is based on pure CSS on top of the classic Bootstrap styles for simplicity
|
1279
1289
|
and portability to be viewed best on all devices and browsers.
|
1280
1290
|
|
1281
|
-
mdi:bootstrap[
|
1291
|
+
mdi:bootstrap[18px, mdi-md-deep-purple-400]
|
1282
1292
|
link:{url-bs-docs--content-tables}[Bootstrap Docs {char-middot} Tables, {browser-window--new}]
|
1283
1293
|
|
1284
1294
|
++++
|
@@ -1375,7 +1385,7 @@ for the email address or the number for numerical information) to take
|
|
1375
1385
|
advantage of newer input controls like email verification, number selection,
|
1376
1386
|
and more.
|
1377
1387
|
|
1378
|
-
mdi:bootstrap[
|
1388
|
+
mdi:bootstrap[18px, mdi-md-deep-purple-400]
|
1379
1389
|
link:{url-bs-docs--components-forms}[Bootstrap Docs {char-middot} Forms, {browser-window--new}]
|
1380
1390
|
|
1381
1391
|
++++
|
@@ -1427,7 +1437,7 @@ focus state, sizing, and more.
|
|
1427
1437
|
<form>
|
1428
1438
|
<div class="form-group">
|
1429
1439
|
<input type="email" class="form-control" id="exampleFormControlInput1">
|
1430
|
-
<label for="
|
1440
|
+
<label for="exampleFormControlInput1" class="bmd-label-floating">Email address</label>
|
1431
1441
|
</div>
|
1432
1442
|
<div class="form-group">
|
1433
1443
|
<select class="form-control" id="exampleFormControlSelect1">
|
@@ -1700,7 +1710,7 @@ for building all navigation components. It includes some style
|
|
1700
1710
|
overrides (for working with lists), link padding for larger hit areas,
|
1701
1711
|
and basic disabled styling.
|
1702
1712
|
|
1703
|
-
mdi:bootstrap[
|
1713
|
+
mdi:bootstrap[18px, mdi-md-deep-purple-400]
|
1704
1714
|
link:{url-bs-docs--components-navs}[Bootstrap Docs {char-middot} Navs, {browser-window--new}]
|
1705
1715
|
|
1706
1716
|
ifeval::[{navs_tabs} == true]
|
@@ -1714,10 +1724,10 @@ JavaScript plugin.
|
|
1714
1724
|
<div class="doc-example mb-3">
|
1715
1725
|
<ul class="nav nav-tabs mb-3">
|
1716
1726
|
<li class="nav-item">
|
1717
|
-
<a class="nav-link active" data-bs-toggle="tab" href="#home">Home</a>
|
1727
|
+
<a class="link-no-decoration nav-link active" data-bs-toggle="tab" href="#home">Home</a>
|
1718
1728
|
</li>
|
1719
1729
|
<li class="nav-item">
|
1720
|
-
<a class="nav-link" data-bs-toggle="tab" href="#profile">Profile</a>
|
1730
|
+
<a class="link-no-decoration nav-link" data-bs-toggle="tab" href="#profile">Profile</a>
|
1721
1731
|
</li>
|
1722
1732
|
<li class="nav-item dropdown">
|
1723
1733
|
<a href="#" class="nav-link dropdown-toggle" data-bs-toggle="dropdown"
|
@@ -1831,12 +1841,12 @@ Separators are automatically added in CSS through ::before and content.
|
|
1831
1841
|
<li class="breadcrumb-item active">Home</li>
|
1832
1842
|
</ol>
|
1833
1843
|
<ol class="breadcrumb">
|
1834
|
-
<li class="breadcrumb-item"><a href="#">Home</a></li>
|
1844
|
+
<li class="breadcrumb-item"><a class="link-no-decoration" href="#">Home</a></li>
|
1835
1845
|
<li class="breadcrumb-item active">Library</li>
|
1836
1846
|
</ol>
|
1837
1847
|
<ol class="breadcrumb">
|
1838
|
-
<li class="breadcrumb-item"><a href="#">Home</a></li>
|
1839
|
-
<li class="breadcrumb-item"><a href="#">Library</a></li>
|
1848
|
+
<li class="breadcrumb-item"><a class="link-no-decoration" href="#">Home</a></li>
|
1849
|
+
<li class="breadcrumb-item"><a class="link-no-decoration" href="#">Library</a></li>
|
1840
1850
|
<li class="breadcrumb-item active">Data</li>
|
1841
1851
|
</ol>
|
1842
1852
|
</div>
|
@@ -1953,11 +1963,11 @@ button. For proper styling, use one of the eight required contextual classes
|
|
1953
1963
|
(e.g., .alert-success). For inline dismissal, use the alerts
|
1954
1964
|
https://getbootstrap.com/docs/4.0/components/alerts/#dismissing[jQuery plugin].
|
1955
1965
|
|
1956
|
-
mdi:bootstrap[
|
1966
|
+
mdi:bootstrap[18px, mdi-md-deep-purple-400]
|
1957
1967
|
link:{url-bs-docs--components-alerts}[Bootstrap Docs {char-middot} Alerts, {browser-window--new}]
|
1958
1968
|
|
1959
1969
|
++++
|
1960
|
-
<div class="doc-example">
|
1970
|
+
<div class="doc-example mt-2 mb-4">
|
1961
1971
|
<div class="row">
|
1962
1972
|
<div class="col-md-12">
|
1963
1973
|
<div class="alert alert-warning alert-dismissible" role="alert">
|
@@ -1971,20 +1981,20 @@ link:{url-bs-docs--components-alerts}[Bootstrap Docs {char-middot} Alerts, {brow
|
|
1971
1981
|
<div class="row">
|
1972
1982
|
<div class="col-md-4">
|
1973
1983
|
<div class="alert alert-danger alert-dismissible" role="alert">
|
1974
|
-
<strong>Oh snap!</strong> <a href="#" class="alert-link">Change a few things up
|
1975
|
-
<button type="button" class="btn-close" data-bs-dismiss="alert"</button>
|
1984
|
+
<strong>Oh snap!</strong> <a href="#" class="alert-link">Change a few</a> things up and try submitting again.
|
1985
|
+
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"</button>
|
1976
1986
|
</div>
|
1977
1987
|
</div>
|
1978
1988
|
<div class="col-md-4">
|
1979
1989
|
<div class="alert alert-success alert-dismissible" role="alert">
|
1980
|
-
<strong>Well done!</strong> You successfully read <a href="#" class="alert-link">
|
1981
|
-
<button type="button" class="btn-close" data-bs-dismiss="alert"</button>
|
1990
|
+
<strong>Well done!</strong> You successfully read this important <a href="#" class="alert-link">alert message</a>.
|
1991
|
+
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"</button>
|
1982
1992
|
</div>
|
1983
1993
|
</div>
|
1984
1994
|
<div class="col-md-4">
|
1985
1995
|
<div class="alert alert-info alert-dismissible" role="alert">
|
1986
|
-
<strong>Heads up!</strong> This <a href="#" class="alert-link">
|
1987
|
-
<button type="button" class="btn-close" data-bs-dismiss="alert"</button>
|
1996
|
+
<strong>Heads up!</strong> This alert needs your <a href="#" class="alert-link">attention</a>, but it's not super important.
|
1997
|
+
<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"</button>
|
1988
1998
|
</div>
|
1989
1999
|
</div>
|
1990
2000
|
</div>
|
@@ -2005,11 +2015,11 @@ be presented with the content of the badge. Depending on the specific
|
|
2005
2015
|
situation, these badges may seem like random additional words or numbers
|
2006
2016
|
at the end of a sentence, link, or button.
|
2007
2017
|
|
2008
|
-
mdi:bootstrap[
|
2018
|
+
mdi:bootstrap[18px, mdi-md-deep-purple-400]
|
2009
2019
|
link:{url-bs-docs--components-badges}[Bootstrap Docs {char-middot} Badge, {browser-window--new}]
|
2010
2020
|
|
2011
2021
|
++++
|
2012
|
-
<div class="doc-example">
|
2022
|
+
<div class="doc-example mt-2 mb-4">
|
2013
2023
|
<div class="bs-component mb-3">
|
2014
2024
|
<span class="badge bg-primary">Primary</span>
|
2015
2025
|
<span class="badge bg-secondary">Secondary</span>
|
@@ -2130,7 +2140,7 @@ elements, some CSS to set the width, and a few attributes. We don’t use the
|
|
2130
2140
|
HTML5 <progress> element, ensuring you can stack progress bars, animate them,
|
2131
2141
|
and place text labels over them.
|
2132
2142
|
|
2133
|
-
mdi:bootstrap[
|
2143
|
+
mdi:bootstrap[18px, mdi-md-deep-purple-400]
|
2134
2144
|
link:{url-bs-docs--components-progress}[Bootstrap Docs {char-middot} Progress, {browser-window--new}]
|
2135
2145
|
|
2136
2146
|
ifeval::[{progress_basic} == true]
|
@@ -2139,7 +2149,7 @@ ifeval::[{progress_basic} == true]
|
|
2139
2149
|
++++
|
2140
2150
|
<div class="doc-example mb-3">
|
2141
2151
|
<div class="progress">
|
2142
|
-
<div class="progress-bar" role="progressbar" style="width: 25%;" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
|
2152
|
+
<div class="progress-bar" role="progressbar" style="width: 25%;" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100" aria-label="Progress Bar"></div>
|
2143
2153
|
</div>
|
2144
2154
|
</div>
|
2145
2155
|
++++
|
@@ -2152,7 +2162,8 @@ ifeval::[{progress_basic} == true]
|
|
2152
2162
|
style="width: 25%;"
|
2153
2163
|
aria-valuenow="25"
|
2154
2164
|
aria-valuemin="0"
|
2155
|
-
aria-valuemax="100"
|
2165
|
+
aria-valuemax="100"
|
2166
|
+
aria-label="Progress Bar">
|
2156
2167
|
</div>
|
2157
2168
|
</div>
|
2158
2169
|
----
|
@@ -2164,16 +2175,16 @@ ifeval::[{progress_contextual_alternatives} == true]
|
|
2164
2175
|
++++
|
2165
2176
|
<div class="doc-example mb-3">
|
2166
2177
|
<div class="progress mb-1">
|
2167
|
-
<div class="progress-bar bg-success" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
|
2178
|
+
<div class="progress-bar bg-success" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100" aria-label="Progress Bar"></div>
|
2168
2179
|
</div>
|
2169
2180
|
<div class="progress mb-1">
|
2170
|
-
<div class="progress-bar bg-info" role="progressbar" style="width: 50%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>
|
2181
|
+
<div class="progress-bar bg-info" role="progressbar" style="width: 50%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100" aria-label="Progress Bar"></div>
|
2171
2182
|
</div>
|
2172
2183
|
<div class="progress mb-1">
|
2173
|
-
<div class="progress-bar bg-warning" role="progressbar" style="width: 75%" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100"></div>
|
2184
|
+
<div class="progress-bar bg-warning" role="progressbar" style="width: 75%" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100" aria-label="Progress Bar"></div>
|
2174
2185
|
</div>
|
2175
2186
|
<div class="progress">
|
2176
|
-
<div class="progress-bar bg-danger" role="progressbar" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
|
2187
|
+
<div class="progress-bar bg-danger" role="progressbar" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" aria-label="Progress Bar"></div>
|
2177
2188
|
</div>
|
2178
2189
|
</div>
|
2179
2190
|
++++
|
@@ -2186,7 +2197,7 @@ ifeval::[{progress_contextual_alternatives} == true]
|
|
2186
2197
|
style="width: 25%;"
|
2187
2198
|
aria-valuenow="25"
|
2188
2199
|
aria-valuemin="0"
|
2189
|
-
aria-valuemax="100">
|
2200
|
+
aria-valuemax="100" aria-label="Progress Bar">
|
2190
2201
|
</div>
|
2191
2202
|
</div>
|
2192
2203
|
----
|
@@ -2198,9 +2209,9 @@ ifeval::[{progress_multiple_bars} == true]
|
|
2198
2209
|
++++
|
2199
2210
|
<div class="doc-example mb-3">
|
2200
2211
|
<div class="progress">
|
2201
|
-
<div class="progress-bar bg-success" role="progressbar" style="width: 50%" aria-valuenow="15" aria-valuemin="0" aria-valuemax="100"></div>
|
2202
|
-
<div class="progress-bar bg-warning" role="progressbar" style="width: 25%" aria-valuenow="30" aria-valuemin="0" aria-valuemax="100"></div>
|
2203
|
-
<div class="progress-bar bg-danger" role="progressbar" style="width: 20%" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100"></div>
|
2212
|
+
<div class="progress-bar bg-success" role="progressbar" style="width: 50%" aria-valuenow="15" aria-valuemin="0" aria-valuemax="100" aria-label="Progress Bar"></div>
|
2213
|
+
<div class="progress-bar bg-warning" role="progressbar" style="width: 25%" aria-valuenow="30" aria-valuemin="0" aria-valuemax="100" aria-label="Progress Bar"></div>
|
2214
|
+
<div class="progress-bar bg-danger" role="progressbar" style="width: 20%" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100" aria-label="Progress Bar"></div>
|
2204
2215
|
</div>
|
2205
2216
|
</div>
|
2206
2217
|
++++
|
@@ -2212,19 +2223,19 @@ ifeval::[{progress_striped} == true]
|
|
2212
2223
|
++++
|
2213
2224
|
<div class="doc-example mb-3">
|
2214
2225
|
<div class="progress mb-1">
|
2215
|
-
<div class="progress-bar progress-bar-striped" role="progressbar" style="width: 10%" aria-valuenow="10" aria-valuemin="0" aria-valuemax="100"></div>
|
2226
|
+
<div class="progress-bar progress-bar-striped" role="progressbar" style="width: 10%" aria-valuenow="10" aria-valuemin="0" aria-valuemax="100" aria-label="Progress Bar"></div>
|
2216
2227
|
</div>
|
2217
2228
|
<div class="progress mb-1">
|
2218
|
-
<div class="progress-bar progress-bar-striped bg-success" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100"></div>
|
2229
|
+
<div class="progress-bar progress-bar-striped bg-success" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100" aria-label="Progress Bar"></div>
|
2219
2230
|
</div>
|
2220
2231
|
<div class="progress mb-1">
|
2221
|
-
<div class="progress-bar progress-bar-striped bg-info" role="progressbar" style="width: 50%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100"></div>
|
2232
|
+
<div class="progress-bar progress-bar-striped bg-info" role="progressbar" style="width: 50%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100" aria-label="Progress Bar"></div>
|
2222
2233
|
</div>
|
2223
2234
|
<div class="progress mb-1">
|
2224
|
-
<div class="progress-bar progress-bar-striped bg-warning" role="progressbar" style="width: 75%" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100"></div>
|
2235
|
+
<div class="progress-bar progress-bar-striped bg-warning" role="progressbar" style="width: 75%" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100" aria-label="Progress Bar"></div>
|
2225
2236
|
</div>
|
2226
2237
|
<div class="progress">
|
2227
|
-
<div class="progress-bar progress-bar-striped bg-danger" role="progressbar" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100"></div>
|
2238
|
+
<div class="progress-bar progress-bar-striped bg-danger" role="progressbar" style="width: 100%" aria-valuenow="100" aria-valuemin="0" aria-valuemax="100" aria-label="Progress Bar"></div>
|
2228
2239
|
</div>
|
2229
2240
|
</div>
|
2230
2241
|
++++
|
@@ -2236,7 +2247,7 @@ ifeval::[{progress_animated} == true]
|
|
2236
2247
|
++++
|
2237
2248
|
<div class="doc-example mb-3">
|
2238
2249
|
<div class="progress">
|
2239
|
-
<div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100" style="width: 75%"></div>
|
2250
|
+
<div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" aria-valuenow="75" aria-valuemin="0" aria-valuemax="100" style="width: 75%" aria-label="Progress Bar"></div>
|
2240
2251
|
</div>
|
2241
2252
|
</div>
|
2242
2253
|
++++
|
@@ -2279,7 +2290,7 @@ manage to deliver a ton of control and customization. Built with flexbox,
|
|
2279
2290
|
they offer easy alignment and mix well with other Bootstrap components.
|
2280
2291
|
They have no margin by default, so use spacing utilities as needed.
|
2281
2292
|
|
2282
|
-
mdi:bootstrap[
|
2293
|
+
mdi:bootstrap[18px, mdi-md-deep-purple-400]
|
2283
2294
|
link:{url-bs-docs--components-cards}[Bootstrap Docs {char-middot} Card, {browser-window--new}]
|
2284
2295
|
|
2285
2296
|
ifeval::[{cards_simple} == true]
|
@@ -2303,7 +2314,7 @@ ifeval::[{cards_simple} == true]
|
|
2303
2314
|
<div class="card mb-3" style="max-width: 20rem;">
|
2304
2315
|
<div class="card-body">
|
2305
2316
|
<h4 class="card-title notoc">Card title</h4>
|
2306
|
-
<
|
2317
|
+
<h5 class="card-subtitle mb-2 text-muted notoc">Card subtitle</h6>
|
2307
2318
|
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
|
2308
2319
|
<a href="#" class="card-link">Card link</a>
|
2309
2320
|
<a href="#" class="card-link">Another link</a>
|
@@ -2314,7 +2325,7 @@ ifeval::[{cards_simple} == true]
|
|
2314
2325
|
<div class="card mb-3" style="max-width: 20rem;">
|
2315
2326
|
<div class="card-body">
|
2316
2327
|
<h4 class="card-title notoc">Card title</h4>
|
2317
|
-
<
|
2328
|
+
<h5 class="card-subtitle mb-2 text-muted notoc">Card subtitle</h6>
|
2318
2329
|
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
|
2319
2330
|
<a href="#" class="card-link">Card link</a>
|
2320
2331
|
<a href="#" class="card-link">Another link</a>
|
@@ -2370,7 +2381,7 @@ ifeval::[{cards_simple} == true]
|
|
2370
2381
|
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
|
2371
2382
|
</div>
|
2372
2383
|
<div class="card-footer r-text-200">
|
2373
|
-
<a class="card-link bs-info font-weight-bold g-font-size-12 text-uppercase"
|
2384
|
+
<a class="link-no-decoration card-link bs-info font-weight-bold g-font-size-12 text-uppercase"
|
2374
2385
|
href="#">Action · Footer Link
|
2375
2386
|
</a>
|
2376
2387
|
</div>
|
@@ -2386,7 +2397,7 @@ ifeval::[{cards_simple} == true]
|
|
2386
2397
|
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
|
2387
2398
|
</div>
|
2388
2399
|
<div class="card-footer r-text-200">
|
2389
|
-
<a class="card-link bs-warning font-weight-bold g-font-size-12 text-uppercase"
|
2400
|
+
<a class="link-no-decoration card-link bs-warning font-weight-bold g-font-size-12 text-uppercase"
|
2390
2401
|
href="#">Action · Footer Link
|
2391
2402
|
</a>
|
2392
2403
|
</div>
|
@@ -2424,7 +2435,7 @@ ifeval::[{cards_image} == true]
|
|
2424
2435
|
<img src="/assets/images/modules/attics/building-blocks-1920x1280-bw.jpg" alt="Free site generators">
|
2425
2436
|
<div class="card-body">
|
2426
2437
|
<h5 class="card-title notoc">Card title</h5>
|
2427
|
-
<
|
2438
|
+
<h5 class="card-subtitle text-muted notoc">Image card subtitle</h6>
|
2428
2439
|
</div>
|
2429
2440
|
|
2430
2441
|
<div class="card-body">
|
@@ -2438,7 +2449,7 @@ ifeval::[{cards_image} == true]
|
|
2438
2449
|
<img src="/assets/images/modules/attics/building-blocks-1920x1280-bw.jpg" alt="Free site generators">
|
2439
2450
|
<div class="card-body">
|
2440
2451
|
<h5 class="card-title notoc">Card title</h5>
|
2441
|
-
<
|
2452
|
+
<h5 class="card-subtitle text-muted notoc">Image card subtitle</h6>
|
2442
2453
|
</div>
|
2443
2454
|
|
2444
2455
|
<div class="card-body">
|
@@ -2456,7 +2467,7 @@ ifeval::[{cards_image} == true]
|
|
2456
2467
|
<img src="/assets/images/modules/attics/building-blocks-1920x1280-bw.jpg" alt="Free site generators">
|
2457
2468
|
<div class="card-body">
|
2458
2469
|
<h5 class="card-title notoc">Card title</h5>
|
2459
|
-
<
|
2470
|
+
<h5 class="card-subtitle text-muted notoc">Image card subtitle</h6>
|
2460
2471
|
</div>
|
2461
2472
|
|
2462
2473
|
<div class="card-body">
|
@@ -2493,7 +2504,7 @@ built with HTML, CSS, and JavaScript. They’re positioned over everything
|
|
2493
2504
|
else in the document and remove scroll from the <body> so that modal
|
2494
2505
|
content scrolls instead.
|
2495
2506
|
|
2496
|
-
mdi:bootstrap[
|
2507
|
+
mdi:bootstrap[18px, mdi-md-deep-purple-400]
|
2497
2508
|
link:{url-bs-docs--components-modal}[Bootstrap Docs {char-middot} Modal, {browser-window--new}]
|
2498
2509
|
|
2499
2510
|
.Modal types
|
@@ -2885,7 +2896,7 @@ be included before `bootstrap.js` in order to make popovers and tooltips to work
|
|
2885
2896
|
|
2886
2897
|
Bla bla blu.
|
2887
2898
|
|
2888
|
-
mdi:bootstrap[
|
2899
|
+
mdi:bootstrap[18px, mdi-md-deep-purple-400]
|
2889
2900
|
link:{url-bs-docs--components-tooltips}[Bootstrap Docs {char-middot} Tooltips, {browser-window--new}]
|
2890
2901
|
|
2891
2902
|
++++
|
@@ -2930,7 +2941,7 @@ link:{url-bs-docs--components-tooltips}[Bootstrap Docs {char-middot} Tooltips, {
|
|
2930
2941
|
|
2931
2942
|
Bla bla blu.
|
2932
2943
|
|
2933
|
-
mdi:bootstrap[
|
2944
|
+
mdi:bootstrap[18px, mdi-md-deep-purple-400]
|
2934
2945
|
link:{url-bs-docs--components-popovers}[Bootstrap Docs {char-middot} Popovers, {browser-window--new}]
|
2935
2946
|
|
2936
2947
|
++++
|