diff --git a/FoodsharingSiegen.Server/Pages/Prospects.razor b/FoodsharingSiegen.Server/Pages/Prospects.razor
index 4470837..da6f7de 100644
--- a/FoodsharingSiegen.Server/Pages/Prospects.razor
+++ b/FoodsharingSiegen.Server/Pages/Prospects.razor
@@ -25,7 +25,7 @@
@if (activeProspects?.Any() == true)
{
- Aktuell:
+ Aktuell:
@@ -40,7 +40,7 @@
@if (completedProspects?.Any() == true)
{
- Abgeschlossen:
+ Abgeschlossen:
diff --git a/FoodsharingSiegen.Server/Shared/DefaultLayout.razor.css b/FoodsharingSiegen.Server/Shared/DefaultLayout.razor.css
index bacecfa..0a7eef2 100644
--- a/FoodsharingSiegen.Server/Shared/DefaultLayout.razor.css
+++ b/FoodsharingSiegen.Server/Shared/DefaultLayout.razor.css
@@ -87,17 +87,94 @@ input:checked ~ #menu-toggler-label span:nth-child(3) {
}
::deep h2 {
- font-size: 7.8vw;
+ font-size: 1.8rem;
}
@media screen and (min-width: 576px) {
::deep h2 {
- font-size: 4.8vw;
+ font-size: 3.2rem;
+ line-height: 3.2rem;
}
}
-@media screen and (min-width: 576px) {
+@media screen and (min-width: 768px) {
::deep h2 {
- font-size: 3.6vw;
+ font-size: 3.8rem;
+ line-height: 3.8rem;
+ }
+}
+
+@media screen and (min-width: 992px) {
+ ::deep h2 {
+ font-size: 3.8rem;
+ line-height: 3.8rem;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ ::deep h2 {
+ font-size: 3.8rem;
+ line-height: 3.8rem;
+ }
+}
+
+@media screen and (min-width: 1400px) {
+ ::deep h2 {
+ font-size: 3.8rem;
+ line-height: 3.8rem;
+ }
+}
+
+@media screen and (min-width: 1950px) {
+ ::deep h2 {
+ font-size: 3.2rem;
+ line-height: 3.2rem;
+ }
+}
+
+::deep h3 {
+ font-size: 1.4rem;
+ font-weight: 300;
+}
+
+@media screen and (min-width: 576px) {
+ ::deep h3 {
+ font-size: 2.4rem;
+ line-height: 2.4rem;
+ }
+}
+
+@media screen and (min-width: 768px) {
+ ::deep h3 {
+ font-size: 2.8rem;
+ line-height: 2.8rem;
+ }
+}
+
+@media screen and (min-width: 992px) {
+ ::deep h3 {
+ font-size: 2.8rem;
+ line-height: 2.8rem;
+ }
+}
+
+@media screen and (min-width: 1200px) {
+ ::deep h3 {
+ font-size: 2.8rem;
+ line-height: 2.8rem;
+ }
+}
+
+@media screen and (min-width: 1400px) {
+ ::deep h3 {
+ font-size: 2.8rem;
+ line-height: 2.8rem;
+ }
+}
+
+@media screen and (min-width: 1950px) {
+ ::deep h3 {
+ font-size: 2.4rem;
+ line-height: 2.4rem;
}
}
diff --git a/FoodsharingSiegen.Server/Shared/DefaultLayout.razor.scss b/FoodsharingSiegen.Server/Shared/DefaultLayout.razor.scss
index 5910431..650abbe 100644
--- a/FoodsharingSiegen.Server/Shared/DefaultLayout.razor.scss
+++ b/FoodsharingSiegen.Server/Shared/DefaultLayout.razor.scss
@@ -88,10 +88,29 @@ input:checked ~ #menu-toggler-label span {
}
+@mixin mediaFont($breakpoint, $fontsize) {
+ @media screen and (min-width: #{$breakpoint}px) { font-size: #{$fontsize}; line-height: #{$fontsize}; }
+}
+
::deep {
h2 {
- font-size: 7.8vw;
- @media screen and (min-width: #{$breakpointXS}px) { font-size: 4.8vw; }
- @media screen and (min-width: #{$breakpointXS}px) { font-size: 3.6vw; }
+ font-size: 1.8rem;
+ @include mediaFont($breakpointXS, 3.2rem);
+ @include mediaFont($breakpointS, 3.8rem);
+ @include mediaFont($breakpointM, 3.8rem);
+ @include mediaFont($breakpointL, 3.8rem);
+ @include mediaFont($breakpointXL, 3.8rem);
+ @include mediaFont($breakpointXXL, 3.2rem);
+ }
+
+ h3 {
+ font-size: 1.4rem;
+ font-weight: 300;
+ @include mediaFont($breakpointXS, 2.4rem);
+ @include mediaFont($breakpointS, 2.8rem);
+ @include mediaFont($breakpointM, 2.8rem);
+ @include mediaFont($breakpointL, 2.8rem);
+ @include mediaFont($breakpointXL, 2.8rem);
+ @include mediaFont($breakpointXXL, 2.4rem);
}
}
\ No newline at end of file
diff --git a/FoodsharingSiegen.Server/Style/_variables.scss b/FoodsharingSiegen.Server/Style/_variables.scss
index 111a660..6a63a40 100644
--- a/FoodsharingSiegen.Server/Style/_variables.scss
+++ b/FoodsharingSiegen.Server/Style/_variables.scss
@@ -2,4 +2,5 @@
$breakpointS: 768;
$breakpointM: 992;
$breakpointL: 1200;
-$breakpointXL: 1400;
\ No newline at end of file
+$breakpointXL: 1400;
+$breakpointXXL: 1950;
\ No newline at end of file