Changes for page Public Web Site
Last modified by Agnease on 2026/05/30 16:24
Summary
-
Objects (2 modified, 0 added, 0 removed)
Details
- XWiki.StyleSheetExtension[0]
-
- code
-
... ... @@ -617,6 +617,7 @@ 617 617 order: 0; 618 618 position: static; 619 619 width: 100%; 620 + margin-bottom: 24px; 620 620 } 621 621 622 622 .resource-content {
- XWiki.StyleSheetExtension[1]
-
- code
-
... ... @@ -1,63 +1,59 @@ 1 1 /* ========== Agnease Public Top Menu ========== */ 2 2 3 -/* Desktop alignment */ 4 -@media (min-width: 768px) { 5 - .site-nav { 6 - margin-left: auto; 7 - justify-content: flex-end; 3 +.agnease-menu-item { 4 + .dropdown-toggle { 5 + font-weight: inherit; 6 + font-size: inherit; 8 8 } 9 9 10 - .site-nav .agnease-menu-item, 11 - .site-nav .agnease-menu-link { 12 - display: inline-block; 13 - } 14 -} 15 - 16 -/* Top-level menu items */ 17 - 18 -.agnease-menu-item, 19 -.agnease-menu-link { 20 - > a, 21 - > .dropdown-toggle { 22 - color: @brand; 23 - font-size: 17px; 24 - font-weight: 600; 25 - padding-left: 16px; 26 - padding-right: 16px; 27 - text-decoration: none; 28 - } 29 - 30 - > a:hover, 31 - > a:focus, 32 - > a:active, 33 - &.open > a, 34 - &.active > a { 35 - color: @brand-strong; 36 - text-decoration: none; 37 - outline: none; 38 - } 39 - 40 40 .caret { 41 - margin-left: 5px;10 + margin-left: 4px; 42 42 border-top-color: @brand; 43 43 border-bottom-color: @brand; 44 44 } 45 45 46 - > a:hover .caret, 47 - > a:focus .caret, 48 - > a:active .caret, 49 - &.open > a .caret, 50 - &.active > a .caret { 15 + &.open > .dropdown-toggle, 16 + .dropdown-toggle:hover, 17 + .dropdown-toggle:focus { 18 + color: @brand-strong; 19 + background: transparent; 20 + background-color: transparent; 21 + box-shadow: none; 22 + } 23 + 24 + &.open > .dropdown-toggle .caret, 25 + .dropdown-toggle:hover .caret, 26 + .dropdown-toggle:focus .caret { 51 51 border-top-color: @brand-strong; 52 52 border-bottom-color: @brand-strong; 53 53 } 54 54 } 55 55 56 -/* Dropdown panel*/32 +/* Keep Agnease public top-level menu visually clean when hovered/open/focused */ 57 57 34 +.navbar-nav > li.agnease-services-menu > a, 35 +.navbar-nav > li.agnease-products-menu > a, 36 +.navbar-nav > li.agnease-services-menu > a:hover, 37 +.navbar-nav > li.agnease-products-menu > a:hover, 38 +.navbar-nav > li.agnease-services-menu > a:focus, 39 +.navbar-nav > li.agnease-products-menu > a:focus, 40 +.navbar-nav > li.agnease-services-menu.open > a, 41 +.navbar-nav > li.agnease-products-menu.open > a, 42 +.navbar-nav > li.agnease-services-menu.open > a:hover, 43 +.navbar-nav > li.agnease-products-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 + background: transparent; 47 + background-color: transparent; 48 + color: @brand-strong; 49 + box-shadow: none; 50 +} 51 + 52 +/* Dropdown panels */ 53 + 58 58 .agnease-dropdown { 59 - min-width: 310px;60 - padding: 10px8px;55 + min-width: 270px; 56 + padding: 8px; 61 61 border: 1px solid fade(@brand, 18%); 62 62 border-radius: 12px; 63 63 background: #fff; ... ... @@ -66,21 +66,22 @@ 66 66 > li > a { 67 67 display: flex; 68 68 align-items: center; 69 - gap: 12px; 70 - padding: 11px 14px; 65 + gap: 10px; 66 + padding: 9px 11px; 67 + border-radius: 9px; 71 71 color: @brand; 69 + background: transparent; 72 72 white-space: nowrap; 73 - font-size: 16px; 74 - font-weight: 600; 75 - line-height: 1.3; 76 - text-decoration: none; 71 + font-size: 14px; 72 + font-weight: 700; 73 + line-height: 1.25; 77 77 78 78 i { 79 - width: 20px;80 - flex: 0 0 20px;76 + width: 18px; 77 + flex: 0 0 18px; 81 81 color: @brand; 82 82 text-align: center; 83 - font-size: 1 5px;80 + font-size: 14px; 84 84 } 85 85 86 86 &:hover, ... ... @@ -87,6 +87,7 @@ 87 87 &:focus, 88 88 &:active { 89 89 color: @brand-strong; 87 + background: fade(@brand, 8%); 90 90 text-decoration: none; 91 91 outline: none; 92 92 ... ... @@ -96,8 +96,12 @@ 96 96 } 97 97 } 98 98 99 - > .active > a { 97 + > .active > a, 98 + > .active > a:hover, 99 + > .active > a:focus { 100 100 color: @brand-strong; 101 + background: fade(@brand, 10%); 102 + text-decoration: none; 101 101 102 102 i { 103 103 color: @brand-strong; ... ... @@ -105,30 +105,31 @@ 105 105 } 106 106 107 107 .divider { 108 - margin: 8px 0;110 + margin: 7px 0; 109 109 background-color: fade(@brand, 16%); 110 110 } 111 111 } 112 112 113 -/* Mobile */ 115 +.agnease-products-dropdown, 116 +.agnease-resources-dropdown { 117 + min-width: 260px; 118 +} 114 114 120 +/* Remove gray Bootstrap dropdown item states */ 121 +.dropdown-menu > li > a:hover, 122 +.dropdown-menu > li > a:focus { 123 + background-image: none; 124 +} 125 + 126 +/* ========== Mobile Menu ========== */ 127 + 115 115 @media (max-width: 767px) { 116 - . site-nav{117 - margin-left:0;118 - justify-content:center;119 - flex-wrap:wrap;129 + .navbar-nav > li.agnease-menu-item > a, 130 + .navbar-nav > li > a { 131 + padding-top: 8px; 132 + padding-bottom: 8px; 120 120 } 121 121 122 - .agnease-menu-item, 123 - .agnease-menu-link { 124 - > a, 125 - > .dropdown-toggle { 126 - font-size: 16px; 127 - padding-top: 9px; 128 - padding-bottom: 9px; 129 - } 130 - } 131 - 132 132 .agnease-dropdown { 133 133 min-width: 0; 134 134 width: 100%; ... ... @@ -136,21 +136,51 @@ 136 136 border: 0; 137 137 border-radius: 0; 138 138 box-shadow: none; 139 - background: transparent;142 + background: #fff; 140 140 141 141 > li > a { 142 142 padding: 8px 10px; 143 143 white-space: normal; 144 - font-size: 15px; 147 + font-size: 14px; 148 + border-radius: 8px; 149 + color: @brand; 145 145 146 146 i { 147 - width: 1 8px;148 - flex-basis: 1 8px;152 + width: 16px; 153 + flex-basis: 16px; 149 149 } 155 + 156 + &:hover, 157 + &:focus, 158 + &:active { 159 + color: @brand-strong; 160 + background: fade(@brand, 8%); 161 + } 150 150 } 151 151 152 152 .divider { 153 153 margin: 5px 0; 166 + background-color: fade(@brand, 16%); 154 154 } 155 155 } 156 156 } 170 +/* Remove gray background from opened top-level public menu items */ 171 + 172 +.site-nav .dropdown.open > a, 173 +.site-nav .dropdown.open > a:hover, 174 +.site-nav .dropdown.open > a:focus, 175 +.site-nav .agnease-menu-item.open > a, 176 +.site-nav .agnease-menu-item.open > a:hover, 177 +.site-nav .agnease-menu-item.open > a:focus, 178 +.navbar-nav > li.dropdown.open > a, 179 +.navbar-nav > li.dropdown.open > a:hover, 180 +.navbar-nav > li.dropdown.open > a:focus, 181 +.navbar-nav > li.agnease-menu-item.open > a, 182 +.navbar-nav > li.agnease-menu-item.open > a:hover, 183 +.navbar-nav > li.agnease-menu-item.open > a:focus { 184 + color: @brand-strong; 185 + background: transparent !important; 186 + background-color: transparent !important; 187 + background-image: none !important; 188 + box-shadow: none !important; 189 +}