mirror of
https://github.com/FranP-code/Hangman-game-with-React.git
synced 2025-10-13 00:42:32 +00:00
My account styles done
This commit is contained in:
@@ -16,7 +16,7 @@ html, body {
|
||||
|
||||
@mixin bodyFont() {
|
||||
|
||||
font-family: 'Rambla', sans-serif;
|
||||
font-family: 'Helveltica', sans-serif;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
@@ -30,4 +30,5 @@ html, body {
|
||||
@import 'message';
|
||||
@import './control-panel/control-panel';
|
||||
@import './control-panelDemo/demo-message';
|
||||
@import './control-panelDemo/admin-header-demo.scss'
|
||||
@import './control-panelDemo/admin-header-demo.scss';
|
||||
@import './info-account/info-account';
|
||||
102
public/sass/info-account/_info-account.scss
Normal file
102
public/sass/info-account/_info-account.scss
Normal file
@@ -0,0 +1,102 @@
|
||||
.info-account {
|
||||
|
||||
@include bodyFont();
|
||||
|
||||
.loading {
|
||||
|
||||
position: initial;
|
||||
|
||||
height: max-content;
|
||||
|
||||
height: 50vh;
|
||||
}
|
||||
|
||||
.person {
|
||||
|
||||
width: 50vw;
|
||||
|
||||
margin-left: 15vw;
|
||||
|
||||
border-bottom: 1px solid rgb(202, 191, 158);
|
||||
|
||||
h3 {
|
||||
|
||||
font-weight: 300;
|
||||
}
|
||||
}
|
||||
|
||||
.functions {
|
||||
|
||||
width: 50vw;
|
||||
|
||||
margin-left: 15vw;
|
||||
margin-top: 2vh;
|
||||
|
||||
display: flex;
|
||||
|
||||
.close-session {
|
||||
|
||||
width: 20vw;
|
||||
height: 10vh;
|
||||
|
||||
background: rgb(185, 185, 185);
|
||||
|
||||
transition: ease-in-out 0.4s;
|
||||
|
||||
border: 0;
|
||||
|
||||
//border: 1px solid rgb(92, 92, 92);
|
||||
border-radius: 10px;
|
||||
|
||||
&:hover {
|
||||
background: rgb(255, 165, 165);
|
||||
|
||||
transition: ease-in-out 0.4s;
|
||||
}
|
||||
}
|
||||
|
||||
.reffer-code-container {
|
||||
|
||||
margin-left: 5vh;
|
||||
|
||||
flex-grow: 1;
|
||||
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
p {
|
||||
|
||||
width: 100%;
|
||||
flex-grow: 1;
|
||||
|
||||
}
|
||||
|
||||
button {
|
||||
|
||||
$background-color: rgb(255, 255, 255);
|
||||
|
||||
width: 3vw;
|
||||
height: 3vw;
|
||||
|
||||
background-color: $background-color;
|
||||
|
||||
border: 0;
|
||||
border: 1px solid rgb(83, 83, 83);
|
||||
|
||||
border-radius: 100%;
|
||||
|
||||
&:hover {
|
||||
|
||||
background-color: adjust-color($color: $background-color, $lightness: 10%, $alpha: 1.0);
|
||||
border: 3px solid rgb(83, 83, 83);
|
||||
background-color: rgba(0, 0, 0, 0.035);
|
||||
}
|
||||
|
||||
&:active {
|
||||
|
||||
border: 4px solid rgb(83, 83, 83);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user