interaktionsweise/hippie
1
1
Fork 0
Code Issues Pull requests Releases 3 Activity Actions

Rework of the sass card module

Browse source
This commit is contained in:
Stephan 2019-03-24 09:56:34 +01:00
parent 6775ea0712
commit 1acbdf6c95
2 changed files with 37 additions and 37 deletions
Download patch file Download diff file Expand all files Collapse all files

1
source/style/hippie/global/_config.scss
View file

@ -59,6 +59,7 @@ $line_head_basic: $line_text_basic !default;
$family_text_basic: #{'Roboto', 'Segoe UI', 'Liberation Sans', 'Source Sans', 'Trebuchet MS', Helvetica, Arial, sans-serif, sans} !default; $family_text_basic: #{'Roboto', 'Segoe UI', 'Liberation Sans', 'Source Sans', 'Trebuchet MS', Helvetica, Arial, sans-serif, sans} !default;
$family_text_print: #{'Times New Roman', times} !default; $family_text_print: #{'Times New Roman', times} !default;
$family_text_mono: #{'Courier New', monospace} !default; $family_text_mono: #{'Courier New', monospace} !default;
$family_text_card: #{'Trebuchet MS', 'Roboto', 'Segoe UI', 'Liberation Sans', 'Source Sans', 'Trebuchet MS', Helvetica, Arial, sans-serif, sans} !default;
$family_head_basic: $family_text_basic !default; $family_head_basic: $family_text_basic !default;

73
source/style/hippie/modules/card/_card_module.scss
View file

@ -5,29 +5,39 @@
@extend %h_content_full; @extend %h_content_full;
body { body {
.bkg_box {
.bkgBox {
@extend %full_parent; @extend %full_parent;
transition-duration: 800ms; transition-duration: 800ms;
overflow: hidden; overflow: hidden;
vertical-align: top; vertical-align: top;
z-index: -1; z-index: -1;
& > svg {
position: relative;
}
} }
.bkg_box > svg {
position: relative; .cardBox {
}
.flex_wrap_center {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
height: 100%; height: 100vh;
}
.flex_content { * {
position: relative; font-family: $family_text_card;
padding: 64px 64px 24px 64px; text-align: center;
border: 1px solid #FFF; }
background-color: #F5F5F5;
z-index: 40; & > div {
position: relative;
padding: 64px 64px 24px 64px;
border: 1px solid #FFF;
background-color: #F5F5F5;
z-index: 40;
}
} }
h1 { h1 {
margin: 16px 0; margin: 16px 0;
color: #1E1E1E; color: #1E1E1E;
@ -35,6 +45,7 @@
line-height: 1.4em; line-height: 1.4em;
font-weight: normal; font-weight: normal;
} }
p { p {
margin-top: 0; margin-top: 0;
margin-bottom: 16px; margin-bottom: 16px;
@ -42,36 +53,24 @@
line-height: 1.4em; line-height: 1.4em;
} }
// .full {
// position: absolute;
// width: 128px;
// height: 128px;
// top: 16px;
// left: 16px;
// background-color: #fff;
// }
// .mark {
// float: left;
// width: 32px;
// height: 32px;
// margin-top: 16px;
// }
.marked { .marked {
padding-left: 1em; // padding-left: 1em;
text-indent: -1em; // text-indent: -1em;
text-align: center;
&::before { content: "*\0000a0" }
} }
.marked::before { content: "*\0000a0" }
.decent { color: #666 } .decent { color: #666 }
a { a {
color: #000; color: #000;
text-decoration: none; text-decoration: none;
}
a:hover { &:hover {
color: #F4F9FA; color: #F4F9FA;
background-color: #0C85FF; background-color: #0C85FF;
text-decoration: none; text-decoration: none;
}
} }
} }
} }