Replaced css for main tag with .main-section class

Signed-off-by: ChaitanyaKaranam <[email protected]>
kubernetes · Oct 22, 2019 · 3a00c5a · 3a00c5a
1 parent a1ec4f7
commit 3a00c5a
Show file tree

Hide file tree

Showing 5 changed files with 14 additions and 80 deletions.
diff --git a/assets/sass/_base.sass b/assets/sass/_base.sass
@@ -70,7 +70,7 @@ section
   background-color: white
 
 section, header, footer
-  main, .main-section
+  .main-section
     position: relative
     margin: auto
 
@@ -249,7 +249,7 @@ header
     color: $blue
     font-weight: normal
 
-  main, .main-section
+  .main-section
     white-space: nowrap
     overflow: hidden
     clear: both
@@ -439,7 +439,7 @@ footer
   background-image: url(/images/texture.png)
   background-color: $dark-grey
 
-  main, .main-section
+  .main-section
     padding: 20px 0
 
   nav
@@ -1121,7 +1121,7 @@ $feature-box-div-margin-bottom: 40px
     margin-bottom: 0
     padding-bottom: 1px
 
-    main, .main-section
+    .main-section
       padding: 0 10px
       margin-bottom: 30px
 
@@ -1147,7 +1147,7 @@ $feature-box-div-margin-bottom: 40px
   a
     color: $blue
 
-  main, .main-section
+  .main-section
     margin-bottom: $ocean-nodes-padding-Y
     min-height: 160px
 
@@ -1160,7 +1160,7 @@ $feature-box-div-margin-bottom: 40px
       width: 100%
       max-width: 160px
 
-  main:first-child, .main-section:first-child
+  .main-section:first-child
     .image-wrapper
       max-width: 100%
 
@@ -1356,7 +1356,7 @@ $feature-box-div-margin-bottom: 40px
   #mainContent
     padding: 20px 0
 
-    main, .main-section
+    .main-section
       max-width: none
 
     a
@@ -1775,7 +1775,7 @@ $feature-box-div-margin-bottom: 40px
 
 #home
   #talkToUs
-    main, .main-section
+    .main-section
       padding: 30px 0
 
     h5

diff --git a/assets/sass/_desktop.sass b/assets/sass/_desktop.sass
@@ -95,7 +95,7 @@ $video-section-height: 550px
       right: -25px
 
   section, header, footer
-    main, .main-section
+    .main-section
       max-width: $main-max-width
 
   header, #vendorStrip, #encyclopedia, #hero h1, #hero h5, #docs #hero h1, #docs #hero h5,
@@ -108,11 +108,11 @@ $video-section-height: 550px
 
   #home
     section, header, footer
-      main, .main-section
+      .main-section
         max-width: 1000px
 
   #oceanNodes
-    main, .main-section
+    .main-section
       position: relative
       max-width: 830px
 
@@ -172,7 +172,7 @@ $video-section-height: 550px
     background-image: url(../images/texture.png)
     background-color: $dark-grey
 
-    main, .main-section
+    .main-section
       padding: 20px 0
 
     nav

diff --git a/assets/sass/_size.sass b/assets/sass/_size.sass
@@ -26,7 +26,7 @@ section, header, #vendorStrip
   padding-left: $full-width-paddingX
   padding-right: $full-width-paddingX
 
-  main, .main-section
+  .main-section
     width: $main-width
     max-width: $main-max-width
 
@@ -59,9 +59,6 @@ header
   .nav-box + .nav-box
     margin-left: $nav-box-sibling-margin-left
 
-  main + main
-    margin-top: $main-nav-main-sibling-margin-top
-
   .main-secton + .main-section
     margin-top: $main-nav-main-sibling-margin-top
 

diff --git a/content/en/partners/_index.html b/content/en/partners/_index.html
@@ -7,7 +7,7 @@
 ---
 
 <section id="users">
-    <main>
+    <main class="main-section">
         <h5>Kubernetes works with partners to create a strong, vibrant codebase that supports a spectrum of complementary platforms.</h5>
         <div class="col-container">
           <div class="col-nav">

diff --git a/static/css/gridpage.css b/static/css/gridpage.css
@@ -39,10 +39,6 @@
     padding-top: 0;
 }
 
-.gridPage main {
-    max-width: 1100px !important;
-}
-
 .gridPage .main-section {
     max-width: 1100px !important;
 }
@@ -108,28 +104,6 @@ p.attrib {
     /*height: 340px;*/
 }
 
-.gridPage #video main {
-    position: relative;
-    max-width: 900px !important;
-    height: 100%;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    padding: 50px 20px;
-}
-
-.gridPage #video main > div {
-    width: 50%;
-}
-
-.gridPage #video main #zulilyLogo {
-    width: 100px;
-}
-
-.gridPage #video main img {
-    max-width: 100%;
-}
-
 .gridPage #video .main-section {
     position: relative;
     max-width: 900px !important;
@@ -179,15 +153,6 @@ p.attrib {
     padding: 50px;
 }
 
-.gridPage #users main {
-    max-width: 1150px !important;
-}
-
-.gridPage #users main h3 {
-    padding-left: 20px;
-    margin-bottom: 20px;
-}
-
 .gridPage #users .main-section {
     max-width: 1150px !important;
 }
@@ -245,12 +210,6 @@ section.bullets {
     margin-bottom: 50px;
 }
 
-section.bullets main {
-    position: relative;
-    max-width: 1100px;
-    padding: 50px 0;
-}
-
 section.bullets .main-section {
     position: relative;
     max-width: 1100px;
@@ -312,23 +271,6 @@ section.bullets .content {
 }
 
 @media screen and (max-width: 900px){
-    .gridPage #video main {
-        flex-direction: column;
-        align-items: center;
-    }
-
-    .gridPage #video main > div {
-        width: 400px;
-    }
-
-    .gridPage #video main > div + div {
-        margin-top: 30px;
-    }
-
-    .gridPage #video h3 {
-        max-width: 100%;
-    }
-
     .gridPage #video .main-section {
         flex-direction: column;
         align-items: center;
@@ -379,11 +321,6 @@ section.bullets .content {
         padding-left: 20px;
     }
 
-    .gridPage #video main > div {
-        width: 80%;
-        min-width: 280px;
-    }
-
     .gridPage #video .main-section > div {
         width: 80%;
         min-width: 280px;