diff --git a/sass/_elements.sass b/sass/_elements.sass index 16fe5e67..9e24e915 100644 --- a/sass/_elements.sass +++ b/sass/_elements.sass @@ -35,7 +35,6 @@ & pre line-height: 2rem border-radius: 2px - background-color: lighten($dark-grey, 10%) padding: 1rem max-width: 100% overflow-x: scroll @@ -44,9 +43,9 @@ & code font-size: 0.9rem font-family: 'Source Code Pro', monospace - background-color: lighten($dark-grey, 10%) - padding: 0.2rem - border-radius: 2px + padding: 0.1rem + border-radius: 3px + border: 1px solid $links & img width: 100% max-width: 100% @@ -80,6 +79,9 @@ line-height: 2 &:last-child margin-bottom: 1rem + & .highlight + max-width: 100% + color: $dark-grey #tag padding: 0.25em 0em diff --git a/static/css/style.css b/static/css/style.css index 99d7b0e0..c32cda3e 100755 --- a/static/css/style.css +++ b/static/css/style.css @@ -1 +1 @@ -*{margin:0;padding:0;-webkit-box-sizing:border-box;box-sizing:border-box}html{background-color:#39424E;font-family:"Didact Gothic","sans serif";font-size:16px}body{font-size:16px;font-family:"Didact Gothic","sans serif";color:#fff;line-height:2rem;letter-spacing:1.5px;text-shadow:none;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;opacity:1}h1,h2,h3{margin-bottom:0.5em;text-align:center;font-family:'Didact Gothic', sans-serif;opacity:0.6}li{list-style-type:none;opacity:0.8}li a{opacity:0.9}p{display:inline;opacity:0.8}a{color:#ccc;text-decoration:none;border-bottom:2px solid #ccc;-webkit-transition:.5s ease;transition:.5s ease}a:hover{color:#fff;font-style:none}a:active{color:#ccc}button{padding:20px;border:0px;border-radius:5px;background:#fff}button:hover{-webkit-box-shadow:5px 5px #111;box-shadow:5px 5px #111}hr{margin:1rem 0;background-color:transparent;width:50%;border-style:solid;border-width:1px;opacity:0.3}.wrap{margin:0 auto;margin-top:6rem;width:45%}@media screen and (max-width: 736px){.wrap{padding:1rem;width:100%}}.tag{width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;background-color:transparent;position:relative;bottom:0}.section{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.bottom-menu{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding-top:3rem;text-align:center}.footer{width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;text-align:center;background-color:transparent;position:relative;bottom:0;padding:3rem 1rem;font-family:"Didact Gothic","sans serif";font-size:1rem;line-height:1em;opacity:0.8}.footer a{border-bottom:none}#splash{margin:auto 0;height:100vh;width:45%;overflow:hidden}@media screen and (max-width: 736px){#splash{width:90%}}#big-link{font-family:"Didact Gothic","sans serif";font-size:3rem;font-weight:300;margin-bottom:2rem;line-height:1.5em}#title{margin-top:3rem;font-family:"Didact Gothic","sans serif";font-size:2rem;line-height:3rem;margin-bottom:2rem}#content{margin:2rem 0;line-height:2em;letter-spacing:2px}#content h1,#content h2,#content h3{margin:1em 0em;text-align:left}#content p{margin-bottom:1em;line-height:1.8;letter-spacing:1.5px;opacity:0.8}#content pre{line-height:2rem;border-radius:2px;background-color:#4f5b6b;padding:1rem;max-width:100%;overflow-x:scroll}#content pre>code{border:none}#content code{font-size:0.9rem;font-family:'Source Code Pro', monospace;background-color:#4f5b6b;padding:0.2rem;border-radius:2px}#content img{width:100%;max-width:100%;display:block;margin:2rem auto;opacity:1}#content blockquote{background-color:#ccc;color:#39424E;padding:2rem;margin:2rem 1rem 2rem 1rem;border-radius:3px}#content blockquote ul{margin-top:1rem}#content blockquote li{list-style:disc}#content table{width:100%;border-collapse:collapse;margin:1rem 0;overflow-x:auto}#content table th{font-size:0.9rem}#content table td,#content table th{padding:2px 5px;text-align:center;border:1px solid #ccc}#content li{list-style:disc inside;margin-left:1rem;line-height:2}#content li:last-child{margin-bottom:1rem}#tag{padding:0.25em 0em;margin-right:0.5em;opacity:0.6}.grid{display:grid;grid-gap:20px;grid-template-columns:repeat(auto-fit, minmax(400px, 1fr));grid-auto-rows:400px}@media screen and (max-width: 736px){.grid{grid-template-columns:repeat(auto-fit, minmax(100%, 1fr))}}.grid>div{background-color:transparent;overflow:hidden}.grid>div>img{height:100%;width:100%;-o-object-fit:cover;object-fit:cover;opacity:1}.grid>div>a>img{height:100%;width:100%;-o-object-fit:cover;object-fit:cover;opacity:1}.go-left{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.go-right{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}.go-center{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center} +*{margin:0;padding:0;-webkit-box-sizing:border-box;box-sizing:border-box}html{background-color:#39424E;font-family:"Didact Gothic","sans serif";font-size:16px}body{font-size:16px;font-family:"Didact Gothic","sans serif";color:#fff;line-height:2rem;letter-spacing:1.5px;text-shadow:none;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:center;-ms-flex-align:center;align-items:center;opacity:1}h1,h2,h3{margin-bottom:0.5em;text-align:center;font-family:'Didact Gothic', sans-serif;opacity:0.6}li{list-style-type:none;opacity:0.8}li a{opacity:0.9}p{display:inline;opacity:0.8}a{color:#ccc;text-decoration:none;border-bottom:2px solid #ccc;-webkit-transition:.5s ease;transition:.5s ease}a:hover{color:#fff;font-style:none}a:active{color:#ccc}button{padding:20px;border:0px;border-radius:5px;background:#fff}button:hover{-webkit-box-shadow:5px 5px #111;box-shadow:5px 5px #111}hr{margin:1rem 0;background-color:transparent;width:50%;border-style:solid;border-width:1px;opacity:0.3}.wrap{margin:0 auto;margin-top:6rem;width:45%}@media screen and (max-width: 736px){.wrap{padding:1rem;width:100%}}.tag{width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;background-color:transparent;position:relative;bottom:0}.section{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.bottom-menu{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;padding-top:3rem;text-align:center}.footer{width:100%;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;text-align:center;background-color:transparent;position:relative;bottom:0;padding:3rem 1rem;font-family:"Didact Gothic","sans serif";font-size:1rem;line-height:1em;opacity:0.8}.footer a{border-bottom:none}#splash{margin:auto 0;height:100vh;width:45%;overflow:hidden}@media screen and (max-width: 736px){#splash{width:90%}}#big-link{font-family:"Didact Gothic","sans serif";font-size:3rem;font-weight:300;margin-bottom:2rem;line-height:1.5em}#title{margin-top:3rem;font-family:"Didact Gothic","sans serif";font-size:2rem;line-height:3rem;margin-bottom:2rem}#content{margin:2rem 0;line-height:2em;letter-spacing:2px}#content h1,#content h2,#content h3{margin:1em 0em;text-align:left}#content p{margin-bottom:1em;line-height:1.8;letter-spacing:1.5px;opacity:0.8}#content pre{line-height:2rem;border-radius:2px;padding:1rem;max-width:100%;overflow-x:scroll}#content pre>code{border:none}#content code{font-size:0.9rem;font-family:'Source Code Pro', monospace;padding:0.1rem;border-radius:3px;border:1px solid #ccc}#content img{width:100%;max-width:100%;display:block;margin:2rem auto;opacity:1}#content blockquote{background-color:#ccc;color:#39424E;padding:2rem;margin:2rem 1rem 2rem 1rem;border-radius:3px}#content blockquote ul{margin-top:1rem}#content blockquote li{list-style:disc}#content table{width:100%;border-collapse:collapse;margin:1rem 0;overflow-x:auto}#content table th{font-size:0.9rem}#content table td,#content table th{padding:2px 5px;text-align:center;border:1px solid #ccc}#content li{list-style:disc inside;margin-left:1rem;line-height:2}#content li:last-child{margin-bottom:1rem}#content .highlight{max-width:100%;color:#39424E}#tag{padding:0.25em 0em;margin-right:0.5em;opacity:0.6}.grid{display:grid;grid-gap:20px;grid-template-columns:repeat(auto-fit, minmax(400px, 1fr));grid-auto-rows:400px}@media screen and (max-width: 736px){.grid{grid-template-columns:repeat(auto-fit, minmax(100%, 1fr))}}.grid>div{background-color:transparent;overflow:hidden}.grid>div>img{height:100%;width:100%;-o-object-fit:cover;object-fit:cover;opacity:1}.grid>div>a>img{height:100%;width:100%;-o-object-fit:cover;object-fit:cover;opacity:1}.go-left{-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}.go-right{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}.go-center{-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}