tobast.fr-hugo/scss/style.scss

257 lines
3.7 KiB
SCSS

// vim: tabstop=2 shiftwidth=2 expandtab
@import url('fonts.css');
@import 'params';
@import 'blog';
html {
background-color: $bg_color;
}
body {
font-family:Open Sans,Arial;
color:#555;
font-size:16px;
line-height:1.4;
text-align:justify;
margin: 0;
padding: 0;
}
#head {
background-color: $head_bg_color;
display: flex;
justify-content: space-between;
align-items: center;
margin: 0;
padding: 30px 60px;
color: $bg_color;
@media (max-width: $resp_vsmall) {
padding: 20px;
}
.title {
font-size: 1.4em;
font-weight: bold;
}
.whoami {
font-weight: bold;
padding-left: 20px;
@media (max-width: $resp_vsmall) {
font-size: 0.8em;
}
}
a, a:visited {
color: $bg_color;
}
}
#main-container {
display: flex;
justify-content: space-between;
@media (max-width: $resp_vsmall) {
flex-wrap: wrap;
}
.tab-selector {
margin: 40px;
ul {
list-style: none;
min-width: 200px;
padding: 0;
li {
a {
display: block;
font-size: 1.2em;
padding: 10px 20px;
background-color: $head_bg_color;
margin: 2px 0;
border-top-left-radius: 10px;
border-bottom-left-radius: 10px;
transition: margin 0.1s ease-in-out;
&:hover {
margin-left: 10px;
}
color: $bg_color;
}
&.active {
margin-left: 20px;
}
}
}
}
#content {
margin:2em auto;
max-width:800px;
padding:1em;
flex-basis: 800px;
}
.profilepic {
flex: 0 0 auto;
margin: 40px;
width: $profile_pic_wid;
height: auto;
@media (max-width: $resp_small) {
width: $profile_pic_wid_small;
}
@media (max-width: $resp_vsmall) {
flex-shrink: 2;
width: $profile_pic_wid_vsmall;
order: -1;
}
img {
margin: auto;
max-height: 100%;
max-width: 100%;
border-radius: 20px;
@media (max-width: $resp_vsmall) {
border-radius: 50%;
}
}
}
}
.items {
display: grid;
grid-template-columns: 100px auto;
.head {
grid-column: 1/span 1;
font-weight: bold;
}
}
a, a:visited {
color: $link_color;
text-decoration:none;
}
.fa {
color:#555
}
h1 {
margin-left:-10px;
}
h2 {
margin-top: 30px;
margin-left:20px;
.fa {
margin-right: 10px;
}
}
#whoami {
text-align: right;
font-size: 1.2em;
font-style: italic;
}
ul.docsline {
list-style: none;
text-align: center;
margin-top: 30px;
font-size: 1.1em;
li {
display: inline-block;
a {
display: inline-block;
padding: 0 15px;
}
}
}
dl {
list-style: none;
display: grid;
grid-template-columns: 1fr 3fr;
dt {
grid-column: 1 / span 1;
justify-self: end;
text-align: right;
margin-right: 20px;
font-weight: bold;
}
dd {
margin-left: 20px;
justify-self: start;
text-align: left;
}
}
.antispam {
unicode-bidi: bidi-override;
direction: rtl;
}
ul.publications, ul.talks, ul.unpublished {
li {
.authors {
font-style: italic;
.author:after {
content: ', ';
}
.author:last-child:after {
content: '';
}
}
.title {
font-weight: bold;
}
.journal, .venue {
}
.date {
}
}
}
ul.teaching-courses {
li {
list-style: circle;
}
}
.course-name {
.course-title {
font-weight: bold;
}
.course-longtitle:before {
content: ''
}
.course-role {
font-style: italic;
color: $fg_color_light;
}
}
.course-titleblock {
h2 {
margin-bottom: 10px;
}
.course-institute {
text-align: right;
font-size: 1.1em;
font-style: italic;
}
margin-bottom: 20px;
}