Skip to content

Commit d64195b

Browse files
AlbanSdlAlbanSdl
committed
fix: improve css
1 parent 45eda89 commit d64195b

24 files changed

+672
-566
lines changed

‎front/public/locales/fr/common.json.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -52,4 +52,6 @@ export default {
5252
'admin.placeholder_debtor_addr_1': 'Adresse du débiteur (ligne 1)',
5353
'admin.placeholder_debtor_addr_2': 'Adresse du débiteur (ligne 2)',
5454
'admin.placeholder_configure': 'Configurer',
55+
'admin.configure': "Editer la configuration de l'export",
56+
'legals.back': 'Retourner au site',
5557
} as const;

‎front/src/app/admin/page.tsx‎

Lines changed: 65 additions & 70 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,16 @@
11
'use client';
22

3-
import { useAppTranslation } from '@/lib/i18n';
43
import styles from './style.module.scss';
4+
import { useEffect, useState } from 'react';
5+
import { useAppTranslation } from '@/lib/i18n';
56
import { usePageSettings } from '@/module/pageSettings';
67
import { useConnectedUser } from '@/module/user';
7-
import Link from '@/components/UI/Link';
8-
import { useEffect, useState } from 'react';
98
import { API, useAPI } from '@/api/api';
109
import Input from '@/components/UI/Input';
1110
import TextArea from '@/components/UI/TextArea';
1211
import Button from '@/components/UI/Button';
12+
import AppModal from '@/components/toplevel/AppModal';
13+
import Icons from '@/icons';
1314

1415
function str2ab(str: string) {
1516
const buf = new ArrayBuffer(str.length);
@@ -127,73 +128,67 @@ export default function AdminPage() {
127128
};
128129

129130
return (
130-
<div className={styles.page}>
131-
<div className={styles.mod}>
132-
<div className={styles.title}>
133-
{t('common:dashboard.hi')}{' '}
134-
<span className={styles.bluePart}>
135-
<span className={styles.nope}>{user?.firstName}</span>
136-
</span>{' '}
137-
🐩
138-
</div>
139-
{hasLoaded ? (
140-
hasSettingsOpen ? (
141-
<div className={styles.margin}>
142-
<Input
143-
className={[!status.debtor_name ? styles.required : '', styles.in].join(' ')}
144-
value={debtorName}
145-
placeholder={t('common:admin.placeholder_debtor_name')}
146-
onChange={setDebtorName}
147-
/>
148-
<Input
149-
className={[!status.debtor_iban ? styles.required : '', styles.in].join(' ')}
150-
value={debtorIban}
151-
placeholder={t('common:admin.placeholder_debtor_iban')}
152-
onChange={setDebtorIban}
153-
/>
154-
<Input
155-
className={[!status.debtor_bic ? styles.required : '', styles.in].join(' ')}
156-
value={debtorBic}
157-
placeholder={t('common:admin.placeholder_debtor_bic')}
158-
onChange={setDebtorBic}
159-
/>
160-
<Input
161-
className={[!status.debtor_address ? styles.required : '', styles.in].join(' ')}
162-
value={debtorAddr1}
163-
placeholder={t('common:admin.placeholder_debtor_addr_1')}
164-
onChange={setDebtorAddr1}
165-
/>
166-
<Input
167-
className={[!status.debtor_address ? styles.required : '', styles.in].join(' ')}
168-
value={debtorAddr2}
169-
placeholder={t('common:admin.placeholder_debtor_addr_2')}
170-
onChange={setDebtorAddr2}
171-
/>
172-
<Button onClick={submitSettings}>{t('common:admin.placeholder_configure')}</Button>
173-
</div>
174-
) : (
175-
<div className={styles.margin}>
176-
<TextArea
177-
placeholder={t('common:admin.private_key')}
178-
buttonText={t('common:admin.generate')}
179-
onChange={setPrivateKey}
180-
value={privateKey}
181-
onEnter={() => downloadReport(api, privateKey)}
182-
/>
183-
</div>
184-
)
185-
) : (
186-
<div className={styles.loading}>{t('common:admin.loading')}</div>
187-
)}
188-
</div>
189-
<div className={styles.bottomNotes}>
190-
<div>© 2025 UTT NET GROUP</div>
191-
<div>BuckUTT</div>
192-
<div>BDE UTT</div>
193-
<Link className={styles.bottomLink} href={'/legal'}>
194-
{t('common:legals')}
195-
</Link>
131+
<AppModal>
132+
<div className={styles.title}>
133+
{t('common:dashboard.hi')}{' '}
134+
<span className={styles.bluePart}>
135+
<span className={styles.nope}>{user?.firstName}</span>
136+
</span>{' '}
137+
🐩
196138
</div>
197-
</div>
139+
{hasLoaded ? (
140+
hasSettingsOpen ? (
141+
<div className={styles.margin}>
142+
<Input
143+
className={[!status.debtor_name ? styles.required : '', styles.in].join(' ')}
144+
value={debtorName}
145+
placeholder={t('common:admin.placeholder_debtor_name')}
146+
onChange={setDebtorName}
147+
/>
148+
<Input
149+
className={[!status.debtor_iban ? styles.required : '', styles.in].join(' ')}
150+
value={debtorIban}
151+
placeholder={t('common:admin.placeholder_debtor_iban')}
152+
onChange={setDebtorIban}
153+
/>
154+
<Input
155+
className={[!status.debtor_bic ? styles.required : '', styles.in].join(' ')}
156+
value={debtorBic}
157+
placeholder={t('common:admin.placeholder_debtor_bic')}
158+
onChange={setDebtorBic}
159+
/>
160+
<Input
161+
className={[!status.debtor_address ? styles.required : '', styles.in].join(' ')}
162+
value={debtorAddr1}
163+
placeholder={t('common:admin.placeholder_debtor_addr_1')}
164+
onChange={setDebtorAddr1}
165+
/>
166+
<Input
167+
className={[!status.debtor_address ? styles.required : '', styles.in].join(' ')}
168+
value={debtorAddr2}
169+
placeholder={t('common:admin.placeholder_debtor_addr_2')}
170+
onChange={setDebtorAddr2}
171+
/>
172+
<Button onClick={submitSettings}>{t('common:admin.placeholder_configure')}</Button>
173+
</div>
174+
) : (
175+
<div className={styles.margin}>
176+
<TextArea
177+
placeholder={t('common:admin.private_key')}
178+
buttonText={t('common:admin.generate')}
179+
onChange={setPrivateKey}
180+
value={privateKey}
181+
onEnter={() => !!privateKey && downloadReport(api, privateKey)}
182+
/>
183+
<Button className={styles.configure} onClick={() => setSettingsOpen(true)}>
184+
<Icons.CircleWarning />
185+
{t('common:admin.configure')}
186+
</Button>
187+
</div>
188+
)
189+
) : (
190+
<div className={styles.loading}>{t('common:admin.loading')}</div>
191+
)}
192+
</AppModal>
198193
);
199194
}

