diff --git a/Globals.css b/Globals.css index 6d91fbf..0d8773f 100644 --- a/Globals.css +++ b/Globals.css @@ -42,7 +42,7 @@ --radius-standard: 4px; --color-white: #ecf0f1; - --color-white-transparent: rgba(236, 240, 241, 0.8); + --color-white-transparent: rgba(236, 240, 241, 0.7); --color-black: #2a2723; --color-black-transparent: #2a2723aa; diff --git a/components/Customers/Customers.vue b/components/Customers/Customers.vue index ed843fe..1fb7550 100644 --- a/components/Customers/Customers.vue +++ b/components/Customers/Customers.vue @@ -80,7 +80,6 @@ const projects = [ { title: 'Unterricht', customer: 'SAE Institute Germany', - link: 'https://www.sae.edu/deu/en/sae-home/', image: '/img/projects/education.jpg', desc: [ 'Vorbereitung und Durchführung von Unterricht in JavaScript und TypeScript.', diff --git a/components/Intro/Intro.css b/components/Intro/Intro.css index 3c628a8..5277080 100644 --- a/components/Intro/Intro.css +++ b/components/Intro/Intro.css @@ -24,7 +24,7 @@ z-index: 1; .fulltext { - color: var(--color-white-transparent); + color: var(--color-white); } } } diff --git a/components/Services/Services.css b/components/Services/Services.css index 598cb7f..055b71f 100644 --- a/components/Services/Services.css +++ b/components/Services/Services.css @@ -7,37 +7,68 @@ display: flex; flex-wrap: wrap; align-items: stretch; - } - & article { - flex-grow: 1; - flex-shrink: 0; - flex-basis: clamp(400px, calc(33% - 3rem), 500px); - position: relative; + & article { + flex-grow: 1; + flex-shrink: 0; + flex-basis: clamp(400px, calc(33% - 3rem), 500px); + position: relative; - & .chip { - position: absolute; - right: -1rem; - top: calc(-1rem - 3px); - } + & .chip { + position: absolute; + right: -1rem; + top: calc(-1rem - 3px); + } - & header { - display: flex; - } - - & ul { - list-style: none; - gap: 1rem; - - & li { + & header { display: flex; - align-items: center; + } + + & ul { + list-style: none; gap: 1rem; + + & li { + display: flex; + align-items: center; + gap: 1rem; + } + } + + & .extra { + margin-top: auto; } } + } - & .extra { - margin-top: auto; + .network-list { + & article { + width: clamp(400px, calc(33% - 3rem), 500px); + align-items: center; + gap: 1rem; + + & img { + border: 4px solid var(--color-orange); + border-radius: 50%; + width: 150px; + } + + & main { + margin-top: -1rem; + } + + & span { + font-family: 'Roboto Condensed', sans-serif; + font-weight: bold; + + &:not(:last-child):after { + content: " | " + } + } + + & p { + text-align: center; + } } } } diff --git a/components/Services/Services.vue b/components/Services/Services.vue index 5fe42a0..8d38617 100644 --- a/components/Services/Services.vue +++ b/components/Services/Services.vue @@ -4,8 +4,8 @@

Services.

Du hast also beschlossen, dass du meine Hilfe brauchst. Cool!

-

Hinter meinen Angeboten gibt es keinerlei Abos oder versteckte Kosten. Aus Transparenzgründen sei - aber gesagt, dass sich alle Preise zzgl. 19% Umsatzsteuer verstehen.

+

Hinter meinen Angeboten gibt es keinerlei Abos oder versteckte Kosten. + Aus Transparenzgründen sei aber gesagt, dass sich alle Preise zzgl. 19% Umsatzsteuer verstehen.

@@ -21,15 +21,20 @@ {{point}} -
- * {{ extra }} -

Mein Netzwerk

Doch auch wenn ich mal voll ausgelastet bin - keine Sorge! Mein Netzwerk an Profis kann dir sicher auch weiterhelfen!

-
- +
+
+ +

{{person.name}}

+
+ {{tag}} +
+

{{person.flavour}}

+
@@ -40,7 +45,7 @@ import check from 'iconoir/icons/regular/double-check.svg' const services = [ { title: 'Bug Research', - price: '149 € / Einmalig', + price: '99 € / Einmalig', availability: 'Frei', smallClaim: 'Du hast einen Bug, aber weißt nicht woher? Kein Ding.', button: 'Jetzt untersuchen lassen', @@ -48,10 +53,21 @@ const services = [ 'Untersuchung des Source Code', 'Konkrete Behebungsempfehlung', 'Ergebnisse in spätestens 7 Tagen', + 'Fix problemlos anschließend buchen' + ], + }, { + title: 'Projektbuchung', + price: 'ab 999 € je nach Umfang', + availability: '3 Slots Frei', + smallClaim: 'Umsetzung deiner Vision. Von einzelnen Tickets bis hin zu kompletten Anwendungen.', + button: 'Jetzt durchstarten', + list: [ + 'Aufstellung der Anforderungen', + 'Untersuchung geeigneter Technologien', + 'Regelmäßige Projektupdates', + 'Fixe Kosten und Featuresets', + 'Nur 50% Projektpreis als Anzahlung' ], - extra: [ - 'Behebung je nach Schwere gegen Aufpreis möglich' - ] }, { title: 'Stundenbuchung', availability: 'Frei ab 16.12.24', @@ -59,30 +75,22 @@ const services = [ smallClaim: 'Du brauchst einfach Unterstützung im Team, bis sich der Trubel legt?', button: 'Jetzt buchen', list: [ + 'Flexible Aufgabenverteilung', 'Arbeiten nach agilen Prinzipien', - 'Teilnahme an agilen Meetings', 'Monatliche Rechnungsstellung', 'Kündigungsfrist von einer Woche', + 'Ab 80 Stunden flexibel buchbar', ], - extra: [ - 'Mindestabnahme 160 Stunden' - ] - }, { - title: 'Projektbuchung', - price: 'ab 5.499 € je nach Umfang', - availability: '3 Slots Frei', - smallClaim: 'Umsetzung deiner Vision. Von einzelnen Tickets bis hin zu kompletten Anwendungen.', - button: 'Jetzt durchstarten', - list: [ - 'Aufstellung der Anforderungen', - 'Untersuchung geeigneter Technologien', - 'Regelmäßiger Austausch', - 'Klare Kostenübersicht' - ], - extra: [ - 'Anzahlung 50% des Projektpreises', - 'Enddatum je nach Umfang' - ] + } +] + +const network = [ + { + name: 'Robert Janus', + img: '/img/network/robert.jpg', + tags: ['Digitalberatung', 'Webentwicklung', 'eCommerce'], + flavour: 'Professionell und entspannt. Hat immer ein offenes Ohr und schnelle Reaktionszeiten.', + link: 'https://roberjanus.de/webertoire', } ] diff --git a/public/img/network/robert.jpg b/public/img/network/robert.jpg new file mode 100644 index 0000000..0a4dc0a Binary files /dev/null and b/public/img/network/robert.jpg differ