From d0ecf1aec45281a89655a257d9e53a73a8d0cfd7 Mon Sep 17 00:00:00 2001 From: Steffen Illium Date: Sun, 3 Dec 2023 23:30:30 +0100 Subject: [PATCH] fixed css --- _config.yml | 4 +- _includes/archive-single.html | 22 ++--- _sass/minimal-mistakes/_archive.scss | 68 +++++++++++++-- _sass/minimal-mistakes/_base.scss | 87 ++++++++++++++++++- _sass/minimal-mistakes/_forms.scss | 4 +- _sass/minimal-mistakes/_mixins.scss | 4 +- _sass/minimal-mistakes/_search.scss | 2 +- .../vendor/breakpoint/_helpers.scss | 8 +- .../vendor/magnific-popup/_settings.scss | 9 +- .../vendor/susy/susy/_su-math.scss | 6 +- 10 files changed, 178 insertions(+), 36 deletions(-) diff --git a/_config.yml b/_config.yml index ad22dbd4..3949a857 100644 --- a/_config.yml +++ b/_config.yml @@ -39,7 +39,7 @@ atom_feed: hide : true # true, false (default) # SEO Related -google_site_verification : +google_site_verification : ZNT7_sXtFdgqBLCPLavTHWcviZRk__BNvClY8I-sFjU bing_site_verification : naver_site_verification : yandex_site_verification : @@ -59,7 +59,7 @@ social: author: name : "Steffen Illium" avatar : "/assets/images/headshot.jpg" # path of avatar image, e.g. "/assets/images/bio-photo.jpg" - bio : "[AI Research](/research/) and [Lecturer](/teaching/) as [PHD Student](https://www.mobile.ifi.lmu.de/team/steffen-illium/) @ [LMU Munich](https://www.lmu.de/en/index.html)" + bio : "[AI Researcher](/research/) and [Lecturer](/teaching/), [PHD Student](https://www.mobile.ifi.lmu.de/team/steffen-illium/) @ [LMU Munich](https://www.lmu.de/en/index.html)" location : "Augsburg" links: - label: "LMU-Munich" diff --git a/_includes/archive-single.html b/_includes/archive-single.html index 0863663e..9478d91a 100644 --- a/_includes/archive-single.html +++ b/_includes/archive-single.html @@ -17,21 +17,21 @@ {% endif %} -{% if teaser and include.type != "grid"%} + {% if teaser and include.type != "grid"%}
{% endif %}
-

- {% if post.link %} - {{ title }} Permalink - {% else %} - {{ title }} - {% endif %} -

- {% include page__meta.html type=include.type %} - {% if post.excerpt %}

{{ post.excerpt | markdownify | strip_html | truncate: 160 }}

{% endif %} -
+

+ {% if post.link %} + {{ title }} Permalink + {% else %} + {{ title }} + {% endif %} +

+ {% include page__meta.html type=include.type %} + {% if post.excerpt %}

{{ post.excerpt | markdownify | strip_html | truncate: 160 }}

