1
0
Fork 0
mirror of https://github.com/voltbonn/profile-picture-generator.git synced 2024-12-22 15:55:08 +00:00
profile.volt.link/src/App.css

83 lines
1.4 KiB
CSS
Raw Normal View History

2021-01-21 18:51:09 +00:00
:root{
--volt-purple: #582C83;
--background: #140022;
}
2021-01-21 18:50:54 +00:00
*{
font-family: 'Ubuntu';
}
2021-01-21 14:18:25 +00:00
.App {
text-align: center;
background-color: var(--background);
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-size: calc(10px + 2vmin);
color: white;
padding: 10vh;
}
2021-01-21 18:16:17 +00:00
2021-01-21 18:33:07 +00:00
h2{
margin: 10vh 0 2vh 0;
font-size: calc(10px + 4vmin);
}
2021-01-21 18:16:17 +00:00
.HeaderImage{
height: calc(10px + 30vmin);
max-width: 100%;
}
2021-01-21 18:32:45 +00:00
.FinishedFrame {
height: 36vh;
margin: 2vh;
2021-01-21 14:18:25 +00:00
}
2021-01-21 18:11:37 +00:00
.FrameChooser .frame{
height: 12vh;
margin: 2vh;
cursor: pointer;
box-shadow: 0 0 0 1vh rgba(255,255,255,0);
transition: transform 0.2s ease;
}
.FrameChooser .frame:hover{
transform-origin: center center;
transform: scale(1.1);
}
.FrameChooser .frame.choosen{
box-shadow: 0 0 0 1vh white;
2021-01-21 14:18:25 +00:00
}
2021-01-21 18:31:57 +00:00
button,
.labelButton{
outline: none;
border: none;
margin: 2vh;
padding: 1vh 2vh;
font-size: calc(10px + 2vmin);
font-weight: bold;
cursor: pointer;
background: white;
color: var(--volt-purple);
transition: transform 0.2s ease;
}
button:hover,
.labelButton:hover{
transform-origin: center center;
transform: scale(1.05);
2021-01-21 14:18:25 +00:00
}
2021-01-21 18:31:57 +00:00
.labelButton img{
display: inline;
height: calc(10px + 4vmin);
vertical-align: middle;
margin: 0 2vh 0 -1vh;
}
.labelButton span{
vertical-align: middle;
2021-01-21 14:18:25 +00:00
}