pederbs
/
RPGs3_card_insanity
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

add scss files

This commit is contained in:
Peder Bergebakken Sundt 2019-09-09 22:22:09 +02:00
parent 1fe36b2463
commit 7368dd3a64
2 changed files with 228 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

114
sass/classic.scss Normal file
View File

@ -0,0 +1,114 @@
.classic {
--figure-size: 0.9in;
width: 2.5in;
height: 3.5in;
box-sizing: border-box;
border-radius: 2mm;
border-width: 2mm;
border-color: black;
border-style: solid;
background-color: #444;
font-size: 3mm;
font-family: sans-serif;
display: grid;
grid-template-columns: 5fr 3fr;
grid-template-rows: 1.5em var(--figure-size) 2.1em auto;
grid-template-areas:
"title title"
"figure properties"
"costbar costbar"
"description description";
header {
grid-area: title;
font-size: 1.5em;
line-height: 1em;
margin-top: -1mm;
border-radius: 1mm 1mm 0 0;
text-align: center;
background-color: #222;
border-radius: 0;
color: white;
}
figure {
grid-area: figure;
background-color: #333;
overflow: hidden;
position: relative;
border-radius: 0;
margin: 0;
div {
color: #bbb;
position: absolute;
top:0;right:0;left:0;bottom:0;
height: var(--figure-size);
width: var(--figure-size);
margin: auto;
text-align: center;
>* {
width: 100%;
height: 100%;
}
.mdi,
.fa,
.material-icons.figure {
font-size: calc(var(--figure-size) * 0.9);
line-height: var(--figure-size);
}
.lnr{
font-size: calc(var(--figure-size) * 0.8);
line-height: var(--figure-size);
}
}
}
aside {
grid-area: properties;
border-left: solid 0.3mm black;
background-color: #aaa;
padding: 0.5mm;
ul {
list-style-type: none;
padding: 0;
li{
}
}
}
summary {
grid-area: costbar;
border-radius: 0;
background-color: black;
color:white;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
justify-content: center;
text-align: center;
section{
font-size: 0.8em;
margin-left: 0.5mm;
margin-right: 0.5mm;
line-height: 0.9em;
}
}
article {
grid-area: description;
margin: 1mm;
border-radius: 1mm;
background-color: #aaa;
ul, ol {
padding-left: 1.5em;
li {
}
}
}
}

114
sass/classic_white.scss Normal file
View File

@ -0,0 +1,114 @@
.classic_white {
--figure-size: 0.9in;
width: 2.5in;
height: 3.5in;
box-sizing: border-box;
border-radius: 0mm;
border-width: 0.3mm;
border-color: black;
border-style: solid;
background-color: #fff;
font-size: 3mm;
font-family: sans-serif;
display: grid;
grid-template-columns: 5fr 3fr;
grid-template-rows: 1.6em var(--figure-size) 2.1em auto;
grid-template-areas:
"title title"
"figure properties"
"costbar costbar"
"description description";
header {
grid-area: title;
font-size: 1.5em;
line-height: 1em;
border-radius: 1mm 1mm 0 0;
text-align: center;
background-color: #ddd;
border-radius: 0;
color: #333;
}
figure {
grid-area: figure;
background-color: #fff;
overflow: hidden;
position: relative;
border-radius: 0;
margin: 0;
div {
color: #555; // default color
position: absolute;
top:0;right:0;left:0;bottom:0;
height: var(--figure-size);
width: var(--figure-size);
margin: auto;
text-align: center;
>* {
width: 100%;
height: 100%;
}
.mdi,
.fa,
.material-icons.figure {
font-size: calc(var(--figure-size) * 0.9);
line-height: var(--figure-size);
}
.lnr{
font-size: calc(var(--figure-size) * 0.8);
line-height: var(--figure-size);
}
}
}
aside {
grid-area: properties;
border-left: solid 0.3mm #ccc;
background-color: #ddd;
color: #444 ;
padding: 0.5mm;
ul {
list-style-type: none;
padding: 0;
li{
}
}
}
summary {
grid-area: costbar;
border-radius: 0;
background-color: #555;
color: white;
display: flex;
flex-direction: row;
flex-wrap: nowrap;
align-items: center;
justify-content: center;
text-align: center;
section{
font-size: 0.8em;
margin-left: 0.5mm;
margin-right: 0.5mm;
line-height: 0.9em;
}
}
article {
grid-area: description;
margin: 1mm;
border-radius: 1mm;
background-color: #ddd;
ul, ol {
padding-left: 1.5em;
li {
}
}
}
}