« get me outta code hell

precanon - Homestuck^2: Preceeding Canon - (re)presentation of HS2 stylized upon Prequel
summary refs log tree commit diff
path: root/style.css
diff options
context:
space:
mode:
Diffstat (limited to 'style.css')
-rw-r--r--style.css196
1 files changed, 196 insertions, 0 deletions
diff --git a/style.css b/style.css
new file mode 100644
index 0000000..57752ff
--- /dev/null
+++ b/style.css
@@ -0,0 +1,196 @@
+body {
+    background-color: #535353;
+    color: #000000;
+    font-family: Verdana, Geneva, sans-serif;
+    font-size: 13px;
+}
+
+article, nav {
+    max-width: 650px;
+    background-color: #efefef;
+    color: black;
+    padding: 5px 20px;
+    border-radius: 5px;
+    line-height: 1.6em;
+    margin: 0 auto 10px auto;
+}
+
+nav > time {
+    float: right;
+    opacity: 0.5;
+    font-style: oblique;
+}
+
+nav > time:not(:first-of-type):after {
+    content: " \00b7 ";
+    font-weight: bold;
+    margin-right: 4px;
+}
+
+nav > span:not(:last-of-type):after {
+    content: " \00b7 ";
+    font-weight: bold;
+}
+
+.panel {
+    display: block;
+    width: 100%;
+    margin: 2em 0;
+    image-rendering: pixelated;
+}
+
+.command {
+    --color: #5e440c;
+    text-align: center;
+    margin: 2em 30px;
+    padding: 2px;
+    border-radius: 10px;
+    background: var(--color);
+    color: black;
+    position: relative;
+    overflow: hidden;
+    z-index: 0;
+}
+
+.command::before {
+    content: "";
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    background: white;
+    opacity: 0.5;
+    z-index: -1;
+}
+
+.command > span {
+    display: block;
+    margin-bottom: 3px;
+    font-weight: bold;
+}
+
+.command > div {
+    background: rgba(255, 255, 255, 0.8);
+    padding: 5px;
+    border-radius: 10px;
+    font-style: oblique;
+}
+
+.chat {
+    background-color: inherit;
+    font-family: "courier-std", courier, monospace;
+    font-weight: bold;
+    line-height: 1.35;
+    padding: 15px 25px;
+    margin: 1.5em 0;
+    border: 1px dashed gray;
+    color: black;
+}
+
+article > p,
+article > .chat,
+article > form {
+    margin-left: 30px;
+    margin-right: 30px;
+}
+
+.chat > p {
+    margin: 0;
+}
+
+p, p > span {
+    color: var(--color);
+}
+
+a:not([href]) {
+    opacity: 0.5;
+    font-style: oblique;
+}
+
+a[href] {
+    color: blue;
+    text-decoration: none;
+}
+
+a[href]:hover {
+    text-decoration: underline;
+}
+
+h2 {
+    border-bottom: 1px solid rgba(0, 0, 0, 0.5);
+}
+
+.command-line {
+    font-size: 1.5em;
+}
+
+.flash {
+    display: block;
+    margin: 3em 30px;
+    font-size: 1.125em;
+    line-height: 1.5;
+    padding: 5px;
+    text-align: center;
+    font-style: oblique;
+    border: 1px dashed black;
+    border-radius: 5px;
+    box-shadow: 0 3px 3px rgba(0, 0, 0, 0.3);
+}
+
+.wide {
+    margin-left: -20px;
+    margin-right: -20px;
+}
+
+.two-columns {
+    columns: 2;
+    margin: 20px;
+}
+
+.column {
+    break-inside: avoid;
+    padding: 10px;
+}
+
+.column > :first-child {
+    margin-top: 0;
+}
+
+.prose {
+    font-family: Verdana, Geneva, sans-serif;
+    font-size: 13px;
+    color: black;
+    font-weight: normal;
+}
+
+.dead-jade .jade,
+.alt-callie { --color: #ff0000; }
+.alfonz { --color: #416600; }
+.aradia { --color: #a10000; }
+.avril  { --color: #ffc600; }
+.davebot,
+.dave   { --color: #e00707; }
+.dirk   { --color: #f2a400; }
+.tg-harry .tg,
+.harry  { --color: #0671cd; }
+.imode  { --color: #bdb49c; }
+.jade   { --color: #4ac925; }
+.jake   { --color: #1f9400; }
+.jane   { --color: #0097d7; }
+.john   { --color: #0715cd; }
+.karkat { --color: #7c7e81; }
+.kanaya { --color: #008141; }
+.meenah { --color: #77003c; }
+.rosebot,
+.rose   { --color: #b536da; }
+.roxy   { --color: #ff6ff2; }
+.silas  { --color: #71d666; }
+.sollux { --color: #a1a100; }
+.swifer { --color: #008141; }
+.gg-tavros .gg,
+.tavros { --color: #2b0057; }
+.terezi { --color: #008282; }
+.vrissy, .ag-vrissy .ag,
+.vriska { --color: #005682; }
+.yiffy  { --color: #d00009; }