diff --git a/doc/templates/uno/component/navbar.scss b/doc/templates/uno/component/navbar.scss
index 888a39811a43..a517240fc971 100644
--- a/doc/templates/uno/component/navbar.scss
+++ b/doc/templates/uno/component/navbar.scss
@@ -133,9 +133,9 @@
       }
 
       /**
-       * has-children means there is a submenu
+       * menu-item-has-children means there is a submenu
        */
-      &.has-children {
+      &.menu-item-has-children {
         // actual submenu
         position: relative;
 
@@ -236,7 +236,7 @@
            * instead of on hover. This is to displays submenus as columns.
            */
           &:not([style*="display: none;"]) {
-            .has-children {
+            .menu-item-has-children {
               ul {
                 visibility: visible;
                 opacity: 1;
@@ -337,7 +337,7 @@
           width: 100%;
         }
 
-        &.has-children {
+        &.menu-item-has-children {
           position: relative;
 
           ul {
diff --git a/doc/templates/uno/main.js b/doc/templates/uno/main.js
index 61b81040e7c3..a60fa48d952d 100644
--- a/doc/templates/uno/main.js
+++ b/doc/templates/uno/main.js
@@ -12,7 +12,7 @@ document.addEventListener(
                 const t = e.target;
                 if (
                     window.innerWidth >= 980 ||
-                    !t.matches("#navbar .has-children a")
+                    !t.matches("#navbar .menu-item-has-children a")
                 )
                     return;
                 e.stopImmediatePropagation();
diff --git a/doc/templates/uno/styles/main.css b/doc/templates/uno/styles/main.css
index d75ab27c88da..e7d81fd4ae92 100644
--- a/doc/templates/uno/styles/main.css
+++ b/doc/templates/uno/styles/main.css
@@ -6,6 +6,6 @@
 .alert{background-color:transparent;border-color:#c4c4c4;color:#242424;padding:16px 16px;transition:transform .2s}.alert-hover:hover{transform:scale(1.05);border-color:#159bff;box-shadow:0 5px 10px 0 rgba(0,0,0,0.2)}.alert-hover:hover h4{color:#159bff}
 
 
-@media (min-width: 980px){.visibility-opacity-transition,#header-container nav>ul>li.has-children>ul,#header-container nav>ul>li.has-children>ul ul{visibility:hidden;opacity:0;transition:visibility 100ms, opacity 100ms ease-in-out;list-style:none}}#header-container{padding:16px 32px;z-index:9999;background:#fff;display:flex;position:fixed;width:100%;min-height:67px;max-height:67px;border-bottom:1px solid #f4f2f3;justify-content:space-between}#header-container::after,#header-container::before{content:none}#header-container #menu-menu-principal{float:right;list-style:none}@media (max-width: 1023.98px){#header-container #menu-menu-principal{width:100%;max-height:70vh;overflow-y:auto}}@media (min-width: 980px){#header-container #menu-menu-principal{display:flex}}#header-container #header-logo-container{width:36px;vertical-align:middle;z-index:9}#header-container #header-logo-container img{width:100%}@media (min-width: 980px){#header-container #header-logo-container{min-width:120px}}#header-container .navbar-toggle{padding:0;margin:10px 0;display:none !important;z-index:9}#header-container .navbar-toggle .icon-bar{background:#242424;width:20px}#header-container .navbar-toggle .icon-bar+.icon-bar{margin-top:3px}@media (max-width: 979px){#header-container .navbar-toggle{display:block !important}}#header-container .navbar-brand{height:auto}#header-container nav a{padding:10px;font-size:13px;font-weight:600;font-stretch:normal;font-style:normal;line-height:14px;letter-spacing:normal;text-transform:uppercase;color:#242424}#header-container nav a:hover,#header-container nav a:focus{color:#7a67f8}@media (min-width: 980px){#header-container nav a{font-size:19px;line-height:17px}}@media (min-width: 980px){#header-container nav>ul>li{margin:0 16px;align-self:center;min-width:-webkit-max-content;min-width:-moz-max-content;min-width:max-content}}#header-container nav>ul>li.has-children{position:relative}#header-container nav>ul>li.has-children>a::after{display:inline-block;text-rendering:auto;-webkit-font-smoothing:antialiased;font:normal normal normal 10px/1 FontAwesome;content:"\f078";line-height:12px;margin-left:12px;vertical-align:top}@media (min-width: 980px){#header-container nav>ul>li.has-children>a::after{line-height:21px;font:normal normal normal 15px/1 FontAwesome}}#header-container nav>ul>li.has-children>ul{width:100%}@media (min-width: 980px){#header-container nav>ul>li.has-children>ul{width:-webkit-max-content;width:-moz-max-content;width:max-content;display:flex;position:absolute;padding:20px;top:170% !important;left:-25% !important;flex-direction:column;box-shadow:0 0 20px 2px rgba(36,36,36,0.2);background-color:#fff}}#header-container nav>ul>li.has-children>ul li{display:flex;border-bottom:1px solid #EAF2F9;background:#fff}@media (min-width: 980px){#header-container nav>ul>li.has-children>ul li{border:none}}#header-container nav>ul>li.has-children>ul a{font-size:14px;font-weight:400;line-height:20px;text-transform:none;transition:0s}#header-container nav>ul>li.has-children>ul .column-title{flex-direction:column}#header-container nav>ul>li.has-children>ul .column-title>a{font-weight:700;line-height:normal !important}#header-container nav>ul>li.has-children>ul .column-title ul{width:192px;padding:0}#header-container nav>ul>li.has-children>ul ul{display:flex;position:inherit;flex-direction:column}#header-container nav>ul>li.has-children>ul ul a{border-left:0}#header-container nav>ul>li.has-children:hover>ul{visibility:visible;opacity:1}#header-container nav>ul>li.has-children:hover>ul:not([style*="display: none;"]) .has-children ul{visibility:visible;opacity:1}#header-container nav>ul>li.row-menu>ul{flex-direction:row}#header-container .get-started-btn a{display:block;border:none;border-radius:8px;margin-left:0;padding:8px 32px;font-size:16px;line-height:24px;font-weight:700;min-width:125px;text-align:center;text-transform:none;color:#242424;background-color:#67e5ad;background:linear-gradient(to top, #159bff 50%, #67e5ad 50%);background-size:100% 200%;background-position:left top;transition:all 0.5s cubic-bezier(0.69, 0.04, 0.9, 0.65)}#header-container .get-started-btn a:hover{color:#fff;background-position:bottom left}@media (max-width: 979px){#navbar{overflow:auto !important;position:fixed;width:100%;margin:-16px 0 0 0;padding:0;padding-top:67px;left:0;text-align:left;background:#EAF2F9;transition:height .4s ease .1s, opacity .6s ease;opacity:0}#navbar.collapse{height:67px !important;display:none !important}#navbar.collapse.in{display:block !important;height:100vh !important;opacity:1}#navbar .menu{display:block;margin:0;padding:0 0 10px 0}#navbar .menu li{display:block;padding:0}#navbar .menu li.get-started-btn{position:absolute;padding:0 16px;bottom:10%;width:100%}#navbar .menu li.has-children{position:relative}#navbar .menu li.has-children ul{position:relative;max-height:0;padding:0;overflow:hidden;transition:all .5s ease}#navbar .menu li.has-children.open ul{max-height:1500px}#navbar .menu a{display:block;padding:10px 25px}}.subnav{position:fixed;top:67px;width:100%;z-index:999;background-color:#f8f8f8}
+@media (min-width: 980px){.visibility-opacity-transition,#header-container nav>ul>li.menu-item-has-children>ul,#header-container nav>ul>li.menu-item-has-children>ul ul{visibility:hidden;opacity:0;transition:visibility 100ms, opacity 100ms ease-in-out;list-style:none}}#header-container{padding:16px 32px;z-index:9999;background:#fff;display:flex;position:fixed;width:100%;min-height:67px;max-height:67px;border-bottom:1px solid #f4f2f3;justify-content:space-between}#header-container::after,#header-container::before{content:none}#header-container #menu-menu-principal{float:right;list-style:none}@media (max-width: 1023.98px){#header-container #menu-menu-principal{width:100%;max-height:70vh;overflow-y:auto}}@media (min-width: 980px){#header-container #menu-menu-principal{display:flex}}#header-container #header-logo-container{width:36px;vertical-align:middle;z-index:9}#header-container #header-logo-container img{width:100%}@media (min-width: 980px){#header-container #header-logo-container{min-width:120px}}#header-container .navbar-toggle{padding:0;margin:10px 0;display:none !important;z-index:9}#header-container .navbar-toggle .icon-bar{background:#242424;width:20px}#header-container .navbar-toggle .icon-bar+.icon-bar{margin-top:3px}@media (max-width: 979px){#header-container .navbar-toggle{display:block !important}}#header-container .navbar-brand{height:auto}#header-container nav a{padding:10px;font-size:13px;font-weight:600;font-stretch:normal;font-style:normal;line-height:14px;letter-spacing:normal;text-transform:uppercase;color:#242424}#header-container nav a:hover,#header-container nav a:focus{color:#7a67f8}@media (min-width: 980px){#header-container nav a{font-size:19px;line-height:17px}}@media (min-width: 980px){#header-container nav>ul>li{margin:0 16px;align-self:center;min-width:-webkit-max-content;min-width:-moz-max-content;min-width:max-content}}#header-container nav>ul>li.menu-item-has-children{position:relative}#header-container nav>ul>li.menu-item-has-children>a::after{display:inline-block;text-rendering:auto;-webkit-font-smoothing:antialiased;font:normal normal normal 10px/1 FontAwesome;content:"\f078";line-height:12px;margin-left:12px;vertical-align:top}@media (min-width: 980px){#header-container nav>ul>li.menu-item-has-children>a::after{line-height:21px;font:normal normal normal 15px/1 FontAwesome}}#header-container nav>ul>li.menu-item-has-children>ul{width:100%}@media (min-width: 980px){#header-container nav>ul>li.menu-item-has-children>ul{width:-webkit-max-content;width:-moz-max-content;width:max-content;display:flex;position:absolute;padding:20px;top:170% !important;left:-25% !important;flex-direction:column;box-shadow:0 0 20px 2px rgba(36,36,36,0.2);background-color:#fff}}#header-container nav>ul>li.menu-item-has-children>ul li{display:flex;border-bottom:1px solid #EAF2F9;background:#fff}@media (min-width: 980px){#header-container nav>ul>li.menu-item-has-children>ul li{border:none}}#header-container nav>ul>li.menu-item-has-children>ul a{font-size:14px;font-weight:400;line-height:20px;text-transform:none;transition:0s}#header-container nav>ul>li.menu-item-has-children>ul .column-title{flex-direction:column}#header-container nav>ul>li.menu-item-has-children>ul .column-title>a{font-weight:700;line-height:normal !important}#header-container nav>ul>li.menu-item-has-children>ul .column-title ul{width:192px;padding:0}#header-container nav>ul>li.menu-item-has-children>ul ul{display:flex;position:inherit;flex-direction:column}#header-container nav>ul>li.menu-item-has-children>ul ul a{border-left:0}#header-container nav>ul>li.menu-item-has-children:hover>ul{visibility:visible;opacity:1}#header-container nav>ul>li.menu-item-has-children:hover>ul:not([style*="display: none;"]) .menu-item-has-children ul{visibility:visible;opacity:1}#header-container nav>ul>li.row-menu>ul{flex-direction:row}#header-container .get-started-btn a{display:block;border:none;border-radius:8px;margin-left:0;padding:8px 32px;font-size:16px;line-height:24px;font-weight:700;min-width:125px;text-align:center;text-transform:none;color:#242424;background-color:#67e5ad;background:linear-gradient(to top, #159bff 50%, #67e5ad 50%);background-size:100% 200%;background-position:left top;transition:all 0.5s cubic-bezier(0.69, 0.04, 0.9, 0.65)}#header-container .get-started-btn a:hover{color:#fff;background-position:bottom left}@media (max-width: 979px){#navbar{overflow:auto !important;position:fixed;width:100%;margin:-16px 0 0 0;padding:0;padding-top:67px;left:0;text-align:left;background:#EAF2F9;transition:height .4s ease .1s, opacity .6s ease;opacity:0}#navbar.collapse{height:67px !important;display:none !important}#navbar.collapse.in{display:block !important;height:100vh !important;opacity:1}#navbar .menu{display:block;margin:0;padding:0 0 10px 0}#navbar .menu li{display:block;padding:0}#navbar .menu li.get-started-btn{position:absolute;padding:0 16px;bottom:10%;width:100%}#navbar .menu li.menu-item-has-children{position:relative}#navbar .menu li.menu-item-has-children ul{position:relative;max-height:0;padding:0;overflow:hidden;transition:all .5s ease}#navbar .menu li.menu-item-has-children.open ul{max-height:1500px}#navbar .menu a{display:block;padding:10px 25px}}.subnav{position:fixed;top:67px;width:100%;z-index:999;background-color:#f8f8f8}
 
 :root{--docsearch-primary-color: #159bff !important;--docsearch-logo-color: #159bff !important}.sidefilter{background-color:transparent;height:60px;padding:10px}.sidefilter .DocSearch-Button{background:transparent;border:2px inset #242424;border-radius:6px;margin:0;min-height:45px;padding:10px;width:100%}.sidefilter .DocSearch-Button:active,.sidefilter .DocSearch-Button:focus,.sidefilter .DocSearch-Button:hover{border:2px solid #159bff;box-shadow:none}.sidefilter .DocSearch-Button .DocSearch-Search-Icon{display:none}.sidefilter .DocSearch-Button-Placeholder{color:#757575;font-family:"Open Sans", sans-serif;font-size:14px;line-height:20px;padding:10px;display:block}.DocSearch.DocSearch-Container{z-index:9999}
diff --git a/doc/templates/uno/styles/main.js b/doc/templates/uno/styles/main.js
index 0b42bba68b09..aedd50e6fcde 100644
--- a/doc/templates/uno/styles/main.js
+++ b/doc/templates/uno/styles/main.js
@@ -1 +1 @@
-document.addEventListener("DOMContentLoaded",function(){initializeNavbar(),document.addEventListener("click",function(n){const t=n.target;980<=window.innerWidth||!t.matches("#navbar .has-children a")||(n.stopImmediatePropagation(),t.parentElement.classList.toggle("open"))},!0)},!1);
\ No newline at end of file
+document.addEventListener("DOMContentLoaded",function(){initializeNavbar(),document.addEventListener("click",function(e){const n=e.target;980<=window.innerWidth||!n.matches("#navbar .menu-item-has-children a")||(e.stopImmediatePropagation(),n.parentElement.classList.toggle("open"))},!0)},!1);
\ No newline at end of file