122 lines
2.4 KiB
SCSS
122 lines
2.4 KiB
SCSS
.bio {
|
|
@include flexbox();
|
|
@include justify-content(center);
|
|
@include align-items(flex-start);
|
|
@include flex-direction(column);
|
|
@include themify($codeblock) {
|
|
color: themed('content-pre-color');
|
|
}
|
|
|
|
width: 100%;
|
|
max-width: 928px;
|
|
font-family: $title-font;
|
|
|
|
&__photo {
|
|
border-radius: 0.25rem;
|
|
width: 100%;
|
|
max-width: 250px;
|
|
height: auto;
|
|
@include box-shadow(0, 2px, 4px, 0, rgba(0, 0, 0, 0.25));
|
|
|
|
&[data-ani="true"] {
|
|
@include animation('slide-in-down-little .2s .6s 1 ease-in both');
|
|
}
|
|
|
|
&-wrapper {
|
|
width: 90%;
|
|
height: 100%;
|
|
border-radius: 0.25rem;
|
|
margin: 1rem auto;
|
|
@include flexbox();
|
|
@include align-items(center);
|
|
@include justify-content(center);
|
|
}
|
|
}
|
|
|
|
&__name {
|
|
font-weight: 700;
|
|
letter-spacing: 1px;
|
|
font-family: inherit;
|
|
font-size: 26px;
|
|
margin-top: 0.8rem;
|
|
}
|
|
|
|
&__desc {
|
|
margin: 0.5rem 0;
|
|
font-size: 14px;
|
|
}
|
|
|
|
&__info {
|
|
font-size: 14px;
|
|
margin: 0.1rem 0;
|
|
@include flexbox();
|
|
@include align-items(center);
|
|
@include justify-content(center);
|
|
}
|
|
|
|
&[data-dir="ltr"] {
|
|
.bio__info {
|
|
&--icon {
|
|
margin-right: 0.25rem;
|
|
|
|
@include flexbox();
|
|
@include align-items(center);
|
|
@include themify($themes) {
|
|
color: themed('social-icon-color');
|
|
}
|
|
}
|
|
|
|
a {
|
|
padding-right: 1rem;
|
|
@include truncate($sidebar-width);
|
|
}
|
|
}
|
|
}
|
|
|
|
&[data-dir="rtl"] {
|
|
.bio__info {
|
|
&--icon {
|
|
margin-left: 0.25rem !important;
|
|
|
|
@include flexbox();
|
|
@include align-items(center);
|
|
@include themify($themes) {
|
|
color: themed('social-icon-color');
|
|
}
|
|
}
|
|
|
|
a {
|
|
padding-left: 1rem;
|
|
@include truncate($sidebar-width);
|
|
}
|
|
}
|
|
}
|
|
|
|
&__social {
|
|
width: 100%;
|
|
margin-top: 0.5rem;
|
|
|
|
@include flexbox();
|
|
@include flex-wrap(wrap);
|
|
a {
|
|
text-decoration: none !important;
|
|
padding: 0.5rem;
|
|
border-radius: 0.125rem;
|
|
|
|
@include flexbox();
|
|
@include flex-grow(1);
|
|
@include align-items(center);
|
|
@include justify-content(flex-start);
|
|
@include themify($themes) {
|
|
color: themed('social-icon-color');
|
|
@include on-event {
|
|
color: themed('social-icon-hover-color');
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
&-hr {
|
|
border-radius: 0.5rem;
|
|
}
|
|
} |