add left-right padding for small res
authorIan Kelling <ian@iankelling.org>
Mon, 3 Oct 2016 20:56:23 +0000 (13:56 -0700)
committerIan Kelling <ian@iankelling.org>
Mon, 3 Oct 2016 20:56:23 +0000 (13:56 -0700)
b.rb
css/common.scss
css/gitweb-site.scss
css/main.scss

diff --git a/b.rb b/b.rb
index 4611b5d7fe9cc237c98341c2b8765acae5fdeddb..6bd631d9c9d81489e3263da61b0a6349c61b6699 100644 (file)
--- a/b.rb
+++ b/b.rb
@@ -82,7 +82,7 @@ EOF
     <meta name="viewport" content="width=device-width, initial-scale=1">
   </head>
   <body>
-    <header>
+    <header class="page_header">
       <h3><a href="/">iankelling.org</a>#{o[:header]}</h3>
     </header>
     <div class="main-content-stripe">
index d0c5e76cb24545d87a678e538b908b360a6f4ea0..ca35862f8e7e93c993add9dc7a763d4a496a412c 100644 (file)
@@ -1,6 +1,6 @@
 /* a few other things are duplicated in main.css and gitweb.css,*/
-/* but they are for different classes and such, and it's not worth using*/
-/* css variables etc at this point. */
+
+$main-column-max-width: 700px;
 
 /* nice font seen elsewhere. google -> stackoverflow -> localfont.com */
 /* If I didn't use this font, I'd just go with sans-serif */
index 11b81e287608685453f81102b871d48eb5dcce5a..f884fc7b7ce3f3e1cfd4c15e1b70913985d50add 100644 (file)
@@ -11,8 +11,14 @@ body {
     border-width: 0px;
 }
 .page_header,.page_footer {
-    margin: 0 auto;
-    max-width: 700px;
+    // auto centers it
+    margin-left: auto;
+    margin-right: auto;
+    margin-top: 0;
+    margin-bottom: 0;
+    padding-left: 30px;
+    padding-right: 30px;
+    max-width: $main-column-max-width;
 }
 
 table.project_list {
@@ -31,7 +37,8 @@ div.page_header {
     margin-top: 21.0667px;
     margin-bottom: 21.0667px;
     /* remove padding added by gitweb's css */
-    padding: 0;
+    padding-top: 0;
+    padding-bottom: 0;
 }
 
 /* I tried to find all the css to override,*/
index 375f7ec6f3263d60a8fae322da0fe3fa9b3d173d..a9288e1a70661cb80b5bf66627129dd8e184c1cf 100644 (file)
@@ -29,7 +29,8 @@ div.comment {
 
 #comment-section {
     /* make the top/bottom of comments have more space */
-    padding: 30px 0;
+    padding-top: 30px;
+    padding-bottom: 30px;
 }
 
 
@@ -132,11 +133,16 @@ footer {
 footer p {
     margin: 0;
 }
-header,footer,.content,#comment-section {
-    /* top margin 0, left/right = auto, which centers it */
-    margin: 0 auto;
+.page_header,footer,.content,#comment-section {
+    // auto centers it
+    margin-left: auto;
+    margin-right: auto;
+    margin-top: 0;
+    margin-bottom: 0;
+    padding-left: 30px;
+    padding-right: 30px;
     /* default too wide */
-    max-width: 700px;
+    max-width: $main-column-max-width;
 }
 footer {
     font-size: 15px;