Skip to content

Commit 4776424

Browse files
timmytiefkuehltimmytiefkuehl
committed
Weitere Inhaltsseiten
1 parent ec5ff18 commit 4776424

File tree

10 files changed

+240
-2
lines changed

10 files changed

+240
-2
lines changed

‎deploy/html/sites/about.html

+53
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
{% extends "template.html" %}
2+
3+
{% block content %}
4+
5+
<div class="wrapper">
6+
<div class="bind">
7+
<h1 class="headline">
8+
Über Uns
9+
</h1>
10+
<p class="paragraph">
11+
Wir sind Ihr zuverlässiger Partner für die Verwaltung von Immobilien. Ob Eigentumswohnung, Mehrfamilienhaus oder Gewerbeimmobilie – wir kümmern uns um Ihre Immobilie, als wäre es unsere eigene. Mit langjähriger Erfahrung, einem engagierten Team und modernster Technik bieten wir maßgeschneiderte Lösungen, die den Werterhalt und die Rentabilität Ihrer Immobilien sichern.
12+
</p>
13+
<p class="paragraph">
14+
Seit 10 Jahren sind wir als Hausverwaltung tätig. Unser Ziel ist es, Immobilienbesitzern die Sorgen und den Aufwand rund um die Verwaltung abzunehmen. Wir verstehen uns als Schnittstelle zwischen Eigentümern, Mietern und Dienstleistern. Unser erfahrenes Team bietet individuelle Betreuung, transparente Abrechnungen und schnelle Reaktionszeiten, damit Sie sich entspannt zurücklehnen können.
15+
</p>
16+
</div>
17+
18+
<div class="bind">
19+
<h2 class="headline">Leistungen</h2>
20+
<p class="paragraph">Unser Leistungsportfolio für Ihre Immobilie</p>
21+
22+
<h3 class="headline">Mietverwaltung</h3>
23+
<p class="paragraph">
24+
Wir übernehmen für Sie die vollständige Betreuung Ihrer Mietobjekte. Dazu gehören die Mietersuche, Vertragsgestaltung, Mieterkommunikation, Nebenkostenabrechnungen und vieles mehr.
25+
</p>
26+
27+
<h3 class="headline">WEG-Verwaltung</h3>
28+
<p class="paragraph">
29+
Für Wohnungseigentümergemeinschaften (WEG) bieten wir umfassende Dienstleistungen von der Verwaltung der gemeinschaftlichen Finanzen über die Durchführung von Eigentümerversammlungen bis hin zur Abwicklung von Instandhaltungsmaßnahmen.
30+
</p>
31+
32+
<h3 class="headline">Buchhaltung & Abrechnung</h3>
33+
<p class="paragraph">
34+
Eine transparente und ordnungsgemäße Buchführung ist das Rückgrat jeder Immobilienverwaltung. Wir sorgen für korrekte Abrechnungen und die rechtzeitige Erstellung der jährlichen Nebenkostenabrechnung.
35+
</p>
36+
37+
<h3 class="headline">Instandhaltung & Modernisierung</h3>
38+
<p class="paragraph">
39+
Unser Team koordiniert alle nötigen Reparaturen, Wartungen und Modernisierungen, um den Wert Ihrer Immobilie langfristig zu sichern.
40+
</p>
41+
</div>
42+
43+
<div class="bind">
44+
<h2 class="headline">Service für Mieter</h2>
45+
<p class="paragraph">
46+
Als Mieter profitieren Sie von einem direkten Zugang zu unserem Mieterportal. Hier können Sie wichtige Dokumente einsehen, Schäden melden und Fragen direkt an unser Team stellen. Wir garantieren eine schnelle Bearbeitung Ihrer Anliegen und einen transparenten Kommunikationsfluss.
47+
</p>
48+
49+
50+
</div>
51+
52+
</div>
53+
{% endblock %}

‎deploy/html/sites/immobilien.html

