arona/website
1
0
Fork 0
Code Issues 1 Pull Requests Releases Activity

Prevent articles from using whole of small screens

Browse Source 
(screens that don't allow optimum ~80ch width)
This commit is contained in:
FreneticScribbler
2021-01-06 17:55:36 +00:00
parent 99b8c95896
commit 5d2292cfb8
2 changed files with 2 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/sass/screen.scss
View File

@@ -110,7 +110,7 @@ h3 {
} }
article { article {
margin: 0 auto; margin: 0 auto;
max-width: 80ch !important; max-width: unquote("min(80%, 60ch)") !important;
} }
.container { .container {
min-height: 100%; min-height: 100%;

2
static/css/screen.css
View File

@@ -1 +1 @@
*,::after,::before{box-sizing:inherit}body,dd,hr{margin:0;padding:0}blockquote,dl,figure,h1,h2,h3,h4,h5,h6,ol,p,ul{padding:0}blockquote,dl,h1,h2,h3,h4,h5,h6,ol,pre,ul{margin:0 0 15px}.highlight{margin-bottom:15px}figure>img,main{display:block}img{vertical-align:middle;max-width:100%}figcaption{font-size:14px;text-align:center;color:#999}ol,ul{margin-left:30px}li>ol,li>ul{margin-bottom:0}a{color:#2a7ae2;text-decoration:none}a:visited{color:#1756a9}a:hover{color:#111;text-decoration:underline}blockquote{color:#828282;border-left:4px solid #e8e8e8;padding-left:15px;font-size:18px;letter-spacing:-1px;font-style:italic}blockquote>:last-child{margin-bottom:0}code,pre,table{border:1px solid #e8e8e8}code,pre{font-size:15px;border-radius:3px;background-color:#eef}code{padding:1px 5px}pre{padding:8px 12px;overflow-x:auto}pre>code{border:0;padding-right:0;padding-left:0}table{margin-bottom:30px;width:100%;text-align:left;color:#3f3f3f;border-collapse:collapse}table tr:nth-child(even){background-color:#f7f7f7}table td,table th{padding:10px 15px}table th{background-color:#f0f0f0;border:1px solid #dedede;border-bottom-color:#c9c9c9}table td{border:1px solid #e8e8e8}body,html{width:100%;height:100%;overflow-x:hidden;font-family:helvetica,arial;font-size:100%;box-sizing:border-box;background-color:#222831}footer,header{background:#202226;padding:1rem;text-align:center}header>*{padding-top:.5em}header{box-shadow:0 0 25px 0 #000}body,footer,footer>a,h3,html{color:#fff}footer>a{font-size:x-large;padding:.5rem}h1{color:#00adff}figure,p{margin:15px 0}.contained{width:70vw;margin-left:auto;margin-right:auto}article{margin:0 auto;max-width:80ch!important}.container{min-height:100%;display:grid;grid-template-rows:auto 1fr auto;grid-template-columns:100%}.bigimage{transform:skew(-10deg);color:#fff;padding:2em;width:100%;height:100%;text-align:center}img.background{-o-object-fit:cover;object-fit:cover;color:#000;width:100%;height:100%;position:absolute;left:0;top:0;z-index:-1;-webkit-filter:blur(2px);filter:blur(2px);transition:.3s ease-in-out}.bigimage:hover img{-webkit-filter:blur(0);filter:blur(0)}a.button,nav>*{display:inline-block;position:relative}a.button{transform:skew(10deg);color:#fff;touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer;overflow:hidden;padding:.8em;background:rgba(32,34,38,.7)}.badge,nav{align-items:center}.badge,a.button{border-radius:.5em}.badge{display:inline-flex;justify-content:center;padding:4px 8px}.bg-green{background:green}.full-width{width:100vw;position:relative;left:50%;right:50%;margin-left:-50vw;margin-right:-50vw}nav{display:flex;flex-wrap:wrap;width:70%}nav>*{padding-left:2em;padding-right:2em;border-left:2px solid #000;color:#fff!important}nav :first-child{padding-left:0;border-left:none}nav>::after{content:'';position:absolute;height:2px;width:100%;left:0;bottom:0;opacity:0;transform:translateY(3px);background:#00adff;transition:opacity .2s ease,transform .2s ease}nav a:hover{color:#00adff;text-decoration:none}.borderFade:hover::after,nav a:hover::after{opacity:1;transform:translateY(0)}@media only screen and (max-width:800px){nav{flex-direction:column}nav>*{margin-right:auto;padding-bottom:.5em}nav :first-child{padding-left:2em;border-left:2px solid #000}#homepage-container{flex-wrap:wrap}.bigimage{max-height:20vh}.bigimage,a.button{transform:skew(0deg)}} *,::after,::before{box-sizing:inherit}body,dd,hr{margin:0;padding:0}blockquote,dl,figure,h1,h2,h3,h4,h5,h6,ol,p,ul{padding:0}blockquote,dl,h1,h2,h3,h4,h5,h6,ol,pre,ul{margin:0 0 15px}.highlight{margin-bottom:15px}figure>img,main{display:block}img{vertical-align:middle;max-width:100%}figcaption{font-size:14px;text-align:center;color:#999}ol,ul{margin-left:30px}li>ol,li>ul{margin-bottom:0}a{color:#2a7ae2;text-decoration:none}a:visited{color:#1756a9}a:hover{color:#111;text-decoration:underline}blockquote{color:#828282;border-left:4px solid #e8e8e8;padding-left:15px;font-size:18px;letter-spacing:-1px;font-style:italic}blockquote>:last-child{margin-bottom:0}code,pre,table{border:1px solid #e8e8e8}code,pre{font-size:15px;border-radius:3px;background-color:#eef}code{padding:1px 5px}pre{padding:8px 12px;overflow-x:auto}pre>code{border:0;padding-right:0;padding-left:0}table{margin-bottom:30px;width:100%;text-align:left;color:#3f3f3f;border-collapse:collapse}table tr:nth-child(even){background-color:#f7f7f7}table td,table th{padding:10px 15px}table th{background-color:#f0f0f0;border:1px solid #dedede;border-bottom-color:#c9c9c9}table td{border:1px solid #e8e8e8}body,html{width:100%;height:100%;overflow-x:hidden;font-family:helvetica,arial;font-size:100%;box-sizing:border-box;background-color:#222831}footer,header{background:#202226;padding:1rem;text-align:center}header>*{padding-top:.5em}header{box-shadow:0 0 25px 0 #000}body,footer,footer>a,h3,html{color:#fff}footer>a{font-size:x-large;padding:.5rem}h1{color:#00adff}figure,p{margin:15px 0}.contained{width:70vw;margin-left:auto;margin-right:auto}article{margin:0 auto;max-width:min(80%,60ch)!important}.container{min-height:100%;display:grid;grid-template-rows:auto 1fr auto;grid-template-columns:100%}.bigimage{transform:skew(-10deg);color:#fff;padding:2em;width:100%;height:100%;text-align:center}img.background{-o-object-fit:cover;object-fit:cover;color:#000;width:100%;height:100%;position:absolute;left:0;top:0;z-index:-1;-webkit-filter:blur(2px);filter:blur(2px);transition:.3s ease-in-out}.bigimage:hover img{-webkit-filter:blur(0);filter:blur(0)}a.button,nav>*{display:inline-block;position:relative}a.button{transform:skew(10deg);color:#fff;touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:pointer;overflow:hidden;padding:.8em;background:rgba(32,34,38,.7)}.badge,nav{align-items:center}.badge,a.button{border-radius:.5em}.badge{display:inline-flex;justify-content:center;padding:4px 8px}.bg-green{background:green}.full-width{width:100vw;position:relative;left:50%;right:50%;margin-left:-50vw;margin-right:-50vw}nav{display:flex;flex-wrap:wrap;width:70%}nav>*{padding-left:2em;padding-right:2em;border-left:2px solid #000;color:#fff!important}nav :first-child{padding-left:0;border-left:none}nav>::after{content:'';position:absolute;height:2px;width:100%;left:0;bottom:0;opacity:0;transform:translateY(3px);background:#00adff;transition:opacity .2s ease,transform .2s ease}nav a:hover{color:#00adff;text-decoration:none}.borderFade:hover::after,nav a:hover::after{opacity:1;transform:translateY(0)}@media only screen and (max-width:800px){nav{flex-direction:column}nav>*{margin-right:auto;padding-bottom:.5em}nav :first-child{padding-left:2em;border-left:2px solid #000}#homepage-container{flex-wrap:wrap}.bigimage{max-height:20vh}.bigimage,a.button{transform:skew(0deg)}}