{% endif %} + diff --git a/_sass/minimal-mistakes/_archive.scss b/_sass/minimal-mistakes/_archive.scss index aee71890..9ff1b40c 100644 --- a/_sass/minimal-mistakes/_archive.scss +++ b/_sass/minimal-mistakes/_archive.scss @@ -2,6 +2,26 @@ ARCHIVE ========================================================================== */ +h2 { + margin-top: 1.5em ; +} + +.table-right { + // font-size: 28px !important; + font: 21px/1.4 Helvetica,"Helvetica Neue",Arial,sans-serif; + padding-left: 1.5em; + align-content: "center"; + display: block; + margin-left: auto; + margin-right: auto; + + @include breakpoint($small) { + float: right; + margin-right: 1em; + margin-bottom: 1em; + } +} + .archive { margin-top: 1em; margin-bottom: 2em; @@ -39,7 +59,7 @@ border-bottom: 1px solid $border-color; + .list__item .archive__item-title { - margin-top: 0.5em; + margin-top: 0.0em; } } @@ -49,6 +69,7 @@ line-height: initial; overflow: hidden; text-overflow: ellipsis; + max-lines: 3; a[rel="permalink"]::before { content: ''; @@ -64,13 +85,14 @@ /* remove border*/ .page__content { .archive__item-title { - margin-top: 1em; + margin-top: 0.5em; border-bottom: none; } } .archive__item-excerpt { margin-top: 0; +display: block; font-size: $type-size-6; & + p { @@ -84,11 +106,31 @@ .archive__item-teaser { position: relative; +margin: auto; border-radius: $border-radius; overflow: hidden; - +align-content: center; + display: flex; img { - width: 100%; + width: auto; + margin: auto; + max-height: 90px; + } +} + +.archive__item-teaser-list { + position: relative; + margin: auto; + padding-right: 1em; + padding-bottom: 3em; + border-radius: $border-radius; + align-content: center; + //display: inline; + float: left; + img { + // width: auto; + margin: auto; + max-height: 48px; } } @@ -148,6 +190,7 @@ .grid__item { margin-bottom: 2em; +max-width: 180px; @include breakpoint($small) { float: inline-start; @@ -222,6 +265,7 @@ .archive__item-teaser { @include breakpoint($small) { max-height: 200px; + display: flex; } @include breakpoint($medium) { @@ -340,6 +384,11 @@ width: span(5 of 12); } + .archive__item-teaser-list { + float: right; + width: span(5 of 12); + } + .archive__item-body { float: inline-start; width: span(7 of 12); @@ -366,6 +415,10 @@ margin-bottom: 2em; } + .archive__item-teaser-list { + margin-bottom: 2em; + } + a.btn::before { content: ''; position: absolute; @@ -380,6 +433,11 @@ width: span(5 of 12); } + .archive__item-teaser-list { + margin: 0 auto; + width: span(5 of 12); + } + .archive__item-body { margin: 0 auto; width: span(7 of 12); @@ -428,4 +486,4 @@ .feature__wrapper { display: inline-block; } -} +} \ No newline at end of file diff --git a/_sass/minimal-mistakes/_base.scss b/_sass/minimal-mistakes/_base.scss index d52a42f2..de94f862 100644 --- a/_sass/minimal-mistakes/_base.scss +++ b/_sass/minimal-mistakes/_base.scss @@ -160,6 +160,24 @@ pre { overflow-x: auto; /* add scrollbars to wide code blocks*/ } +p > code, +a > code, +li > code, +figcaption > code, +td > code { + padding-top: 0.1rem; + padding-bottom: 0.1rem; + font-size: 0.8em; + background: $code-background-color; + border-radius: $border-radius; + + &:before, + &:after { + letter-spacing: -0.2em; + content: "\00a0"; /* non-breaking space*/ + } +} + /* horizontal rule */ hr { @@ -208,6 +226,13 @@ figure { border-radius: $border-radius; -webkit-transition: $global-transition; transition: $global-transition; +:hover { + width: 120%; + } + } + + > p { + align-content: middle; } > a { @@ -228,10 +253,27 @@ figure { } &.third { +> p, + // > a, + > img { + width: calc(33.3333% - 0.5em); + @include breakpoint($small) { + width: calc(28.0% - 0.5em); + } + } + + figcaption { + width: 100%; + } + } + + &.fourth { + > p, > a, > img { + @include breakpoint($small) { - width: calc(33.3333% - 0.5em); + width: calc(15% - 0.5em); } } @@ -239,6 +281,44 @@ figure { width: 100%; } } + + &.research_icons { + > p, + > a { + + font-size: 0%; + + @include breakpoint($small) { + font-size: 0%; + } + + @include breakpoint($medium) { + font-size: 70%; + } + + @include breakpoint($medium-wide) { + font-size: 75%; + } + + @include breakpoint($large) { + font-size: 85%; + } + + } + } + + &.research_icons { + > p, + > a, + > img { + + width: calc(15% - 0.5em); + } + + figcaption { + width: 100%; + } + } } /* Figure captions */ @@ -333,7 +413,8 @@ form button, input[type="submit"], .btn, .highlight, -.archive__item-teaser { +.archive__item-teaser, +.archive__item-teaser-list { -webkit-transition: $global-transition; transition: $global-transition; -} +} \ No newline at end of file diff --git a/_sass/minimal-mistakes/_forms.scss b/_sass/minimal-mistakes/_forms.scss index af29b9f7..8aacdb1d 100644 --- a/_sass/minimal-mistakes/_forms.scss +++ b/_sass/minimal-mistakes/_forms.scss @@ -1,7 +1,7 @@ /* ========================================================================== Forms ========================================================================== */ - + @use "sass:math"; form { margin-bottom: 5px; padding: 1em; @@ -25,7 +25,7 @@ form { } p { - margin-bottom: (5px / 2); + margin-bottom: math.div(5px, 2); } ul { diff --git a/_sass/minimal-mistakes/_mixins.scss b/_sass/minimal-mistakes/_mixins.scss index 4aa9eb09..a754bb36 100644 --- a/_sass/minimal-mistakes/_mixins.scss +++ b/_sass/minimal-mistakes/_mixins.scss @@ -1,7 +1,7 @@ /* ========================================================================== MIXINS ========================================================================== */ - +@use "sass:math"; %tab-focus { /* Default*/ outline: thin dotted $focus-color; @@ -65,7 +65,7 @@ $green: green($color); $blue: blue($color); - $yiq: (($red*299)+($green*587)+($blue*114))/1000; + $yiq: math.div((($red*299)+($green*587)+($blue*114)), 1000); @if $yiq-debug { @debug $yiq, $threshold; } diff --git a/_sass/minimal-mistakes/_search.scss b/_sass/minimal-mistakes/_search.scss index 4a3a2b37..d71c0320 100644 --- a/_sass/minimal-mistakes/_search.scss +++ b/_sass/minimal-mistakes/_search.scss @@ -126,4 +126,4 @@ color: $primary-color; font-style: normal; font-weight: bold; -} +} \ No newline at end of file diff --git a/_sass/minimal-mistakes/vendor/breakpoint/_helpers.scss b/_sass/minimal-mistakes/vendor/breakpoint/_helpers.scss index 97e522d1..a0ea23b9 100644 --- a/_sass/minimal-mistakes/vendor/breakpoint/_helpers.scss +++ b/_sass/minimal-mistakes/vendor/breakpoint/_helpers.scss @@ -1,6 +1,8 @@ ////////////////////////////// // Converts the input value to Base EMs ////////////////////////////// +@use "sass:math"; + @function breakpoint-to-base-em($value) { $value-unit: unit($value); @@ -25,16 +27,16 @@ $unit: unit($value); @if $unit == 'px' { - @return $value / 16px * 1em; + @return math.div($value, 16px) * 1em; } @else if $unit == '%' { - @return $value / 100% * 1em; + @return math.div($value, 100%) * 1em; } @else if $unit == 'em' { @return $value; } @else if $unit == 'pt' { - @return $value / 12pt * 1em; + @return math.div($value, 12pt) * 1em; } @else { @return $value; diff --git a/_sass/minimal-mistakes/vendor/magnific-popup/_settings.scss b/_sass/minimal-mistakes/vendor/magnific-popup/_settings.scss index e7866b3f..50a724c3 100644 --- a/_sass/minimal-mistakes/vendor/magnific-popup/_settings.scss +++ b/_sass/minimal-mistakes/vendor/magnific-popup/_settings.scss @@ -1,6 +1,7 @@ -//////////////////////// +/////////////////////// // Settings // //////////////////////// +@use "sass:math"; // overlay $mfp-overlay-color: #000; // Color of overlay screen @@ -19,16 +20,16 @@ $mfp-controls-opacity: 1; // Opacity of $mfp-controls-color: #fff; // Color of controls $mfp-controls-border-color: #fff; // Border color of controls $mfp-inner-close-icon-color: #fff; // Color of close button when inside -$mfp-controls-text-color: #ccc; // Color of preloader and "1 of X" indicator +$mfp-controls-text-color: #ccc; // Color of preloader and "1 of X" indicator $mfp-controls-text-color-hover: #fff; // Hover color of preloader and "1 of X" indicator $mfp-IE7support: true; // Very basic IE7 support // Iframe-type options $mfp-include-iframe-type: true; // Enable Iframe-type popups $mfp-iframe-padding-top: 40px; // Iframe padding top -$mfp-iframe-background: #000; // Background color of iframes +$mfp-iframe-background: #000; // Background color of iframes $mfp-iframe-max-width: 900px; // Maximum width of iframes -$mfp-iframe-ratio: 9/16; // Ratio of iframe (9/16 = widescreen, 3/4 = standard, etc.) +$mfp-iframe-ratio: math.div(9, 16); // Ratio of iframe (9/16 = widescreen, 3/4 = standard, etc.) // Image-type options $mfp-include-image-type: true; // Enable Image-type popups diff --git a/_sass/minimal-mistakes/vendor/susy/susy/_su-math.scss b/_sass/minimal-mistakes/vendor/susy/susy/_su-math.scss index 1e885284..31f248bd 100644 --- a/_sass/minimal-mistakes/vendor/susy/susy/_su-math.scss +++ b/_sass/minimal-mistakes/vendor/susy/susy/_su-math.scss @@ -23,7 +23,7 @@ /// @ignore _su-calc-sum /// @ignore _su-needs-calc-output - +@use "sass:math"; // Su Span // ------- @@ -90,7 +90,7 @@ @if unitless($span-width) { $container-spread: su-valid-spread($container-spread); $container: _su-sum($columns, $gutters, $container-spread, $validate: false); - @return percentage($span-width / $container); + @return percentage(math.div($span-width, $container)); } @return $span-width; @@ -141,7 +141,7 @@ } $container: _su-sum($columns, $gutters, $container-spread); - @return percentage($gutters / $container); + @return percentage(math.div($gutters, $container)); }