diff --git a/docs/devGuide/projectManagement.md b/docs/devGuide/projectManagement.md index 4e9a4a849d..ea2b287399 100644 --- a/docs/devGuide/projectManagement.md +++ b/docs/devGuide/projectManagement.md @@ -381,4 +381,4 @@ Note that: * Result: 'tlylt' will be updated to have both icons(code and doc) {% from "njk/common.njk" import previous_next %} -{{ previous_next('githubActions/markbindReusableWorkflows', 'styleGuides') }} \ No newline at end of file +{{ previous_next('githubActions/markbindReusableWorkflows', 'styleGuides') }} diff --git a/docs/userGuide/syntax/lists.md b/docs/userGuide/syntax/lists.md index bcff639133..1b7b0292ed 100644 --- a/docs/userGuide/syntax/lists.md +++ b/docs/userGuide/syntax/lists.md @@ -72,6 +72,33 @@ Markdown can also be used in texts. You may need to add escape characters when using special characters for Markdown in text. +**You can add an icon or text that only applies to a specific item by using the `once` attribute.** + + +markdown + +* Item 1 { icon="glyphicon-education" } +* Item 2 { icon="fas-code-branch" once=true } + * Item 2.1 + * Item 2.2 +* Item 3 + + + +Subsequent items at the same level will not inherit icons or texts with the `once` attribute and will instead inherit the icons or texts before it. + +The `once` attribute also applies to all other attributes such as `i-size` and `t-size` as seen below. + + +markdown + +* Item 1 { icon="glyphicon-education" i-size="40px" i-class="text-primary" } +* Item 2 { i-size="25px" once=true } + * Sub-item 2.1 +* Item 3 + + + **You can adjust the icon and text's size by using the `i-size` and `t-size` attribute respectively.** diff --git a/packages/cli/test/functional/test_site/expected/testList.html b/packages/cli/test/functional/test_site/expected/testList.html index 58c3cc3470..246d4c3586 100644 --- a/packages/cli/test/functional/test_site/expected/testList.html +++ b/packages/cli/test/functional/test_site/expected/testList.html @@ -220,6 +220,14 @@

