more layout improvements
This commit is contained in:
parent
9722cfbaf8
commit
6f0e10b6e9
3 changed files with 22 additions and 13 deletions
|
@ -54,7 +54,7 @@ title: sp-codes
|
||||||
<input type="checkbox" id="menu"/>
|
<input type="checkbox" id="menu"/>
|
||||||
|
|
||||||
<div class="items">
|
<div class="items">
|
||||||
<a class="logo mini fixed me-4" href="/{{locale}}/">
|
<a class="logo mini me-4" href="/{{locale}}/">
|
||||||
<img src="/img/sp-codes.svg" alt="sp-codes">
|
<img src="/img/sp-codes.svg" alt="sp-codes">
|
||||||
</a>
|
</a>
|
||||||
{%- for entry in collections.all | eleventyNavigation %}
|
{%- for entry in collections.all | eleventyNavigation %}
|
||||||
|
|
|
@ -9,7 +9,7 @@ eleventyNavigation:
|
||||||
---
|
---
|
||||||
|
|
||||||
<div class="row py-5">
|
<div class="row py-5">
|
||||||
<div class="col-12 col-lg-4 my-3 my-lg-0 fill-col-inner">
|
<div class="col-12 col-lg-4 mb-4 mb-lg-0 fill-col-inner">
|
||||||
<div class="logo huge animated">
|
<div class="logo huge animated">
|
||||||
{% include "logo-animated.html" %}
|
{% include "logo-animated.html" %}
|
||||||
</div>
|
</div>
|
||||||
|
@ -31,12 +31,12 @@ eleventyNavigation:
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="row py-5">
|
<div class="row py-5">
|
||||||
<div class="col-12 col-lg-4 col-12 my-3 my-lg-0 fill-col-inner order-lg-1">
|
<div class="col-12 col-lg-4 mb-4 mb-lg-0 fill-col-inner order-lg-1">
|
||||||
<div class="me-profile">
|
<div class="me-profile">
|
||||||
<img src="/img/samuel-1024.jpg" alt="Samuel Philipp">
|
<img src="/img/samuel-1024.jpg" alt="Samuel Philipp">
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-12 col-lg-8 col-12">
|
<div class="col-12 col-lg-8">
|
||||||
<h1>Über mich</h1>
|
<h1>Über mich</h1>
|
||||||
<p class="mb-2">
|
<p class="mb-2">
|
||||||
Mein Name ist Samuel Philipp und ich bin Full-Stack-Developer und SysAdmin. In meiner Freizeit betreibe ich alle angebotenen Dienste von sp-codes. Wenn du mehr über mich erfahren möchtest, schau gerne auf meiner persönlichen Webseite vorbei:
|
Mein Name ist Samuel Philipp und ich bin Full-Stack-Developer und SysAdmin. In meiner Freizeit betreibe ich alle angebotenen Dienste von sp-codes. Wenn du mehr über mich erfahren möchtest, schau gerne auf meiner persönlichen Webseite vorbei:
|
||||||
|
|
|
@ -60,11 +60,6 @@ p {
|
||||||
max-width: 128px;
|
max-width: 128px;
|
||||||
max-height: 128px;
|
max-height: 128px;
|
||||||
|
|
||||||
&.fixed {
|
|
||||||
width: 128px;
|
|
||||||
height: 128px;
|
|
||||||
}
|
|
||||||
|
|
||||||
&.huge {
|
&.huge {
|
||||||
width: 256px;
|
width: 256px;
|
||||||
height: 256px;
|
height: 256px;
|
||||||
|
@ -72,16 +67,23 @@ p {
|
||||||
max-height: 256px;
|
max-height: 256px;
|
||||||
}
|
}
|
||||||
|
|
||||||
&.mini.fixed {
|
&.mini {
|
||||||
width: 32px;
|
width: 32px;
|
||||||
height: 32px;
|
height: 32px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@media (max-width: 767.98px) {
|
@include media-breakpoint-down(lg) {
|
||||||
.logo {
|
.logo {
|
||||||
max-width: 96px;
|
max-width: 64px;
|
||||||
max-height: 96px;
|
max-height: 64px;
|
||||||
|
|
||||||
|
&.huge {
|
||||||
|
width: 128px;
|
||||||
|
height: 128px;
|
||||||
|
max-width: 128px;
|
||||||
|
max-height: 128px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -102,6 +104,13 @@ p {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@include media-breakpoint-down(lg) {
|
||||||
|
.me-profile {
|
||||||
|
height: 128px;
|
||||||
|
width: 128px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.nav {
|
.nav {
|
||||||
display: flex;
|
display: flex;
|
||||||
background-color: #111;
|
background-color: #111;
|
||||||
|
|
Loading…
Reference in a new issue