‎front/src/app/admin/style.module.scss‎

Lines changed: 33 additions & 74 deletions
Original file line numberDiff line numberDiff line change
@@ -1,85 +1,44 @@
11
@use '@/variables.scss' as *;
22

3-
.page {
4-
width: 100%;
5-
height: 100%;
6-
position: relative;
7-
background-color: $background-dark;
8-
display: flex;
9-
align-items: center;
10-
justify-content: center;
11-
flex-flow: column nowrap;
12-
13-
.mod {
14-
justify-content: center;
15-
padding: 30px 50px;
16-
background-color: $background-light;
17-
border-radius: 20px;
18-
width: 90%;
19-
max-width: 1200px;
20-
21-
> * {
22-
display: block;
23-
}
24-
25-
.title {
26-
font-size: 2.2rem;
27-
color: $background-dark;
28-
29-
.bluePart {
30-
color: $buck-dark-blue;
31-
.nope {
32-
text-decoration: line-through;
33-
text-decoration-thickness: 3px;
34-
}
35-
}
3+
.title {
4+
font-size: 2.2rem;
5+
@include text-dark;
6+
7+
.bluePart {
8+
@include text-blue;
9+
.nope {
10+
text-decoration: line-through;
11+
text-decoration-thickness: 3px;
3612
}
13+
}
14+
}
3715

38-
.margin {
39-
padding: 15px 0;
40-
}
16+
.margin {
17+
padding: 15px 0;
18+
}
4119

42-
.in {
43-
margin-bottom: 0.8em;
44-
}
20+
.in {
21+
margin-bottom: 0.8em;
22+
}
4523

46-
.loading {
47-
text-align: center;
48-
font-size: 1.5rem;
49-
padding: 30px 0;
50-
}
24+
.loading {
25+
text-align: center;
26+
font-size: 1.5rem;
27+
padding: 30px 0;
28+
}
5129

52-
.required {
53-
& ::placeholder {
54-
color: crimson;
55-
}
56-
border-color: crimson;
57-
}
30+
.required {
31+
& ::placeholder {
32+
color: crimson;
5833
}
34+
border-color: crimson;
35+
}
5936

60-
.bottomNotes {
61-
position: absolute;
62-
bottom: 10px;
63-
display: flex;
64-
flex-flow: row wrap;
65-
gap: 20px;
66-
color: $background-light;
67-
68-
& > :not(:first-child) {
69-
position: relative;
70-
71-
&::before {
72-
content: '';
73-
display: inline-block;
74-
position: absolute;
75-
left: -15px;
76-
top: 50%;
77-
width: 5px;
78-
height: 5px;
79-
border-radius: 50%;
80-
background-color: $background-light;
81-
transform: translate(50%, -50%);
82-
}
83-
}
37+
.configure {
38+
margin-top: 2em;
39+
& > * {
40+
height: 1.1em;
41+
margin-right: 1ch;
42+
vertical-align: text-bottom;
8443
}
8544
}

‎front/src/app/legal/page.tsx‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,14 @@
11
'use client';
22
import { usePageSettings } from '@/module/pageSettings';
33
import styles from './style.module.scss';
4+
import { useRouter } from 'next/navigation';
5+
import { useAppTranslation } from '@/lib/i18n';
6+
import Icons from '@/icons';
47

58
export default function LegalPage() {
69
usePageSettings({ permissions: 'public', needsLoading: false });
10+
const { t } = useAppTranslation();
11+
const rt = useRouter();
712

813
// Associtation Informations
914
const ASSOCIATION_NAME = 'ASS UTT NET GROUP';
@@ -24,6 +29,11 @@ export default function LegalPage() {
2429
return (
2530
<div id="legal" className={styles.legal}>
2631
<div className={styles.container}>
32+
<div className={styles.back} onClick={() => rt.back()}>
33+
<Icons.LeftArrow />
34+
{t('common:legals.back')}
35+
</div>
36+
<br />
2737
Cette page a été mise à jour le {LAST_TERMS_UPDATE}.<h1>Mentions légales</h1>
2838
<p>
2939
Le site web BuckUTT est développé, maintenu et hébergé par :<br />

‎front/src/app/legal/style.module.scss‎

Lines changed: 21 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
@use '@/variables.scss' as *;
22

33
.legal {
4+
@include background;
45
width: 100%;
56
height: 100%;
6-
background-color: $background-dark;
77
display: flex;
88
align-items: center;
99
justify-content: center;
@@ -16,10 +16,29 @@
1616
max-height: 95%;
1717
overflow: scroll;
1818

19+
@include box-light;
1920
padding: 50px 50px 30px;
20-
background-color: $background-light;
2121
border-radius: 20px;
2222

23+
.back {
24+
cursor: pointer;
25+
user-select: none;
26+
text-transform: uppercase;
27+
font-weight: bold;
28+
@include ctx-button;
29+
border-radius: 1.2em;
30+
padding: 0.2em 0.5ch;
31+
display: inline-flex;
32+
flex-flow: row nowrap;
33+
align-items: center;
34+
gap: 0.5ch;
35+
36+
svg {
37+
height: 1.1em;
38+
stroke-width: 3px;
39+
}
40+
}
41+
2342
> h1 {
2443
font-size: 2.5rem;
2544
font-weight: 700;

‎front/src/app/login/page.tsx‎

Lines changed: 3 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -2,25 +2,15 @@
22
import styles from './style.module.scss';
33
import LoginForm from '@/components/auth/LoginForm';
44
import { setPageParams, usePageSettings } from '@/module/pageSettings';
5-
import { useAppTranslation } from '@/lib/i18n';
6-
import Link from '@/components/UI/Link';
5+
import AppModal from '@/components/toplevel/AppModal';
76

87
export default function LoginPage() {
98
usePageSettings({ hasNavbar: false, permissions: 'public', needsLoading: false });
109
setPageParams({ title: 'Login' });
11-
const { t } = useAppTranslation();
1210

1311
return (
14-
<div id="login-page" className={styles.loginPage}>
12+
<AppModal className={styles.noWidth}>
1513
<LoginForm />
16-
<div className={styles.bottomNotes}>
17-
<div>© 2025 UTT NET GROUP</div>
18-
<div>BuckUTT</div>
19-
<div>BDE UTT</div>
20-
<Link className={styles.bottomLink} href={'/legal'}>
21-
{t('common:legals')}
22-
</Link>
23-
</div>
24-
</div>
14+
</AppModal>
2515
);
2616
}

0 commit comments

Comments
 (0)