Fixing footer

assets/scss/common.scss

@@ -39,6 +39,11 @@ body {
     padding: 1em;
 }
 
+.padding-container-1 {
+    padding-left: 1em;
+    padding-right: 1em;
+}
+
 .padding-container-3 {
     padding-left: 3em;
     padding-right: 3em;

assets/scss/components/columns.scss

@@ -21,8 +21,7 @@
     display: flex;
 }
 
-.column {
-    &.col1 {
+.col1 {
     &:not(.col1-fill) {
         width: 50%;
         margin-right: auto !important;
@@ -32,31 +31,30 @@
     &.col1-fill {
         width: 100%;
     }
-    }
+}
 
-    &.col2 {
+.col2 {
     width: 50%;
-    }
+}
 
-    &.col3 {
+.col3 {
     width: 33%;
-    }
+}
 
-    &.col2-3 {
+.col2-3 {
     width: 66%;
-    }
+}
 
-    &.col4 {
+.col4 {
     width: 25%;
-    }
+}
 
-    &.col3-4 {
+.col3-4 {
     width: 75%;
-    }
+}
 
-    &.col5 {
+.col5 {
     width: 20%;
-    }
 }
 
 @media screen and (max-width: 700px) {

layouts/partials/footer.html

@@ -1,7 +1,7 @@
 <footer>
     <br><br>
     <div class="columns-container">
-        <div class="col3 footer-social-list grid padding-container-3">
+        <div class="col3 footer-social-list grid padding-container-1">
             {{ range .Site.Menus.social }}
                 <a role="button" alt="{{ .Name }}" title="{{ .Name }}" href={{ .URL }}>
                     {{ .Pre }}
@@ -11,7 +11,7 @@
         <div class="text-center col3">
             {{ .Site.Copyright }}
         </div>
-        <div class="col3 text-right padding-container-3">
+        <div class="col3 text-right padding-container-1">
             {{ .Site.Params.usingTheme }} <a href="/omegamma">Omegamma</a><br>
             {{ .Site.Params.poweredBy }} <a href="https://gohugo.io">Hugo</a>
         </div>