Change hex to hsl

This commit is contained in:
Soldat 2018-10-07 21:33:49 +02:00
parent a78f1101c3
commit cce33d13b3

View File

@ -1,34 +1,34 @@
$first-color: hsl(220, 100%, 50%);
$second-color: #ffdd59;
$second-color: hsl(48, 100%, 67%);
$primary-color: hsl(219.9, 53.7%, 50%);
$secondary-color: #2980b9;
$secondary-color: hsl(204, 64%, 44%);
$primary-color-text: hsl(0, 0%, 100%);
$secondary-color-text: hsla(0, 0%, 0%, 0.87);
$primary-light-color: hsl(219.8, 46.4%, 64.9%);
$primary-dark-color: #2d98da;
$primary-dark-color: hsl(203, 70%, 52%);
$secondary-light-color: hsl(40, 68%, 65%);
$secondary-dark-color: hsl(40, 68%, 35%);
$primary-neutral-color: hsl(219.6, 20.8%, 50%);
$primary-neutral-light-color: #efefef;
$primary-neutral-dark-color: #34495e;
$primary-neutral-light-color: hsl(0, 0%, 94%);
$primary-neutral-dark-color: hsl(210, 29%, 29%);
$secondary-neutral-color: #2980b9;
$secondary-neutral-light-color: #e7e7e7;
$secondary-neutral-color: hsl(204, 64%, 44%);
$secondary-neutral-light-color: hsl(0, 0%, 91%);
$secondary-neutral-dark-color: hsl(40, 57.6%, 17%);
$white-color: hsl(219.6, 20.8%, 98%);
$black-color: hsl(40.0, 0%, 17%);
$faceblue: #3B5998;
$twitblue: #55acee;
$faceblue: hsl(221, 44%, 41%);
$twitblue: hsl(206, 82%, 63%);
$shadow-color: rgb(223, 223, 223);
$background-bouton-color: #e6e6e6;
$background-bouton-color: hsl(0, 0%, 90%);
/*--------------------------------GENERAL------------------------------*/
@ -50,7 +50,7 @@ input[type=button], input[type=submit], input[type=reset],input[type=file] {
box-shadow: $shadow-color 0px 0px 1px;
&:hover {
background: #d3d3d3;
background: hsl(0, 0%, 83%);
}
}
button{
@ -63,7 +63,7 @@ button{
box-shadow: $shadow-color 0px 0px 1px;
cursor: pointer;
&:hover {
background: #d3d3d3;
background: hsl(0, 0%, 83%);
}
}
input,textarea[type=text],[type=number]{
@ -256,7 +256,7 @@ header {
li {
padding: 0.2em;
&:hover {
background: #bcc;
background: hsl(180, 14%, 77%);
}
}
li:last-child {
@ -308,7 +308,7 @@ header {
font-family: FontAwesome;
font-size: 4em;
content: "\f05a";
color: #1e90ff;
color: hsl(210, 100%, 56%);
}
}
#alert_box {
@ -729,14 +729,14 @@ header {
padding-right: 20px;
margin-left: 5px;
border-radius: 20px;
background-color: #ffaa00;
background-color: hsl(40, 100%, 50%);
color: black;
&:hover{
color: black;
background-color: #c99836;
background-color: hsl(40, 58%, 50%);
}
&.delete{
background-color: #cb0000;
background-color: hsl(0, 100%, 40%);
}
}
}
@ -821,11 +821,11 @@ header {
.edit, .moderate, .slideshow{
padding: 5px;
border-radius: 20px;
background-color: #ffaa00;
background-color: hsl(40, 100%, 50%);
color: black;
&:hover{
color: black;
background-color: #c99836;
background-color: hsl(40, 58%, 50%);
}
&:nth-child(2n){
margin-top: 5px;
@ -835,8 +835,8 @@ header {
.tooltip{
visibility: hidden;
width: 120px;
background-color: #f9fafb;
color: #000;
background-color: hsl(210, 20%, 98%);
color: hsl(0, 0%, 0%);
text-align: center;
padding: 5px 0;
border-radius: 6px;
@ -1235,8 +1235,8 @@ u, .underline {
#pict {
display: inline-block;
width: 80%;
background: #333;
border: solid #333 2px;
background: hsl(0, 0%, 20%);
border: solid hsl(0, 0%, 20%) 2px;
}
/*--------------------------------MATMAT-------------------------------*/
.matmat_results {
@ -1290,7 +1290,7 @@ textarea {
#forum {
.button {
background-color: rgb(230, 230, 230);
padding: 7px;
padding: 10px;
font-weight: bold;
border-radius: 5px;
&:hover {
@ -1359,7 +1359,7 @@ textarea {
.category {
margin-top: 5px;
background: $secondary-color;
color: #ffffff;
color: white;
border-radius: 10px 10px 0px 0px;
.title {
text-transform: uppercase;
@ -1369,7 +1369,7 @@ textarea {
.message {
padding: 1px;
margin: 1px;
background: #f3f3f3;
background: $secondary-neutral-light-color;
&:nth-child(odd) {
background: $primary-neutral-light-color;
}
@ -1420,10 +1420,10 @@ textarea {
}
.forum_signature {
color: #C0C0C0;
border-top: 1px solid #C0C0C0;
color: hsl(0, 0%, 75%);
border-top: 1px solid hsl(0, 0%, 75%);
a {
color: #C0C0C0;
color: hsl(0, 0%, 75%);
&:hover {
text-decoration: underline;
}
@ -1440,7 +1440,7 @@ textarea {
padding: 5px;
width: 200px;
height: 140px;
background: #eee;
background: hsl(0, 0%, 93%);
box-shadow: black 2px 2px 10px;
margin: 10px;
vertical-align: top;
@ -1455,7 +1455,7 @@ textarea {
width: 150px;
height: 100px;
margin: 5px;
background: #eee;
background: #eeeeee;
box-shadow: grey 2px 2px 5px;
padding: 2px;
vertical-align: middle;