Skip to content

Commit 6c06b97

Browse files
committed
Arlon thème
1 parent c90dbd4 commit 6c06b97

File tree

11 files changed

+244
-14
lines changed

11 files changed

+244
-14
lines changed

arlon/assets/svg/a-svg.svg

Lines changed: 1 addition & 0 deletions
Loading

arlon/assets/svg/close.svg

Lines changed: 0 additions & 1 deletion
This file was deleted.

arlon/assets/svg/logo.svg

Lines changed: 1 addition & 0 deletions
Loading

arlon/assets/svg/triangle.svg

Lines changed: 1 addition & 0 deletions
Loading

arlon/icons/favicon.ico

-14.7 KB
Binary file not shown.

arlon/icons/logo.png

35.1 KB
Loading

arlon/icons/manifest.webmanifest

Lines changed: 65 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,65 @@
1+
{
2+
"dir": "auto",
3+
"lang": "en-US",
4+
"display": "standalone",
5+
"orientation": "any",
6+
"start_url": "/?homescreen=1",
7+
"background_color": "#fff",
8+
"theme_color": "#fff",
9+
"icons": [
10+
{
11+
"src": "android-chrome-36x36.png",
12+
"sizes": "36x36",
13+
"type": "image/png",
14+
"purpose": "any"
15+
},
16+
{
17+
"src": "android-chrome-48x48.png",
18+
"sizes": "48x48",
19+
"type": "image/png",
20+
"purpose": "any"
21+
},
22+
{
23+
"src": "android-chrome-72x72.png",
24+
"sizes": "72x72",
25+
"type": "image/png",
26+
"purpose": "any"
27+
},
28+
{
29+
"src": "android-chrome-96x96.png",
30+
"sizes": "96x96",
31+
"type": "image/png",
32+
"purpose": "any"
33+
},
34+
{
35+
"src": "android-chrome-144x144.png",
36+
"sizes": "144x144",
37+
"type": "image/png",
38+
"purpose": "any"
39+
},
40+
{
41+
"src": "android-chrome-192x192.png",
42+
"sizes": "192x192",
43+
"type": "image/png",
44+
"purpose": "any"
45+
},
46+
{
47+
"src": "android-chrome-256x256.png",
48+
"sizes": "256x256",
49+
"type": "image/png",
50+
"purpose": "any"
51+
},
52+
{
53+
"src": "android-chrome-384x384.png",
54+
"sizes": "384x384",
55+
"type": "image/png",
56+
"purpose": "any"
57+
},
58+
{
59+
"src": "android-chrome-512x512.png",
60+
"sizes": "512x512",
61+
"type": "image/png",
62+
"purpose": "any"
63+
}
64+
]
65+
}

arlon/src/scss/banner.scss

Lines changed: 116 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,116 @@
1+
// sub header
2+
html:has(body.section-home-page) {
3+
overflow-x: hidden;
4+
}
5+
6+
.smartweb_herobanner {
7+
width: 100%;
8+
9+
.swiper-wrapper {
10+
padding-bottom: 0;
11+
}
12+
13+
.section-slide {
14+
padding-bottom: 0;
15+
16+
&::before {
17+
content: "Bienvune à";
18+
font-weight: 300;
19+
margin-left: 11%;
20+
font-size: 7.9vw;
21+
font-size: clamp(1rem, 7.9vw, 48px);
22+
23+
@media screen and (min-width: 992px) {
24+
margin-left: 23.5%;
25+
}
26+
}
27+
28+
&::after {
29+
content: "Authentique & attractive";
30+
display: block;
31+
font-weight: 300;
32+
margin-left: auto;
33+
font-size: 7.9vw;
34+
font-size: clamp(1rem, 7.9vw, 48px);
35+
max-width: 51.4vw;
36+
37+
@media screen and (min-width: 992px) {
38+
max-width: 330px;
39+
margin-right: 154px;
40+
}
41+
}
42+
43+
.swiper-banner-image {
44+
position: relative !important;
45+
mask-image: url("../../assets/svg/logo.svg");
46+
mask-size: cover;
47+
mask-repeat: no-repeat;
48+
mask-position: center;
49+
// padding-bottom: 24%;
50+
// top: 50% !important;
51+
// transform: translateY(-50%);
52+
aspect-ratio: 4.2;
53+
}
54+
}
55+
}
56+
57+
.section-home-page {
58+
position: relative;
59+
background-color: #f5f4ea;
60+
}
61+
62+
.section-home-page.userrole-anonymous {
63+
position: relative;
64+
background-color: #f5f4ea;
65+
66+
#portal-header {
67+
margin-bottom: 0;
68+
}
69+
70+
#content-header {
71+
position: relative;
72+
}
73+
74+
#portal-header #portal-header-top::after {
75+
display: none;
76+
}
77+
78+
&::before {
79+
content: "";
80+
display: block;
81+
width: 74%;
82+
max-width: 900px;
83+
aspect-ratio: 1;
84+
background-color: #fce1ce;
85+
z-index: 0;
86+
position: absolute;
87+
border-radius: 100%;
88+
top: 0;
89+
transform: translate(-123%, -9%);
90+
left: 50%;
91+
92+
@media screen and (min-width: 992px) {
93+
transform: translate(-123%, -25%);
94+
}
95+
}
96+
97+
&::after {
98+
content: "";
99+
background: url("../../assets/svg/triangle.svg");
100+
background-size: contain;
101+
background-repeat: no-repeat;
102+
display: block;
103+
width: 74%;
104+
max-width: 760px;
105+
aspect-ratio: 1.1;
106+
position: absolute;
107+
z-index: -1;
108+
top: 0;
109+
transform: translate(29%, 29%);
110+
left: 50%;
111+
112+
@media screen and (min-width: 992px) {
113+
transform: translate(25%, 29%);
114+
}
115+
}
116+
}

arlon/src/scss/main.scss

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,5 @@ $enable-roboto-webfont: false;
1414

1515
@import "./variables";
1616
@import "../../../base/src/scss/main";
17-
18-
//// STYLES
19-
20-
// ... add your styles here
17+
@import "./banner";
18+
@import "./quick-access";

arlon/src/scss/quick-access.scss

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
.quick-access {
2+
position: relative;
3+
4+
.section-container {
5+
padding: 0 !important;
6+
7+
& > div {
8+
box-shadow: 0 9px 45px rgba(3, 7, 18, 16%);
9+
border-radius: 50px;
10+
background-color: #fff;
11+
justify-content: center;
12+
align-items: center;
13+
padding: 25px 0;
14+
15+
@media screen and (min-width: 992px) {
16+
display: flex;
17+
}
18+
}
19+
20+
.section-title {
21+
font-size: 20px;
22+
margin: 0;
23+
max-width: 280px;
24+
padding-left: 30px;
25+
}
26+
27+
.row {
28+
// display: grid;
29+
// grid-template-columns: repeat(6, 1fr);
30+
// padding: 0 30px;
31+
// margin-bottom: 0;
32+
display: flex;
33+
flex-wrap: nowrap;
34+
overflow-x: auto; /* permet le scroll horizontal */
35+
gap: 1rem;
36+
list-style: none;
37+
padding: 0;
38+
margin: 0;
39+
scroll-snap-type: x mandatory; /* optionnel : snap au scroll */
40+
41+
li {
42+
width: auto;
43+
padding: 0;
44+
flex: 0 0 auto; /* empêche les éléments de rétrécir */
45+
scroll-snap-align: start; /* optionnel : effet snap */
46+
}
47+
}
48+
}
49+
}

0 commit comments

Comments
 (0)