worked a bit on display

This commit is contained in:
newick 2019-08-12 21:54:40 +02:00
parent 8ac8b696aa
commit 93b9908a40
3 changed files with 51 additions and 81 deletions

View File

@ -1,68 +1,38 @@
@charset "UTF-8"; @charset "UTF-8";
a { button,
color: $black; input[type="submit"] {
padding-right: 1.5rem;
padding-left: 1.5rem;
font-size: 1.6rem;
line-height: 1;
border: 2px solid $primary_color;
border-radius: 0.3rem;
.icon { &.background-btn {
font-size: 1.5em; font-weight: 600;
&.right{ background-color: $primary_color;
float: right;
display: inline-block; &:hover {
margin: -0.3em 0.4em; background-color: $secondary_color;
border-color: $secondary_color;
}
&.btn_delete {
} }
}
}
// buttons
.btn {
display: inline-block;
padding: 1em;
border-radius: 0.25em;
background: $primary_color;
// color: $light;
border: 0;
margin: 1em;
min-height: 1.5rem;
cursor: pointer;
&:hover {
background-color: $dusty-orange;
} }
}
.btn-block { &.btn_border {
display: block; padding-top: 0.8rem;
font-weight: 600; padding-bottom: 0.8rem;
font-size: 1.25em;
text-align: center;
}
.btn-outline { &:hover {
background: $white; background-color: rgba($primary_color, .2);
border: solid 1px $primary_color; }
}
.btn-next { &.btn_delete {
@extend .striked;
text-align: right; }
width: 100%;
padding: 1em 2em;
a {
display: block;
} }
} }
.striked {
&::after {
content: "";
display: block;
width: 12ch;
height: 4px;
margin-top: -0.7em;
margin-right: 0;
margin-left: auto;
background-color: $primary_color;
}
}

View File

@ -60,8 +60,4 @@ h4,
h5, h5,
h6 { h6 {
font-family: $title_font, "Brie Light", "Arial", "DejaVu Sans Mono"; font-family: $title_font, "Brie Light", "Arial", "DejaVu Sans Mono";
} }
p{
font-family: $default_font;
font-size:14px;
}

View File

@ -1,33 +1,37 @@
@charset "UTF-8"; @charset "UTF-8";
// form inputs input,
.funky-box { select,
//background: $white; textarea {
padding: 1em; padding: 1rem;
border-radius: 0.25em; border-top: none;
border-right: none;
border-bottom: 3px solid $primary_color; border-bottom: 3px solid $primary_color;
border-left: none;
} }
input, input,
textarea, select {
select, display: inline-block;
{
@extend .funky-box;
border:none;
border-bottom:2px solid $primary_color;
color:$black;
} }
input[type="text"],input[type="email"],input[type="password"]{
width: 219px;
height: 36px;
}
textarea { textarea {
margin-top: 1em; width: 100%;
border-left: 3px solid $primary_color; border-left: 3px solid $primary_color;
} }
select,
option {
// delete default display
-webkit-appearance : none;
-moz-appearance : none;
background: none;
border-radius: 0;
// TODO -> check what angular can do + find a way to add the arrow
}
label { label {
&[for] { &[for] {
cursor: pointer; cursor: pointer;