76 lines
1.9 KiB
CSS
76 lines
1.9 KiB
CSS
|
|
|||
|
|
/* Table of contents
|
|||
|
|
––––––––––––––––––––––––––––––––––––––––––––––––––
|
|||
|
|
|
|||
|
|
- Rounded user avatars
|
|||
|
|
- Buttons
|
|||
|
|
- Brand Styles
|
|||
|
|
|
|||
|
|
*/
|
|||
|
|
|
|||
|
|
|
|||
|
|
/* Rounded avatars
|
|||
|
|
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
|||
|
|
|
|||
|
|
/* Disable this if you don't want rounded avatars for users */
|
|||
|
|
.rounded-avatar {
|
|||
|
|
border-radius: 50%;
|
|||
|
|
-webkit-box-shadow: 0px 0px 0px 3px #ffffff;
|
|||
|
|
box-shadow: 0px 0px 0px 3px #ffffff;
|
|||
|
|
background-color: #ffffff !important;
|
|||
|
|
width: 150px;
|
|||
|
|
height: 150px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
/* Buttons
|
|||
|
|
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
|||
|
|
|
|||
|
|
:root {
|
|||
|
|
/* violet */
|
|||
|
|
--primary-color: 111, 76, 255;
|
|||
|
|
|
|||
|
|
/* white */
|
|||
|
|
--text-color: 256, 256, 256;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.button {
|
|||
|
|
font-family: 'DM Sans', sans-serif;
|
|||
|
|
font-size: 18px;
|
|||
|
|
padding: 12px 32px;
|
|||
|
|
margin: 1rem;
|
|||
|
|
cursor: pointer;
|
|||
|
|
border-radius: 4px;
|
|||
|
|
transition: all 0.3s ease;
|
|||
|
|
border-radius: 50px;
|
|||
|
|
color: rgba(var(--text-color));
|
|||
|
|
border: 2px double transparent;
|
|||
|
|
background-image: linear-gradient(rgb(13, 14, 33), rgb(13, 14, 33)), radial-gradient(circle at left top, rgb(1, 110, 218), rgb(217, 0, 192));
|
|||
|
|
background-origin: border-box;
|
|||
|
|
background-clip: padding-box, border-box;
|
|||
|
|
max-width: 300px;
|
|||
|
|
width: 70%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.button:hover {
|
|||
|
|
transition: all 0.3s ease;
|
|||
|
|
box-shadow: rgba(var(--primary-color), 0.5) 0px 0px 20px 0px;
|
|||
|
|
color: rgba(var(--text-color));
|
|||
|
|
opacity: 0.85;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
/* Brand Icons
|
|||
|
|
–––––––––––––––––––––––––––––––––––––––––––––––––– */
|
|||
|
|
|
|||
|
|
.icon {
|
|||
|
|
padding: 0px 8px 3.5px 0px;
|
|||
|
|
/* position: absolute;
|
|||
|
|
left: 20px;
|
|||
|
|
top: 15px; */
|
|||
|
|
vertical-align: middle;
|
|||
|
|
width: 20px;
|
|||
|
|
height: 20px;
|
|||
|
|
}
|
|||
|
|
|