uibee 2.4.11 → 2.4.13

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -5,7 +5,7 @@ import Link from 'next/link';
5
5
  import LogoSmall from '../logo/logoSmall';
6
6
  import LanguageToggle from '../toggle/language';
7
7
  import ThemeToggle from '../toggle/theme';
8
- import { LogOut } from 'lucide-react';
8
+ import { LogOut, User } from 'lucide-react';
9
9
  function hamburgerStyle(isOpen, isSecond) {
10
10
  return `bg-login-50 h-0.5 absolute w-8 transition-all duration-[400ms] left-2 ${isOpen
11
11
  ? `top-6 ${isSecond ? 'rotate-45' : '-rotate-45'}`
@@ -23,23 +23,9 @@ export default function Navbar({ lang, onlyLogo, disableLanguageToggle, disableT
23
23
  }, children: child }, index))) })] }))] }) }));
24
24
  }
25
25
  function AuthButton({ profileURL, token }) {
26
- return (_jsx("div", { className: 'rounded-[0.3rem] hover:bg-[#6464641a] h-12 w-12', children: token ? (_jsxs(_Fragment, { children: [_jsx(Link, { href: '/api/logout', prefetch: false, onClick: (e) => {
26
+ return (_jsx("div", { className: 'rounded-[0.3rem] hover:bg-login-300/20 h-12 w-12', children: token ? (_jsxs(_Fragment, { children: [_jsx(Link, { href: '/api/logout', prefetch: false, onClick: (e) => {
27
27
  e.preventDefault();
28
28
  window.location.href = '/api/logout';
29
29
  }, className: 'grid items-center justify-center h-full w-full', children: _jsx(LogOut, { size: 24 }) }), profileURL &&
30
- _jsx(Link, { href: profileURL, className: 'grid items-center justify-center h-full w-full', children: _jsx("div", { className: `relative w-[30px] h-5
31
- before:content-[""] before:absolute before:top-0 before:left-1/2 before:-translate-x-1/2
32
- before:w-2.5 before:h-2.5 before:border-2 before:border-login-50
33
- before:rounded-full before:bg-transparent
34
- after:content-[""] after:absolute after:bottom-0 after:left-1/2 after:-translate-x-1/2
35
- after:w-[18px] after:h-2 after:border-2 after:border-login-50
36
- after:rounded-t-[22px] after:border-b-0 after:bg-transparent
37
- ` }) })] })) : (_jsx(Link, { href: '/api/login', className: 'grid items-center justify-center h-full w-full', children: _jsx("div", { className: `relative w-[30px] h-5
38
- before:content-[""] before:absolute before:top-0 before:left-1/2 before:-translate-x-1/2
39
- before:w-2.5 before:h-2.5 before:border-2 before:border-login-50
40
- before:rounded-full before:bg-transparent
41
- after:content-[""] after:absolute after:bottom-0 after:left-1/2 after:-translate-x-1/2
42
- after:w-[18px] after:h-2 after:border-2 after:border-login-50
43
- after:rounded-t-[22px] after:border-b-0 after:bg-transparent
44
- ` }) })) }));
30
+ _jsx(Link, { href: profileURL, className: 'grid items-center justify-center h-full w-full', children: _jsx(User, { size: 24 }) })] })) : (_jsx(Link, { href: '/api/login', className: 'grid items-center justify-center h-full w-full', children: _jsx(User, { size: 24 }) })) }));
45
31
  }
@@ -432,9 +432,6 @@
432
432
  .h-4 {
433
433
  height: calc(var(--spacing) * 4);
434
434
  }
435
- .h-5 {
436
- height: calc(var(--spacing) * 5);
437
- }
438
435
  .h-6 {
439
436
  height: calc(var(--spacing) * 6);
440
437
  }
@@ -489,9 +486,6 @@
489
486
  .w-\[4\.3rem\] {
490
487
  width: 4.3rem;
491
488
  }
492
- .w-\[30px\] {
493
- width: 30px;
494
- }
495
489
  .w-\[calc\(100\%-2rem\)\] {
496
490
  width: calc(100% - 2rem);
497
491
  }
@@ -1168,163 +1162,12 @@
1168
1162
  padding-inline: calc(var(--spacing) * 2);
1169
1163
  }
1170
1164
  }
1171
- .before\:absolute {
1172
- &::before {
1173
- content: var(--tw-content);
1174
- position: absolute;
1175
- }
1176
- }
1177
- .before\:top-0 {
1178
- &::before {
1179
- content: var(--tw-content);
1180
- top: calc(var(--spacing) * 0);
1181
- }
1182
- }
1183
- .before\:left-1\/2 {
1184
- &::before {
1185
- content: var(--tw-content);
1186
- left: calc(1/2 * 100%);
1187
- }
1188
- }
1189
- .before\:h-2\.5 {
1190
- &::before {
1191
- content: var(--tw-content);
1192
- height: calc(var(--spacing) * 2.5);
1193
- }
1194
- }
1195
- .before\:w-2\.5 {
1196
- &::before {
1197
- content: var(--tw-content);
1198
- width: calc(var(--spacing) * 2.5);
1199
- }
1200
- }
1201
- .before\:-translate-x-1\/2 {
1202
- &::before {
1203
- content: var(--tw-content);
1204
- --tw-translate-x: calc(calc(1/2 * 100%) * -1);
1205
- translate: var(--tw-translate-x) var(--tw-translate-y);
1206
- }
1207
- }
1208
- .before\:rounded-full {
1209
- &::before {
1210
- content: var(--tw-content);
1211
- border-radius: calc(infinity * 1px);
1212
- }
1213
- }
1214
- .before\:border-2 {
1215
- &::before {
1216
- content: var(--tw-content);
1217
- border-style: var(--tw-border-style);
1218
- border-width: 2px;
1219
- }
1220
- }
1221
- .before\:border-login-50 {
1222
- &::before {
1223
- content: var(--tw-content);
1224
- border-color: var(--color-login-50);
1225
- }
1226
- }
1227
- .before\:bg-transparent {
1228
- &::before {
1229
- content: var(--tw-content);
1230
- background-color: transparent;
1231
- }
1232
- }
1233
- .before\:content-\[\"\"\] {
1234
- &::before {
1235
- --tw-content: "";
1236
- content: var(--tw-content);
1237
- }
1238
- }
1239
- .after\:absolute {
1240
- &::after {
1241
- content: var(--tw-content);
1242
- position: absolute;
1243
- }
1244
- }
1245
- .after\:bottom-0 {
1246
- &::after {
1247
- content: var(--tw-content);
1248
- bottom: calc(var(--spacing) * 0);
1249
- }
1250
- }
1251
- .after\:left-1\/2 {
1252
- &::after {
1253
- content: var(--tw-content);
1254
- left: calc(1/2 * 100%);
1255
- }
1256
- }
1257
- .after\:h-2 {
1258
- &::after {
1259
- content: var(--tw-content);
1260
- height: calc(var(--spacing) * 2);
1261
- }
1262
- }
1263
- .after\:w-\[18px\] {
1264
- &::after {
1265
- content: var(--tw-content);
1266
- width: 18px;
1267
- }
1268
- }
1269
- .after\:-translate-x-1\/2 {
1270
- &::after {
1271
- content: var(--tw-content);
1272
- --tw-translate-x: calc(calc(1/2 * 100%) * -1);
1273
- translate: var(--tw-translate-x) var(--tw-translate-y);
1274
- }
1275
- }
1276
- .after\:rounded-t-\[22px\] {
1277
- &::after {
1278
- content: var(--tw-content);
1279
- border-top-left-radius: 22px;
1280
- border-top-right-radius: 22px;
1281
- }
1282
- }
1283
- .after\:border-2 {
1284
- &::after {
1285
- content: var(--tw-content);
1286
- border-style: var(--tw-border-style);
1287
- border-width: 2px;
1288
- }
1289
- }
1290
- .after\:border-b-0 {
1291
- &::after {
1292
- content: var(--tw-content);
1293
- border-bottom-style: var(--tw-border-style);
1294
- border-bottom-width: 0px;
1295
- }
1296
- }
1297
- .after\:border-login-50 {
1298
- &::after {
1299
- content: var(--tw-content);
1300
- border-color: var(--color-login-50);
1301
- }
1302
- }
1303
- .after\:bg-transparent {
1304
- &::after {
1305
- content: var(--tw-content);
1306
- background-color: transparent;
1307
- }
1308
- }
1309
- .after\:content-\[\"\"\] {
1310
- &::after {
1311
- --tw-content: "";
1312
- content: var(--tw-content);
1313
- }
1314
- }
1315
1165
  .after\:content-\[\"_\*\"\] {
1316
1166
  &::after {
1317
1167
  --tw-content: " *";
1318
1168
  content: var(--tw-content);
1319
1169
  }
1320
1170
  }
1321
- .hover\:bg-\[\#6464641a\] {
1322
- &:hover {
1323
- @media (hover: hover) {
1324
- background-color: #6464641a;
1325
- }
1326
- }
1327
- }
1328
1171
  .hover\:bg-gray-400\/10 {
1329
1172
  &:hover {
1330
1173
  @media (hover: hover) {
@@ -1456,7 +1299,7 @@
1456
1299
  }
1457
1300
  :root {
1458
1301
  transition: background 0.4s,
1459
- color 0.4s;
1302
+ color 0.4s,;
1460
1303
  }
1461
1304
  .dark {
1462
1305
  --background: #0e0e0e;
@@ -1473,6 +1316,7 @@
1473
1316
  --color-login-200: #6b6b6b;
1474
1317
  --color-login-100: #b0b0b0;
1475
1318
  --color-login-50: #ededed;
1319
+ --color-login-text: #ededed;
1476
1320
  }
1477
1321
  .light {
1478
1322
  --background: #ededed;
@@ -1489,6 +1333,7 @@
1489
1333
  --color-login-200: #fafafa;
1490
1334
  --color-login-100: #fcfcfc;
1491
1335
  --color-login-50: #ffffff;
1336
+ --color-login-text: #0e0e0e;
1492
1337
  }
1493
1338
  @keyframes jump {
1494
1339
  40% {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "uibee",
3
- "version": "2.4.11",
3
+ "version": "2.4.13",
4
4
  "description": "Shared components, functions and hooks for reuse across Login projects",
5
5
  "homepage": "https://github.com/Login-Linjeforening-for-IT/uibee#readme",
6
6
  "bugs": {
@@ -31,8 +31,8 @@
31
31
  "lint": "eslint --fix ./src"
32
32
  },
33
33
  "peerDependencies": {
34
- "next": "^15.0.0",
35
- "react": "^19.1.1"
34
+ "next": "^16.0.10",
35
+ "react": "^19.2.3"
36
36
  },
37
37
  "devDependencies": {
38
38
  "@eslint/eslintrc": "^3.3.3",
@@ -51,8 +51,6 @@
51
51
  },
52
52
  "dependencies": {
53
53
  "lucide-react": "^0.555.0",
54
- "next": "16.0.7",
55
- "react": "19.2.1",
56
- "react-dom": "19.2.1"
54
+ "react-dom": "19.2.3"
57
55
  }
58
56
  }
@@ -6,7 +6,7 @@ import LogoSmall from '@components/logo/logoSmall'
6
6
  import LanguageToggle from '@components/toggle/language'
7
7
  import ThemeToggle from '@components/toggle/theme'
8
8
  import { Language } from 'uibee/components'
9
- import { LogOut } from 'lucide-react'
9
+ import { LogOut, User } from 'lucide-react'
10
10
 
11
11
 
12
12
  function hamburgerStyle (isOpen: boolean, isSecond?: boolean) {
@@ -114,7 +114,7 @@ export default function Navbar({
114
114
  function AuthButton({ profileURL, token }: { profileURL?: string, token?: string | null }) {
115
115
 
116
116
  return (
117
- <div className='rounded-[0.3rem] hover:bg-[#6464641a] h-12 w-12'>
117
+ <div className='rounded-[0.3rem] hover:bg-login-300/20 h-12 w-12'>
118
118
  {token ? (
119
119
  <>
120
120
  <Link
@@ -133,15 +133,7 @@ function AuthButton({ profileURL, token }: { profileURL?: string, token?: string
133
133
  href={profileURL}
134
134
  className='grid items-center justify-center h-full w-full'
135
135
  >
136
- <div className={`relative w-[30px] h-5
137
- before:content-[""] before:absolute before:top-0 before:left-1/2 before:-translate-x-1/2
138
- before:w-2.5 before:h-2.5 before:border-2 before:border-login-50
139
- before:rounded-full before:bg-transparent
140
- after:content-[""] after:absolute after:bottom-0 after:left-1/2 after:-translate-x-1/2
141
- after:w-[18px] after:h-2 after:border-2 after:border-login-50
142
- after:rounded-t-[22px] after:border-b-0 after:bg-transparent
143
- `}
144
- />
136
+ <User size={24} />
145
137
  </Link>
146
138
  }
147
139
  </>
@@ -150,15 +142,7 @@ function AuthButton({ profileURL, token }: { profileURL?: string, token?: string
150
142
  href='/api/login'
151
143
  className='grid items-center justify-center h-full w-full'
152
144
  >
153
- <div className={`relative w-[30px] h-5
154
- before:content-[""] before:absolute before:top-0 before:left-1/2 before:-translate-x-1/2
155
- before:w-2.5 before:h-2.5 before:border-2 before:border-login-50
156
- before:rounded-full before:bg-transparent
157
- after:content-[""] after:absolute after:bottom-0 after:left-1/2 after:-translate-x-1/2
158
- after:w-[18px] after:h-2 after:border-2 after:border-login-50
159
- after:rounded-t-[22px] after:border-b-0 after:bg-transparent
160
- `}
161
- />
145
+ <User size={24} />
162
146
  </Link>
163
147
  )}
164
148
  </div>
package/src/globals.css CHANGED
@@ -34,6 +34,8 @@
34
34
  --color-login-200: #727272;
35
35
  --color-login-100: #b0b0b0;
36
36
  --color-login-50: #ededed;
37
+
38
+ --color-login-text: #ededed;
37
39
  }
38
40
 
39
41
  @utility noscroll {
@@ -53,7 +55,7 @@
53
55
  :root {
54
56
  transition:
55
57
  background 0.4s,
56
- color 0.4s;
58
+ color 0.4s,
57
59
  }
58
60
 
59
61
  .dark {
@@ -72,6 +74,8 @@
72
74
  --color-login-200: #6b6b6b;
73
75
  --color-login-100: #b0b0b0;
74
76
  --color-login-50: #ededed;
77
+
78
+ --color-login-text: #ededed;
75
79
  }
76
80
 
77
81
  .light {
@@ -90,6 +94,8 @@
90
94
  --color-login-200: #fafafa;
91
95
  --color-login-100: #fcfcfc;
92
96
  --color-login-50: #ffffff;
97
+
98
+ --color-login-text: #0e0e0e;
93
99
  }
94
100
 
95
101
  @keyframes jump {