More actions
(Created page with ".profile-iconbox { position: relative; background: #242a31; border-radius: 8px; box-shadow: 0 3px 6px rgba( 0, 0, 0, 0.04 ), 0 3px 6px rgba( 0, 0, 0, 0.0575 ); font-size: 0.875rem; overflow: hidden; display: inline-block; min-width: 170px; width: 100%; height: 4rem; } .profile-iconbox .profile-iconbox__img a { display: block; height: 100%; } .profile-iconbox .profile-iconbox__img:after { position: absolute; pointer-events: none; right: 0; bot...") |
No edit summary |
||
| Line 81: | Line 81: | ||
content: '▶'; | content: '▶'; | ||
font-size: 0.8125rem; | font-size: 0.8125rem; | ||
} | |||
.ButtonGradient-container { | |||
min-width: 170px; | |||
width: 100%; | |||
} | |||
.ButtonGradient { | |||
padding: 19px 15px; | |||
transition: 0.5s; | |||
background-size: 200%auto; | |||
color: white; | |||
box-shadow: 0 3px 6px rgba(0,0,0,0.04),0 3px 6px rgba(0,0,0,0.0575); | |||
border-radius: 8px; | |||
display: block; | |||
height: 4rem; | |||
} | |||
.ButtonGradient.blue { | |||
background-image: linear-gradient(to right,#3968c4 0%,#5390d7 51%,#3968c4 100%); | |||
text-decoration: none; | |||
} | |||
.ButtonGradient.blue:hover { | |||
background-image: linear-gradient(to left,#3968c4 0%,#5390d7 51%,#3968c4 100%); | |||
text-decoration: none; | |||
} | } | ||
Revision as of 05:11, 16 July 2024
.profile-iconbox {
position: relative;
background: #242a31;
border-radius: 8px;
box-shadow: 0 3px 6px rgba( 0, 0, 0, 0.04 ), 0 3px 6px rgba( 0, 0, 0, 0.0575 );
font-size: 0.875rem;
overflow: hidden;
display: inline-block;
min-width: 170px;
width: 100%;
height: 4rem;
}
.profile-iconbox .profile-iconbox__img a {
display: block;
height: 100%;
}
.profile-iconbox .profile-iconbox__img:after {
position: absolute;
pointer-events: none;
right: 0;
bottom: 0;
left: 0;
display: block;
height: 100% !important;
background: linear-gradient(to right,rgba(0,0,0,0.8),transparent) !important;
border-radius: 0 0 8px 8px;
content: '';
}
.profile-iconbox__img img {
transition: transform 250ms cubic-bezier(0.215,0.61,0.355,1);
height: 4rem;
width: 100%;
object-fit: cover;
}
.profile-iconbox__img img:hover {
transform: scale(1.1);
transition: transform 250ms cubic-bezier(0.215,0.61,0.355,1);
height: 4rem;
width: 100%;
}
.profile-iconbox__foreground {
position: absolute;
}
.profile-iconbox__foreground .profile-iconbox__label {
color: #bababa;
}
.profile-iconbox__foreground .profile-iconbox__header {
color: #fff;
}
.profile-iconbox .profile-iconbox__foreground {
pointer-events: none;
bottom: 27%;
left: 15px;
}
.home-card__foreground .profile-iconbox__label {
color: #bababa;
}
.profile-iconbox__label {
color: var( --color-base--subtle );
font-size: 0.8125rem;
letter-spacing: 0.75px;
}
h3.profile-iconbox__header {
margin-top: 0;
font-size: 1rem;
}
.profile-iconbox__header a {
display: flex;
align-items: center;
justify-content: space-between;
}
.profile-iconbox__header a:after {
content: '▶';
font-size: 0.8125rem;
}
.ButtonGradient-container {
min-width: 170px;
width: 100%;
}
.ButtonGradient {
padding: 19px 15px;
transition: 0.5s;
background-size: 200%auto;
color: white;
box-shadow: 0 3px 6px rgba(0,0,0,0.04),0 3px 6px rgba(0,0,0,0.0575);
border-radius: 8px;
display: block;
height: 4rem;
}
.ButtonGradient.blue {
background-image: linear-gradient(to right,#3968c4 0%,#5390d7 51%,#3968c4 100%);
text-decoration: none;
}
.ButtonGradient.blue:hover {
background-image: linear-gradient(to left,#3968c4 0%,#5390d7 51%,#3968c4 100%);
text-decoration: none;
}