add initial Glaube section
This commit is contained in:
@@ -1,68 +1,9 @@
|
||||
<script>
|
||||
import "$lib/css/nordtheme.css";
|
||||
import LinksGrid from "$lib/components/LinksGrid.svelte";
|
||||
export let data;
|
||||
</script>
|
||||
<style>
|
||||
|
||||
.grid_section a:nth-child(4n),
|
||||
.grid_section a:nth-child(4n) svg{
|
||||
background-color: var(--nord4);
|
||||
fill: var(--nord11);
|
||||
}
|
||||
.grid_section a:nth-child(4n+1),
|
||||
.grid_section a:nth-child(4n+1) svg{
|
||||
background-color: var(--nord6);
|
||||
fill: var(--nord10);
|
||||
}
|
||||
.grid_section a:nth-child(4n+2){
|
||||
background-color: var(--nord5);
|
||||
}
|
||||
.grid_section a:nth-child(4n+3){
|
||||
background-color: var(--nord5);
|
||||
}
|
||||
|
||||
a{
|
||||
text-decoration: unset;
|
||||
color: var(--nord0);
|
||||
transition: 200ms;
|
||||
}
|
||||
.grid_section a:hover{
|
||||
box-shadow: 1em 1em 2em 1em rgba(0,0,0, 0.3);
|
||||
}
|
||||
.grid_section a{
|
||||
box-shadow: 0.2em 0.2em 1em 1em rgba(0,0,0, 0.1);
|
||||
}
|
||||
.grid_section{
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
|
||||
gap: 2rem;
|
||||
max-width: 1000px;
|
||||
margin-inline: auto;
|
||||
padding: 2rem 1rem;
|
||||
}
|
||||
.grid_section a{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
text-decoration: unset;
|
||||
color: var(--nord0);
|
||||
transition: 200ms;
|
||||
width: 100%;
|
||||
padding: 1rem;
|
||||
}
|
||||
.grid_section a:hover{
|
||||
scale: 1.02;
|
||||
}
|
||||
.grid_section a :is(svg, img){
|
||||
height: 120px;
|
||||
fill: var(--nord0);
|
||||
}
|
||||
.grid_section h3{
|
||||
font-size: 1.5rem;
|
||||
}
|
||||
|
||||
|
||||
.hero{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
@@ -90,27 +31,6 @@ section h2{
|
||||
*{
|
||||
color: white;
|
||||
}
|
||||
.grid_section a:nth-child(4n),
|
||||
.grid_section a:nth-child(4n) svg{
|
||||
background-color: var(--nord6-dark);
|
||||
fill: var(--nord11);
|
||||
}
|
||||
.grid_section a:nth-child(4n+1),
|
||||
.grid_section a:nth-child(4n+1) svg{
|
||||
background-color: var(--accent-dark);
|
||||
fill: var(--nord9);
|
||||
}
|
||||
.grid_section a:nth-child(4n+2),
|
||||
.grid_section a:nth-child(4n+2) svg{
|
||||
background-color: var(--nord1);
|
||||
fill: var(--nord8);
|
||||
|
||||
}
|
||||
.grid_section a:nth-child(4n+3),
|
||||
.grid_section a:nth-child(4n+3) svg{
|
||||
background-color: var(--background-dark);
|
||||
fill: var(--nord7);
|
||||
}
|
||||
.hero img{
|
||||
box-shadow: 0.1em 0.1em 2em 0.5em rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
@@ -150,7 +70,7 @@ section h2{
|
||||
|
||||
<section>
|
||||
<h2>Seiten</h2>
|
||||
<div class=grid_section>
|
||||
<LinksGrid>
|
||||
<a href="rezepte">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 576 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M240 144A96 96 0 1 0 48 144a96 96 0 1 0 192 0zm44.4 32C269.9 240.1 212.5 288 144 288C64.5 288 0 223.5 0 144S64.5 0 144 0c68.5 0 125.9 47.9 140.4 112h71.8c8.8-9.8 21.6-16 35.8-16H496c26.5 0 48 21.5 48 48s-21.5 48-48 48H392c-14.2 0-27-6.2-35.8-16H284.4zM144 80a64 64 0 1 1 0 128 64 64 0 1 1 0-128zM400 240c13.3 0 24 10.7 24 24v8h96c13.3 0 24 10.7 24 24s-10.7 24-24 24H280c-13.3 0-24-10.7-24-24s10.7-24 24-24h96v-8c0-13.3 10.7-24 24-24zM288 464V352H512V464c0 26.5-21.5 48-48 48H336c-26.5 0-48-21.5-48-48zM48 320h80 16 32c26.5 0 48 21.5 48 48s-21.5 48-48 48H160c0 17.7-14.3 32-32 32H64c-17.7 0-32-14.3-32-32V336c0-8.8 7.2-16 16-16zm128 64c8.8 0 16-7.2 16-16s-7.2-16-16-16H160v32h16zM24 464H200c13.3 0 24 10.7 24 24s-10.7 24-24 24H24c-13.3 0-24-10.7-24-24s10.7-24 24-24z"/></svg>
|
||||
<h3>Rezepte</h3>
|
||||
@@ -194,5 +114,13 @@ section h2{
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M335.5 4l288 160c15.4 8.6 21 28.1 12.4 43.5s-28.1 21-43.5 12.4L320 68.6 47.5 220c-15.4 8.6-34.9 3-43.5-12.4s-3-34.9 12.4-43.5L304.5 4c9.7-5.4 21.4-5.4 31.1 0zM320 160a40 40 0 1 1 0 80 40 40 0 1 1 0-80zM144 256a40 40 0 1 1 0 80 40 40 0 1 1 0-80zm312 40a40 40 0 1 1 80 0 40 40 0 1 1 -80 0zM226.9 491.4L200 441.5V480c0 17.7-14.3 32-32 32H120c-17.7 0-32-14.3-32-32V441.5L61.1 491.4c-6.3 11.7-20.8 16-32.5 9.8s-16-20.8-9.8-32.5l37.9-70.3c15.3-28.5 45.1-46.3 77.5-46.3h19.5c16.3 0 31.9 4.5 45.4 12.6l33.6-62.3c15.3-28.5 45.1-46.3 77.5-46.3h19.5c32.4 0 62.1 17.8 77.5 46.3l33.6 62.3c13.5-8.1 29.1-12.6 45.4-12.6h19.5c32.4 0 62.1 17.8 77.5 46.3l37.9 70.3c6.3 11.7 1.9 26.2-9.8 32.5s-26.2 1.9-32.5-9.8L552 441.5V480c0 17.7-14.3 32-32 32H472c-17.7 0-32-14.3-32-32V441.5l-26.9 49.9c-6.3 11.7-20.8 16-32.5 9.8s-16-20.8-9.8-32.5l36.3-67.5c-1.7-1.7-3.2-3.6-4.3-5.8L376 345.5V400c0 17.7-14.3 32-32 32H296c-17.7 0-32-14.3-32-32V345.5l-26.9 49.9c-1.2 2.2-2.6 4.1-4.3 5.8l36.3 67.5c6.3 11.7 1.9 26.2-9.8 32.5s-26.2 1.9-32.5-9.8z"/></svg>
|
||||
<h3>Stammbaum</h3>
|
||||
</a>
|
||||
</div>
|
||||
<a href=glaube>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 640 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M351.2 4.8c3.2-2 6.6-3.3 10-4.1c4.7-1 9.6-.9 14.1 .1c7.7 1.8 14.8 6.5 19.4 13.6L514.6 194.2c8.8 13.1 13.4 28.6 13.4 44.4v73.5c0 6.9 4.4 13 10.9 15.2l79.2 26.4C631.2 358 640 370.2 640 384v96c0 9.9-4.6 19.3-12.5 25.4s-18.1 8.1-27.7 5.5L431 465.9c-56-14.9-95-65.7-95-123.7V224c0-17.7 14.3-32 32-32s32 14.3 32 32v80c0 8.8 7.2 16 16 16s16-7.2 16-16V219.1c0-7-1.8-13.8-5.3-19.8L340.3 48.1c-1.7-3-2.9-6.1-3.6-9.3c-1-4.7-1-9.6 .1-14.1c1.9-8 6.8-15.2 14.3-19.9zm-62.4 0c7.5 4.6 12.4 11.9 14.3 19.9c1.1 4.6 1.2 9.4 .1 14.1c-.7 3.2-1.9 6.3-3.6 9.3L213.3 199.3c-3.5 6-5.3 12.9-5.3 19.8V304c0 8.8 7.2 16 16 16s16-7.2 16-16V224c0-17.7 14.3-32 32-32s32 14.3 32 32V342.3c0 58-39 108.7-95 123.7l-168.7 45c-9.6 2.6-19.9 .5-27.7-5.5S0 490 0 480V384c0-13.8 8.8-26 21.9-30.4l79.2-26.4c6.5-2.2 10.9-8.3 10.9-15.2V238.5c0-15.8 4.7-31.2 13.4-44.4L245.2 14.5c4.6-7.1 11.7-11.8 19.4-13.6c4.6-1.1 9.4-1.2 14.1-.1c3.5 .8 6.9 2.1 10 4.1z"/></svg>
|
||||
<h3>Glaube</h3>
|
||||
</a>
|
||||
<a href=https://transmission.bocken.org>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.5.1 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M288 32c0-17.7-14.3-32-32-32s-32 14.3-32 32V274.7l-73.4-73.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l128 128c12.5 12.5 32.8 12.5 45.3 0l128-128c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L288 274.7V32zM64 352c-35.3 0-64 28.7-64 64v32c0 35.3 28.7 64 64 64H448c35.3 0 64-28.7 64-64V416c0-35.3-28.7-64-64-64H346.5l-45.3 45.3c-25 25-65.5 25-90.5 0L165.5 352H64zm368 56a24 24 0 1 1 0 48 24 24 0 1 1 0-48z"/></svg>
|
||||
<h3>Transmission</h3>
|
||||
</a>
|
||||
</LinksGrid>
|
||||
</section>
|
||||
|
||||
Reference in New Issue
Block a user