diff --git a/css/accform.css b/css/accform.css
new file mode 100755
index 0000000..a11d400
--- /dev/null
+++ b/css/accform.css
@@ -0,0 +1,56 @@
+.logincontainer {
+ max-width: 300px;
+ margin: 32px;
+ text-align: center;
+}
+
+.logincontainer hr {
+ border: 1px inset rgba(0,0,0,0.5);
+}
+
+.logincontainer .assets,
+.logincontainer .accinput {
+ flex-grow: 1;
+ padding: 8px;
+}
+
+.options .option { display: flex; }
+
+.options .option .name {
+ font-family: var(--spfont1);
+ font-size: 12px;
+ flex-shrink: 0; flex-grow: 1;
+ text-align: right;
+ padding: 2px;
+}
+.options .option input,
+.options .option select,
+.options .option textarea, {
+ flex-grow: 0;
+}
+
+.logincontainer h2 {
+ font-family: var(--spfont1);
+}
+
+.logincontainer .error {
+ color: var(--error);
+}
+
+.logincontainer .buttonbar {
+ display: flex;
+}
+
+img.bg-icon-overlay {
+ position: absolute;
+ bottom: 0; right: 0;
+ width: 50vh; height: 50vh;
+ /* width: 100vh; height: 100vh; */
+ opacity: 0.25;
+ z-index: -100;
+}
+
+ul.errors {
+ text-align: left;
+ color: red;
+}
\ No newline at end of file
diff --git a/css/blog.css b/css/blog.css
new file mode 100644
index 0000000..83c0f3f
--- /dev/null
+++ b/css/blog.css
@@ -0,0 +1,109 @@
+body.blog-index .article {
+ background-color: var(--menu-bg, #d0d0d0);
+ border: var(--menu-border, 1px solid #a4a4a4);
+ margin: 4px;
+ padding: 8px;
+}
+
+body.blog-index .article p {
+ margin: 2px;
+}
+
+body.blog-index .article i, .article .userlink {
+ font-family: var(--spfont1, Pixio);
+}
+
+body.blog-index .article i { color: var(--subtitle, #525252); }
+
+.body > img {
+ max-width: calc(100% - 64px);
+}
+
+.subject {
+ margin: 4px 0px;
+ }
+
+#commentFrame {
+ width: calc(100% - 8px);
+ border: none;
+}
+
+.comment {
+ background-color: var(--menu-bg, #d0d0d0);
+ border: var(--menu-border, 1px solid #bdbdbd);
+ margin: 4px;
+ padding: 8px;
+}
+
+.comment p {
+ margin: 2px;
+}
+
+.comment i {
+ color: var(--subtitle, #525252);
+}
+
+.userlink, .userlink a {
+ color: var(--main-text, #000000);
+ text-decoration: none;
+}
+
+.userlink, .date i, .comment i, #comments {
+ font-family: var(--spfont1, Pixio);
+}
+
+textarea {
+ width: calc(100% - 8px);
+}
+
+.header-title h1, .header-title .author {
+ margin: 2px;
+}
+
+.header-title .author .userlink {
+ margin: 0px;
+}
+
+.header-title i {
+ color: var(--subtitle, #525252);
+}
+
+
+.comment {
+ background-color: var(--menu-bg, #d0d0d0);
+ border: var(--menu-border, 1px solid #bdbdbd);
+ margin: 4px;
+ padding: 8px;
+}
+
+.comment p {
+ margin: 2px;
+}
+
+.comment a[title="Delete"],
+.userlink,
+.comment i{
+ font-family: var(--spfont1, Pixio);
+}
+
+.comment i {
+ color: var(--subtitle, #525252);
+}
+
+.userlink, .userlink a {
+ color: var(--main-text, #000000);
+ text-decoration: none;
+}
+
+textarea {
+ width: calc(100% - 8px);
+}
+
+#header {
+ font-size: 24px;
+ vertical-align: top;
+}
+
+body#comments > .header-title {
+ top: -10px;
+}
diff --git a/css/buttons.css b/css/buttons.css
new file mode 100644
index 0000000..b4a3c20
--- /dev/null
+++ b/css/buttons.css
@@ -0,0 +1,16 @@
+div.button {
+ display: block;
+ padding: 4px;
+ background: #D4D4D4;
+ border: 2px outset #B8B8B8;
+}
+
+div.button:hover {
+ background: #99D4AB;
+ border: 2px outset #77C68F;
+}
+
+div.button:active {
+ background: #9E9E9E;
+ border: 2px inset #707070;
+}
\ No newline at end of file
diff --git a/css/creations.css b/css/creations.css
new file mode 100755
index 0000000..0d4e816
--- /dev/null
+++ b/css/creations.css
@@ -0,0 +1,67 @@
+body.creation-page { }
+
+body.creation-page .creation-container {
+ max-width: 800px;
+ margin: 0 auto;
+}
+
+body.creation-page .creation-container .title {
+ background: var(--menu-bg);
+ border: var(--menu-border);
+ border-bottom: none;
+ text-align: left;
+ font-weight: bold;
+ font-family: var(--spfont1);
+ font-size: 24px;
+}
+
+body.creation-page .creation-container .title td { padding: 8px; }
+
+body.creation-page .creation-container .gallery-cell {
+ background: var(--menu-bg);
+ border-left: var(--menu-border);
+ border-right: var(--menu-border);
+ padding: 8px;
+}
+
+body.creation-page .creation-container .gallery {
+ height: 50vh;
+}
+
+body.creation-page .creation-container .gallery .gallery-pager {
+ width: 24px;
+ text-align: center;
+ font-size: 20px;
+ font-family: var(--spfont1);
+ color: var(--main-text);
+ text-decoration: none;
+ cursor: pointer;
+}
+
+body.creation-page .creation-container .filmstrip-cell {
+ background: var(--menu-bg);
+ border: var(--menu-border);
+ border-top: none;
+ padding: 8px;
+}
+
+body.creation-page .creation-container .info-cell {
+ width: 224px;
+ vertical-align: top;
+}
+
+body.creation-page .creation-container .info-panel {
+ background: var(--menu-bg);
+ border: var(--menu-border);
+ padding: 8px;
+}
+
+body.creation-page .creation-container .info-panel hr,
+body.creation-page .creation-container .box[name='desc'] hr {
+ border: var(--menu-border);
+ color: var(--menu-bg);
+}
+
+body.creation-page .creation-container .tabbed-cell {
+ vertical-align: top;
+}
\ No newline at end of file
diff --git a/css/fonts.css b/css/fonts.css
index fba13b5..510ee2f 100755
--- a/css/fonts.css
+++ b/css/fonts.css
@@ -1,15 +1,3 @@
-:root {
- --spfont1: Pixio;
- --spfont2: TypeWriter;
- --spfont3: Pixelated;
- --spfont4: Joystix;
- --spfont5: VCR_OSD_MONO;
- --spfont6: BitPap;
- --spfont7: Comicoro;
- --spfont8: DOSVGA-LessPerfect;
- --spfont9: DOSVGA-MorePerfect;
-}
-
@font-face {
font-family: TypeWriter;
src: url(//assets.worlio.com/fonts/type_writer/type_writer.woff),
diff --git a/css/radio.css b/css/radio.css
new file mode 100644
index 0000000..5d8df5a
--- /dev/null
+++ b/css/radio.css
@@ -0,0 +1,342 @@
+@import url('//assets.worlio.com/style/css/theme.css');
+
+@font-face {
+ font-family:Pixio;
+ src:url(//assets.worlio.com/fonts/Pixio/Pixio.woff2),
+ url(//assets.worlio.com/fonts/Pixio/Pixio.woff),
+ url(//assets.worlio.com/fonts/Pixio/Pixio.ttf) format("truetype");
+}
+
+@font-face {
+ font-family:nk57;
+ src:url(../fonts/nk57/nk57-monospace-cd-rg.ttf) format("truetype"),
+ url(../fonts/nk57/nk57-monospace-cd-bd.ttf) format("truetype"),
+ url(../fonts/nk57/nk57-monospace-cd-it.ttf) format("truetype"),
+ url(../fonts/nk57/nk57-monospace-cd-lt.ttf) format("truetype");
+}
+
+:root {
+ --primary: #0079b5;
+ --primary-border: #009ae6;
+
+ --secondary: #f3dca9;
+ --secondary-border: #f2e5c8;
+
+ --button: #DFDFDF;
+ --button-active: gray;
+
+ --monitor: #0F0F0F;
+ --monitor-text: #F0F0F0;
+ --monitor-border: gray;
+
+ --link-color: unset;
+}
+
+*:link, *:visited {
+ color: var(--link-color);
+}
+
+html {
+ height: 100%;
+}
+
+body {
+ background: var(--background-image) var(--main-background);
+ background-repeat: repeat;
+ height: 100%;
+ margin: 0;
+}
+
+body, button, fakebutton, input { font-family: Pixio; }
+
+.container, .player-container {
+ background: var(--primary);
+ border: 2px outset var(--primary-border);
+ padding: 4px;
+}
+.container {
+ min-width: 320px;
+ min-height: 280px;
+ display: flex;
+ gap: 4px;
+ margin: auto;
+ max-width: 976px;
+}
+.player-container {
+ position: relative;
+ border-bottom: none;
+ width: 320px;
+ height: 78px;
+ margin-bottom: -2px;
+ z-index: 1;
+}
+.footer {
+ min-width: 320px;
+ max-width: 976px;
+ text-align: right;
+ margin: auto;
+}
+
+player, visualizer {
+ display: flex;
+ flex-direction: column;
+ background: var(--secondary);
+ border: 2px outset var(--secondary-border);
+ flex-shrink: 0;
+ padding: 4px;
+}
+
+.banner {
+ display: flex;
+}
+
+player {
+ width: 308px; height: 68px;
+}
+
+visualizer {
+ margin-bottom: 4px;
+}
+
+.vis-container {
+ width: 320px;
+ max-width: 320px;
+}
+
+button, fakebutton, slider {
+ border: 2px outset var(--button);
+ background: var(--button);
+}
+
+slider input {
+ background: lightgray;
+ -webkit-appearance: none;
+ appearance: none;
+ height: 50%;
+ margin: auto 4px;
+ width: 96px;
+}
+
+slider input::-webkit-slider-thumb,
+slider input::-moz-range-thumb {
+ background: gray;
+ -webkit-appearance: none;
+ appearance: none;
+ width: 8px;
+ height: 100%;
+ border: none;
+ border-radius: 0;
+}
+
+select {
+ border: none;
+ background: none;
+}
+
+button:active,
+button.active,
+fakebutton:active,
+fakebutton.active {
+ border: 2px inset var(--button-active);
+ background: var(--button-active);
+}
+
+fakebutton { display: flex; }
+fakebutton img { margin: 2px; }
+
+controls {
+ display: flex;
+}
+
+controls input { flex-grow: 1; }
+
+tablist {
+ display: flex;
+ flex-shrink: 0;
+}
+
+metadata, canvas {
+ color: var(--monitor-text);
+ background: black;
+ border: 2px inset var(--secondary-border);
+}
+
+metadata {
+ padding: 4px;
+ display: flex;
+ flex-direction: column;
+}
+metadata station { font-weight: bold; }
+
+panel {
+ display: flex;
+ flex-direction: column;
+ flex: 1;
+}
+
+stations {
+ display: flex;
+ flex-direction: column;
+ overflow-y: auto;
+ border: 2px inset var(--primary-border);
+ margin: 2px;
+ flex-grow: 1;
+}
+
+favorites, history, stats {
+ background: var(--monitor);
+ color: var(--monitor-text);
+ border: 2px inset var(--monitor-border);
+ flex-grow: 1;
+ display: flex;
+ flex-direction: column;
+ padding: 4px;
+ overflow-y: scroll;
+ min-height: 0;
+}
+
+tabbox {
+ display: none;
+ flex-direction: column;
+ flex-grow: 1;
+}
+tabbox.active { display: flex; }
+
+station {
+ display: flex;
+ flex-direction: column;
+ cursor: pointer;
+ user-select: none;
+ padding: 4px;
+ margin: 2px;
+ border: 2px inset var(--button-active);
+ background: var(--button-active);
+}
+
+station.active {
+ background: var(--button);
+ border: 2px outset var(--button);
+ color: black;
+}
+
+station station-name { font-weight: bold; }
+station track-meta {
+ font-size: 12px;
+}
+
+history track-container {
+ display: flex;
+ flex-direction: column;
+ padding: 2px;
+}
+
+history track-container track-station { font-weight: bold; }
+
+history track-container:nth-of-type(1) {
+ background-color: var(--monitor-text);
+ color: var(--monitor);
+}
+
+canvas.vis, canvas.metadata { border-bottom: none; }
+
+.button-row { display: flex; }
+
+.fav-button img {
+ filter: contrast(0%);
+}
+
+.fav-button.fav img {
+ filter: none;
+}
+
+favorites .station-header,
+history .station-header {
+ text-align: center;
+ margin: 4px 0;
+ text-decoration: underline;
+ margin-top: 12px;
+}
+
+favorites .track,
+history .track {
+ display: flex;
+ border-bottom: 1px dashed var(--monitor-text);
+ margin: 2px 0;
+}
+
+favorites .track button,
+history .track button {
+ background: none;
+ border: none;
+ cursor: pointer;
+ flex-shrink: 0;
+ flex-grow: 0;
+ margin: 2px;
+}
+
+favorites .track a,
+history .track a {
+ flex-grow: 1;
+}
+
+@media only screen and (orientation: portrait) {
+ .container, .footer {
+ flex-direction: column;
+ width: 320px;
+ }
+
+ .banner { flex-direction: column-reverse; }
+ .banner img, .player-container {
+ margin: auto;
+ }
+ .banner > img { flex-shrink: 0; }
+ .player-container { margin-bottom: -2px; }
+
+ panel {
+ max-height: 480px;
+ }
+
+ favorites, history {
+ height: 240px;
+ }
+
+ body.old panel#favorites, body.old panel#history { display: none; }
+}
+
+@media only screen and (orientation: landscape) {
+ .container, .footer {
+ width: calc(100% - 64px);
+ }
+ body:not(.old) .container { height: calc(100% - 212px); }
+
+ .banner {
+ margin: auto;
+ min-width: 320px;
+ width: calc(100% - 52px);
+ max-width: 988px;
+ }
+ .banner > img { margin-top: 2px; }
+
+ .player-container {
+ margin-top: 48px;
+ }
+
+ /* OLD */
+ body.old .container, body.old .footer {
+ flex-direction: column;
+ width: 320px;
+ }
+
+ body.old .banner { flex-direction: column-reverse; }
+ body.old .banner img, body.old .player-container {
+ margin: auto;
+ }
+ body.old .banner > img { flex-shrink: 0; }
+ body.old .player-container { margin-bottom: -2px; }
+
+ body.old panel {
+ max-height: 480px;
+ }
+
+ body.old panel#favorites, body.old panel#history { display: none; }
+}
\ No newline at end of file
diff --git a/css/settings.css b/css/settings.css
new file mode 100644
index 0000000..205189d
--- /dev/null
+++ b/css/settings.css
@@ -0,0 +1,116 @@
+iframe {
+width: 100%;
+border: none;
+min-height: 128px;
+}
+
+.box[name="profile"] img.avatar {
+ float: left;
+ margin: 2px;
+}
+
+.tabbed-container .box {
+padding: 8px;
+}
+
+.tablist .tab {
+cursor: pointer;
+}
+
+.box .option .title.small {
+font-size: 12px;
+}
+
+.option {
+margin: 8px 0px;
+}
+
+.option.disabled > *:not(.title) {
+opacity: 0.2;
+}
+
+.option .title {
+font-family: var(--spfont1);
+font-weight: bold;
+}
+
+.option .inputtext:not(.shown) {
+display: none;
+}
+
+.box hr {
+border: var(--menu-border);
+}
+
+.box .buttonbar {
+border-top: var(--menu-border);
+padding: 4px;
+display: flex;
+}
+
+.box .buttonbar .grower {
+flex-grow: 1;
+}
+
+.box[name="sessions"] .session {
+background: var(--mail-content-bg, #dbdbdb);
+border: var(--mail-content-border, 1px outset #a8a8a8);
+padding: 4px;
+margin: 8px 0px;
+}
+
+.box[name="sessions"] .session .title {
+background: var(--mail-subject-bg, #b7b7b7);
+border: var(--mail-subject-border, 1px outset #8a8a8a);
+display: flex;
+padding: 4px;
+margin: -8px;
+margin-bottom: 4px;
+font-family: var(--spfont1);
+}
+
+.box[name="sessions"] .session .title img {
+height: 16px;
+}
+
+.box[name="sessions"] .session .title b {
+flex-grow: 1;
+}
+
+.box[name="sessions"] .session .title .button {
+margin: 0px !important;
+}
+
+.box .pager { display: flex; }
+
+.box .userlist .user-box {
+ display: flex;
+ margin: 4px 0px;
+}
+.box .userlist .user-box:hover { background: #0001; }
+
+.box .userlist .user-box hr {
+ margin: 4px;
+}
+
+.guestbooklist .gbmsgbox {
+ border: var(--menu-border);
+ background: var(--menu-bg);
+ margin: 4px;
+ padding: 2px;
+}
+
+.guestbooklist .gbmsgbox .name {
+ display: flex;
+}
+@media only screen and (orientation: landscape) {
+.tabbed-container.primary > .box .tabbed-container.secondary {
+ margin: -44px -4px -8px -4px;
+}
+
+.tabbed-container.primary > .box .tabbed-container.secondary .box {
+ border-left: none;
+ border-right: none;
+ border-bottom: none;
+}
+}
\ No newline at end of file
diff --git a/css/theme.css b/css/theme.css
index 887b79d..46d9d80 100755
--- a/css/theme.css
+++ b/css/theme.css
@@ -8,11 +8,15 @@
--acc-nav-separator: 2px solid #000000;
--context-menu: #d0d0d0;
- --context-menu-border: 1px outset #a4a4a4;
+ --context-menu-border: 2px outset #a4a4a4;
--context-menu-hover: #bfbfbf;
- --menu-border: 1px outset #c8b793;
- --menu-bg: #dbd1bb;
+ /* DEPRECATED: Use --x-container-y */
+ --menu-border: 2px outset #c4dbff;
+ --menu-bg: #a5cff9;
+
+ --primary-container-background: #a5cff9;
+ --primary-container-border: 2px outset #c4dbff;
--header-bg: #ffffff;
--header-text: #000000;
@@ -32,12 +36,13 @@
--staff: #d500d1;
- --tab-inactive: #aeafb9;
- --tab-selected: #bfcfdd;
+ --tab-border: 2px outset #000;
+ --tab-inactive: #b9b3ae;
+ --tab-selected: #ddd0bf;
--tab-gradient: #dedede;
--popup-title-bg: #b3b3b3;
- --popup-title-border: 1px outset #868686;
+ --popup-title-border: 2px outset #868686;
--dialog-bg: #fbebcc;
--dialog-button-hover: #f9f7dd;
@@ -57,11 +62,11 @@
--success: #95ce8d;
--mail-subject-bg: #b7b7b7;
- --mail-subject-border: 1px outset #8a8a8a;
+ --mail-subject-border: 2px outset #8a8a8a;
--mail-sub-bg: #cecece;
- --mail-sub-border: 1px outset #a8a8a8;
+ --mail-sub-border: 2px outset #a8a8a8;
--mail-content-bg: #dbdbdb;
- --mail-content-border: 1px outset #959595;
+ --mail-content-border: 2px outset #959595;
--mail-buttonbar: #cacaca;
--forum-header: #f3dca9;
@@ -121,12 +126,6 @@
--navbar-bg: url('//assets.worlio.com/style/navbar-bg');
--navbar-gradient: url('//assets.worlio.com/style/navbar-gradient');
- --rankflag0: #777;
- --rankflag1: #4c3525;
- --rankflag2: #3d464b;
- --rankflag3: #5c4d0f;
- --rankflag4: #5988a5;
- --rankflag5: #319b3a;
- --rankflag6: #d35ed0;
- --rankflag7: #171717;
+ --primary-font: Pixio;
+ --secondary-font: TypeWriter;
}
\ No newline at end of file
diff --git a/error/401.png b/error/401.png
new file mode 100644
index 0000000..5b2587f
Binary files /dev/null and b/error/401.png differ
diff --git a/error/401.svg b/error/401.svg
deleted file mode 100755
index 0c0ca7c..0000000
--- a/error/401.svg
+++ /dev/null
@@ -1,335 +0,0 @@
-
-
diff --git a/error/403.png b/error/403.png
new file mode 100644
index 0000000..4ba118c
Binary files /dev/null and b/error/403.png differ
diff --git a/error/403.svg b/error/403.svg
deleted file mode 100755
index d752823..0000000
--- a/error/403.svg
+++ /dev/null
@@ -1,351 +0,0 @@
-
-
diff --git a/error/404.png b/error/404.png
new file mode 100644
index 0000000..37d6151
Binary files /dev/null and b/error/404.png differ
diff --git a/error/404.svg b/error/404.svg
deleted file mode 100755
index ed24c48..0000000
--- a/error/404.svg
+++ /dev/null
@@ -1,284 +0,0 @@
-
-
diff --git a/error/451.svg b/error/451.svg
deleted file mode 100755
index e09a2cc..0000000
--- a/error/451.svg
+++ /dev/null
@@ -1,488 +0,0 @@
-
-
diff --git a/error/500.png b/error/500.png
new file mode 100644
index 0000000..29f6838
Binary files /dev/null and b/error/500.png differ
diff --git a/error/500.svg b/error/500.svg
deleted file mode 100755
index 06b1936..0000000
--- a/error/500.svg
+++ /dev/null
@@ -1,341 +0,0 @@
-
-
diff --git a/style.css b/style.css
index f3318ef..86e771e 100644
--- a/style.css
+++ b/style.css
@@ -1,13 +1,3 @@
-/*
- * | | |
- * | | | {}
- * | | ___ .__ | ___ __ ___ . .
- * | /\ | / \ | \ | || / \ / \ / \ |\ /|
- * | / \ | || || | | || || || || || || | \/ |
- * |/ \| \___/ | | || \___/ () \__/ \___/ | |
- * GLOBAL SITE STYLESHEET
- * 07/20/2022
- */
@import url('//assets.worlio.com/style/css/theme.css');
.pixel, nav, nav.top, .button, .centerdiv, .heading {
@@ -31,7 +21,7 @@ nav.top::-webkit-scrollbar {
body.home .home-container {}
body.home .home-container img.logo { max-height: 256px; max-width: 100%; }
body.home .home-container .slogan {
- font-family: var(--spfont1);
+ font-family: var(--primary-font);
font-weight: bold;
font-size: 24px;
text-align: center;
@@ -60,7 +50,7 @@ body.home .home-container .blog-contents {
}
body.home .home-container .blog-contents .title {
border-bottom: 1px solid black;
- font-family: var(--spfont1);
+ font-family: var(--primary-font);
font-weight: bold;
font-size: 16px;
padding: 2px;
@@ -75,9 +65,9 @@ body.home .home-container .blog-contents .blog-item i { text-align: right; }
nav.top {
display: flex;
- background-image: var(--navbar-top, url('//assets.worlio.com/style/navbar-top'));
+ background-image: var(--navbar-top);
background-position: 0px 100%;
- background-color: var(--acc-nav, #f3dca9);
+ background-color: var(--acc-nav);
background-repeat: repeat-x;
background-size: auto 64px;
position: fixed;
@@ -87,11 +77,16 @@ nav.top {
white-space: nowrap;
}
+nav.top .navbutton-bar {
+ padding-left: 4px;
+ overflow-x: scroll;
+}
+
nav.top div.slideout {
position: relative;
height: 32px;
z-index: 3;
- margin: 2px 4px;
+ margin: 2px;
transition-duration: 0.05s;
flex-shrink: 0;
}
@@ -104,35 +99,17 @@ nav.top div.slideout.active {
width: 264px;
}
-nav.top div.slideout .upbutton {
- width: 32px;
- height: 16px;
- margin: 0 auto;
- background: var(--navbar-bg), rgb(196, 187, 166);
- border: 1px outset black;
- display: none;
- opacity: 0;
- transition-duration: 0.05s;
-}
-
-nav.top div.slideout.active .upbutton {
- display: block;
- opacity: 1;
-}
-
nav.top div.slideout .upbutton img { margin: 4px 8px; }
-nav.top div.slideout.account .dropdown { margin: -2px -4px; }
-
nav.top div.slideout .dropdown {
- font-family: var(--spfont1, Pixio);
+ font-family: var(--primary-font);
background: var(--navbar-bg), linear-gradient(0deg, rgba(162,147,112,1) 0%, rgba(243,220,169,1) 8px);
background-position: 0 0, 0px 100%;
- background-color: var(--acc-nav, #f3dca9);
+ background-color: var(--acc-nav);
background-repeat: repeat, repeat-x;
background-size: auto auto, auto 64px;
- border-right: var(--acc-nav-separator, 2px solid #000000);
- border-bottom: var(--acc-nav-separator, 2px solid #000000);
+ border: var(--acc-nav-separator);
+ border-top: none;
overflow: hidden;
width: 100%;
height: 32px;
@@ -142,18 +119,40 @@ nav.top div.slideout .dropdown {
white-space: nowrap;
transition-duration: 0.05s;
}
+nav.top div.slideout.account .dropdown {
+ margin: -2px -4px;
+}
nav.top div.slideout:not(.active):hover .dropdown {
background: var(--navbar-bg), linear-gradient(0deg, rgba(243,220,169,1) 0%, rgba(210,190,143,1) 8px);
}
-nav.top div.slideout.account.active .dropdown { height: 112px; }
+nav.top div.slideout .dropdown .clicker {
+ -webkit-user-select: none;
+ -moz-user-select: none;
+ -ms-user-select: none;
+ user-select: none;
+}
+
+nav.top div.slideout.account .upane {
+ display: flex;
+}
+
+nav.top div.slideout.account .upane .avatar {
+ flex-shrink: 0;
+ background: var(--menu-bg);
+ border: var(--menu-border);
+}
+
+nav.top div.slideout.account .upane .ninfo {
+ flex-grow: 1;
+}
+
+nav.top div.slideout.account.active .dropdown { height: 212px; }
nav.top.guest div.slideout.account.active .dropdown { height: 112px; }
nav.top div.slideout.mail.active .dropdown,
nav.top div.slideout.alerts.active .dropdown { height: 352px; }
-
-
nav.top div.slideout .dropdown .right {
pointer-events: none;
display: none;
@@ -185,7 +184,7 @@ nav.top div.slideout.mail .dropdown .mail {
nav.top div.slideout.alerts .dropdown .alerts .alert,
nav.top div.slideout.mail .dropdown .mail .message {
margin: 4px;
- font-family: var(--spfont1);
+ font-family: var(--primary-font);
background-color: var(--menu-bg);
border: var(--menu-border);
padding: 4px;
@@ -231,38 +230,25 @@ nav.top div.slideout.mail .counter.new,nav.top div.slideout.alerts .counter.new
nav.top div.slideout.account .username {
display: block;
- width: 132px;
height: 38px;
margin: -1px;
}
-nav.top div.slideout .dropdown .username .counters {
- display: flex;
+nav.top div.slideout.account .dropdown .mycon {
+ margin-right: 4px;
}
-nav.top div.slideout .dropdown .username .counter {
- flex-grow: 1;
+nav.top div.slideout.account .dropdown .username .currency {
height: 16px;
}
-
-nav.top div.slideout .dropdown .username .counter a {
- color: var(--inactive, #6e6e6e);
- vertical-align: top;
- font-size: 14px;
-}
-
-nav.top div.slideout .dropdown .username .counter img {
+nav.top div.slideout.account .dropdown .username .currency img {
height: 100%;
margin: 0px 1px;
padding: 0px 2px;
+ vertical-align: center;
}
-
-nav.top div.slideout .dropdown .username .counter.alert a {
- color: var(--alert, #ce0000);
-}
-
-nav.top div.slideout .dropdown .username .counter.currency a {
- color: var(--currency, #89541A);
+nav.top div.slideout.account .dropdown .username .currency a {
+ color: var(--currency);
}
nav.top div.slideout .dropdown .username .userlink {
@@ -302,7 +288,7 @@ nav.top p {
}
nav.top.alert {
- background-color: var(--dialog-bg, #fbebcc);
+ background-color: var(--dialog-bg);
height: unset;
min-height: 28px;
max-height: 64px;
@@ -328,7 +314,7 @@ nav.top.alert p {
}
nav {
- background-color: var(--main-nav, dodgerblue);
+ background-color: var(--main-nav);
position: fixed;
top: 0px;
left: 0px;
@@ -348,7 +334,7 @@ nav .logo {
}
.button, nav {
- font-family: var(--spfont1, Pixio);
+ font-family: var(--primary-font);
}
.button {
@@ -415,7 +401,7 @@ nav .logo {
.longbutton.txt a {
display: inline-block !important;
width: 100%; height: 100%;
- font-family: var(--spfont1, Pixio);
+ font-family: var(--primary-font);
text-decoration: none;
text-align: center;
color: var(--main-text, #000000);
@@ -428,7 +414,7 @@ nav .logo {
}
.longbutton > a, .smallbutton > a {
- color: var(--main-text, #000000);
+ color: var(--main-text);
text-decoration: none;
display: flex !important;
align-items: center;
@@ -464,12 +450,12 @@ body {
.header > .gap { flex-grow: 1;}
.header > .title {
- border: var(--menu-border, 1px solid #bdbdbd);
+ border: var(--menu-border);
border-top: none;
flex-shrink: 0; flex-grow: 0;
- background-color: var(--menu-bg, #d0d0d0);
+ background-color: var(--menu-bg);
padding: 8px;
- font-family: var(--spfont1, Pixio);
+ font-family: var(--primary-font);
font-weight: bold;
margin: -8px 4px 8px 4px;
}
@@ -511,7 +497,7 @@ body {
nav {
width: 60px;
padding: 0px 2px;
- background-image: var(--navbar-left, url('//assets.worlio.com/style/navbar-left'));
+ background-image: var(--navbar-left);
background-repeat: repeat-y;
background-size: 100%;
height: 100%;
@@ -564,7 +550,7 @@ body {
}
.popbutton > a {
- color: var(--main-text, #000000);
+ color: var(--main-text);
text-decoration: none;
display: flex;
align-items: center;
@@ -628,7 +614,7 @@ body {
}
nav {
- background-image: var(--navbar-top, url('//assets.worlio.com/style/navbar-top'));
+ background-image: var(--navbar-top);
background-repeat: repeat-x;
background-size: 64px;
width: 100%;
@@ -642,8 +628,8 @@ body {
}
nav.top {
- overflow-y: unset;
overflow-x: unset;
+ overflow-y: unset;
}
nav hr {
@@ -728,11 +714,15 @@ body {
.forum .thread .post .bottombar .buttons {
flex-direction: row;
}
+
+ nav.top div.slideout.account { width: 32px; }
+ nav.top div.slideout.account:not(.active) .dropdown .username *:not(.mycon) { display: none; }
+ nav.top div.slideout.account:not(.active) .dropdown .username .mycon { margin: 2px; }
}
body {
- background-color: var(--main-background, #d3d3d3);
- background-image: var(--background-image, url('//assets.worlio.com/style/background'));
+ background-color: var(--main-background);
+ background-image: var(--background-image);
color: var(--main-text, #000000);
}
@@ -776,7 +766,7 @@ table {
overflow-x: auto;
white-space: nowrap;
border: none;
- font-family: var(--spfont1, Pixio);
+ font-family: var(--primary-font);
}
.heading.main {
@@ -786,8 +776,8 @@ table {
}
.heading {
- background-color: var(--header-bg, #ffffff);;
- background-image: var(--navbar-top, url('//assets.worlio.com/style/navbar-top'));
+ background-color: var(--header-bg);
+ background-image: var(--navbar-top);
}
.heading.sub,
@@ -802,8 +792,8 @@ table {
.heading.section {
background-size: 32px;
- background-image: var(--nav-db, url('//assets.worlio.com/style/navbar-db'));;
- background-color: var(--header-bg, #ffffff);;
+ background-image: var(--nav-db);
+ background-color: var(--header-bg);
font-size: 1.5em;
}
@@ -844,7 +834,7 @@ table {
.heading hr {
margin: 0px 8px;
border: none;
- border-left: var(--header-line, 2px solid #000000);
+ border-left: var(--header-line);
width: 0px;
display: inline-block;
height: 75%;
@@ -865,7 +855,7 @@ hr.arrow.up { background-position: 0 100%; }
hr.arrow.down { background-position: 100% 100%; }
c, code, .codeblock:not(.title) {
- background-color: var(--code-bg, #ffffff63);
+ background: var(--code-bg);
color: var(--code-text, #000000);
display: inline-block;
max-width: calc(100% - 4px);
@@ -1002,27 +992,27 @@ input[type="time"],
input[type="url"],
input[type="week"],
textarea {
- background-color: var(--input-bg, #ffffff);
- color: var(--input-text, #000);
+ background-color: var(--input-bg);
+ color: var(--input-text);
}
input[type="file"] {
- color: var(--input-text, #000);
+ color: var(--input-text);
}
.styled-table > tbody > tr {
- border-bottom: 1px dashed var(--border-line, #000000);
+ border-bottom: 1px dashed var(--border-line);
}
.styled-table > tbody > tr th {
background-color: rgba(255,255,255,0.4);
- border-bottom: 1px solid var(--border-header, #ffffff);
+ border-bottom: 1px solid var(--border-header);
}
-.styled-table > tbody > tr td { border: 1px dotted var(--border-line, #000000); }
+.styled-table > tbody > tr td { border: 1px dotted var(--border-line); }
-.status.success, .output .success {color: var(--status-success, #458e1c);}
-.status.error, .output .error {color: var(--status-error, #ff0000);}
+.status.success, .output .success {color: var(--status-success);}
+.status.error, .output .error {color: var(--status-error);}
heading .button {
display: inline-block !important;
@@ -1030,11 +1020,11 @@ heading .button {
.file-table {
width: calc(100% - 8px);
- border: 1px dotted var(--border-line, #000000);
+ border: 1px dotted var(--border-line);
}
.file-table tr {
- border-bottom: 1px dotted var(--border-line, #000000);
+ border-bottom: 1px dotted var(--border-line);
}
.userlink {
@@ -1043,7 +1033,7 @@ heading .button {
}
.userlink a {
- color: var(--main-text, #000000);
+ color: var(--main-text);
text-decoration: none;
}
@@ -1053,8 +1043,8 @@ heading .button {
}
.message-container {
- background-color: var(--main-background, #d3d3d3);
- border: var(--menu-border, 1px solid #bdbdbd);
+ background-color: var(--main-background);
+ border: var(--menu-border);
display: block;
padding: 4px;
margin-right: 8px;
@@ -1071,8 +1061,8 @@ heading .button {
}
.message-container .body {
- background-color: var(--menu-bg, #d0d0d0);
- border: var(--menu-border, 1px solid #bdbdbd);
+ background-color: var(--menu-bg);
+ border: var(--menu-border);
padding: 8px;
margin: 4px;
}
@@ -1093,13 +1083,13 @@ heading .button {
.formbutton button {
background: none;
- color: var(--main-text, #000000);
+ color: var(--main-text);
text-decoration: none;
display: flex;
align-items: center;
width: 100%;
height: 100%;
- font-family: var(--spfont1, Pixio);
+ font-family: var(--primary-font);
border: none;
box-sizing: content-box;
padding: 0px;
@@ -1134,11 +1124,11 @@ textarea {
}
.dropdown .menu {
- background-image: var(--background-image, url('//assets.worlio.com/style/background'));
+ background-image: var(--background-image);
display: none;
position: relative;
- background-color: var(--menu-bg, #d0d0d0);
- border: var(--menu-border, 1px solid #bdbdbd);
+ background-color: var(--menu-bg);
+ border: var(--menu-border);
padding: 4px;
right: 152px;
width: 140px;
@@ -1188,15 +1178,12 @@ table {
}
.form-container {
- background-color: var(--menu-bg, #d0d0d0);
- border: var(--menu-border, 1px solid #bdbdbd);
+ background-color: var(--menu-bg);
+ border: var(--menu-border);
padding: 8px;
margin: 4px;
}
-.tabbed-container {
-}
-
.tabbed-container .tablist .tab,
.tabbed-container .tablist .faketab {
cursor: pointer;
@@ -1206,7 +1193,7 @@ table {
.mailbox a:link, .mailbox a:visited,
.tablist a,
.tablist a:link, .tablist a:visited {
- color: var(--main-text, #000000);
+ color: var(--main-text);
text-decoration: none;
}
@@ -1217,7 +1204,7 @@ table {
.tabbed-container .tablist {
position: relative;
- bottom: -1px;
+ bottom: -2px;
display: flex;
flex-direction: row;
flex-shrink: 0;
@@ -1227,15 +1214,15 @@ table {
.tabbed-container .tablist .tab,
.tabbed-container .tablist .faketab {
- background-color: var(--tab-inactive, #bdbdbd);
- border: var(--menu-border, 1px solid #bdbdbd);
+ background-color: var(--tab-inactive);
+ border: var(--tab-border);
display: inline-block;
padding: 8px;
position: relative;
margin: 0px 2px;
bottom: -1px;
text-align: center;
- font-family: var(--spfont1, Pixio);
+ font-family: var(--primary-font);
}
.tabbed-container .tablist .tab *:not(.userlink) img,
@@ -1246,17 +1233,17 @@ table {
.tabbed-container .tablist .tab.selected,
.tabbed-container .tablist .faketab.selected {
background: var(--tab-selected, #d3d3d3);
- background: -moz-linear-gradient(0deg, var(--tab-selected, #d3d3d3) 50%, var(--tab-gradient, #dedede) 100%);
- background: -webkit-linear-gradient(0deg, var(--tab-selected, #d3d3d3) 50%, var(--tab-gradient, #dedede) 100%);
- background: linear-gradient(0deg, var(--tab-selected, #d3d3d3) 50%, var(--tab-gradient, #dedede) 100%);
+ background: -moz-linear-gradient(0deg, var(--tab-selected) 50%, var(--tab-gradient) 100%);
+ background: -webkit-linear-gradient(0deg, var(--tab-selected) 50%, var(--tab-gradient) 100%);
+ background: linear-gradient(0deg, var(--tab-selected) 50%, var(--tab-gradient) 100%);
bottom: -2px;
/*border-bottom: none;*/
}
.tabbed-container .box,
.tabbed-container .dropdown {
- background-color: var(--tab-selected, #d3d3d3);
- border: var(--menu-border, 1px solid #bdbdbd);
+ background-color: var(--tab-selected);
+ border: var(--tab-border);
padding: 4px;
display: block;
flex: auto;
@@ -1270,8 +1257,8 @@ table {
.mailbox .message,
.userbox .member {
- background-color: var(--menu-bg, #d0d0d0);
- border: var(--menu-border, 1px solid #bdbdbd);
+ background-color: var(--menu-bg);
+ border: var(--menu-border);
margin: 4px;
padding: 8px;
}
@@ -1296,7 +1283,7 @@ table {
.overlay .box,
.overlay .attachment {
- background: var(--main-background, #d3d3d3);
+ background: var(--main-background);
border: 2px inset gray;
padding: 8px;
@@ -1319,7 +1306,7 @@ table {
cursor: pointer;
border: 1px solid transparent;
height: 30px;
- font-family: var(--spfont1);
+ font-family: var(--primary-font);
}
.overlay .popup.box .embedder .embed-item img {
@@ -1329,8 +1316,8 @@ table {
}
.overlay .popup.box .embedder .embed-item:hover {
- border: var(--menu-border, 1px solid #bdbdbd);
- background: var(--menu-bg, #d0d0d0);
+ border: var(--menu-border);
+ background: var(--menu-bg);
}
.overlay .popup.box .embedder .embed-item.selected {
@@ -1341,7 +1328,7 @@ table {
.dragbox {
position: absolute;
z-index: 10;
- background: var(--main-background, #d3d3d3);
+ background: var(--main-background);
border: var(--menu-border);
padding: 8px;
box-shadow: #0005 5px 5px 4px;
@@ -1363,7 +1350,7 @@ table {
padding: 4px;
background: var(--popup-title-bg);
border-bottom: var(--popup-title-border);
- font-family: var(--spfont1, Pixio);
+ font-family: var(--primary-font);
}
.overlay .popup .titlebar .title,
@@ -1446,10 +1433,10 @@ table {
.tabbed-container.vertical > .tablist .tab.selected,
.tabbed-container.vertical > .tablist .faketab.selected {
background: var(--tab-selected, #d3d3d3);
- background: -moz-linear-gradient(-90deg, var(--tab-selected, #d3d3d3) 25%, var(--tab-gradient, #dedede) 100%);
- background: -webkit-linear-gradient(-90deg, var(--tab-selected, #d3d3d3) 25%, var(--tab-gradient, #dedede) 100%);
- background: linear-gradient(-90deg, var(--tab-selected, #d3d3d3) 25%, var(--tab-gradient, #dedede) 100%);
- border: var(--menu-border, 1px solid #bdbdbd);
+ background: -moz-linear-gradient(-90deg, var(--tab-selected) 25%, var(--tab-gradient) 100%);
+ background: -webkit-linear-gradient(-90deg, var(--tab-selected) 25%, var(--tab-gradient) 100%);
+ background: linear-gradient(-90deg, var(--tab-selected) 25%, var(--tab-gradient) 100%);
+ border: var(--tab-border);
}
.forum .thread .threadsub {
@@ -1489,7 +1476,7 @@ table {
}
/* FORUM */
-table.board { font-family: var(--spfont1, Pixio); }
+table.board { font-family: var(--primary-font); }
table.board th {
text-align: left;
@@ -1497,7 +1484,7 @@ table.board th {
background-color: var(--forum-header, #f3dca9);
}
-body.forum_board table.board tr:nth-child(0) { border: var(--forum-header-border, 1px solid #a89b7f); }
+body.forum_board table.board tr:nth-child(0) { border: var(--forum-header-border); }
body.forum_board table.board tr:not(.subboard) td:nth-child(4),
body.forum_board table.board tr:not(.subboard) th:nth-child(3) { text-align: right; }
@@ -1507,14 +1494,14 @@ body.forum table.board td:nth-child(3) * { vertical-align: middle; }
body.forum table.board th {
cursor: pointer;
user-select: none;
- border: var(--forum-header-border, 1px solid #a89b7f);
+ border: var(--forum-header-border);
}
table.board tr {
text-align: left;
padding: 4px;
- background-color: var(--forum-content, #d9d4c9);
- border: var(--forum-content-border, 1px solid #a29c8d);
+ background-color: var(--forum-content);
+ border: var(--forum-content-border);
}
body.forum_board table.board th {
@@ -1530,7 +1517,7 @@ body.forum table.board.collapsed td { display: none; }
body.forum_board table.board col:nth-child(4),
body.forum_watched table.board td:nth-child(4),
body.forum_watched table.board col:nth-child(4) { display: none; }
- table.board td:nth-child(3) { border-right: var(--forum-content-border, 1px solid #a29c8d); }
+ table.board td:nth-child(3) { border-right: var(--forum-content-border); }
}
table.board .status {
@@ -1541,7 +1528,7 @@ table.board .status {
}
.forum .category {
- font-family: var(--spfont1, Pixio);
+ font-family: var(--primary-font);
}
.forum > .category,
@@ -1562,9 +1549,9 @@ table.board .status {
.forum .category name,
.forum .thread name {
display: flex;
- background-color: var(--forum-header, #f3dca9);
- border: var(--forum-header-border, 1px solid #a89b7f);
- font-family: var(--spfont1, Pixio);
+ background-color: var(--forum-header);
+ border: var(--forum-header-border);
+ font-family: var(--primary-font);
padding: 4px;
}
@@ -1584,7 +1571,7 @@ table.board .status {
.forum .category name .info i,
.forum .thread name .info i {
font-size: 12px;
- color: var(--subtitle, #525252);
+ color: var(--subtitle);
}
.forum .board name .buttons,
@@ -1608,8 +1595,8 @@ table.board .status {
.forum .category .board {
display: flex;
- background-color: var(--forum-content, #d9d4c9);
- border: var(--forum-content-border, 1px solid #a29c8d);
+ background-color: var(--forum-content);
+ border: var(--forum-content-border);
padding: 8px;
margin-left: 8px;
margin-bottom: -1px;
@@ -1631,13 +1618,13 @@ table.board .status {
.forum .board .thread {
display: flex;
- background-color: var(--forum-content, #d9d4c9);
- border: var(--forum-content-border, 1px solid #a29c8d);
+ background-color: var(--forum-content);
+ border: var(--forum-content-border);
border-top: none;
margin-left: 8px;
margin-right: 8px;
padding: 8px;
- font-family: var(--spfont1, Pixio);
+ font-family: var(--primary-font);
}
.forum .board .thread .userlink {
@@ -1649,7 +1636,7 @@ table.board .status {
}
.forum .board .thread .details1 .post-count {
- color: var(--subtitle, #525252);
+ color: var(--subtitle);
}
.forum .board .thread .details2 {
@@ -1664,14 +1651,14 @@ table.board .status {
}
.forum .board .thread .time {
- color: var(--subtitle, #525252);
+ color: var(--subtitle);
}
.forum .thread .post .post-content,
.forum .thread .reply,
.forum .errors {
- background-color: var(--post, #d9d9d9);
- border: var(--post-border, 1px solid #bfb9a9);
+ background-color: var(--post);
+ border: var(--post-border);
padding: 4px;
}
@@ -1690,7 +1677,7 @@ table.board .status {
.forum .thread .reply .title,
.forum .errors .title {
display: flex;
- font-family: var(--spfont1, Pixio);
+ font-family: var(--primary-font);
padding: 4px;
margin: -8px;
margin-bottom: 8px;
@@ -1705,8 +1692,8 @@ table.board .status {
}
.forum .thread .post .authorbar {
- background-color: var(--post-author, #b4b6b7);
- border: var(--post-author-border, 1px solid #84775a);
+ background-color: var(--post-author);
+ border: var(--post-author-border);
display: flex;
min-height: 64px;
padding: 2px;
@@ -1718,10 +1705,8 @@ table.board .status {
flex-direction: column;
}
-/*.forum .thread .post .authorbar .userlink { text-align: center: }*/
-
.forum .thread .post .authorbar .user-stat {
- font-family: var(--spfont1);
+ font-family: var(--primary-font);
color: var(--subtitle);
display: flex;
}
@@ -1745,7 +1730,7 @@ table.board .status {
display: flex;
padding: 2px;
margin: 0px 16px;
- font-family: var(--spfont1, Pixio);
+ font-family: var(--primary-font);
z-index: 5;
}
@@ -1766,7 +1751,7 @@ table.board .status {
background-color: var(--post-bottombar, #d2d2d2);
padding: 4px;
display: flex;
- font-family: var(--spfont1, Pixio);
+ font-family: var(--primary-font);
margin: -4px; margin-bottom: 4px;
}
@@ -1796,7 +1781,7 @@ table.board .status {
background-color: var(--post-bottombar, #d2d2d2);
display: flex;
margin: -4px; margin-top: 8px;
- font-family: var(--spfont1, Pixio);
+ font-family: var(--primary-font);
}
.forum .thread .post .buttonbar a {
@@ -1804,7 +1789,7 @@ table.board .status {
}
.forum .thread .options .option .name {
- font-family: var(--spfont1, Pixio);
+ font-family: var(--primary-font);
}
.forum .thread name .thricon {
@@ -1847,7 +1832,7 @@ div.page-buttons .button#last-page div a {
display: block;
}
-.userlink { font-family: var(--spfont1, Pixio); }
+.userlink { font-family: var(--primary-font); }
.posteditor .editor-buttons .button a > input,
.posteditor .editor-buttons .button a > select {
@@ -1855,7 +1840,7 @@ div.page-buttons .button#last-page div a {
border: none;
height: 100%;
width: 100%;
- font-family: var(--spfont1, Pixio);
+ font-family: var(--primary-font);
}
.posteditor .editbox {
@@ -1894,7 +1879,7 @@ div.emotebox .emote-container:hover {
}
.mailcontainer .subject {
- font-family: var(--spfont1, Pixio);
+ font-family: var(--primary-font);
margin: 2px 2px 0px 2px;
background: var(--mail-subject-bg, #b7b7b7);
border: var(--mail-subject-border, 1px solid #8a8a8a);
@@ -1931,7 +1916,7 @@ div.emotebox .emote-container:hover {
.mailcontainer .buttonbar .date {
flex-grow: 1;
- font-family: var(--spfont1, Pixio);
+ font-family: var(--primary-font);
padding: 4px;
color: var(--subtitle, #525252);
}
@@ -2013,15 +1998,15 @@ body.forum .sidebar .box .content {
border-top: 0;
}
-body.forum .sidebar .box .content .subject {font-family: var(--spfont1);}
+body.forum .sidebar .box .content .subject {font-family: var(--primary-font);}
body.forum .sidebar .box name {
background: var(--post-author);
border: var(--post-author-border);
- font-family: var(--spfont1);
+ font-family: var(--primary-font);
font-weight: bold;
padding: 4px;
}
-body.forum .sidebar .box .thread .info {font-family: var(--spfont1);}
+body.forum .sidebar .box .thread .info {font-family: var(--primary-font);}
body.forum .sidebar .box .thread .info .loc {font-size: 12px;}
body.forum .sidebar .box .thread .info .timestamp {color: var(--subtitle);}
@@ -2072,7 +2057,7 @@ body.dashboard .dash-container .mainbox {
}
body.dashboard .profile-tag {
- font-family: var(--spfont1);
+ font-family: var(--primary-font);
display: flex;
}
@@ -2097,7 +2082,7 @@ body.dashboard .dash-title {
display: inline-block;
padding: 8px;
font-weight: bold;
- font-family: var(--spfont1);
+ font-family: var(--primary-font);
margin-bottom: -1px;
}
@@ -2124,7 +2109,7 @@ body.dashboard .dash-container .sidebar .userlink.invisible {
}
body.dashboard .stats {
- font-family: var(--spfont1);
+ font-family: var(--primary-font);
font-size: 20px;
}
@@ -2151,7 +2136,7 @@ body.dashboard .stats .unread { color: var(--alert); }
.dash-container .primary .mainbox .alert .info {
text-align: right;
color: var(--subtitle);
- font-family: var(--spfont1);
+ font-family: var(--primary-font);
}
.dash-container .blogpost {
@@ -2160,13 +2145,13 @@ body.dashboard .stats .unread { color: var(--alert); }
.dash-container .blogpost .info {
color: var(--subtitle);
- font-family: var(--spfont1);
+ font-family: var(--primary-font);
}
.dash-container .sidebar .container div.filespace meter { flex-grow: 1; margin: 0px 4px;}
.dash-container .sidebar .container div.filespace b { margin-right: 4px;}
.dash-container .sidebar .container div.filespace { display: flex; }
-.dash-container .sidebar .container div.filespace a { font-family: var(--spfont1); margin: 0px 2px; }
+.dash-container .sidebar .container div.filespace a { font-family: var(--primary-font); margin: 0px 2px; }
/* USER PROFILE PAGE */
body.user-profile .user-infobox {
@@ -2208,9 +2193,9 @@ body.user-profile .tabbed-container {
body.user-profile .tabbed-container .tablist {white-space: nowrap;}
body.user-profile .tabbed-container .box[name='stats'] .stat.role-stat,
-body.user-profile .tabbed-container .box[name='stats'] .stat.plan-stat { font-family: var(--spfont1); }
+body.user-profile .tabbed-container .box[name='stats'] .stat.plan-stat { font-family: var(--primary-font); }
body.user-profile .tabbed-container .stat b {
- font-family: var(--spfont1);
+ font-family: var(--primary-font);
font-size: 12px;
}
@@ -2227,7 +2212,7 @@ a.thumbnail-box {
width: 150px;
height: 150px;
color: var(--main-text);
- font-family: var(--spfont1);
+ font-family: var(--primary-font);
text-decoration: none;
margin: 2px;
}
@@ -2248,7 +2233,7 @@ button.user-input {
width: 180px;
height: 24px;
text-align: left;
- font-family: var(--spfont1);
+ font-family: var(--primary-font);
font-size: 14px;
vertical-align: middle;
cursor: pointer;