created a central area thinner than banners
This commit is contained in:
@@ -14,16 +14,16 @@ pre.banner.pause {
|
||||
pre.banner.reverse {
|
||||
animation-direction: reverse;
|
||||
}
|
||||
pre.banner.t0_5 {
|
||||
pre.banner.t05 {
|
||||
animation-duration: 0.5s;
|
||||
}
|
||||
pre.banner.t1_0 {
|
||||
pre.banner.t10 {
|
||||
animation-duration: 1s;
|
||||
}
|
||||
pre.banner.t1_5 {
|
||||
pre.banner.t15 {
|
||||
animation-duration: 1.5s;
|
||||
}
|
||||
pre.banner.t2_0 {
|
||||
pre.banner.t20 {
|
||||
animation-duration: 2s;
|
||||
}
|
||||
@keyframes slide {
|
||||
|
||||
@@ -1,27 +1,27 @@
|
||||
|
||||
#cv_infos {
|
||||
margin: 10px 10px 30px 10px;
|
||||
#cv {
|
||||
}
|
||||
#cv_infos h1,
|
||||
#cv_infos h2,
|
||||
#cv_infos h3,
|
||||
#cv_infos h4,
|
||||
#cv_infos h5,
|
||||
#cv_infos h6 {
|
||||
|
||||
#cv h1,
|
||||
#cv h2,
|
||||
#cv h3,
|
||||
#cv h4,
|
||||
#cv h5,
|
||||
#cv h6 {
|
||||
/*
|
||||
place-self: center;
|
||||
margin-left: var(--list-padding);
|
||||
*/
|
||||
}
|
||||
#cv_infos details {
|
||||
#cv details {
|
||||
margin: 10px 0px;
|
||||
}
|
||||
#cv_infos summary {
|
||||
#cv summary {
|
||||
/*
|
||||
*/
|
||||
margin-left: var(--list-padding);
|
||||
}
|
||||
#cv_infos summary + * {
|
||||
#cv summary + * {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
|
||||
.mouse {
|
||||
position: relative;
|
||||
margin: 0px;
|
||||
margin: 20px 0px;
|
||||
}
|
||||
.frames_container {
|
||||
display: grid;
|
||||
@@ -48,6 +48,7 @@ pre.frame.f4 {animation-delay: calc(var(--tframes) * 75/100);}
|
||||
|
||||
#mouse_1 {
|
||||
place-self: center;
|
||||
margin: auto;
|
||||
}
|
||||
#mouse_2 {
|
||||
left: 10%;
|
||||
|
||||
5
styles/elements/sections.css
Normal file
5
styles/elements/sections.css
Normal file
@@ -0,0 +1,5 @@
|
||||
section {
|
||||
justify-self: center;
|
||||
margin: 50px 20px;
|
||||
}
|
||||
|
||||
@@ -1,24 +0,0 @@
|
||||
|
||||
#test::after {
|
||||
content: " \a \a \a \a \a \a \a \a \a \a \a \a \a \a \a ";
|
||||
white-space: pre-wrap;
|
||||
/*
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
*/
|
||||
}
|
||||
@@ -5,10 +5,12 @@ html {
|
||||
--small-space: 10px;
|
||||
--medium-space: calc(var(--small-space) * 3);
|
||||
--big-space: calc(var(--small-space) * 10);
|
||||
--list-padding: 40px;
|
||||
--list-padding: 10px;
|
||||
}
|
||||
body {
|
||||
overflow-x: hidden;
|
||||
margin: auto;
|
||||
width: fit-content;
|
||||
}
|
||||
figure {
|
||||
overflow: hidden;
|
||||
@@ -25,10 +27,9 @@ pre {
|
||||
grid
|
||||
*/
|
||||
|
||||
#personnal_infos { grid-area: infos; }
|
||||
#role_title { grid-area: title; }
|
||||
#cv_infos { grid-area: cv; }
|
||||
#mouse_1 { grid-area: mouse_1; }
|
||||
#infos { grid-area: infos; }
|
||||
#title_area { grid-area: title; }
|
||||
#cv { grid-area: cv; }
|
||||
#mouse_2 { grid-area: mouse_2; }
|
||||
#mouse_3 { grid-area: mouse_3; }
|
||||
#mouse_4 { grid-area: mouse_4; }
|
||||
@@ -37,24 +38,29 @@ pre {
|
||||
#banner_3 { grid-area: banner_3;}
|
||||
#banner_4 { grid-area: banner_4;}
|
||||
#banner_5 { grid-area: banner_5;}
|
||||
#banner_6 { grid-area: banner_6;}
|
||||
#banner_7 { grid-area: banner_7;}
|
||||
#banner_8 { grid-area: banner_8;}
|
||||
|
||||
body {
|
||||
/*
|
||||
*/
|
||||
margin: 0px;
|
||||
display: grid;
|
||||
grid:
|
||||
' title ' auto
|
||||
' banner_1 ' auto
|
||||
' mouse_1 ' auto
|
||||
' banner_2 ' auto
|
||||
' cv ' auto
|
||||
' banner_3 ' auto
|
||||
' banner_4 ' auto
|
||||
' mouse_2 ' auto
|
||||
' mouse_3 ' auto
|
||||
' banner_5 ' auto
|
||||
' mouse_4 ' auto
|
||||
' infos ' auto
|
||||
/ 1fr ;
|
||||
' banner_1 banner_1 banner_1 ' auto
|
||||
' . title . ' auto
|
||||
' banner_2 banner_2 banner_2 ' auto
|
||||
' . cv . ' auto
|
||||
' banner_3 banner_3 banner_3 ' auto
|
||||
' . mouse_2 . ' auto
|
||||
' banner_4 banner_4 banner_4 ' auto
|
||||
' banner_5 banner_5 banner_5 ' auto
|
||||
' . mouse_3 . ' auto
|
||||
' banner_6 banner_6 banner_6 ' auto
|
||||
' banner_7 banner_7 banner_7 ' auto
|
||||
' . mouse_4 . ' auto
|
||||
' banner_8 banner_8 banner_8 ' auto
|
||||
' . infos . ' auto
|
||||
/ 1fr auto 1fr ;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user