Changes for page Public Web Site

Last modified by Agnease on 2026/05/30 16:24

From version 10.28
edited by Agnease
on 2026/05/19 07:18
Change comment: There is no comment for this version
To version 8.24
edited by Agnease
on 2026/05/19 03:47
Change comment: There is no comment for this version

Summary

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,154 +1,69 @@
1 1  /* ========== Agnease Public Top Menu ========== */
2 2  
3 -/* Keep the public menu aligned to the right on desktop */
4 -@media (min-width: 768px) {
5 - .navbar-nav {
6 - float: right;
7 - margin-left: auto;
3 +.agnease-menu-item {
4 + .dropdown-toggle {
5 + font-weight: inherit;
6 + font-size: inherit;
8 8   }
9 9  
10 - .site-nav {
11 - margin-left: auto;
12 - justify-content: flex-end;
9 + .caret {
10 + margin-left: 4px;
13 13   }
14 -}
15 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 - background: transparent !important;
28 - background-color: transparent !important;
29 - background-image: none !important;
30 - box-shadow: none !important;
31 - }
32 -
33 - > a:hover,
34 - > a:focus,
35 - > a:active,
36 - &.open > a,
37 - &.open > a:hover,
38 - &.open > a:focus,
39 - &.open > a:active,
40 - &.active > a,
41 - &.active > a:hover,
42 - &.active > a:focus,
43 - &.active > a:active {
13 + &.open > .dropdown-toggle,
14 + .dropdown-toggle:hover,
15 + .dropdown-toggle:focus {
44 44   color: @brand-strong;
45 - background: transparent !important;
46 - background-color: transparent !important;
47 - background-image: none !important;
48 - box-shadow: none !important;
49 - outline: none;
50 - text-decoration: none;
17 + background: transparent;
18 + background-color: transparent;
19 + box-shadow: none;
51 51   }
52 -
53 - .caret {
54 - margin-left: 5px;
55 - border-top-color: @brand;
56 - border-bottom-color: @brand;
57 - }
58 -
59 - > a:hover .caret,
60 - > a:focus .caret,
61 - > a:active .caret,
62 - &.open > a .caret,
63 - &.active > a .caret {
64 - border-top-color: @brand-strong;
65 - border-bottom-color: @brand-strong;
66 - }
67 67  }
68 68  
69 -/* Strong Bootstrap/XWiki overrides for top-level menu backgrounds */
70 -
71 -.navbar-nav > li,
72 -.navbar-nav > li:hover,
73 -.navbar-nav > li:focus,
74 -.navbar-nav > li:active,
75 -.navbar-nav > li.open,
76 -.navbar-nav > li.open:hover,
77 -.navbar-nav > li.open:focus,
78 -.navbar-nav > li.open:active,
79 -.navbar-nav > li.active,
80 -.navbar-nav > li.active:hover,
81 -.navbar-nav > li.active:focus,
82 -.navbar-nav > li.active:active {
83 - background: transparent !important;
84 - background-color: transparent !important;
85 - background-image: none !important;
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 {
29 + background: transparent;
30 + background-color: transparent;
31 + color: @brand-strong;
32 + box-shadow: none;
86 86  }
87 87  
88 -.navbar-nav > li > a,
89 -.navbar-nav > li > a:hover,
90 -.navbar-nav > li > a:focus,
91 -.navbar-nav > li > a:active,
92 -.navbar-nav > li.open > a,
93 -.navbar-nav > li.open > a:hover,
94 -.navbar-nav > li.open > a:focus,
95 -.navbar-nav > li.open > a:active,
96 -.navbar-nav > li.active > a,
97 -.navbar-nav > li.active > a:hover,
98 -.navbar-nav > li.active > a:focus,
99 -.navbar-nav > li.active > a:active,
100 -.nav .open > a,
101 -.nav .open > a:hover,
102 -.nav .open > a:focus {
103 - background: transparent !important;
104 - background-color: transparent !important;
105 - background-image: none !important;
106 - box-shadow: none !important;
107 -}
108 -
109 -/* Dropdown panel */
110 -
111 111  .agnease-dropdown {
112 - min-width: 310px;
113 - padding: 10px 8px;
114 - border: 1px solid fade(@brand, 18%);
36 + min-width: 270px;
37 + padding: 8px;
38 + border: 1px solid @line;
115 115   border-radius: 12px;
116 - background: #fff;
117 - box-shadow: 0 12px 32px fade(@brand-strong, 12%);
40 + box-shadow: 0 12px 32px rgba(0, 0, 0, .10);
118 118  
119 119   > li > a {
120 120   display: flex;
121 121   align-items: center;
122 - gap: 12px;
123 - padding: 11px 14px;
124 - color: @brand;
125 - background: transparent !important;
126 - background-color: transparent !important;
127 - background-image: none !important;
45 + gap: 10px;
46 + padding: 9px 11px;
47 + border-radius: 9px;
48 + color: @text;
128 128   white-space: nowrap;
129 - font-size: 16px;
50 + font-size: 14px;
130 130   font-weight: 600;
131 - line-height: 1.3;
132 - box-shadow: none !important;
52 + line-height: 1.25;
133 133  
134 134   i {
135 - width: 20px;
136 - flex: 0 0 20px;
55 + width: 18px;
56 + flex: 0 0 18px;
137 137   color: @brand;
138 138   text-align: center;
139 - font-size: 15px;
59 + font-size: 14px;
140 140   }
141 141  
142 142   &:hover,
143 - &:focus,
144 - &:active {
63 + &:focus {
145 145   color: @brand-strong;
146 - background: transparent !important;
147 - background-color: transparent !important;
148 - background-image: none !important;
65 + background: @brand-bg;
149 149   text-decoration: none;
150 - outline: none;
151 - box-shadow: none !important;
152 152  
153 153   i {
154 154   color: @brand-strong;
... ... @@ -156,66 +156,29 @@
156 156   }
157 157   }
158 158  
159 - > .active > a,
160 - > .active > a:hover,
161 - > .active > a:focus,
162 - > .active > a:active {
163 - color: @brand-strong;
164 - background: transparent !important;
165 - background-color: transparent !important;
166 - background-image: none !important;
167 - text-decoration: none;
168 - box-shadow: none !important;
169 -
170 - i {
171 - color: @brand-strong;
172 - }
173 - }
174 -
175 175   .divider {
176 - margin: 8px 0;
177 - background-color: fade(@brand, 16%);
75 + margin: 7px 0;
76 + background-color: @line;
178 178   }
179 179  }
180 180  
181 -/* Strong Bootstrap/XWiki overrides for submenu gray hover backgrounds */
80 +.agnease-products-dropdown {
81 + min-width: 260px;
82 +}
182 182  
183 -.dropdown-menu > li > a,
184 -.dropdown-menu > li > a:hover,
185 -.dropdown-menu > li > a:focus,
186 -.dropdown-menu > li > a:active,
187 -.dropdown-menu > .active > a,
188 -.dropdown-menu > .active > a:hover,
189 -.dropdown-menu > .active > a:focus,
190 -.dropdown-menu > .active > a:active,
191 -.agnease-dropdown > li > a,
192 -.agnease-dropdown > li > a:hover,
193 -.agnease-dropdown > li > a:focus,
194 -.agnease-dropdown > li > a:active {
195 - background: transparent !important;
196 - background-color: transparent !important;
197 - background-image: none !important;
198 - box-shadow: none !important;
84 +.agnease-resources-dropdown {
85 + min-width: 260px;
199 199  }
200 200  
201 -/* Mobile */
88 +/* ========== Mobile Menu ========== */
202 202  
203 203  @media (max-width: 767px) {
204 - .navbar-nav {
205 - float: none;
206 - margin-left: 0;
91 + .navbar-nav > li.agnease-menu-item > a,
92 + .navbar-nav > li > a {
93 + padding-top: 8px;
94 + padding-bottom: 8px;
207 207   }
208 208  
209 - .agnease-menu-item,
210 - .agnease-menu-link {
211 - > a,
212 - > .dropdown-toggle {
213 - font-size: 16px;
214 - padding-top: 9px;
215 - padding-bottom: 9px;
216 - }
217 - }
218 -
219 219   .agnease-dropdown {
220 220   min-width: 0;
221 221   width: 100%;
... ... @@ -228,26 +228,17 @@
228 228   > li > a {
229 229   padding: 8px 10px;
230 230   white-space: normal;
231 - font-size: 15px;
232 - color: @brand;
233 - background: transparent !important;
109 + font-size: 14px;
110 + border-radius: 8px;
234 234  
235 235   i {
236 - width: 18px;
237 - flex-basis: 18px;
113 + width: 16px;
114 + flex-basis: 16px;
238 238   }
239 -
240 - &:hover,
241 - &:focus,
242 - &:active {
243 - color: @brand-strong;
244 - background: transparent !important;
245 - }
246 246   }
247 247  
248 248   .divider {
249 249   margin: 5px 0;
250 - background-color: fade(@brand, 16%);
251 251   }
252 252   }
253 253  }