Adjust styles for large font sizes

ionic-team · Sep 29, 2023 · d40f6a6 · d40f6a6
1 parent 84bfdca
commit d40f6a6
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 1 deletion.
diff --git a/src/app/app.component.scss b/src/app/app.component.scss
@@ -24,6 +24,8 @@ ion-menu.md ion-list-header {
   padding-right: 18px;
   padding-left: 18px;
 
+  font-size: min(1.375rem, 36px);
+
   font-weight: 450;
 
   letter-spacing: .1em;
@@ -67,6 +69,8 @@ ion-menu.ios ion-list-header {
 
   padding-right: 16px;
   padding-left: 16px;
+
+  font-size: clamp(22px, 1.375rem, 40px);
 }
 
 ion-menu.ios ion-list {

diff --git a/src/app/pages/about/about.scss b/src/app/pages/about/about.scss
@@ -53,13 +53,15 @@ ion-toolbar ion-menu-button {
 }
 
 .about-info {
-  position: absolute;
+  position: relative;
 
   margin-top: -10px;
 
   border-radius: 10px;
 
   background: var(--ion-background-color, #ffffff);
+
+  z-index: 2; // display rounded border above header image
 }
 
 .about-info h3 {