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