ptorrel/JS
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

init webseite ts and claude

Browse Source
This commit is contained in:
Philippe Torrel
2026-07-31 13:02:11 +02:00
parent e375bf23bc
commit 56295802c0
617 changed files with 94590 additions and 5826 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
webseite-ts-claude/frontend/dev/scss/05_modules/_footer-main.scss Normal file
View File

@@ -0,0 +1,18 @@
.footer-main {
background: $color-dark-blue; // Fallback für ältere Browser
background: $linear-gradient-dark;
padding: 2rem 0;
.col {
color: $color-white;
h2,
h3,
h4,
h5 {
font-size: 1.5rem;
color: $color-5;
padding: 0.5rem 0;
margin-bottom: 1rem;
letter-spacing: 2px;
}
}
}

83
webseite-ts-claude/frontend/dev/scss/05_modules/_header-main.scss Normal file
View File

@@ -0,0 +1,83 @@
.header-main {
position: relative;
width: 100%;
min-height: 400px;
.content-box {
position: relative;
z-index: 2;
display: flex;
justify-content: center;
align-items: center;
width: auto;
margin: 0 auto;
height: 100%;
max-width: 360px;
max-height: 380px;
}
background: $color-3 url('../img/header-image.webp') center no-repeat;
background-size: cover;
&--min {
height: 150px;
background-color: $color-2;
display: flex;
justify-content: center;
align-items: center;
.content-box {
figure {
width: 150px;
}
}
}
.splide {
position: absolute;
z-index: 1;
height: 100%;
width: 100%;
top: 0;
overflow: hidden;
.splide__track {
height: 100%;
.splider-content {
&::after {
content: '';
position: absolute;
z-index: 1;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.2);
}
height: 100%;
padding: 0;
img {
object-fit: cover;
width: 100%;
height: 100%;
}
}
}
}
// .content-box {
// figure {
// width: 280px;
// figcaption {
// position: absolute;
// clip: rect(1px, 1px, 1px, 1px);
// clip-path: inset(0 0 99.9% 99.9%);
// overflow: hidden;
// height: 1px;
// width: 1px;
// padding: 0;
// border: 0;
// }
// }
// }
}

5
webseite-ts-claude/frontend/dev/scss/05_modules/_index.scss Normal file
View File

@@ -0,0 +1,5 @@
@import 'footer-main';
@import 'header-main';
@import 'logo-main';
@import 'menu-main';
@import 'product-manager';

14
webseite-ts-claude/frontend/dev/scss/05_modules/_logo-main.scss Normal file
View File

@@ -0,0 +1,14 @@
figure.logo-main {
width: 280px;
figcaption {
position: absolute;
clip: rect(1px, 1px, 1px, 1px);
clip-path: inset(0 0 99.9% 99.9%);
overflow: hidden;
height: 1px;
width: 1px;
padding: 0;
border: 0;
}
}

60
webseite-ts-claude/frontend/dev/scss/05_modules/_menu-main.scss Normal file
View File

@@ -0,0 +1,60 @@
.menu-main {
background-color: $color-5;
ul {
padding: 0;
margin: 0;
list-style: none;
}
ul ul {
display: none; // TODO: change to not visible
}
ul > li:hover,
ul > li:focus,
ul > li:focus-within {
ul {
display: block;
}
}
ul.list {
display: flex;
justify-content: center;
li {
a {
display: inline-block;
text-decoration: none;
text-transform: uppercase;
color: $color-white;
padding: 0.5rem 1rem;
transition: all 0.4s ease-out;
&:hover,
&:focus {
background-color: $color-white;
color: $color-5;
}
}
}
}
ul.sublist {
position: absolute;
background-color: rgba($color-5, 0.8);
li {
a {
display: inline-block;
background-color: $color-5;
color: $color-white;
padding: 0.5rem 1rem;
transition: all 0.4s ease-out;
&:hover,
&:focus {
background-color: $color-white;
color: $color-5;
}
}
}
}
}

37
webseite-ts-claude/frontend/dev/scss/05_modules/_product-manager.scss Normal file
View File

@@ -0,0 +1,37 @@
.product-manager {
.nav-products-actions {
margin: 1rem 0;
display: flex;
justify-content: flex-end;
.list {
list-style: none;
margin: 0;
padding: 0;
display: flex;
gap: 1rem;
}
}
table {
.th-actions {
width: 200px;
}
tbody {
td {
vertical-align: middle;
button {
margin: 3px;
}
}
}
tfoot {
.row > * {
margin-bottom: 1rem;
@media (min-width: 992px) {
margin-bottom: 0;
}
}
}
}
}