Changes for page Public Web Site
Last modified by Agnease on 2026/05/30 16:24
Summary
-
Objects (1 modified, 0 added, 0 removed)
Details
- XWiki.StyleSheetExtension[1]
-
- code
-
... ... @@ -1,10 +1,6 @@ 1 1 /* ========== Agnease Public Top Menu ========== */ 2 2 3 -/* Top-level dropdown menu items */ 4 - 5 -.agnease-services-menu, 6 -.agnease-products-menu, 7 -.agnease-resources-menu { 3 +.agnease-menu-item { 8 8 .dropdown-toggle { 9 9 font-weight: inherit; 10 10 font-size: inherit; ... ... @@ -24,26 +24,12 @@ 24 24 } 25 25 } 26 26 27 -/* Keep public top-level dropdown items visually clean when hovered/open/focused */ 28 - 29 -.navbar-nav > li.agnease-services-menu > a, 30 -.navbar-nav > li.agnease-products-menu > a, 31 -.navbar-nav > li.agnease-resources-menu > a, 32 -.navbar-nav > li.agnease-services-menu > a:hover, 33 -.navbar-nav > li.agnease-products-menu > a:hover, 34 -.navbar-nav > li.agnease-resources-menu > a:hover, 35 -.navbar-nav > li.agnease-services-menu > a:focus, 36 -.navbar-nav > li.agnease-products-menu > a:focus, 37 -.navbar-nav > li.agnease-resources-menu > a:focus, 38 -.navbar-nav > li.agnease-services-menu.open > a, 39 -.navbar-nav > li.agnease-products-menu.open > a, 40 -.navbar-nav > li.agnease-resources-menu.open > a, 41 -.navbar-nav > li.agnease-services-menu.open > a:hover, 42 -.navbar-nav > li.agnease-products-menu.open > a:hover, 43 -.navbar-nav > li.agnease-resources-menu.open > a:hover, 44 -.navbar-nav > li.agnease-services-menu.open > a:focus, 45 -.navbar-nav > li.agnease-products-menu.open > a:focus, 46 -.navbar-nav > li.agnease-resources-menu.open > a:focus { 23 +.navbar-nav > li.agnease-menu-item > a, 24 +.navbar-nav > li.agnease-menu-item > a:hover, 25 +.navbar-nav > li.agnease-menu-item > a:focus, 26 +.navbar-nav > li.agnease-menu-item.open > a, 27 +.navbar-nav > li.agnease-menu-item.open > a:hover, 28 +.navbar-nav > li.agnease-menu-item.open > a:focus { 47 47 background: transparent; 48 48 background-color: transparent; 49 49 color: @brand-strong; ... ... @@ -50,26 +50,33 @@ 50 50 box-shadow: none; 51 51 } 52 52 53 -/* Dropdown panels */ 54 - 55 -.agnease-services-dropdown, 56 -.agnease-products-dropdown, 57 -.agnease-resources-dropdown { 58 - min-width: 360px; 59 - padding: 10px; 35 +.agnease-dropdown { 36 + min-width: 270px; 37 + padding: 8px; 60 60 border: 1px solid @line; 61 61 border-radius: 12px; 62 - box-shadow: 0 12px 3 6px rgba(0, 0, 0, .10);40 + box-shadow: 0 12px 32px rgba(0, 0, 0, .10); 63 63 64 64 > li > a { 65 65 display: flex; 66 - align-items: flex-start;67 - gap: 1 2px;68 - padding: 10px 12px;69 - border-radius: 10px;44 + align-items: center; 45 + gap: 10px; 46 + padding: 9px 11px; 47 + border-radius: 9px; 70 70 color: @text; 71 - white-space: normal; 49 + white-space: nowrap; 50 + font-size: 14px; 51 + font-weight: 600; 52 + line-height: 1.25; 72 72 54 + i { 55 + width: 18px; 56 + flex: 0 0 18px; 57 + color: @brand; 58 + text-align: center; 59 + font-size: 14px; 60 + } 61 + 73 73 &:hover, 74 74 &:focus { 75 75 color: @brand-strong; ... ... @@ -76,87 +76,58 @@ 76 76 background: @brand-bg; 77 77 text-decoration: none; 78 78 79 - .menu-icon{68 + i { 80 80 color: @brand-strong; 81 - background: fade(@brand, 14%); 82 - border-color: fade(@brand, 28%); 83 83 } 84 - 85 - strong { 86 - color: @brand-strong; 87 - } 88 - 89 - small { 90 - color: @muted; 91 - } 92 92 } 93 93 } 94 94 95 95 .divider { 96 - margin: 8px 0;75 + margin: 7px 0; 97 97 background-color: @line; 98 98 } 99 - 100 - .menu-icon { 101 - width: 34px; 102 - height: 34px; 103 - border-radius: 50%; 104 - background: fade(@brand, 8%); 105 - border: 1px solid fade(@brand, 18%); 106 - color: @brand; 107 - display: flex; 108 - align-items: center; 109 - justify-content: center; 110 - flex-shrink: 0; 111 - transition: color .15s ease, background .15s ease, border-color .15s ease; 112 - } 113 - 114 - .menu-text { 115 - display: flex; 116 - flex-direction: column; 117 - line-height: 1.25; 118 - 119 - strong { 120 - color: @brand; 121 - font-size: 14px; 122 - font-weight: 600; 123 - } 124 - 125 - small { 126 - color: @muted; 127 - font-size: 12px; 128 - margin-top: 2px; 129 - font-weight: 400; 130 - } 131 - } 132 132 } 133 133 134 -/* Slightly narrower dropdowns where the content is shorter */ 135 - 136 136 .agnease-products-dropdown { 137 - min-width: 340px;81 + min-width: 260px; 138 138 } 139 139 140 140 .agnease-resources-dropdown { 141 - min-width: 380px;85 + min-width: 260px; 142 142 } 143 143 144 -/* Mobile */ 88 +/* ========== Mobile Menu ========== */ 145 145 146 146 @media (max-width: 767px) { 147 - .agnease-services-dropdown, 148 - .agnease-products-dropdown, 149 - .agnease-resources-dropdown { 91 + .navbar-nav > li.agnease-menu-item > a, 92 + .navbar-nav > li > a { 93 + padding-top: 8px; 94 + padding-bottom: 8px; 95 + } 96 + 97 + .agnease-dropdown { 150 150 min-width: 0; 151 151 width: 100%; 152 - padding: 6px; 100 + padding: 4px 8px 8px 18px; 101 + border: 0; 153 153 border-radius: 0; 154 - border-left: 0; 155 - border-right: 0; 156 156 box-shadow: none; 104 + background: transparent; 157 157 158 158 > li > a { 159 - padding: 10px; 107 + padding: 8px 10px; 108 + white-space: normal; 109 + font-size: 14px; 110 + border-radius: 8px; 111 + 112 + i { 113 + width: 16px; 114 + flex-basis: 16px; 115 + } 160 160 } 117 + 118 + .divider { 119 + margin: 5px 0; 120 + } 161 161 } 162 162 }