Testing Site-Nav +
  • +
    Only 1 item
    +
    • +
    1. One item with customization text
    @@ -252,6 +260,20 @@

    Testing Site-Nav +
  • +
    Only 1 item +
      +
    • +
      Only 1 item
      +
      • +
    +
    +
    • +
    1. One item + nested list with text customization
    @@ -633,6 +655,370 @@

    Testing Site-Nav +
  • +
    Item A
    +
    • +
  • Item B +
      +
    • +
      Sub-item B1
      +
      • +
    • +
      Sub-item B2
      +
      • +
    • +
      Sub-item B3 +
        +
      • Icon​​ +
        Sub-sub-item B3.1
        +
        • +
      • Icon​​ +
        Sub-sub-item B3.2
        +
        • +
      +
      +
      • +
    • +
      Sub-item B4
      +
      • +
    +
    • +
  • +
    Item C
    +
    • + +
      +
    1. Customization + none + once
      2. +
    +
      +
    • +
      Item A
      +
      • +
    • +
      Item B +
        +
      • +
        Sub-item B1
        +
        • +
      • +
        Sub-item B2
        +
        • +
      • +
        Sub-item B3 +
          +
        • Icon​​ +
          Sub-sub-item B3.1
          +
          • +
        • Icon​​ +
          Sub-sub-item B3.2
          +
          • +
        +
        +
        • +
      • +
        Sub-item B4
        +
        • +
      +
      +
      • +
    • +
      Item C
      +
      • +
    +
      +
    1. Customization + once + none
      2. +
    +
      +
    • +
      Item A
      +
      • +
    • +
      Item B +
        +
      • Sub-item B1
        • +
      • Sub-item B2
        • +
      • Sub-item B3 +
          +
        • Icon​​ +
          Sub-sub-item B3.1
          +
          • +
        • Icon​​ +
          Sub-sub-item B3.2
          +
          • +
        +
        • +
      • Sub-item B4
        • +
      +
      +
      • +
    • +
      Item C
      +
      • +
    +
      +
    1. Once + customization + none
      2. +
    +
      +
    • +
      Item A
      +
      • +
    • +
      Item B +
        +
      • Sub-item B1
        • +
      • Sub-item B2
        • +
      • Sub-item B3 +
          +
        • Icon​​ +
          Sub-sub-item B3.1
          +
          • +
        • Icon​​ +
          Sub-sub-item B3.2
          +
          • +
        +
        • +
      • Sub-item B4
        • +
      +
      +
      • +
    • +
      Item C
      +
      • +
    +
      +
    1. None + customization + once
      2. +
    +
      +
    • Item A
      • +
    • Item B +
        +
      • Sub-item B1
        • +
      • Sub-item B2
        • +
      • Sub-item B3 +
          +
        • Icon​​ +
          Sub-sub-item B3.1
          +
          • +
        • Icon​​ +
          Sub-sub-item B3.2
          +
          • +
        +
        • +
      • Sub-item B4
        • +
      +
      • +
    • Item C
      • +
    +
      +
    1. None + once + customization
      2. +
    +
      +
    • Item A
      • +
    • Item B +
        +
      • Sub-item B1
        • +
      • Sub-item B2
        • +
      • Sub-item B3 +
          +
        • Icon​​ +
          Sub-sub-item B3.1
          +
          • +
        • Icon​​ +
          Sub-sub-item B3.2
          +
          • +
        +
        • +
      • Sub-item B4
        • +
      +
      • +
    • Item C
      • +
    +
      +
    1. Customization + once + customization
      2. +
    +
      +
    • +
      Item A
      +
      • +
    • +
      Item B +
        +
      • Sub-item B1
        • +
      • Sub-item B2
        • +
      • Sub-item B3 +
          +
        • Icon​​ +
          Sub-sub-item B3.1
          +
          • +
        • Icon​​ +
          Sub-sub-item B3.2
          +
          • +
        +
        • +
      • Sub-item B4
        • +
      +
      +
      • +
    • Icon​​ +
      Item C
      +
      • +
    +
      +
    1. String once
      2. +
    +
      +
    • +
      Item A
      +
      • +
    • Item B +
        +
      • Sub-item B1
        • +
      • Sub-item B2
        • +
      • Sub-item B3 +
          +
        • Icon​​ +
          Sub-sub-item B3.1
          +
          • +
        • Icon​​ +
          Sub-sub-item B3.2
          +
          • +
        +
        • +
      • Sub-item B4
        • +
      +
      • +
    • Item C
      • +
    +
      +
    1. False once for item A, rest of items will inherit
      2. +
    +
      +
    • +
      Item A
      +
      • +
    • +
      Item B +
        +
      • Sub-item B1
        • +
      • Sub-item B2
        • +
      • Sub-item B3 +
          +
        • Icon​​ +
          Sub-sub-item B3.1
          +
          • +
        • Icon​​ +
          Sub-sub-item B3.2
          +
          • +
        +
        • +
      • Sub-item B4
        • +
      +
      +
      • +
    • +
      Item C
      +
      • +
    +
      +
    1. False once for item B, will overwrite item A
      2. +
    +
      +
    • +
      Item A
      +
      • +
    • +
      Item B +
        +
      • Sub-item B1
        • +
      • Sub-item B2
        • +
      • Sub-item B3 +
          +
        • Icon​​ +
          Sub-sub-item B3.1
          +
          • +
        • Icon​​ +
          Sub-sub-item B3.2
          +
          • +
        +
        • +
      • Sub-item B4
        • +
      +
      +
      • +
    • +
      Item C
      +
      • +
    +
      +
    1. Once for specific attributes besides icon, does not overwrite
      2. +
    +
      +
    • +
      Item A
      +
      • +
    • +
      Item B +
        +
      • Sub-item B1
        • +
      +
      +
      • +
    • +
      Item C
      +
      • +
    +
      +
    1. False once for specific attributes besides icon, does overwrite
      2. +
    +
      +
    • +
      Item A
      +
      • +
    • +
      Item B +
        +
      • Sub-item B1
        • +
      +
      +
      • +
    • +
      Item C
      +
      • +
    +
      +
    1. Sub-level
      2. +
    +
      +
    • Item A
      • +
    • Item B +
        +
      • +
        Sub-item B1
        +
        • +
      • Sub-item B2
        • +
      • +
        Sub-item B3 +
          +
        • Icon​​ +
          Sub-sub-item B3.1
          +
          • +
        • Icon​​ +
          Sub-sub-item B3.2
          +
          • +
        +
        +
        • +
      • +
        Sub-item B4
        +
        • +
      +
      • +
    • Item C
      • +
    diff --git a/packages/cli/test/functional/test_site/expected/testList.page-vue-render.js b/packages/cli/test/functional/test_site/expected/testList.page-vue-render.js index 809f18f38f..01e9446c97 100644 --- a/packages/cli/test/functional/test_site/expected/testList.page-vue-render.js +++ b/packages/cli/test/functional/test_site/expected/testList.page-vue-render.js @@ -1,7 +1,7 @@ var pageVueRenderFn = function anonymous( ) { -with(this){return _c('div',{attrs:{"id":"app"}},[_c('div',[_c('header',[_c('navbar',{attrs:{"type":"dark","default-highlight-on":"sibling-or-child"},scopedSlots:_u([{key:"brand",fn:function(){return [_c('a',{staticClass:"navbar-brand",attrs:{"href":"/","title":"Home"}},[_v("MarkBind Test Site")])]},proxy:true}])},[_v(" "),_c('li',[_c('a',{staticClass:"nav-link",attrs:{"href":"/test_site/bugs/index.html"}},[_v("Open Bugs")])])]),_v(" "),_m(0)],1),_v(" "),_m(1)]),_v(" "),_c('div',{attrs:{"id":"flex-body"}},[_c('overlay-source',{attrs:{"id":"site-nav","tag-name":"nav","to":"site-nav"}},[_c('div',{staticClass:"site-nav-top"},[_c('div',{staticClass:"fw-bold mb-2",staticStyle:{"font-size":"1.25rem"}},[_c('div',[_c('h2',{attrs:{"id":"default-layout"}},[_v("Default Layout"),_c('a',{staticClass:"fa fa-anchor",attrs:{"href":"#default-layout","onclick":"event.stopPropagation()"}})])])])]),_v(" "),_c('div',{staticClass:"nav-component slim-scroll"},[_c('div',[_c('site-nav',[_c('overlay-source',{staticClass:"site-nav-list site-nav-list-root",attrs:{"tag-name":"ul","to":"mb-site-nav"}},[_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-0",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('a',{attrs:{"href":"/test_site/index.html"}},[_v("Home 🏠")])])]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-0",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('a',{attrs:{"href":"/test_site/bugs/index.html"}},[_v("Open Bugs 🐛")])])]),_v(" "),_c('li',{staticClass:"site-nav-custom-list-item site-nav-list-item-0"},[_c('h3',{attrs:{"id":"testing-site-nav"}},[_v("Testing Site-Nav"),_c('a',{staticClass:"fa fa-anchor",attrs:{"href":"#testing-site-nav","onclick":"event.stopPropagation()"}})])]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-0",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('strong',[_v("Dropdown ")]),_v(" "),_c('span',{staticClass:"glyphicon glyphicon-search",attrs:{"aria-hidden":"true"}}),_v(" title ✏️ "),_v(" "),_c('div',{staticClass:"site-nav-dropdown-btn-container"},[_c('i',{staticClass:"site-nav-dropdown-btn-icon site-nav-rotate-icon",attrs:{"onclick":"handleSiteNavClick(this.parentNode.parentNode, false); event.stopPropagation();"}},[_c('span',{staticClass:"glyphicon glyphicon-menu-down",attrs:{"aria-hidden":"true"}})])])]),_c('ul',{staticClass:"site-nav-dropdown-container site-nav-dropdown-container-open site-nav-list"},[_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-1",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('a',{attrs:{"href":"https://www.google.com/"}},[_v("Dropdown link one")])])]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-1",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('a',{attrs:{"href":"https://www.google.com/"}},[_v("Html within site-nav "),_c('span',{staticStyle:{"color":"red"}},[_v("should")]),_v(" be displayed properly")])])]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-1",attrs:{"onclick":"handleSiteNavClick(this)"}},[_v("Nested Dropdown title 📐\n\n"),_c('div',{staticClass:"site-nav-dropdown-btn-container"},[_c('i',{staticClass:"site-nav-dropdown-btn-icon",attrs:{"onclick":"handleSiteNavClick(this.parentNode.parentNode, false); event.stopPropagation();"}},[_c('span',{staticClass:"glyphicon glyphicon-menu-down",attrs:{"aria-hidden":"true"}})])])]),_c('ul',{staticClass:"site-nav-dropdown-container site-nav-list"},[_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-2",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('a',{attrs:{"href":"https://www.google.com/"}},[_c('strong',[_v("Nested")]),_v(" Dropdown link one")])])]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-2",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('a',{attrs:{"href":"https://www.google.com/"}},[_c('strong',[_v("Nested")]),_v(" Dropdown link two")])])])])]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-1",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('a',{attrs:{"href":"https://www.google.com/"}},[_v("Dropdown link two")])])])])]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-0",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('a',{attrs:{"href":"https://www.google.com/"}},[_c('mark',[_v("Third Link")]),_v(" 📋")])])]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-0",attrs:{"onclick":"handleSiteNavClick(this)"}},[_v("Filler text "),_c('a',{attrs:{"href":"https://www.youtube.com/"}},[_c('span',{staticClass:"glyphicon glyphicon-facetime-video",attrs:{"aria-hidden":"true"}}),_v(" Youtube 📺")]),_v(" filler text"),_v(" "),_c('div',{staticClass:"site-nav-dropdown-btn-container"},[_c('i',{staticClass:"site-nav-dropdown-btn-icon",attrs:{"onclick":"handleSiteNavClick(this.parentNode.parentNode, false); event.stopPropagation();"}},[_c('span',{staticClass:"glyphicon glyphicon-menu-down",attrs:{"aria-hidden":"true"}})])])]),_c('ul',{staticClass:"site-nav-dropdown-container site-nav-list"},[_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-1",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('a',{attrs:{"href":"https://www.youtube.com/watch?v=dQw4w9WgXcQ"}},[_v("The answer to everything in the universe")])])]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-1",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('mark',[_v("Dropdown title")]),_v(" "),_c('span',{staticClass:"glyphicon glyphicon-comment",attrs:{"aria-hidden":"true"}}),_v(" ✏️ "),_v(" "),_c('div',{staticClass:"site-nav-dropdown-btn-container"},[_c('i',{staticClass:"site-nav-dropdown-btn-icon site-nav-rotate-icon",attrs:{"onclick":"handleSiteNavClick(this.parentNode.parentNode, false); event.stopPropagation();"}},[_c('span',{staticClass:"glyphicon glyphicon-menu-down",attrs:{"aria-hidden":"true"}})])])]),_c('ul',{staticClass:"site-nav-dropdown-container site-nav-dropdown-container-open site-nav-list"},[_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-2",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('a',{attrs:{"href":"https://www.google.com/"}},[_c('strong',[_v("Nested")]),_v(" Dropdown link one")])])])])])])]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-0",attrs:{"onclick":"handleSiteNavClick(this)"}},[_v("Really Long Dropdown Title Really Long Dropdown Title Really Long Dropdown Title Really Long Dropdown\n\n"),_c('div',{staticClass:"site-nav-dropdown-btn-container"},[_c('i',{staticClass:"site-nav-dropdown-btn-icon",attrs:{"onclick":"handleSiteNavClick(this.parentNode.parentNode, false); event.stopPropagation();"}},[_c('span',{staticClass:"glyphicon glyphicon-menu-down",attrs:{"aria-hidden":"true"}})])])]),_c('ul',{staticClass:"site-nav-dropdown-container site-nav-list"},[_c('li',{staticClass:"site-nav-custom-list-item site-nav-list-item-1"},[_v("Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text")]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-1",attrs:{"onclick":"handleSiteNavClick(this)"}},[_v("Nested Dropdown Title\n\n"),_c('div',{staticClass:"site-nav-dropdown-btn-container"},[_c('i',{staticClass:"site-nav-dropdown-btn-icon",attrs:{"onclick":"handleSiteNavClick(this.parentNode.parentNode, false); event.stopPropagation();"}},[_c('span',{staticClass:"glyphicon glyphicon-menu-down",attrs:{"aria-hidden":"true"}})])])]),_c('ul',{staticClass:"site-nav-dropdown-container site-nav-list"},[_c('li',{staticClass:"site-nav-custom-list-item site-nav-list-item-2"},[_v("Hello Doge Hello Doge 🐶")]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-2",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('a',{attrs:{"href":"/test_site/index.html"}},[_c('strong',[_v("NESTED LINK")]),_v(" Home 🏠")])])]),_v(" "),_c('li',{staticClass:"site-nav-custom-list-item site-nav-list-item-2"},[_v("Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit")])])])])]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-0",attrs:{"onclick":"handleSiteNavClick(this)"}},[_v("Test line break in navigation layout\n\n"),_c('div',{staticClass:"site-nav-dropdown-btn-container"},[_c('i',{staticClass:"site-nav-dropdown-btn-icon",attrs:{"onclick":"handleSiteNavClick(this.parentNode.parentNode, false); event.stopPropagation();"}},[_c('span',{staticClass:"glyphicon glyphicon-menu-down",attrs:{"aria-hidden":"true"}})])])]),_c('ul',{staticClass:"site-nav-dropdown-container site-nav-list"},[_c('li',{staticClass:"site-nav-custom-list-item site-nav-list-item-1"},[_v("Nested line break text ✂️")]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-1",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('a',{attrs:{"href":"/test_site/index.html"}},[_v("Nested line break href")]),_v(" "),_c('div',{staticClass:"site-nav-dropdown-btn-container"},[_c('i',{staticClass:"site-nav-dropdown-btn-icon",attrs:{"onclick":"handleSiteNavClick(this.parentNode.parentNode, false); event.stopPropagation();"}},[_c('span',{staticClass:"glyphicon glyphicon-menu-down",attrs:{"aria-hidden":"true"}})])])]),_c('ul',{staticClass:"site-nav-dropdown-container site-nav-list"},[_c('li',{staticClass:"site-nav-custom-list-item site-nav-list-item-2"},[_v("Nested Nested line break text ✂️")])])]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-1",attrs:{"onclick":"handleSiteNavClick(this)"}},[_v("Nested line break dropdown menu\n\n"),_c('div',{staticClass:"site-nav-dropdown-btn-container"},[_c('i',{staticClass:"site-nav-dropdown-btn-icon",attrs:{"onclick":"handleSiteNavClick(this.parentNode.parentNode, false); event.stopPropagation();"}},[_c('span',{staticClass:"glyphicon glyphicon-menu-down",attrs:{"aria-hidden":"true"}})])])]),_c('ul',{staticClass:"site-nav-dropdown-container site-nav-list"},[_c('li',{staticClass:"site-nav-custom-list-item site-nav-list-item-2"},[_v("Line break item 2 📘")])])])])])])],1)],1)])]),_v(" "),_c('div',{attrs:{"id":"content-wrapper"}},[_c('breadcrumb'),_v(" "),_m(2),_v(" "),_m(3),_v(" "),_m(4),_v(" "),_m(5),_v(" "),_m(6),_v(" "),_m(7),_v(" "),_m(8),_v(" "),_m(9),_v(" "),_m(10),_v(" "),_m(11),_v(" "),_m(12),_v(" "),_m(13),_v(" "),_m(14),_v(" "),_m(15),_v(" "),_m(16),_v(" "),_m(17),_v(" "),_m(18),_v(" "),_m(19),_v(" "),_m(20),_v(" "),_m(21),_v(" "),_m(22),_v(" "),_m(23),_v(" "),_m(24),_v(" "),_m(25),_v(" "),_m(26),_v(" "),_m(27),_v(" "),_m(28),_v(" "),_m(29),_v(" "),_m(30),_v(" "),_m(31),_v(" "),_m(32),_v(" "),_m(33),_v(" "),_m(34),_v(" "),_m(35)],1),_v(" "),_c('overlay-source',{attrs:{"id":"page-nav","tag-name":"nav","to":"page-nav"}},[_c('div',{staticClass:"nav-component slim-scroll"})]),_v(" "),_c('scroll-top-button')],1),_v(" "),_m(36)])} +with(this){return _c('div',{attrs:{"id":"app"}},[_c('div',[_c('header',[_c('navbar',{attrs:{"type":"dark","default-highlight-on":"sibling-or-child"},scopedSlots:_u([{key:"brand",fn:function(){return [_c('a',{staticClass:"navbar-brand",attrs:{"href":"/","title":"Home"}},[_v("MarkBind Test Site")])]},proxy:true}])},[_v(" "),_c('li',[_c('a',{staticClass:"nav-link",attrs:{"href":"/test_site/bugs/index.html"}},[_v("Open Bugs")])])]),_v(" "),_m(0)],1),_v(" "),_m(1)]),_v(" "),_c('div',{attrs:{"id":"flex-body"}},[_c('overlay-source',{attrs:{"id":"site-nav","tag-name":"nav","to":"site-nav"}},[_c('div',{staticClass:"site-nav-top"},[_c('div',{staticClass:"fw-bold mb-2",staticStyle:{"font-size":"1.25rem"}},[_c('div',[_c('h2',{attrs:{"id":"default-layout"}},[_v("Default Layout"),_c('a',{staticClass:"fa fa-anchor",attrs:{"href":"#default-layout","onclick":"event.stopPropagation()"}})])])])]),_v(" "),_c('div',{staticClass:"nav-component slim-scroll"},[_c('div',[_c('site-nav',[_c('overlay-source',{staticClass:"site-nav-list site-nav-list-root",attrs:{"tag-name":"ul","to":"mb-site-nav"}},[_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-0",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('a',{attrs:{"href":"/test_site/index.html"}},[_v("Home 🏠")])])]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-0",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('a',{attrs:{"href":"/test_site/bugs/index.html"}},[_v("Open Bugs 🐛")])])]),_v(" "),_c('li',{staticClass:"site-nav-custom-list-item site-nav-list-item-0"},[_c('h3',{attrs:{"id":"testing-site-nav"}},[_v("Testing Site-Nav"),_c('a',{staticClass:"fa fa-anchor",attrs:{"href":"#testing-site-nav","onclick":"event.stopPropagation()"}})])]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-0",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('strong',[_v("Dropdown ")]),_v(" "),_c('span',{staticClass:"glyphicon glyphicon-search",attrs:{"aria-hidden":"true"}}),_v(" title ✏️ "),_v(" "),_c('div',{staticClass:"site-nav-dropdown-btn-container"},[_c('i',{staticClass:"site-nav-dropdown-btn-icon site-nav-rotate-icon",attrs:{"onclick":"handleSiteNavClick(this.parentNode.parentNode, false); event.stopPropagation();"}},[_c('span',{staticClass:"glyphicon glyphicon-menu-down",attrs:{"aria-hidden":"true"}})])])]),_c('ul',{staticClass:"site-nav-dropdown-container site-nav-dropdown-container-open site-nav-list"},[_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-1",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('a',{attrs:{"href":"https://www.google.com/"}},[_v("Dropdown link one")])])]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-1",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('a',{attrs:{"href":"https://www.google.com/"}},[_v("Html within site-nav "),_c('span',{staticStyle:{"color":"red"}},[_v("should")]),_v(" be displayed properly")])])]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-1",attrs:{"onclick":"handleSiteNavClick(this)"}},[_v("Nested Dropdown title 📐\n\n"),_c('div',{staticClass:"site-nav-dropdown-btn-container"},[_c('i',{staticClass:"site-nav-dropdown-btn-icon",attrs:{"onclick":"handleSiteNavClick(this.parentNode.parentNode, false); event.stopPropagation();"}},[_c('span',{staticClass:"glyphicon glyphicon-menu-down",attrs:{"aria-hidden":"true"}})])])]),_c('ul',{staticClass:"site-nav-dropdown-container site-nav-list"},[_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-2",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('a',{attrs:{"href":"https://www.google.com/"}},[_c('strong',[_v("Nested")]),_v(" Dropdown link one")])])]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-2",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('a',{attrs:{"href":"https://www.google.com/"}},[_c('strong',[_v("Nested")]),_v(" Dropdown link two")])])])])]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-1",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('a',{attrs:{"href":"https://www.google.com/"}},[_v("Dropdown link two")])])])])]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-0",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('a',{attrs:{"href":"https://www.google.com/"}},[_c('mark',[_v("Third Link")]),_v(" 📋")])])]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-0",attrs:{"onclick":"handleSiteNavClick(this)"}},[_v("Filler text "),_c('a',{attrs:{"href":"https://www.youtube.com/"}},[_c('span',{staticClass:"glyphicon glyphicon-facetime-video",attrs:{"aria-hidden":"true"}}),_v(" Youtube 📺")]),_v(" filler text"),_v(" "),_c('div',{staticClass:"site-nav-dropdown-btn-container"},[_c('i',{staticClass:"site-nav-dropdown-btn-icon",attrs:{"onclick":"handleSiteNavClick(this.parentNode.parentNode, false); event.stopPropagation();"}},[_c('span',{staticClass:"glyphicon glyphicon-menu-down",attrs:{"aria-hidden":"true"}})])])]),_c('ul',{staticClass:"site-nav-dropdown-container site-nav-list"},[_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-1",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('a',{attrs:{"href":"https://www.youtube.com/watch?v=dQw4w9WgXcQ"}},[_v("The answer to everything in the universe")])])]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-1",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('mark',[_v("Dropdown title")]),_v(" "),_c('span',{staticClass:"glyphicon glyphicon-comment",attrs:{"aria-hidden":"true"}}),_v(" ✏️ "),_v(" "),_c('div',{staticClass:"site-nav-dropdown-btn-container"},[_c('i',{staticClass:"site-nav-dropdown-btn-icon site-nav-rotate-icon",attrs:{"onclick":"handleSiteNavClick(this.parentNode.parentNode, false); event.stopPropagation();"}},[_c('span',{staticClass:"glyphicon glyphicon-menu-down",attrs:{"aria-hidden":"true"}})])])]),_c('ul',{staticClass:"site-nav-dropdown-container site-nav-dropdown-container-open site-nav-list"},[_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-2",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('a',{attrs:{"href":"https://www.google.com/"}},[_c('strong',[_v("Nested")]),_v(" Dropdown link one")])])])])])])]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-0",attrs:{"onclick":"handleSiteNavClick(this)"}},[_v("Really Long Dropdown Title Really Long Dropdown Title Really Long Dropdown Title Really Long Dropdown\n\n"),_c('div',{staticClass:"site-nav-dropdown-btn-container"},[_c('i',{staticClass:"site-nav-dropdown-btn-icon",attrs:{"onclick":"handleSiteNavClick(this.parentNode.parentNode, false); event.stopPropagation();"}},[_c('span',{staticClass:"glyphicon glyphicon-menu-down",attrs:{"aria-hidden":"true"}})])])]),_c('ul',{staticClass:"site-nav-dropdown-container site-nav-list"},[_c('li',{staticClass:"site-nav-custom-list-item site-nav-list-item-1"},[_v("Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text Really Really Long Text")]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-1",attrs:{"onclick":"handleSiteNavClick(this)"}},[_v("Nested Dropdown Title\n\n"),_c('div',{staticClass:"site-nav-dropdown-btn-container"},[_c('i',{staticClass:"site-nav-dropdown-btn-icon",attrs:{"onclick":"handleSiteNavClick(this.parentNode.parentNode, false); event.stopPropagation();"}},[_c('span',{staticClass:"glyphicon glyphicon-menu-down",attrs:{"aria-hidden":"true"}})])])]),_c('ul',{staticClass:"site-nav-dropdown-container site-nav-list"},[_c('li',{staticClass:"site-nav-custom-list-item site-nav-list-item-2"},[_v("Hello Doge Hello Doge 🐶")]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-2",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('a',{attrs:{"href":"/test_site/index.html"}},[_c('strong',[_v("NESTED LINK")]),_v(" Home 🏠")])])]),_v(" "),_c('li',{staticClass:"site-nav-custom-list-item site-nav-list-item-2"},[_v("Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit Text cut off from height limit")])])])])]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-0",attrs:{"onclick":"handleSiteNavClick(this)"}},[_v("Test line break in navigation layout\n\n"),_c('div',{staticClass:"site-nav-dropdown-btn-container"},[_c('i',{staticClass:"site-nav-dropdown-btn-icon",attrs:{"onclick":"handleSiteNavClick(this.parentNode.parentNode, false); event.stopPropagation();"}},[_c('span',{staticClass:"glyphicon glyphicon-menu-down",attrs:{"aria-hidden":"true"}})])])]),_c('ul',{staticClass:"site-nav-dropdown-container site-nav-list"},[_c('li',{staticClass:"site-nav-custom-list-item site-nav-list-item-1"},[_v("Nested line break text ✂️")]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-1",attrs:{"onclick":"handleSiteNavClick(this)"}},[_c('a',{attrs:{"href":"/test_site/index.html"}},[_v("Nested line break href")]),_v(" "),_c('div',{staticClass:"site-nav-dropdown-btn-container"},[_c('i',{staticClass:"site-nav-dropdown-btn-icon",attrs:{"onclick":"handleSiteNavClick(this.parentNode.parentNode, false); event.stopPropagation();"}},[_c('span',{staticClass:"glyphicon glyphicon-menu-down",attrs:{"aria-hidden":"true"}})])])]),_c('ul',{staticClass:"site-nav-dropdown-container site-nav-list"},[_c('li',{staticClass:"site-nav-custom-list-item site-nav-list-item-2"},[_v("Nested Nested line break text ✂️")])])]),_v(" "),_c('li',[_c('div',{staticClass:"site-nav-default-list-item site-nav-list-item-1",attrs:{"onclick":"handleSiteNavClick(this)"}},[_v("Nested line break dropdown menu\n\n"),_c('div',{staticClass:"site-nav-dropdown-btn-container"},[_c('i',{staticClass:"site-nav-dropdown-btn-icon",attrs:{"onclick":"handleSiteNavClick(this.parentNode.parentNode, false); event.stopPropagation();"}},[_c('span',{staticClass:"glyphicon glyphicon-menu-down",attrs:{"aria-hidden":"true"}})])])]),_c('ul',{staticClass:"site-nav-dropdown-container site-nav-list"},[_c('li',{staticClass:"site-nav-custom-list-item site-nav-list-item-2"},[_v("Line break item 2 📘")])])])])])])],1)],1)])]),_v(" "),_c('div',{attrs:{"id":"content-wrapper"}},[_c('breadcrumb'),_v(" "),_m(2),_v(" "),_m(3),_v(" "),_m(4),_v(" "),_m(5),_v(" "),_m(6),_v(" "),_m(7),_v(" "),_m(8),_v(" "),_m(9),_v(" "),_m(10),_v(" "),_m(11),_v(" "),_m(12),_v(" "),_m(13),_v(" "),_m(14),_v(" "),_m(15),_v(" "),_m(16),_v(" "),_m(17),_v(" "),_m(18),_v(" "),_m(19),_v(" "),_m(20),_v(" "),_m(21),_v(" "),_m(22),_v(" "),_m(23),_v(" "),_m(24),_v(" "),_m(25),_v(" "),_m(26),_v(" "),_m(27),_v(" "),_m(28),_v(" "),_m(29),_v(" "),_m(30),_v(" "),_m(31),_v(" "),_m(32),_v(" "),_m(33),_v(" "),_m(34),_v(" "),_m(35),_v(" "),_m(36),_v(" "),_m(37),_v(" "),_m(38),_v(" "),_m(39),_v(" "),_m(40),_v(" "),_m(41),_v(" "),_m(42),_v(" "),_m(43),_v(" "),_m(44),_v(" "),_m(45),_v(" "),_m(46),_v(" "),_m(47),_v(" "),_m(48),_v(" "),_m(49),_v(" "),_m(50),_v(" "),_m(51),_v(" "),_m(52),_v(" "),_m(53),_v(" "),_m(54),_v(" "),_m(55),_v(" "),_m(56),_v(" "),_m(57),_v(" "),_m(58),_v(" "),_m(59),_v(" "),_m(60),_v(" "),_m(61),_v(" "),_m(62),_v(" "),_m(63),_v(" "),_m(64),_v(" "),_m(65)],1),_v(" "),_c('overlay-source',{attrs:{"id":"page-nav","tag-name":"nav","to":"page-nav"}},[_c('div',{staticClass:"nav-component slim-scroll"})]),_v(" "),_c('scroll-top-button')],1),_v(" "),_m(66)])} }; var pageVueStaticRenderFns = [function anonymous( ) { @@ -23,6 +23,12 @@ with(this){return _c('ol',[_c('li',[_v("One item with customization icon")])])} with(this){return _c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"glyphicon glyphicon-education",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Only 1 item")])])])} },function anonymous( ) { +with(this){return _c('ol',[_c('li',[_v("One item with once customization")])])} +},function anonymous( +) { +with(this){return _c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"glyphicon glyphicon-education",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Only 1 item")])])])} +},function anonymous( +) { with(this){return _c('ol',[_c('li',[_v("One item with customization text")])])} },function anonymous( ) { @@ -41,6 +47,12 @@ with(this){return _c('ol',[_c('li',[_v("One item + nested list with icon customi with(this){return _c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"glyphicon glyphicon-education",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Only 1 item\n"),_c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"glyphicon glyphicon-education",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Only 1 item")])])])])])])} },function anonymous( ) { +with(this){return _c('ol',[_c('li',[_v("One item + nested list with once customization")])])} +},function anonymous( +) { +with(this){return _c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"glyphicon glyphicon-education",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Only 1 item\n"),_c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"glyphicon glyphicon-education",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Only 1 item")])])])])])])} +},function anonymous( +) { with(this){return _c('ol',[_c('li',[_v("One item + nested list with text customization")])])} },function anonymous( ) { @@ -113,6 +125,84 @@ with(this){return _c('ol',[_c('li',[_v("Every second list item customized")])])} with(this){return _c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"glyphicon glyphicon-education text-primary",staticStyle:{"font-size":"20px","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item A")])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"glyphicon glyphicon-education text-primary",staticStyle:{"font-size":"20px","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item B\n"),_c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"fas fa-file-code text-success",staticStyle:{"font-size":"30px","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Sub-item B1")])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"fas fa-file-code text-success",staticStyle:{"font-size":"30px","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Sub-item B2")])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticStyle:{"padding-bottom":"0.3em","padding-top":"0.3em","font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"}},[_c('img',{staticClass:"text-warning",staticStyle:{"width":"200px","height":"100px","display":"inline-block"},attrs:{"src":"/test_site/images/deer.jpg","alt":"Icon"}}),_v("​​")]),_c('div',[_v("Sub-item B3")])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticStyle:{"padding-bottom":"0.3em","padding-top":"0.3em","font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"}},[_c('img',{staticClass:"text-warning",staticStyle:{"width":"200px","height":"100px","display":"inline-block"},attrs:{"src":"/test_site/images/deer.jpg","alt":"Icon"}}),_v("​​")]),_c('div',[_v("Sub-item B4")])])])])])])} },function anonymous( ) { +with(this){return _c('ol',[_c('li',[_v("Once + none + customization")])])} +},function anonymous( +) { +with(this){return _c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"glyphicon glyphicon-education",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item A")])]),_v(" "),_c('li',[_v("Item B\n"),_c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"fas fa-file-code",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Sub-item B1")])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"fas fa-file-code",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Sub-item B2")])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"fas fa-file-code",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Sub-item B3\n"),_c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticStyle:{"padding-bottom":"0.3em","padding-top":"0.3em","font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"}},[_c('img',{staticStyle:{"width":"50px","display":"inline-block"},attrs:{"src":"/test_site/images/deer.jpg","alt":"Icon"}}),_v("​​")]),_c('div',[_v("Sub-sub-item B3.1")])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticStyle:{"padding-bottom":"0.3em","padding-top":"0.3em","font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"}},[_c('img',{staticStyle:{"width":"50px","display":"inline-block"},attrs:{"src":"/test_site/images/deer.jpg","alt":"Icon"}}),_v("​​")]),_c('div',[_v("Sub-sub-item B3.2")])])])])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"fas fa-file-code",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Sub-item B4")])])])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"fas fa-file-code",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item C")])])])} +},function anonymous( +) { +with(this){return _c('ol',[_c('li',[_v("Customization + none + once")])])} +},function anonymous( +) { +with(this){return _c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"fas fa-file-code",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item A")])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"fas fa-file-code",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item B\n"),_c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"fas fa-file-code",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Sub-item B1")])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"fas fa-file-code",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Sub-item B2")])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"fas fa-file-code",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Sub-item B3\n"),_c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticStyle:{"padding-bottom":"0.3em","padding-top":"0.3em","font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"}},[_c('img',{staticStyle:{"width":"50px","display":"inline-block"},attrs:{"src":"/test_site/images/deer.jpg","alt":"Icon"}}),_v("​​")]),_c('div',[_v("Sub-sub-item B3.1")])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticStyle:{"padding-bottom":"0.3em","padding-top":"0.3em","font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"}},[_c('img',{staticStyle:{"width":"50px","display":"inline-block"},attrs:{"src":"/test_site/images/deer.jpg","alt":"Icon"}}),_v("​​")]),_c('div',[_v("Sub-sub-item B3.2")])])])])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"fas fa-file-code",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Sub-item B4")])])])])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"glyphicon glyphicon-education",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item C")])])])} +},function anonymous( +) { +with(this){return _c('ol',[_c('li',[_v("Customization + once + none")])])} +},function anonymous( +) { +with(this){return _c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"fas fa-file-code",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item A")])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"glyphicon glyphicon-education",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item B\n"),_c('ul',[_c('li',[_v("Sub-item B1")]),_v(" "),_c('li',[_v("Sub-item B2")]),_v(" "),_c('li',[_v("Sub-item B3\n"),_c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticStyle:{"padding-bottom":"0.3em","padding-top":"0.3em","font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"}},[_c('img',{staticStyle:{"width":"50px","display":"inline-block"},attrs:{"src":"/test_site/images/deer.jpg","alt":"Icon"}}),_v("​​")]),_c('div',[_v("Sub-sub-item B3.1")])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticStyle:{"padding-bottom":"0.3em","padding-top":"0.3em","font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"}},[_c('img',{staticStyle:{"width":"50px","display":"inline-block"},attrs:{"src":"/test_site/images/deer.jpg","alt":"Icon"}}),_v("​​")]),_c('div',[_v("Sub-sub-item B3.2")])])])]),_v(" "),_c('li',[_v("Sub-item B4")])])])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"fas fa-file-code",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item C")])])])} +},function anonymous( +) { +with(this){return _c('ol',[_c('li',[_v("Once + customization + none")])])} +},function anonymous( +) { +with(this){return _c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"glyphicon glyphicon-education",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item A")])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"fas fa-file-code",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item B\n"),_c('ul',[_c('li',[_v("Sub-item B1")]),_v(" "),_c('li',[_v("Sub-item B2")]),_v(" "),_c('li',[_v("Sub-item B3\n"),_c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticStyle:{"padding-bottom":"0.3em","padding-top":"0.3em","font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"}},[_c('img',{staticStyle:{"width":"50px","display":"inline-block"},attrs:{"src":"/test_site/images/deer.jpg","alt":"Icon"}}),_v("​​")]),_c('div',[_v("Sub-sub-item B3.1")])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticStyle:{"padding-bottom":"0.3em","padding-top":"0.3em","font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"}},[_c('img',{staticStyle:{"width":"50px","display":"inline-block"},attrs:{"src":"/test_site/images/deer.jpg","alt":"Icon"}}),_v("​​")]),_c('div',[_v("Sub-sub-item B3.2")])])])]),_v(" "),_c('li',[_v("Sub-item B4")])])])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"fas fa-file-code",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item C")])])])} +},function anonymous( +) { +with(this){return _c('ol',[_c('li',[_v("None + customization + once")])])} +},function anonymous( +) { +with(this){return _c('ul',[_c('li',[_v("Item A")]),_v(" "),_c('li',{attrs:{"icon":"fas-file-code"}},[_v("Item B\n"),_c('ul',[_c('li',[_v("Sub-item B1")]),_v(" "),_c('li',[_v("Sub-item B2")]),_v(" "),_c('li',[_v("Sub-item B3\n"),_c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticStyle:{"padding-bottom":"0.3em","padding-top":"0.3em","font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"}},[_c('img',{staticStyle:{"width":"50px","display":"inline-block"},attrs:{"src":"/test_site/images/deer.jpg","alt":"Icon"}}),_v("​​")]),_c('div',[_v("Sub-sub-item B3.1")])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticStyle:{"padding-bottom":"0.3em","padding-top":"0.3em","font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"}},[_c('img',{staticStyle:{"width":"50px","display":"inline-block"},attrs:{"src":"/test_site/images/deer.jpg","alt":"Icon"}}),_v("​​")]),_c('div',[_v("Sub-sub-item B3.2")])])])]),_v(" "),_c('li',[_v("Sub-item B4")])])]),_v(" "),_c('li',{attrs:{"icon":"glyphicon-education","once":"true"}},[_v("Item C")])])} +},function anonymous( +) { +with(this){return _c('ol',[_c('li',[_v("None + once + customization")])])} +},function anonymous( +) { +with(this){return _c('ul',[_c('li',[_v("Item A")]),_v(" "),_c('li',{attrs:{"icon":"glyphicon-education","once":"true"}},[_v("Item B\n"),_c('ul',[_c('li',[_v("Sub-item B1")]),_v(" "),_c('li',[_v("Sub-item B2")]),_v(" "),_c('li',[_v("Sub-item B3\n"),_c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticStyle:{"padding-bottom":"0.3em","padding-top":"0.3em","font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"}},[_c('img',{staticStyle:{"width":"50px","display":"inline-block"},attrs:{"src":"/test_site/images/deer.jpg","alt":"Icon"}}),_v("​​")]),_c('div',[_v("Sub-sub-item B3.1")])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticStyle:{"padding-bottom":"0.3em","padding-top":"0.3em","font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"}},[_c('img',{staticStyle:{"width":"50px","display":"inline-block"},attrs:{"src":"/test_site/images/deer.jpg","alt":"Icon"}}),_v("​​")]),_c('div',[_v("Sub-sub-item B3.2")])])])]),_v(" "),_c('li',[_v("Sub-item B4")])])]),_v(" "),_c('li',{attrs:{"icon":"fas-file-code"}},[_v("Item C")])])} +},function anonymous( +) { +with(this){return _c('ol',[_c('li',[_v("Customization + once + customization")])])} +},function anonymous( +) { +with(this){return _c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"fas fa-file-code",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item A")])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"glyphicon glyphicon-education",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item B\n"),_c('ul',[_c('li',[_v("Sub-item B1")]),_v(" "),_c('li',[_v("Sub-item B2")]),_v(" "),_c('li',[_v("Sub-item B3\n"),_c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticStyle:{"padding-bottom":"0.3em","padding-top":"0.3em","font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"}},[_c('img',{staticStyle:{"width":"50px","display":"inline-block"},attrs:{"src":"/test_site/images/deer.jpg","alt":"Icon"}}),_v("​​")]),_c('div',[_v("Sub-sub-item B3.1")])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticStyle:{"padding-bottom":"0.3em","padding-top":"0.3em","font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"}},[_c('img',{staticStyle:{"width":"50px","display":"inline-block"},attrs:{"src":"/test_site/images/deer.jpg","alt":"Icon"}}),_v("​​")]),_c('div',[_v("Sub-sub-item B3.2")])])])]),_v(" "),_c('li',[_v("Sub-item B4")])])])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticStyle:{"padding-bottom":"0.3em","padding-top":"0.3em","font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"}},[_c('img',{staticStyle:{"width":"50px","display":"inline-block"},attrs:{"src":"/test_site/images/deer.jpg","alt":"Icon"}}),_v("​​")]),_c('div',[_v("Item C")])])])} +},function anonymous( +) { +with(this){return _c('ol',[_c('li',[_v("String once")])])} +},function anonymous( +) { +with(this){return _c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"glyphicon glyphicon-education",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item A")])]),_v(" "),_c('li',[_v("Item B\n"),_c('ul',[_c('li',[_v("Sub-item B1")]),_v(" "),_c('li',[_v("Sub-item B2")]),_v(" "),_c('li',[_v("Sub-item B3\n"),_c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticStyle:{"padding-bottom":"0.3em","padding-top":"0.3em","font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"}},[_c('img',{staticStyle:{"width":"50px","display":"inline-block"},attrs:{"src":"/test_site/images/deer.jpg","alt":"Icon"}}),_v("​​")]),_c('div',[_v("Sub-sub-item B3.1")])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticStyle:{"padding-bottom":"0.3em","padding-top":"0.3em","font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"}},[_c('img',{staticStyle:{"width":"50px","display":"inline-block"},attrs:{"src":"/test_site/images/deer.jpg","alt":"Icon"}}),_v("​​")]),_c('div',[_v("Sub-sub-item B3.2")])])])]),_v(" "),_c('li',[_v("Sub-item B4")])])]),_v(" "),_c('li',[_v("Item C")])])} +},function anonymous( +) { +with(this){return _c('ol',[_c('li',[_v("False once for item A, rest of items will inherit")])])} +},function anonymous( +) { +with(this){return _c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"glyphicon glyphicon-education",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item A")])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"glyphicon glyphicon-education",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item B\n"),_c('ul',[_c('li',[_v("Sub-item B1")]),_v(" "),_c('li',[_v("Sub-item B2")]),_v(" "),_c('li',[_v("Sub-item B3\n"),_c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticStyle:{"padding-bottom":"0.3em","padding-top":"0.3em","font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"}},[_c('img',{staticStyle:{"width":"50px","display":"inline-block"},attrs:{"src":"/test_site/images/deer.jpg","alt":"Icon"}}),_v("​​")]),_c('div',[_v("Sub-sub-item B3.1")])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticStyle:{"padding-bottom":"0.3em","padding-top":"0.3em","font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"}},[_c('img',{staticStyle:{"width":"50px","display":"inline-block"},attrs:{"src":"/test_site/images/deer.jpg","alt":"Icon"}}),_v("​​")]),_c('div',[_v("Sub-sub-item B3.2")])])])]),_v(" "),_c('li',[_v("Sub-item B4")])])])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"glyphicon glyphicon-education",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item C")])])])} +},function anonymous( +) { +with(this){return _c('ol',[_c('li',[_v("False once for item B, will overwrite item A")])])} +},function anonymous( +) { +with(this){return _c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"fas fa-file-code",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item A")])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"glyphicon glyphicon-education",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item B\n"),_c('ul',[_c('li',[_v("Sub-item B1")]),_v(" "),_c('li',[_v("Sub-item B2")]),_v(" "),_c('li',[_v("Sub-item B3\n"),_c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticStyle:{"padding-bottom":"0.3em","padding-top":"0.3em","font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"}},[_c('img',{staticStyle:{"width":"50px","display":"inline-block"},attrs:{"src":"/test_site/images/deer.jpg","alt":"Icon"}}),_v("​​")]),_c('div',[_v("Sub-sub-item B3.1")])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticStyle:{"padding-bottom":"0.3em","padding-top":"0.3em","font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"}},[_c('img',{staticStyle:{"width":"50px","display":"inline-block"},attrs:{"src":"/test_site/images/deer.jpg","alt":"Icon"}}),_v("​​")]),_c('div',[_v("Sub-sub-item B3.2")])])])]),_v(" "),_c('li',[_v("Sub-item B4")])])])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"glyphicon glyphicon-education",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item C")])])])} +},function anonymous( +) { +with(this){return _c('ol',[_c('li',[_v("Once for specific attributes besides icon, does not overwrite")])])} +},function anonymous( +) { +with(this){return _c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"glyphicon glyphicon-education text-primary",staticStyle:{"font-size":"70px","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item A")])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"glyphicon glyphicon-education text-primary",staticStyle:{"font-size":"40px","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item B\n"),_c('ul',[_c('li',[_v("Sub-item B1")])])])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"glyphicon glyphicon-education text-primary",staticStyle:{"font-size":"70px","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item C")])])])} +},function anonymous( +) { +with(this){return _c('ol',[_c('li',[_v("False once for specific attributes besides icon, does overwrite")])])} +},function anonymous( +) { +with(this){return _c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"glyphicon glyphicon-education text-primary",staticStyle:{"font-size":"70px","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item A")])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"glyphicon glyphicon-education text-primary",staticStyle:{"font-size":"40px","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item B\n"),_c('ul',[_c('li',[_v("Sub-item B1")])])])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"glyphicon glyphicon-education text-primary",staticStyle:{"font-size":"40px","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Item C")])])])} +},function anonymous( +) { +with(this){return _c('ol',[_c('li',[_v("Sub-level")])])} +},function anonymous( +) { +with(this){return _c('ul',[_c('li',[_v("Item A")]),_v(" "),_c('li',[_v("Item B\n"),_c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"glyphicon glyphicon-education",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Sub-item B1")])]),_v(" "),_c('li',[_v("Sub-item B2")]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"fas fa-file-code",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Sub-item B3\n"),_c('ul',{staticStyle:{"list-style-type":"none","padding-inline-start":"0px"}},[_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticStyle:{"padding-bottom":"0.3em","padding-top":"0.3em","font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"}},[_c('img',{staticStyle:{"width":"50px","display":"inline-block"},attrs:{"src":"/test_site/images/deer.jpg","alt":"Icon"}}),_v("​​")]),_c('div',[_v("Sub-sub-item B3.1")])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticStyle:{"padding-bottom":"0.3em","padding-top":"0.3em","font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"}},[_c('img',{staticStyle:{"width":"50px","display":"inline-block"},attrs:{"src":"/test_site/images/deer.jpg","alt":"Icon"}}),_v("​​")]),_c('div',[_v("Sub-sub-item B3.2")])])])])]),_v(" "),_c('li',{staticStyle:{"display":"flex"}},[_c('span',{staticClass:"fas fa-file-code",staticStyle:{"font-size":"unset","min-width":"16px","line-height":"unset","margin-inline-end":"0.35em","align-self":"flex-start","flex-shrink":"0"},attrs:{"aria-hidden":"true"}},[_v("​")]),_c('div',[_v("Sub-item B4")])])])]),_v(" "),_c('li',{attrs:{"icon":"./images/deer.jpg","i-width":"50px"}},[_v("Item C")])])} +},function anonymous( +) { with(this){return _c('div',[_c('footer',[_c('h1',{attrs:{"id":"heading-in-footer-should-not-be-indexed"}},[_v("Heading in footer should not be indexed"),_c('a',{staticClass:"fa fa-anchor",attrs:{"href":"#heading-in-footer-should-not-be-indexed","onclick":"event.stopPropagation()"}})]),_v(" "),_c('div',{staticClass:"text-center"},[_v("\n This is a dynamic height footer that supports markdown "),_c('span',[_v("😄")]),_v("!\n ")])])])} }]; \ No newline at end of file diff --git a/packages/cli/test/functional/test_site/testList.md b/packages/cli/test/functional/test_site/testList.md index 584f024874..a83d8b378e 100644 --- a/packages/cli/test/functional/test_site/testList.md +++ b/packages/cli/test/functional/test_site/testList.md @@ -4,6 +4,9 @@ 1. One item with customization icon - Only 1 item { icon="glyphicon-education" } +1. One item with once customization +- Only 1 item { icon="glyphicon-education" once=true } + 1. One item with customization text - Only 1 item { text="Step 1" } @@ -15,6 +18,10 @@ - Only 1 item { icon="glyphicon-education" } - Only 1 item { icon="glyphicon-education" } +1. One item + nested list with once customization +- Only 1 item { icon="glyphicon-education" once=true } + - Only 1 item { icon="glyphicon-education" once=true } + 1. One item + nested list with text customization - Only 1 item { text="Step 1" } - Only 1 item { text="Step 1.1" } @@ -136,3 +143,137 @@ * Sub-item B2 * Sub-item B3 {icon="./images/deer.jpg" i-width="200px" i-height="100px" i-class="text-warning"} * Sub-item B4 + +1. Once + none + customization +* Item A { icon="glyphicon-education" once=true } +* Item B + * Sub-item B1 { icon="fas-file-code" } + * Sub-item B2 + * Sub-item B3 + * Sub-sub-item B3.1 { icon="./images/deer.jpg" i-width="50px" } + * Sub-sub-item B3.2 + * Sub-item B4 +* Item C { icon="fas-file-code" } + +1. Customization + none + once +* Item A { icon="fas-file-code" } +* Item B + * Sub-item B1 { icon="fas-file-code" } + * Sub-item B2 + * Sub-item B3 + * Sub-sub-item B3.1 { icon="./images/deer.jpg" i-width="50px" } + * Sub-sub-item B3.2 + * Sub-item B4 +* Item C { icon="glyphicon-education" once=true } + +1. Customization + once + none +* Item A { icon="fas-file-code" } +* Item B { icon="glyphicon-education" once=true } + * Sub-item B1 + * Sub-item B2 + * Sub-item B3 + * Sub-sub-item B3.1 { icon="./images/deer.jpg" i-width="50px" } + * Sub-sub-item B3.2 + * Sub-item B4 +* Item C + +1. Once + customization + none +* Item A { icon="glyphicon-education" once=true } +* Item B { icon="fas-file-code" } + * Sub-item B1 + * Sub-item B2 + * Sub-item B3 + * Sub-sub-item B3.1 { icon="./images/deer.jpg" i-width="50px" } + * Sub-sub-item B3.2 + * Sub-item B4 +* Item C + +1. None + customization + once +* Item A +* Item B { icon="fas-file-code" } + * Sub-item B1 + * Sub-item B2 + * Sub-item B3 + * Sub-sub-item B3.1 { icon="./images/deer.jpg" i-width="50px" } + * Sub-sub-item B3.2 + * Sub-item B4 +* Item C { icon="glyphicon-education" once=true } + +1. None + once + customization +* Item A +* Item B { icon="glyphicon-education" once=true } + * Sub-item B1 + * Sub-item B2 + * Sub-item B3 + * Sub-sub-item B3.1 { icon="./images/deer.jpg" i-width="50px" } + * Sub-sub-item B3.2 + * Sub-item B4 +* Item C { icon="fas-file-code" } + +1. Customization + once + customization +* Item A { icon="fas-file-code" } +* Item B { icon="glyphicon-education" once=true } + * Sub-item B1 + * Sub-item B2 + * Sub-item B3 + * Sub-sub-item B3.1 { icon="./images/deer.jpg" i-width="50px" } + * Sub-sub-item B3.2 + * Sub-item B4 +* Item C { icon="./images/deer.jpg" i-width="50px" } + +1. String once +* Item A { icon="glyphicon-education" once="true" } +* Item B + * Sub-item B1 + * Sub-item B2 + * Sub-item B3 + * Sub-sub-item B3.1 { icon="./images/deer.jpg" i-width="50px" } + * Sub-sub-item B3.2 + * Sub-item B4 +* Item C + +1. False once for item A, rest of items will inherit +* Item A { icon="glyphicon-education" once=false } +* Item B + * Sub-item B1 + * Sub-item B2 + * Sub-item B3 + * Sub-sub-item B3.1 { icon="./images/deer.jpg" i-width="50px" } + * Sub-sub-item B3.2 + * Sub-item B4 +* Item C + + +1. False once for item B, will overwrite item A +* Item A { icon="fas-file-code" } +* Item B { icon="glyphicon-education" once=false } + * Sub-item B1 + * Sub-item B2 + * Sub-item B3 + * Sub-sub-item B3.1 { icon="./images/deer.jpg" i-width="50px" } + * Sub-sub-item B3.2 + * Sub-item B4 +* Item C + +1. Once for specific attributes besides icon, does not overwrite +* Item A { icon="glyphicon-education" i-size="70px" i-class="text-primary" } +* Item B { i-size="40px" once=true } + * Sub-item B1 +* Item C + +1. False once for specific attributes besides icon, does overwrite +* Item A { icon="glyphicon-education" i-size="70px" i-class="text-primary" } +* Item B { i-size="40px" once=false } + * Sub-item B1 +* Item C + +1. Sub-level +* Item A +* Item B + * Sub-item B1 { icon="glyphicon-education" once=true } + * Sub-item B2 + * Sub-item B3 { icon="fas-file-code" } + * Sub-sub-item B3.1 { icon="./images/deer.jpg" i-width="50px" } + * Sub-sub-item B3.2 + * Sub-item B4 +* Item C { icon="./images/deer.jpg" i-width="50px" } diff --git a/packages/core/src/html/CustomListIconProcessor.ts b/packages/core/src/html/CustomListIconProcessor.ts index b574ead3a4..7be0629510 100644 --- a/packages/core/src/html/CustomListIconProcessor.ts +++ b/packages/core/src/html/CustomListIconProcessor.ts @@ -9,9 +9,8 @@ interface EmojiData { } const emojiData = emojiDictionary as unknown as EmojiData; - const ICON_ATTRIBUTES - = ['icon', 'i-width', 'i-height', 'i-size', 'i-class', 'i-spacing', 'text', 't-size', 't-class']; + = ['icon', 'i-width', 'i-height', 'i-size', 'i-class', 'i-spacing', 'text', 't-size', 't-class', 'once']; interface IconAttributes { icon?: string; @@ -23,10 +22,12 @@ interface IconAttributes { textClassName?: string; textSize?: string; spacing?: string; + once?: boolean; } type IconAttributeDetail = { isFirst: boolean; + addIcons: boolean; iconAttrs: IconAttributes | null; }; @@ -110,8 +111,13 @@ function updateNodeStyle(node: NodeOrText) { }); } -// If an item has a specified icon, that icon will be used for it and for subsequent -// items at that level to prevent duplication of icons attribute declarations. +// If an item has a specified icon, that icon and its attributes will be saved and used +// for it and for subsequent items at that level to prevent duplication of icons +// attribute declarations. +// If once is true, its icons and/or attributes will only be used for that item. +// Items with once icons/attributes do not overwrite the previously saved icon/ +// attributes, meaning that subsequent items will still use the last saved +// icon/attributes. const getIconAttributes = (node: MbNode, renderMdInline: (text: string) => string, iconAttrsSoFar?: IconAttributes): IconAttributes | null => { @@ -134,6 +140,7 @@ IconAttributes | null => { : iconAttrsSoFar?.textClassName, textSize: node.attribs['t-size'] !== undefined ? node.attribs['t-size'] : iconAttrsSoFar?.textSize, spacing: node.attribs['i-spacing'] !== undefined ? node.attribs['i-spacing'] : iconAttrsSoFar?.spacing, + once: (node.attribs.once === true || node.attribs.once === 'true'), }; }; @@ -144,9 +151,6 @@ const deleteAttributes = (node: MbNode, attributes: string[]) => { }; function updateLi(node: MbNode, iconAttributes: IconAttributes, renderMdInline: (text: string) => string) { - if ( - iconAttributes.icon === undefined && iconAttributes.text === undefined - ) return; const curLiIcon = getIconAttributes(node, renderMdInline, iconAttributes); deleteAttributes(node, ICON_ATTRIBUTES); @@ -179,12 +183,43 @@ function updateLi(node: MbNode, iconAttributes: IconAttributes, renderMdInline: function handleLiNode(node: MbNode, iconAttrValue: IconAttributeDetail, renderMdInline: (text: string) => string) { if (iconAttrValue.isFirst) { - iconAttrValue.iconAttrs = getIconAttributes(node, renderMdInline); + const nodeIconAttrs = getIconAttributes(node, renderMdInline); + // Check if first item is customized with icon or text + if (nodeIconAttrs?.icon !== undefined || nodeIconAttrs?.text !== undefined) { + iconAttrValue.addIcons = true; + } + // Save if the icon is not once + if (!nodeIconAttrs?.once) { + iconAttrValue.iconAttrs = nodeIconAttrs; + } iconAttrValue.isFirst = false; } else if (iconAttrValue.iconAttrs) { - iconAttrValue.iconAttrs = getIconAttributes(node, renderMdInline, iconAttrValue.iconAttrs); + const nodeIconAttrs = getIconAttributes(node, renderMdInline, iconAttrValue.iconAttrs); + // Save if there is icon or text, and not once + if ((nodeIconAttrs?.icon !== undefined || nodeIconAttrs?.text !== undefined) && !nodeIconAttrs?.once) { + iconAttrValue.iconAttrs = nodeIconAttrs; + } + } + if (!iconAttrValue.addIcons) { + return; + } + // for subsequent items, if first item is once, there is no previous icon + // so future attributes that are not once will need to be saved + if (iconAttrValue.iconAttrs?.icon === undefined && iconAttrValue.iconAttrs?.text === undefined) { + // There is no previous icon and no previous text + const nodeIconAttrs = getIconAttributes(node, renderMdInline); + // Save if current item has icon or text, and it is not once + if ((nodeIconAttrs?.icon !== undefined || nodeIconAttrs?.text !== undefined) && !nodeIconAttrs?.once) { + iconAttrValue.iconAttrs = nodeIconAttrs; + } + } + + // update only if current item has icon/text or previous items have saved icon/text + const nodeIconAttrs = getIconAttributes(node, renderMdInline); + if (nodeIconAttrs?.icon !== undefined || iconAttrValue.iconAttrs?.icon !== undefined + || nodeIconAttrs?.text !== undefined || iconAttrValue.iconAttrs?.text !== undefined) { + updateLi(node, iconAttrValue.iconAttrs ?? {}, renderMdInline); } - updateLi(node, iconAttrValue.iconAttrs ?? {}, renderMdInline); } export function processUlNode(node: NodeOrText, renderMdInline: (text: string) => string) { @@ -197,7 +232,7 @@ export function processUlNode(node: NodeOrText, renderMdInline: (text: string) = const iconAttrs: IconAttributeDetail[] = []; function dfs(currentNode: NodeOrText, level: number) { if (!iconAttrs[level]) { - iconAttrs[level] = { isFirst: true, iconAttrs: null }; + iconAttrs[level] = { isFirst: true, addIcons: false, iconAttrs: null }; } const ulNode = currentNode as MbNode; @@ -217,7 +252,7 @@ export function processUlNode(node: NodeOrText, renderMdInline: (text: string) = } }); }); - if (iconAttrs[level].iconAttrs !== null) { + if (iconAttrs[level].addIcons) { updateNodeStyle(ulNode); } }