Changes for page Public Web Site

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

From version 6.38
edited by Agnease
on 2026/05/12 13:17
Change comment: There is no comment for this version
To version 7.4
edited by Agnease
on 2026/05/12 14:17
Change comment: There is no comment for this version

Summary

Details

XWiki.StyleSheetExtension[1]
code
... ... @@ -9,7 +9,8 @@
9 9  
10 10  .agnease-services-menu {
11 11   .dropdown-toggle {
12 - font-weight: 600;
12 + font-weight: inherit;
13 + font-size: inherit;
13 13   }
14 14  
15 15   &.open > .dropdown-toggle,
... ... @@ -18,6 +18,10 @@
18 18   color: @brand;
19 19   background: transparent;
20 20   }
22 +
23 + .caret {
24 + margin-left: 4px;
25 + }
21 21  }
22 22  
23 23  .agnease-services-dropdown {
... ... @@ -38,18 +38,23 @@
38 38  
39 39   &:hover,
40 40   &:focus {
41 - color: @text;
46 + color: @brand-strong;
42 42   background: @brand-bg;
43 43   text-decoration: none;
44 44  
45 45   .menu-icon {
46 - color: #fff;
47 - background: @brand;
51 + color: @brand-strong;
52 + background: fade(@brand, 14%);
53 + border-color: fade(@brand, 28%);
48 48   }
49 49  
50 50   strong {
51 51   color: @brand-strong;
52 52   }
59 +
60 + small {
61 + color: @muted;
62 + }
53 53   }
54 54   }
55 55  
... ... @@ -62,13 +62,14 @@
62 62   width: 34px;
63 63   height: 34px;
64 64   border-radius: 50%;
65 - background: fade(@brand, 10%);
75 + background: fade(@brand, 8%);
76 + border: 1px solid fade(@brand, 18%);
66 66   color: @brand;
67 67   display: flex;
68 68   align-items: center;
69 69   justify-content: center;
70 70   flex-shrink: 0;
71 - transition: color .15s ease, background .15s ease;
82 + transition: color .15s ease, background .15s ease, border-color .15s ease;
72 72   }
73 73  
74 74   .menu-text {
... ... @@ -77,9 +77,9 @@
77 77   line-height: 1.25;
78 78  
79 79   strong {
80 - color: @text;
91 + color: @brand;
81 81   font-size: 14px;
82 - font-weight: 700;
93 + font-weight: 600;
83 83   }
84 84  
85 85   small {
... ... @@ -86,6 +86,7 @@
86 86   color: @muted;
87 87   font-size: 12px;
88 88   margin-top: 2px;
100 + font-weight: 400;
89 89   }
90 90   }
91 91  }
... ... @@ -103,3 +103,104 @@
103 103   }
104 104   }
105 105  }
118 +/* Keep the top-level Services menu visually clean when hovered/open/focused */
119 +.navbar-nav > li.agnease-services-menu > a,
120 +.navbar-nav > li.agnease-services-menu > a:hover,
121 +.navbar-nav > li.agnease-services-menu > a:focus,
122 +.navbar-nav > li.agnease-services-menu.open > a,
123 +.navbar-nav > li.agnease-services-menu.open > a:hover,
124 +.navbar-nav > li.agnease-services-menu.open > a:focus {
125 + background: transparent;
126 + background-color: transparent;
127 + color: @brand-strong;
128 + box-shadow: none;
129 +}
130 +
131 +/* ========== Mobile Services Menu ========== */
132 +
133 +@media (max-width: 767px) {
134 + .navbar-nav > li.agnease-services-menu {
135 + position: static;
136 + }
137 +
138 + .navbar-nav > li.agnease-services-menu > a,
139 + .navbar-nav > li.agnease-services-menu > a:hover,
140 + .navbar-nav > li.agnease-services-menu > a:focus,
141 + .navbar-nav > li.agnease-services-menu.open > a,
142 + .navbar-nav > li.agnease-services-menu.open > a:hover,
143 + .navbar-nav > li.agnease-services-menu.open > a:focus {
144 + background: transparent;
145 + background-color: transparent;
146 + box-shadow: none;
147 + }
148 +
149 + .navbar-nav > li.agnease-services-menu.open > .agnease-services-dropdown {
150 + display: grid;
151 + }
152 +
153 + .agnease-services-dropdown {
154 + left: 50% !important;
155 + right: auto !important;
156 + transform: translateX(-50%);
157 + width: calc(100vw - 32px);
158 + max-width: 460px;
159 + min-width: 0;
160 + max-height: calc(100vh - 190px);
161 + overflow-y: auto;
162 +
163 + grid-template-columns: repeat(2, minmax(0, 1fr));
164 + grid-gap: 8px;
165 +
166 + padding: 10px;
167 + margin-top: 8px;
168 + border-radius: 14px;
169 + border: 1px solid @line;
170 + box-shadow: 0 14px 36px rgba(0, 0, 0, .14);
171 + background: #fff;
172 + }
173 +
174 + .agnease-services-dropdown > li {
175 + display: block;
176 + }
177 +
178 + .agnease-services-dropdown > li:first-child,
179 + .agnease-services-dropdown > li.divider {
180 + grid-column: 1 / -1;
181 + }
182 +
183 + .agnease-services-dropdown > li.divider {
184 + margin: 4px 0;
185 + }
186 +
187 + .agnease-services-dropdown > li > a {
188 + min-height: 92px;
189 + padding: 12px 10px;
190 + border-radius: 12px;
191 + flex-direction: column;
192 + align-items: center;
193 + justify-content: center;
194 + gap: 8px;
195 + text-align: center;
196 + }
197 +
198 + .agnease-services-dropdown .menu-icon {
199 + width: 34px;
200 + height: 34px;
201 + font-size: 15px;
202 + }
203 +
204 + .agnease-services-dropdown .menu-text {
205 + align-items: center;
206 + line-height: 1.2;
207 + }
208 +
209 + .agnease-services-dropdown .menu-text strong {
210 + color: @brand;
211 + font-size: 13px;
212 + font-weight: 600;
213 + }
214 +
215 + .agnease-services-dropdown .menu-text small {
216 + display: none;
217 + }
218 +}
contentType
... ... @@ -1,0 +1,1 @@
1 +LESS