Changes for page Public Web Site

Last modified by Alex Cotiuga on 2026/07/29 05:00

From version 31.7
edited by Alex Cotiuga
on 2026/07/29 04:42
Change comment: There is no comment for this version
To version 31.14
edited by Alex Cotiuga
on 2026/07/29 05:00
Change comment: There is no comment for this version

Summary

Details

XWiki.StyleSheetExtension[0]
code
... ... @@ -117,19 +117,51 @@
117 117  .site-nav {
118 118   display: flex;
119 119   align-items: center;
120 - gap: 22px;
120 + gap: 8px;
121 121   font-size: 15px;
122 122  
123 123   a {
124 + display: inline-flex;
125 + align-items: center;
126 + gap: 5px;
127 + padding: 8px 11px;
128 + border-radius: 9px;
124 124   color: @text;
130 + background: transparent;
125 125   text-decoration: none;
126 126   font-weight: 600;
133 + line-height: 1.2;
134 + transition:
135 + color .18s ease,
136 + background .18s ease,
137 + box-shadow .18s ease,
138 + transform .18s ease;
127 127  
128 128   &:hover,
129 129   &:focus {
130 - color: @brand;
142 + color: #fff;
143 + background:
144 + linear-gradient(
145 + 110deg,
146 + @text 0%,
147 + @text-soft 55%,
148 + @brand-strong 100%
149 + );
150 + box-shadow: 0 8px 18px rgba(7, 24, 45, .14);
131 131   text-decoration: none;
152 + transform: translateY(-1px);
132 132   }
154 +
155 + &:focus-visible {
156 + outline: 2px solid fade(@brand, 45%);
157 + outline-offset: 2px;
158 + }
159 +
160 + i,
161 + .fa,
162 + .caret {
163 + color: inherit;
164 + }
133 133   }
134 134  
135 135   .nav-cta {
... ... @@ -136,14 +136,20 @@
136 136   color: #fff;
137 137   background: @brand;
138 138   border: 1px solid @brand;
139 - border-radius: 6px;
171 + border-radius: 9px;
140 140   padding: 8px 14px;
141 141  
142 142   &:hover,
143 143   &:focus {
144 144   color: #fff;
145 - background: @brand-strong;
146 - border-color: @brand-strong;
177 + border-color: transparent;
178 + background:
179 + linear-gradient(
180 + 110deg,
181 + @text 0%,
182 + @text-soft 55%,
183 + @brand-strong 100%
184 + );
147 147   }
148 148   }
149 149  }
... ... @@ -2018,7 +2018,7 @@
2018 2018  
2019 2019  .public-campaign-banner {
2020 2020   position: relative;
2021 - margin-top:24px;
2059 + margin-top: 30px;
2022 2022   z-index: 20;
2023 2023   border: 0;
2024 2024   background:
... ... @@ -2025,7 +2025,8 @@
2025 2025   radial-gradient(circle at 88% 0%, fade(@brand, 30%) 0%, transparent 32%),
2026 2026   linear-gradient(110deg, @text 0%, @text-soft 55%, @brand-strong 100%);
2027 2027   color: #fff;
2028 - box-shadow: 0 10px 26px rgba(7, 24, 45, .12);
2066 + border-radius: 14px;
2067 + box-shadow: 0 10px 26px rgba(7, 24, 45, .10);
2029 2029  }
2030 2030  
2031 2031  .public-campaign-inner {
... ... @@ -2050,36 +2050,35 @@
2050 2050   display: inline-flex;
2051 2051   align-items: center;
2052 2052   gap: 7px;
2053 - padding: 6px 10px;
2054 - border: 1px solid fade(#fff, 28%);
2092 + padding: 7px 11px;
2093 + border: 1px solid fade(#fff, 32%);
2055 2055   border-radius: 999px;
2056 - background: fade(#fff, 10%);
2095 + background: fade(#fff, 12%);
2057 2057   color: #fff;
2058 2058   font-size: 12px;
2059 2059   line-height: 1.2;
2060 2060   font-weight: 800;
2061 2061   text-transform: uppercase;
2062 - letter-spacing: .04em;
2063 -
2064 - i {
2065 - color: #fff;
2066 - }
2101 + letter-spacing: .05em;
2067 2067  }
2068 2068  
2069 2069  .public-campaign-message {
2070 2070   min-width: 0;
2106 + flex: 1;
2071 2071  
2072 2072   strong {
2073 2073   display: block;
2074 - margin-bottom: 4px;
2110 + margin-bottom: 5px;
2075 2075   color: #fff;
2076 - font-size: 17px;
2077 - line-height: 1.3;
2112 + font-size: 18px;
2113 + line-height: 1.25;
2114 + font-weight: 800;
2115 + letter-spacing: -.01em;
2078 2078   }
2079 2079  
2080 2080   span {
2081 2081   display: block;
2082 - max-width: 700px;
2120 + max-width: 660px;
2083 2083   color: #DBE4EF;
2084 2084   font-size: 14px;
2085 2085   line-height: 1.45;
... ... @@ -2095,19 +2095,13 @@
2095 2095  
2096 2096  .public-campaign-primary {
2097 2097   white-space: nowrap;
2136 + padding: 9px 16px;
2098 2098   border-color: #fff;
2138 + border-radius: 7px;
2099 2099   background: #fff;
2100 2100   color: @text;
2101 - font-weight: 700;
2102 - box-shadow: 0 10px 24px rgba(0, 0, 0, .16);
2103 -
2104 - &:hover,
2105 - &:focus {
2106 - border-color: #fff;
2107 - background: #fff;
2108 - color: @brand-strong;
2109 - text-decoration: none;
2110 - }
2141 + font-weight: 800;
2142 + box-shadow: 0 8px 20px rgba(0, 0, 0, .16);
2111 2111  }
2112 2112  
2113 2113  .public-campaign-link {
... ... @@ -2115,17 +2115,22 @@
2115 2115   color: #fff;
2116 2116   font-size: 14px;
2117 2117   font-weight: 700;
2118 - text-decoration: underline;
2119 - text-underline-offset: 3px;
2150 + text-decoration: none;
2120 2120  
2121 2121   i {
2122 - margin-left: 5px;
2153 + margin-left: 6px;
2154 + transition: transform .18s ease;
2123 2123   }
2124 2124  
2125 2125   &:hover,
2126 2126   &:focus {
2127 2127   color: #fff;
2128 - text-decoration-thickness: 2px;
2160 + text-decoration: underline;
2161 + text-underline-offset: 3px;
2162 +
2163 + i {
2164 + transform: translateX(3px);
2165 + }
2129 2129   }
2130 2130  }
2131 2131