Fix overflows, margin

2 files changed, 4 insertions, 60 deletions

diff --git a/static/css/hugo-apps-theme.css b/static/css/hugo-apps-theme.css
index e3eadcf..b174f1c 100644
--- a/static/css/hugo-apps-theme.css
+++ b/static/css/hugo-apps-theme.css
@@ -1,60 +1 @@
-@import url("https://fonts.googleapis.com/css?family=Rajdhani");
-html { /* @include screen(l, 1) { background-color: black; font-size: 10px; } @include screen(l, 2) { background-color: red; font-size: 15px; } @include screen(l, 3) { background-color: orange; font-size: 15px; } @include screen(l, 4) { background-color: yellow; font-size: 15px; } @include screen(l, 5) { background-color: green; font-size: 15px; } @include screen(l, 6) { background-color: blue; font-size: 15px; } @include screen(l, 7) { background-color: indigo; font-size: 20px; } @include screen(p, 1) { background-color: black; font-size: 10px; } @include screen(p, 2) { background-color: red; font-size: 15px; } @include screen(p, 3) { background-color: orange; font-size: 15px; } @include screen(p, 4) { background-color: yellow; font-size: 15px; } @include screen(p, 5) { background-color: green; font-size: 20px; } @include screen(p, 6) { background-color: blue; font-size: 20px; } @include screen(p, 7) { background-color: indigo; font-size: 20px; } */ }
-
-body { background-color: silver; font-family: 'Rajdhani', cursive; line-height: 120%; word-wrap: break-word; overflow: scroll; text-align: center; }
-
-h1 { font-size: 3.6rem; margin-top: 0.72rem; margin-bottom: 0.72rem; }
-
-h2 { font-size: 3rem; margin-top: 0.6rem; margin-bottom: 0.6rem; }
-
-h3 { font-size: 2.4rem; margin-top: 0.48rem; margin-bottom: 0.48rem; }
-
-h4 { font-size: 1.8rem; margin-top: 0.36rem; margin-bottom: 0.36rem; }
-
-h5 { font-size: 1.4rem; margin-top: 0.28rem; margin-bottom: 0.28rem; }
-
-h6 { font-size: 1.2rem; margin-top: 0.24rem; margin-bottom: 0.24rem; }
-
-h1, h2, h3, h4, h5, h6 { line-height: 110%; }
-
-p { font-size: 1rem; }
-
-pre { overflow: auto; }
-
-a { text-decoration: none; color: black; }
-
-a:visited { color: black; }
-
-a:hover { color: red; }
-
-@media (min-width: 0px) and (orientation: landscape) { .readability, hr, .apps-list, .apps-content { width: 100%; } }
-
-@media (min-width: 600px) and (orientation: landscape) { .readability, hr, .apps-list, .apps-content { width: 75%; } }
-
-@media (min-width: 1025px) and (orientation: landscape) { .readability, hr, .apps-list, .apps-content { width: 50%; } }
-
-@media (min-width: 0px) and (orientation: portrait) { .readability, hr, .apps-list, .apps-content { width: 100%; } }
-
-hr { border: 0; margin-top: 1rem; margin-bottom: 1rem; height: 1rem; background: black; }
-
-table { border-collapse: collapse; table-layout: fixed; }
-
-table, thead, tr, th, td, tfoot, fieldset, input, textarea { border: 0.1rem solid black; }
-
-thead, th { border-bottom-width: 0.2rem; }
-
-.apps-list, .apps-content { margin: 0 auto; }
-
-.apps-content { background-color: lightgray; text-align: left; overflow: scroll; }
-
-.apps-content > * { margin: 1rem 2rem 1rem 2rem; }
-
-.apps-header { color: black; }
-
-.apps-header .apps-header-title { font-size: 2.5rem; }
-
-.apps-app-item { display: inline-block; width: 8rem; vertical-align: top; margin-right: 1.5rem; margin-bottom: 1.5rem; }
-
-.apps-app-icon { display: inline-block; border: 0.5rem solid white; border-radius: 1.5rem; width: 8rem; height: 8rem; padding-bottom: 0; overflow: hidden; }
-
-.apps-app-icon img { width: 8rem; height: 8rem; }
+@import url("https://fonts.googleapis.com/css?family=Rajdhani");body{background-color:silver;font-family:'Rajdhani', cursive;line-height:120%;word-wrap:break-word;overflow:scroll;text-align:center}h1{font-size:3.6rem;margin-top:0.72rem;margin-bottom:0.72rem}h2{font-size:3rem;margin-top:0.6rem;margin-bottom:0.6rem}h3{font-size:2.4rem;margin-top:0.48rem;margin-bottom:0.48rem}h4{font-size:1.8rem;margin-top:0.36rem;margin-bottom:0.36rem}h5{font-size:1.4rem;margin-top:0.28rem;margin-bottom:0.28rem}h6{font-size:1.2rem;margin-top:0.24rem;margin-bottom:0.24rem}h1,h2,h3,h4,h5,h6{line-height:110%}p{font-size:1rem}pre{overflow:auto}a{text-decoration:none;color:black}a:visited{color:black}a:hover{color:red}@media (min-width: 0px) and (orientation: landscape){.readability,hr,.apps-list,.apps-content{width:100%}}@media (min-width: 600px) and (orientation: landscape){.readability,hr,.apps-list,.apps-content{width:75%}}@media (min-width: 1025px) and (orientation: landscape){.readability,hr,.apps-list,.apps-content{width:50%}}@media (min-width: 0px) and (orientation: portrait){.readability,hr,.apps-list,.apps-content{width:100%}}hr{border:0;margin-top:1rem;margin-bottom:1rem;height:1rem;background:black}table{border-collapse:collapse;table-layout:fixed}table,thead,tr,th,td,tfoot,fieldset,input,textarea{border:0.1rem solid black}thead,th{border-bottom-width:0.2rem}.apps-list,.apps-content{margin:0 auto}.apps-content{background-color:lightgray;text-align:left;overflow:scroll}.apps-content>*{margin:1rem 2rem 1rem 2rem}.apps-content *{max-width:100%}.apps-header{color:black}.apps-header .apps-header-title{font-size:2.5rem}.apps-app-item{display:inline-block;width:8rem;vertical-align:top;margin-right:1.5rem;margin-bottom:1.5rem}.apps-app-icon{display:inline-block;border:0.5rem solid white;border-radius:1.5rem;width:8rem;height:8rem;padding-bottom:0;overflow:hidden}.apps-app-icon img{width:8rem;height:8rem}
diff --git a/static/css/hugo-apps-theme.scss b/static/css/hugo-apps-theme.scss
index c12fc80..b7b15d8 100644
--- a/static/css/hugo-apps-theme.scss
+++ b/static/css/hugo-apps-theme.scss
@@ -215,6 +215,9 @@ thead, th {
   > * {
     margin: 1rem 2rem 1rem 2rem;
   }
+  * {
+    max-width: 100%
+  }
 }
 
 .apps-header {