Improve mobile codelab title.

googlecodelabs · Apr 7, 2022 · d977ead · d977ead
1 parent c3b83b4
commit d977ead
Showing 1 changed file with 6 additions and 0 deletions.
diff --git a/codelab-elements/google-codelab/google_codelab.scss b/codelab-elements/google-codelab/google_codelab.scss
@@ -49,6 +49,7 @@ google-codelab #codelab-title {
   padding: 0 36px 0 16px;
   -webkit-font-smoothing: antialiased;
   z-index: 1000;
+  max-width: 100vw;
 }
 
 google-codelab #codelab-title h1 {
@@ -120,6 +121,7 @@ google-codelab #controls {
 google-codelab #fabs {
   display: flex;
   justify-content: space-between;
+  margin: 0 auto;
   max-width: 1025px;
 }
 
@@ -197,6 +199,10 @@ google-codelab .metadata a:focus {
     padding-top: 0;
   }
 
+  google-codelab #codelab-title {
+    padding: 0 16px;
+  }
+
   google-codelab #codelab-title .codelab-time-container {
     display: none;
   }