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,7 +617,6 @@ 617 617 order: 0; 618 618 position: static; 619 619 width: 100%; 620 - margin-bottom: 24px; 621 621 } 622 622 623 623 .resource-content {
- XWiki.StyleSheetExtension[1]
-
- code
-
... ... @@ -1,156 +1,148 @@ 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; 3 +/* Desktop alignment */ 4 +.navbar-nav { 5 + float: right; 6 + } 9 9 10 10 /* Top-level menu items */ 11 11 12 -.agnease-services-menu, 13 -.agnease-products-menu { 14 - .dropdown-toggle { 15 - font-weight: inherit; 16 - font-size: inherit; 10 +.agnease-menu-item, 11 +.agnease-menu-link { 12 + > a, 13 + > .dropdown-toggle { 14 + color: @brand; 15 + font-size: 17px; 16 + font-weight: 600; 17 + padding-left: 16px; 18 + padding-right: 16px; 19 + text-decoration: none; 17 17 } 18 18 22 + > a:hover, 23 + > a:focus, 24 + > a:active, 25 + &.open > a, 26 + &.active > a { 27 + color: @brand-strong; 28 + text-decoration: none; 29 + outline: none; 30 + } 31 + 19 19 .caret { 20 - margin-left: 4px; 33 + margin-left: 5px; 34 + border-top-color: @brand; 35 + border-bottom-color: @brand; 21 21 } 22 22 23 - &.open>.dropdown-toggle,24 - .dropdown-toggle:hover,25 - .dropdown-toggle:focus{26 - color:@brand-strong;27 - background:transparent;28 - b ackground-color:transparent;29 - bo x-shadow: none;38 + > a:hover .caret, 39 + > a:focus .caret, 40 + > a:active .caret, 41 + &.open > a .caret, 42 + &.active > a .caret { 43 + border-top-color: @brand-strong; 44 + border-bottom-color: @brand-strong; 30 30 } 31 31 } 32 32 33 -/* Keep Agnease public top-level menu visually cleanwhenhovered/open/focused*/48 +/* Dropdown panel */ 34 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 { 47 - background: transparent; 48 - background-color: transparent; 49 - color: @brand-strong; 50 - box-shadow: none; 51 -} 52 - 53 -/* Dropdown panels */ 54 - 55 -.agnease-services-dropdown, 56 -.agnease-products-dropdown { 57 - min-width: 360px; 58 - padding: 10px; 59 - border: 1px solid @line; 50 +.agnease-dropdown { 51 + min-width: 310px; 52 + padding: 10px 8px; 53 + border: 1px solid fade(@brand, 18%); 60 60 border-radius: 12px; 61 - box-shadow: 0 12px 36px rgba(0, 0, 0, .10); 55 + background: #fff; 56 + box-shadow: 0 12px 32px fade(@brand-strong, 12%); 62 62 63 63 > li > a { 64 64 display: flex; 65 - align-items: flex-start;60 + align-items: center; 66 66 gap: 12px; 67 - padding: 10px 12px; 68 - border-radius: 10px; 69 - color: @text; 70 - white-space: normal; 62 + padding: 11px 14px; 63 + color: @brand; 64 + white-space: nowrap; 65 + font-size: 16px; 66 + font-weight: 600; 67 + line-height: 1.3; 68 + text-decoration: none; 71 71 70 + i { 71 + width: 20px; 72 + flex: 0 0 20px; 73 + color: @brand; 74 + text-align: center; 75 + font-size: 15px; 76 + } 77 + 72 72 &:hover, 73 - &:focus { 79 + &:focus, 80 + &:active { 74 74 color: @brand-strong; 75 - background: @brand-bg; 76 76 text-decoration: none; 83 + outline: none; 77 77 78 - .menu-icon{85 + i { 79 79 color: @brand-strong; 80 - background: fade(@brand, 14%); 81 - border-color: fade(@brand, 28%); 82 82 } 88 + } 89 + } 83 83 84 - strong { 85 - color: @brand-strong; 86 - } 91 + > .active > a { 92 + color: @brand-strong; 87 87 88 - small { 89 - color: @muted; 90 - } 94 + i { 95 + color: @brand-strong; 91 91 } 92 92 } 93 93 94 94 .divider { 95 95 margin: 8px 0; 96 - background-color: @ line;101 + background-color: fade(@brand, 16%); 97 97 } 103 +} 98 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; 105 +/* Mobile */ 106 + 107 +@media (max-width: 767px) { 108 + .site-nav { 109 + margin-left: 0; 108 108 justify-content: center; 109 - flex-shrink: 0; 110 - transition: color .15s ease, background .15s ease, border-color .15s ease; 111 + flex-wrap: wrap; 111 111 } 112 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; 114 + .agnease-menu-item, 115 + .agnease-menu-link { 116 + > a, 117 + > .dropdown-toggle { 118 + font-size: 16px; 119 + padding-top: 9px; 120 + padding-bottom: 9px; 122 122 } 123 - 124 - small { 125 - color: @muted; 126 - font-size: 12px; 127 - margin-top: 2px; 128 - font-weight: 400; 129 - } 130 130 } 131 -} 132 132 133 -/* Products dropdown can be slightly narrower for now */ 134 - 135 -.agnease-products-dropdown { 136 - min-width: 340px; 137 -} 138 - 139 -/* Mobile */ 140 - 141 -@media (max-width: 767px) { 142 - .agnease-services-dropdown, 143 - .agnease-products-dropdown { 124 + .agnease-dropdown { 144 144 min-width: 0; 145 145 width: 100%; 146 - padding: 6px; 127 + padding: 4px 8px 8px 18px; 128 + border: 0; 147 147 border-radius: 0; 148 - border-left: 0; 149 - border-right: 0; 150 150 box-shadow: none; 131 + background: transparent; 151 151 152 152 > li > a { 153 - padding: 10px; 134 + padding: 8px 10px; 135 + white-space: normal; 136 + font-size: 15px; 137 + 138 + i { 139 + width: 18px; 140 + flex-basis: 18px; 141 + } 154 154 } 143 + 144 + .divider { 145 + margin: 5px 0; 146 + } 155 155 } 156 156 }