+63
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
{% extends "template.html" %}
2+
3+
{% block content %}
4+
5+
<div class="wrapper">
6+
<div class="bind">
7+
<h1 class="headline">
8+
Unsere Immobilien
9+
</h1>
10+
<p class="paragraph">
11+
Hier finden Sie eine Übersicht der Immobilien, die wir für Sie verwalten.
12+
</p>
13+
</div>
14+
15+
<div class="bind">
16+
<div class="immobilie-wrap">
17+
<sl-card class="immobilie">
18+
<img src="/static/site/images/haus-1.png" slot="image">
19+
<h2 class="headline">Kanalhafen 23</h2>
20+
<p>
21+
Als Mieter profitieren Sie von einem direkten Zugang zu unserem Mieterportal. Hier können Sie wichtige Dokumente einsehen, Schäden melden und Fragen direkt an unser Team stellen. Wir garantieren eine schnelle Bearbeitung Ihrer Anliegen und einen transparenten Kommunikationsfluss.
22+
</p>
23+
</sl-card>
24+
<sl-card class="immobilie">
25+
<img src="/static/site/images/haus-3.png" slot="image">
26+
<h2 class="headline">Kohlenhafen 13</h2>
27+
<p>
28+
Als Mieter profitieren Sie von einem direkten Zugang zu unserem Mieterportal. Hier können Sie wichtige Dokumente einsehen, Schäden melden und Fragen direkt an unser Team stellen. Wir garantieren eine schnelle Bearbeitung Ihrer Anliegen und einen transparenten Kommunikationsfluss.
29+
</p>
30+
</sl-card>
31+
<sl-card class="immobilie">
32+
<img src="/static/site/images/haus-4.png" slot="image">
33+
<h2 class="headline">Petroleumhafen 42</h2>
34+
<p>
35+
Als Mieter profitieren Sie von einem direkten Zugang zu unserem Mieterportal. Hier können Sie wichtige Dokumente einsehen, Schäden melden und Fragen direkt an unser Team stellen. Wir garantieren eine schnelle Bearbeitung Ihrer Anliegen und einen transparenten Kommunikationsfluss.
36+
</p>
37+
</sl-card>
38+
<sl-card class="immobilie">
39+
<img src="/static/site/images/haus-2.png" slot="image">
40+
<h2 class="headline">Stadthafen 1a</h2>
41+
<p>
42+
Als Mieter profitieren Sie von einem direkten Zugang zu unserem Mieterportal. Hier können Sie wichtige Dokumente einsehen, Schäden melden und Fragen direkt an unser Team stellen. Wir garantieren eine schnelle Bearbeitung Ihrer Anliegen und einen transparenten Kommunikationsfluss.
43+
</p>
44+
</sl-card>
45+
<sl-card class="immobilie">
46+
<img src="/static/site/images/haus-2.png" slot="image">
47+
<h2 class="headline">Stadthafen 1b</h2>
48+
<p>
49+
Als Mieter profitieren Sie von einem direkten Zugang zu unserem Mieterportal. Hier können Sie wichtige Dokumente einsehen, Schäden melden und Fragen direkt an unser Team stellen. Wir garantieren eine schnelle Bearbeitung Ihrer Anliegen und einen transparenten Kommunikationsfluss.
50+
</p>
51+
</sl-card>
52+
<sl-card class="immobilie">
53+
<img src="/static/site/images/haus-5.png" slot="image">
54+
<h2 class="headline">Südhafen 9</h2>
55+
<p>
56+
Als Mieter profitieren Sie von einem direkten Zugang zu unserem Mieterportal. Hier können Sie wichtige Dokumente einsehen, Schäden melden und Fragen direkt an unser Team stellen. Wir garantieren eine schnelle Bearbeitung Ihrer Anliegen und einen transparenten Kommunikationsfluss.
57+
</p>
58+
</sl-card>
59+
</div>
60+
</div>
61+
62+
</div>
63+
{% endblock %}

‎deploy/html/template.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -21,10 +21,10 @@
2121
<img src="/static/site/images/logo.svg">
2222
</a>
2323
<div class="menu">
24-
<a href="#" class="menu-item">
24+
<a href="/s/about" class="menu-item">
2525
Über Uns
2626
</a>
27-
<a href="#" class="menu-item">
27+
<a href="/s/immobilien" class="menu-item">
2828
Unsere Immobilien
2929
</a>
3030
<a href="/todo/add" class="menu-item">

‎sources/site/public/images/haus-1.png

1.23 MB
Loading

‎sources/site/public/images/haus-2.png

723 KB
Loading

‎sources/site/public/images/haus-3.png

714 KB
Loading

‎sources/site/public/images/haus-4.png

733 KB
Loading

‎sources/site/public/images/haus-5.png

713 KB
Loading

‎sources/site/styles/config.css

