some modification to global css, but it's not good anymore
This commit is contained in:
@@ -2,19 +2,27 @@
|
||||
#cv {
|
||||
/*
|
||||
place-items: center;
|
||||
*/
|
||||
place-self: stretch;
|
||||
*/
|
||||
}
|
||||
#cv #cv_ascii {
|
||||
/*
|
||||
place-self: center;
|
||||
*/
|
||||
}
|
||||
#cv #cv_download {
|
||||
/*
|
||||
place-self: center;
|
||||
*/
|
||||
}
|
||||
|
||||
#cv details {
|
||||
/*
|
||||
*/
|
||||
margin: 10px 0px 10px 20px;
|
||||
}
|
||||
#cv summary + * {
|
||||
/*
|
||||
*/
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
@@ -2,7 +2,8 @@
|
||||
/*
|
||||
DATA-FLEX
|
||||
|
||||
direction width position main axis cross axis
|
||||
direction width childrens childrens childrens
|
||||
position main axis cross axis
|
||||
|
||||
[/]-horizontal [/]-parent [/]-center [/]-pack [/]-fit
|
||||
[/] vertical [/] content [/] left [/]-wrap [/] stretch
|
||||
@@ -31,32 +32,32 @@
|
||||
/*
|
||||
width : -parent- content
|
||||
*/
|
||||
[data-flex~="parent"] { width: auto; }
|
||||
[data-flex~="parent"] { width: 100%; }
|
||||
[data-flex~="content"] { width: fit-content; }
|
||||
/*
|
||||
position : -center- left right top bottom
|
||||
*/
|
||||
[data-flex~="left"] ,[data-flex~="vertical"][data-flex~="left"] { align-items: flex-start; text-align: left; }
|
||||
[data-flex~="right"] ,[data-flex~="vertical"][data-flex~="right"] { align-items: flex-end; text-align: right; }
|
||||
[data-flex~="top"] ,[data-flex~="vertical"][data-flex~="top"] { justify-content: flex-start; }
|
||||
[data-flex~="bottom"] ,[data-flex~="vertical"][data-flex~="bottom"] { justify-content: flex-end; }
|
||||
[data-flex~="center"] ,[data-flex~="vertical"][data-flex~="center"] { align-items: center; text-align: center; }
|
||||
[data-flex~="horizontal"][data-flex~="left"] { justify-content: flex-start; }
|
||||
[data-flex~="horizontal"][data-flex~="right"] { justify-content: flex-end; }
|
||||
[data-flex~="horizontal"][data-flex~="top"] { align-items: flex-start; }
|
||||
[data-flex~="horizontal"][data-flex~="bottom"] { align-items: flex-end; }
|
||||
[data-flex~="horizontal"][data-flex~="center"] { }
|
||||
[data-flex~="vertical"][data-flex~="left"] { align-items: flex-start; }
|
||||
[data-flex~="vertical"][data-flex~="right"] { align-items: flex-end; }
|
||||
[data-flex~="vertical"][data-flex~="top"] { justify-content: flex-start; }
|
||||
[data-flex~="vertical"][data-flex~="bottom"] { justify-content: flex-end; }
|
||||
[data-flex~="vertical"][data-flex~="center"] { align-items: center; }
|
||||
/*
|
||||
main axis : -pack- space spread grow wrap gap
|
||||
*/
|
||||
[data-flex~="pack"] > * ,[data-flex~="vertical"][data-flex~="pack"] > * { flex-grow: 0; }
|
||||
[data-flex~="space"] ,[data-flex~="vertical"][data-flex~="space"] { justify-content: space-around; }
|
||||
[data-flex~="spread"] ,[data-flex~="vertical"][data-flex~="spread"] { justify-content: space-between; }
|
||||
[data-flex~="grow"] > * ,[data-flex~="vertical"][data-flex~="grow"] > * { flex-grow: 1; }
|
||||
[data-flex~="horizontal"][data-flex~="pack"] > * { flex-grow: 0; }
|
||||
[data-flex~="horizontal"][data-flex~="space"] { justify-content: space-around; }
|
||||
[data-flex~="horizontal"][data-flex~="spread"] { justify-content: space-between; }
|
||||
[data-flex~="horizontal"][data-flex~="grow"] > * { flex-grow: 1; }
|
||||
[data-flex~="vertical"][data-flex~="pack"] > * { flex-grow: 0; }
|
||||
[data-flex~="vertical"][data-flex~="space"] { justify-content: space-around; }
|
||||
[data-flex~="vertical"][data-flex~="spread"] { justify-content: space-between; }
|
||||
[data-flex~="vertical"][data-flex~="grow"] > * { flex-grow: 1; }
|
||||
[data-flex~="wrap"] { flex-wrap: wrap; }
|
||||
/*
|
||||
cross axis : -fit- stretch
|
||||
|
||||
@@ -31,6 +31,7 @@ section {
|
||||
#infos { grid-area: infos; }
|
||||
#title_area { grid-area: title; }
|
||||
#cv { grid-area: cv; }
|
||||
#works { grid-area: works; }
|
||||
#mouse_2 { grid-area: mouse_2; }
|
||||
#mouse_3 { grid-area: mouse_3; }
|
||||
#mouse_4 { grid-area: mouse_4; }
|
||||
@@ -51,10 +52,11 @@ section {
|
||||
' banner_1 banner_1 banner_1 ' auto
|
||||
' . title . ' auto
|
||||
' banner_2 banner_2 banner_2 ' auto
|
||||
' . cv . ' auto
|
||||
' . works . ' auto
|
||||
' banner_3 banner_3 banner_3 ' auto
|
||||
' . mouse_2 . ' auto
|
||||
' banner_4 banner_4 banner_4 ' auto
|
||||
' . cv . ' auto
|
||||
' banner_5 banner_5 banner_5 ' auto
|
||||
' . mouse_3 . ' auto
|
||||
' banner_6 banner_6 banner_6 ' auto
|
||||
|
||||
@@ -25,7 +25,10 @@ ul {
|
||||
display: block;
|
||||
list-style-type: "• ";
|
||||
padding-left: 0px;
|
||||
/*
|
||||
list-style-position: outside;
|
||||
*/
|
||||
list-style-position: inside;
|
||||
}
|
||||
li {
|
||||
display: list-item;
|
||||
@@ -34,7 +37,10 @@ li::marker {
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
details summary {
|
||||
/*
|
||||
list-style-position: outside;
|
||||
*/
|
||||
list-style-position: inside;
|
||||
}
|
||||
details summary {
|
||||
font-size: 1.8rem;
|
||||
|
||||
Reference in New Issue
Block a user