diff options
Diffstat (limited to 'Peli-Kiera/static/css')
-rw-r--r-- | Peli-Kiera/static/css/main.css | 404 | ||||
-rw-r--r-- | Peli-Kiera/static/css/pygment.css | 77 |
2 files changed, 481 insertions, 0 deletions
diff --git a/Peli-Kiera/static/css/main.css b/Peli-Kiera/static/css/main.css new file mode 100644 index 0000000..61bb2ec --- /dev/null +++ b/Peli-Kiera/static/css/main.css @@ -0,0 +1,404 @@ +@import url("pygment.css"); + +body { + margin: 0; + padding: 0; + overflow-x: hidden; + font-family: "Roboto Slab", serif; + color: #333333; +} + +h1, +h2, +h3, +h4, +h5, +h6, +time { + font-family: "Ruda", sans-serif; +} + +#container { + margin: 0; + padding: 0; + max-width: 100vw; + min-height: 100vh; + display: flex; + flex-direction: column; +} + +#container > * { + width: 700px; + margin: 0 auto; +} + +@media only screen and (max-width: 800px) { + #container > * { + width: auto; + margin: 0 1.2em; + } +} + +#container header { + margin-bottom: 1em; +} + +#container header h1 { + font-size: 2.8rem; +} + +#container header h1 a { + color: #000000; + font-size: 2.8rem; +} + +#container header ul { + display: flex; + margin: 0; + padding: 0; + list-style: none; + float: right; +} + +#container header ul li { + margin-left: 1em; +} + +@media only screen and (max-width: 800px) { + #container header ul { + float: none; + } + + #container header ul li { + margin: 0 1em 0 0; + } +} + +#container nav { + border-bottom: solid 3px #cecece; + padding-bottom: 0.5em; + font-family: "Ruda", sans-serif; +} + +#container nav ul { + margin: 0; + padding: 0; + list-style: none; + display: flex; + justify-content: flex-end; +} + +#container nav ul li { + margin-left: 1em; +} + +#container nav ul li a.active { + border-bottom: 0.5em solid #666666; +} + +#container main { + flex: 1 0 0; + line-height: 1.5; + font-size: 1.2rem; +} + +#container main section#home ul { + margin: 0; + padding: 0; + list-style: none; +} + +#container main section#home ul li { + margin: 0.5em 0; + padding-bottom: 0.5em; +} + +#container main section#home ul li h2 { + margin: 0.2em 0; +} + +#container main section#home span { + color: #666666; +} + +#container p a { + font-style: italic; +} + +#container main section#list ul { + margin: 0; + padding: 0; + list-style: none; +} + +#container main section#list ul li { + display: flex; + justify-content: space-between; + padding: 0.5em 0; + border-bottom: 1px solid #cecece; +} + +#container main section#list ul li time, #container main section#list ul li span.count { + float: right; + white-space: nowrap; +} + +#container main section#list ul li:last-child { + border-bottom: none; +} + +@media only screen and (max-width: 800px) { + #container main section#list ul li { + font-size: small; + } +} + +#container main section.post-nav ul { + margin: 0.5em 0; + padding: 0.5em 0; + list-style: none; + display: flex; + justify-content: space-between; + border-top: 1px solid #f7f7f7; + font-size: 0.9em; +} + +#container main article pre, #container main section pre { + + background-color: #F5F5F5; + overflow-x: auto; + padding: 0.8em; + font-size: 0.8em; + box-shadow: 0 -1px 0 #bbbbbb inset; +} + +#container main article pre code, #container main section pre code { + font-size: 0.8em; +} + +#container main article p code, #container main section p code { + padding: 0.2em; + background-color: #F5F5F5; + font-size: 0.8em; +} + +#container main article p kbd, #container main section p kbd { + display: inline-block; + padding: 0.2em 0.3em; + font-size: 0.8em; + line-height: 1em; + color: #555555; + vertical-align: middle; + background-color: #F5F5F5; + border-width: 1px; + border-style: solid; + border-color: #cccccc #cccccc #bbbbbb; + border-image: none; + border-radius: 3px; + box-shadow: 0 -1px 0 #bbbbbb inset; +} + +#container main h1 { + margin-bottom: 1rem; +} + +#container footer { + border-top: solid 1px #cecece; +} + +#container footer h6 { + font-size: 0.8em; +} + +.meta-aside, #container main section#home ul li aside, #container main article aside { + margin: 0.5em 0; + font-family: "Ruda", sans-serif; + color: #909090; + font-size: 0.8em; +} + +.meta-aside ul, #container main section#home ul li aside ul, #container main article aside ul { + margin: 0; + padding: 0; + list-style: none; +} + +.meta-aside ul li, #container main section#home ul li aside ul li, #container main article aside ul li { + margin: 0; + padding: 0; +} + +a { + color: #666666; + text-decoration: none; +} + +.image, figure img, img { + width: 100%; + box-shadow: 0 3px 3px #bbbbbb; +} + +.full-image, figure.full img, img[src*="full"] { + width: 100%; + box-shadow: 0 3px 3px #bbbbbb; +} + +@supports (width: 100vw) { + .full-image, figure.full img, img[src*="full"] { + width: 100vw; + position: relative; + left: 50%; + right: 50%; + margin-left: -50vw; + margin-right: -50vw; + } +} + +.mid-image, figure.mid img, img[src*="mid"] { + width: 100%; + box-shadow: 0 3px 3px #bbbbbb; +} + +@supports (width: 100vw) { + .mid-image, figure.mid img, img[src*="mid"] { + width: 800px; + position: relative; + left: 50%; + right: 50%; + margin-left: -400px; + margin-right: -400px; + } + + @media only screen and (max-width: 800px) { + .mid-image, figure.mid img, img[src*="mid"] { + width: 100%; + left: 0; + right: 0; + margin: 0; + } + } +} + +.float-image-left, figure.float-left img, img[src*="float-left"] { + width: 300px; + float: left; + margin: 0 1em 1em -3em; + box-shadow: 0 3px 3px #bbbbbb; +} + +@media only screen and (max-width: 800px) { + .float-image-left, figure.float-left img, img[src*="float-left"] { + float: none; + margin: 0; + width: 100%; + } +} + +.float-image-right, figure.float-right img, img[src*="float-right"] { + width: 300px; + float: right; + margin: 0 -3em 1em 1em; + box-shadow: 0 3px 3px #bbbbbb; +} + +@media only screen and (max-width: 800px) { + .float-image-right, figure.float-right img, img[src*="float-right"] { + float: none; + margin: 0; + width: 100%; + } +} + +figure { + margin: 0; +} + +figure figcaption p { + margin-top: 0.3em; + font-size: 0.8em; + font-style: italic; +} + +figure.full { + margin: 0; +} + +figure.mid { + margin: 0; +} + +figure.float-left { + margin: 0; + float: left; +} + +figure.float-right { + margin: 0; + float: right; +} + +figure.float-right figcaption { + margin-left: 1em; +} + +table { + width: 100%; + border-bottom: solid 1px #cecece; +} + +table thead { + background-color: #cecece; +} + +blockquote { + margin: 1em; + border-left: solid 0.1em #cecece; + padding: 0.5em 2em; + position: relative; + background-color: #efefef; + box-shadow: 0 -1px 0 #bbbbbb inset; +} + +blockquote::before { + content: "\f10d"; + font-size: 3em; + font-family: "FontAwesome"; + color: rgba(192, 192, 192, 0.3); + position: absolute; + left: 6px; + top: 0; +} + +@media only screen and (max-width: 800px) { + blockquote { + margin: 1em 0; + padding: 0.5em; + } +} + +dl dd { + font-style: italic; +} + +ul.pagination { + display: flex; + justify-content: center; + margin: 1em 0 0; + padding: 0.5em 0; + list-style: none; +} + +ul.pagination li { + padding: 0 0.5em; +} + +@media only screen and (max-width: 800px) { + ul.pagination li { + padding: 0 0.3em; + } +} + +ul.pagination li.active { + font-weight: bold; +} + diff --git a/Peli-Kiera/static/css/pygment.css b/Peli-Kiera/static/css/pygment.css new file mode 100644 index 0000000..0fa0bea --- /dev/null +++ b/Peli-Kiera/static/css/pygment.css @@ -0,0 +1,77 @@ +.highlight .hll { background-color: #ffffcc } +.highlight { background: #f8f8f8; } +.highlight .c { color: #8f5902; font-style: italic } /* Comment */ +.highlight .err { color: #a40000; border: 1px solid #ef2929 } /* Error */ +.highlight .g { color: #000000 } /* Generic */ +.highlight .k { color: #204a87; font-weight: bold } /* Keyword */ +.highlight .l { color: #000000 } /* Literal */ +.highlight .n { color: #000000 } /* Name */ +.highlight .o { color: #ce5c00; font-weight: bold } /* Operator */ +.highlight .x { color: #000000 } /* Other */ +.highlight .p { color: #000000; font-weight: bold } /* Punctuation */ +.highlight .ch { color: #8f5902; font-style: italic } /* Comment.Hashbang */ +.highlight .cm { color: #8f5902; font-style: italic } /* Comment.Multiline */ +.highlight .cp { color: #8f5902; font-style: italic } /* Comment.Preproc */ +.highlight .cpf { color: #8f5902; font-style: italic } /* Comment.PreprocFile */ +.highlight .c1 { color: #8f5902; font-style: italic } /* Comment.Single */ +.highlight .cs { color: #8f5902; font-style: italic } /* Comment.Special */ +.highlight .gd { color: #a40000 } /* Generic.Deleted */ +.highlight .ge { color: #000000; font-style: italic } /* Generic.Emph */ +.highlight .gr { color: #ef2929 } /* Generic.Error */ +.highlight .gh { color: #000080; font-weight: bold } /* Generic.Heading */ +.highlight .gi { color: #00A000 } /* Generic.Inserted */ +.highlight .go { color: #000000; font-style: italic } /* Generic.Output */ +.highlight .gp { color: #8f5902 } /* Generic.Prompt */ +.highlight .gs { color: #000000; font-weight: bold } /* Generic.Strong */ +.highlight .gu { color: #800080; font-weight: bold } /* Generic.Subheading */ +.highlight .gt { color: #a40000; font-weight: bold } /* Generic.Traceback */ +.highlight .kc { color: #204a87; font-weight: bold } /* Keyword.Constant */ +.highlight .kd { color: #204a87; font-weight: bold } /* Keyword.Declaration */ +.highlight .kn { color: #204a87; font-weight: bold } /* Keyword.Namespace */ +.highlight .kp { color: #204a87; font-weight: bold } /* Keyword.Pseudo */ +.highlight .kr { color: #204a87; font-weight: bold } /* Keyword.Reserved */ +.highlight .kt { color: #204a87; font-weight: bold } /* Keyword.Type */ +.highlight .ld { color: #000000 } /* Literal.Date */ +.highlight .m { color: #0000cf; font-weight: bold } /* Literal.Number */ +.highlight .s { color: #4e9a06 } /* Literal.String */ +.highlight .na { color: #c4a000 } /* Name.Attribute */ +.highlight .nb { color: #204a87 } /* Name.Builtin */ +.highlight .nc { color: #000000 } /* Name.Class */ +.highlight .no { color: #000000 } /* Name.Constant */ +.highlight .nd { color: #5c35cc; font-weight: bold } /* Name.Decorator */ +.highlight .ni { color: #ce5c00 } /* Name.Entity */ +.highlight .ne { color: #cc0000; font-weight: bold } /* Name.Exception */ +.highlight .nf { color: #000000 } /* Name.Function */ +.highlight .nl { color: #f57900 } /* Name.Label */ +.highlight .nn { color: #000000 } /* Name.Namespace */ +.highlight .nx { color: #000000 } /* Name.Other */ +.highlight .py { color: #000000 } /* Name.Property */ +.highlight .nt { color: #204a87; font-weight: bold } /* Name.Tag */ +.highlight .nv { color: #000000 } /* Name.Variable */ +.highlight .ow { color: #204a87; font-weight: bold } /* Operator.Word */ +.highlight .w { color: #f8f8f8; text-decoration: underline } /* Text.Whitespace */ +.highlight .mb { color: #0000cf; font-weight: bold } /* Literal.Number.Bin */ +.highlight .mf { color: #0000cf; font-weight: bold } /* Literal.Number.Float */ +.highlight .mh { color: #0000cf; font-weight: bold } /* Literal.Number.Hex */ +.highlight .mi { color: #0000cf; font-weight: bold } /* Literal.Number.Integer */ +.highlight .mo { color: #0000cf; font-weight: bold } /* Literal.Number.Oct */ +.highlight .sa { color: #4e9a06 } /* Literal.String.Affix */ +.highlight .sb { color: #4e9a06 } /* Literal.String.Backtick */ +.highlight .sc { color: #4e9a06 } /* Literal.String.Char */ +.highlight .dl { color: #4e9a06 } /* Literal.String.Delimiter */ +.highlight .sd { color: #8f5902; font-style: italic } /* Literal.String.Doc */ +.highlight .s2 { color: #4e9a06 } /* Literal.String.Double */ +.highlight .se { color: #4e9a06 } /* Literal.String.Escape */ +.highlight .sh { color: #4e9a06 } /* Literal.String.Heredoc */ +.highlight .si { color: #4e9a06 } /* Literal.String.Interpol */ +.highlight .sx { color: #4e9a06 } /* Literal.String.Other */ +.highlight .sr { color: #4e9a06 } /* Literal.String.Regex */ +.highlight .s1 { color: #4e9a06 } /* Literal.String.Single */ +.highlight .ss { color: #4e9a06 } /* Literal.String.Symbol */ +.highlight .bp { color: #3465a4 } /* Name.Builtin.Pseudo */ +.highlight .fm { color: #000000 } /* Name.Function.Magic */ +.highlight .vc { color: #000000 } /* Name.Variable.Class */ +.highlight .vg { color: #000000 } /* Name.Variable.Global */ +.highlight .vi { color: #000000 } /* Name.Variable.Instance */ +.highlight .vm { color: #000000 } /* Name.Variable.Magic */ +.highlight .il { color: #0000cf; font-weight: bold } /* Literal.Number.Integer.Long */ |