+79
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,79 @@
1+
2+
:root,
3+
:host {
4+
--ignt-theme-name: "Hausverwaltung";
5+
6+
/* Color Set */
7+
--ignt-color-primary: #970000;
8+
--ignt-color-grey: #EBEBEB;
9+
--ignt-color-border-default: var(--ignt-color-gray-300);
10+
--ignt-color-border-light: var(--ignt-color-gray-200);
11+
--ignt-color-text-default: #353535;
12+
--ignt-color-text-light: #91989c;
13+
14+
--ignt-basic-color-hover: #670101;
15+
16+
--sl-input-filled-background-color: var(--ignt-color-grey);
17+
--sl-input-filled-background-color-focus: var(--ignt-color-grey);
18+
19+
--ignt-surface-light: color-mix(in srgb, var(--ignt-color-neutral-0), var(--ignt-mix-color-up) 3%);
20+
--ignt-surface-dark: color-mix(in srgb, var(--ignt-color-neutral-0), var(--ignt-mix-color-up) 7%);
21+
22+
--ignt-color-hover-default: #f7f7f7;
23+
24+
/* Alert colors */
25+
--ignt-color-success: #419839;
26+
--ignt-color-warning: #ff8c00;
27+
--ignt-color-danger: color-mix(in oklch, var(--ignt-color-primary), darkred 80%);
28+
--ignt-color-info: #4785a7;
29+
30+
/* Buttons, Inputs, Forms and Menus */
31+
--ignt-color-form-default: var(--ignt-color-neutral-0);
32+
33+
/* Font sizes */
34+
--ignt-font-size-3x-small: .8rem;
35+
--ignt-font-size-2x-small: .85rem;
36+
--ignt-font-size-x-small: .9rem;
37+
--ignt-font-size-small: .95rem;
38+
--ignt-font-size-medium: 1rem;
39+
--ignt-font-size-large: 1rem;
40+
--ignt-font-size-x-large: 1rem;
41+
--ignt-font-size-2x-large: 1.2rem;
42+
--ignt-font-size-3x-large: 1.3rem;
43+
--ignt-font-size-4x-large: 1.4rem;
44+
45+
--ignt-input-height-large: 2.5rem;
46+
47+
/* Font Weights */
48+
--ignt-font-weight-light: 300;
49+
--ignt-font-weight-normal: 400;
50+
--ignt-font-weight-bold: 700;
51+
52+
--ignt-page-width-default: 1560px;
53+
--ignt-bind-gap: 140px;
54+
--ignt-bind-padding: var(--sl-spacing-3x-large);
55+
--ignt-bind-padding-mobile: var(--sl-spacing-large);
56+
--ignt-inner-page-width: calc(var(--ignt-page-width-default) - (2 * var(--ignt-bind-padding)));
57+
58+
--ignt-border-radius-default: 8px;
59+
60+
--ignt-menu-height: 130px;
61+
62+
/* Media queries / Supported screen sizes */
63+
--ignt-break-2x-small: 32em; /* old smart phones or gadgets like smart watches up to: 512px / 16px = 32em */
64+
--ignt-break-x-small: 54em; /* smart phones up to: 640px / 16px = 40em */
65+
--ignt-break-small: 900px; /* tablets up to: 1040px / 16px = 65em */
66+
--ignt-break-medium: 900px; /* screens: 1200px / 16px = 75em */
67+
--ignt-break-large: 94em; /* big screens up to: 1504px / 16px = 94em */
68+
--ignt-break-x-large: 105em; /* enough space left and right of the main binder: 1680px / 16px = 105em */
69+
--ignt-break-2x-large: 114em; /* huge screens: 1824px / 16px = 114em; */
70+
--ignt-break-3x-large: 225em; /* 4k screens: 3600px / 16px = 225em; */
71+
72+
--fluid-height-small: 300px;
73+
--fluid-height-medium: 450px;
74+
--fluid-height-large: 600px;
75+
76+
--sl-input-height-small: 2.5em;
77+
--sl-input-height-medium: 3em;
78+
--sl-input-height-large: 3.75em;
79+
}

‎sources/site/styles/style.css

+43
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
@charset "UTF-8";
22
@import url('@viur/ignite/ignite.css');
3+
@import url('config.css');
34

45
body {
56
height: 100%;
@@ -60,6 +61,10 @@ body {
6061
gap: 20px;
6162
}
6263

64+
.menu-item{
65+
font-weight: 600;
66+
}
67+
6368
.stage{
6469
width: 100%;
6570
height: calc(100vh - 200px);
@@ -129,3 +134,41 @@ body {
129134
font-size: 2em;
130135
font-weight: 600;
131136
}
137+
138+
h1.headline{
139+
font-size: 2.6em;
140+
}
141+
142+
h2.headline{
143+
font-size: 2.2em;
144+
}
145+
146+
h3.headline{
147+
font-size: 1.6em;
148+
color: var(--ignt-color-text-default);
149+
}
150+
151+
h4.headline{
152+
font-size: 1.5em;
153+
}
154+
155+
h5.headline{
156+
font-size: 1.2em;
157+
}
158+
159+
.immobilie-wrap{
160+
display: grid;
161+
grid-template-columns: repeat(3, minmax(0, 1fr));
162+
grid-gap: 30px;
163+
}
164+
165+
.immobilie{
166+
&::part(image){
167+
aspect-ratio: 1;
168+
169+
}
170+
171+
img{
172+
object-fit: cover;
173+
}
174+
}

0 commit comments

Comments
 (0)