feat: Kompetenzen zu Services-Seite hinzugefügt.
This commit is contained in:
parent
1475c5cb0c
commit
70725294cb
@ -557,6 +557,10 @@ h1 {
|
||||
line-height: 1.3em;
|
||||
}
|
||||
|
||||
h1.big_heading {
|
||||
font-size: 7.5rem;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-family: 'Noto Serif';
|
||||
font-size: 2rem;
|
||||
@ -930,10 +934,8 @@ hr.-even {
|
||||
grid-template-columns: 3fr 1fr;
|
||||
grid-template-rows: 1fr;
|
||||
grid-template-areas: "cards heading";
|
||||
/*
|
||||
row-gap: 1.5rem;
|
||||
column-gap: 1.5rem;
|
||||
*/
|
||||
|
||||
margin-bottom: 3rem;
|
||||
}
|
||||
|
||||
.services_box h1 {
|
||||
@ -972,6 +974,11 @@ hr.-even {
|
||||
height: 8rem;
|
||||
}
|
||||
|
||||
.services_card__text_box {
|
||||
font-size: 1.25rem;
|
||||
line-height: 1.5em;
|
||||
}
|
||||
|
||||
.services_card__text_box h2 {
|
||||
font-family: "Lato";
|
||||
font-size: 1.5rem;
|
||||
@ -980,6 +987,46 @@ hr.-even {
|
||||
}
|
||||
/* services_cards - end */
|
||||
|
||||
/* bubble_gird - start */
|
||||
.bubble_grid {
|
||||
margin: 0 1.5rem 0 1.5rem;
|
||||
|
||||
display: grid;
|
||||
grid-template-columns: repeat(6, 1fr);
|
||||
grid-template-rows: repeat(4, 10rem);
|
||||
|
||||
}
|
||||
|
||||
.bubble_grid__bubble {
|
||||
align-self: center;
|
||||
background-color: var(--wtf-nearly-white);
|
||||
width: 8rem;
|
||||
height: 8rem;
|
||||
border-radius: 50%;
|
||||
justify-self: center;
|
||||
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.bubble_grid__bubble img {
|
||||
max-width: 5rem;
|
||||
max-height: 5rem;
|
||||
}
|
||||
|
||||
.bubble_grid__card {
|
||||
grid-column: 1 / span 3;
|
||||
grid-row: 2 / span 3;
|
||||
|
||||
font-size: 1.25rem;
|
||||
line-height: 1.5em;
|
||||
background-color: var(--wtf-nearly-white);
|
||||
padding: 3rem;
|
||||
margin: 1.5rem
|
||||
}
|
||||
/* bubble_gird - end */
|
||||
|
||||
.content__box p, .content__box li {
|
||||
hyphens: auto;
|
||||
}
|
||||
|
@ -55,5 +55,89 @@
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="content__box">
|
||||
<div class="content__inner_box">
|
||||
<h1 class="big_heading">Kompetenzen</h1>
|
||||
</div>
|
||||
</div>
|
||||
<section class="content">
|
||||
<div class="content__box">
|
||||
<div class="bubble_grid">
|
||||
|
||||
<div class="bubble_grid__bubble">
|
||||
<img src="/images/logos/Python_logo_and_wordmark.svg" alt="Logo of the Python programming language">
|
||||
</div>
|
||||
|
||||
<div class="bubble_grid__bubble">
|
||||
<img src="{{ '/images/logos/ISO_C++_Logo.svg'|asseturl }}" alt="Logo of the C++ programming language">
|
||||
</div>
|
||||
|
||||
<div class="bubble_grid__bubble">
|
||||
<img src="{{ '/images/logos/Tux.svg'|asseturl }}" alt="Tux the penguin mascott of Linux">
|
||||
</div>
|
||||
|
||||
<div class="bubble_grid__bubble">
|
||||
<img src="{{ '/images/logos/Unofficial_JavaScript_logo_2.svg'|asseturl }}" alt="Logo of the JavaScript programming language">
|
||||
</div>
|
||||
|
||||
<div class="bubble_grid__bubble">
|
||||
<img src="{{ '/images/logos/PHP-logo.svg'|asseturl }}" alt="Logo of the PHP programming language">
|
||||
</div>
|
||||
|
||||
<div class="bubble_grid__bubble">
|
||||
<img src="{{ '/images/logos/C_Programming_Language.svg'|asseturl }}" alt="Logo of the C programming language">
|
||||
</div>
|
||||
|
||||
<div class="bubble_grid__bubble">
|
||||
<img src="{{ '/images/logos/Ansible_logo.svg'|asseturl }}" alt="Logo of the Ansible project">
|
||||
</div>
|
||||
|
||||
<div class="bubble_grid__bubble">
|
||||
<img src="{{ '/images/logos/Postgresql_elephant.svg'|asseturl }}" alt="Logo of the Postgres database">
|
||||
</div>
|
||||
|
||||
<div class="bubble_grid__bubble">
|
||||
<img src="{{ '/images/logos/Java-Logo.svg'|asseturl }}" alt="Logo of the Java programming language">
|
||||
</div>
|
||||
|
||||
<div class="bubble_grid__bubble">
|
||||
<img src="{{ '/images/logos/Rust_programming_language_black_logo.svg'|asseturl }}" alt="Logo of the Rust programming language">
|
||||
</div>
|
||||
|
||||
<div class="bubble_grid__bubble">
|
||||
<img src="{{ '/images/logos/CSS3_logo_and_wordmark.svg'|asseturl }}" alt="Logo of CSS3">
|
||||
</div>
|
||||
|
||||
<div class="bubble_grid__bubble">
|
||||
<img src="{{ '/images/logos/Debian-OpenLogo.svg'|asseturl }}" alt="Logo of the Debian operating system">
|
||||
</div>
|
||||
|
||||
<div class="bubble_grid__bubble">
|
||||
<img src="{{ '/images/logos/MySQL_textlogo.svg'|asseturl }}" alt="Logo of the MySQL database">
|
||||
</div>
|
||||
|
||||
<div class="bubble_grid__bubble">
|
||||
<img src="{{ '/images/logos/Vue.js_Logo_2.svg'|asseturl }}" alt="Logo of the Vue.js framework">
|
||||
</div>
|
||||
|
||||
<div class="bubble_grid__bubble">
|
||||
<img src="{{ '/images/logos/LaTeX_logo.svg'|asseturl }}" alt="Logo of the LaTeX typesetting language">
|
||||
</div>
|
||||
|
||||
<div class="bubble_grid__card">
|
||||
<ul>
|
||||
<li>Agiles Projektmanagement</li>
|
||||
<li>Barrierefreiheit</li>
|
||||
<li>Operations</li>
|
||||
<li>Software-Audits</li>
|
||||
<li>Softwareentwicklung</li>
|
||||
<li>Projektmanagement</li>
|
||||
<li>User Experience</li>
|
||||
<li>Übersetzung & Internationalisierung (i18n/l10n)</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{% endblock %}
|
Loading…
Reference in New Issue
Block a user