Compare commits

..

15 Commits

Author SHA1 Message Date
Kouya Heika
953200f5cb Fix shop filterbox styling on newer browsers 2026-07-26 23:34:29 -05:00
Kouya Heika
f9d348c94e Use grid for newest forum elements 2026-07-26 22:43:14 -05:00
Kouya Heika
22dbc269ed Allow forum post potrait author row to be forced for desktop mode 2026-07-20 18:41:54 -05:00
Kouya Heika
2c90d74c09 Clean alert styles up, add namespace element stylings. 2026-07-19 21:24:10 -05:00
Kouya Heika
6ad7e477b2 Add alert icons
Signed-off-by: Kouya Heika <kouyaheika@canithesis.org>
2026-05-02 00:55:02 -05:00
Kouya Heika
9541c10522 Switch classname origin to namespace
Signed-off-by: Kouya Heika <kouyaheika@canithesis.org>
2026-05-02 00:54:38 -05:00
Kouya Heika
5b2b2b9c43 Add alert dropdown style for channel and fix font size for dashboard origin
Signed-off-by: Kouya Heika <kouyaheika@canithesis.org>
2026-04-29 02:04:50 -05:00
Kouya Heika
e51f944958 clean up header/heading class styles
Signed-off-by: Kouya Heika <kouyaheika@canithesis.org>
2026-04-29 01:50:22 -05:00
Kouya Heika
6242667c55 Change infobar on dashboard alerts
Signed-off-by: Kouya Heika <kouyaheika@canithesis.org>
2026-04-29 01:44:21 -05:00
Kouya Heika
ad7e623b66 dialog cevron styles
Signed-off-by: Kouya Heika <kouyaheika@canithesis.org>
2026-01-21 20:31:50 -06:00
Kouya Heika
e52e0d7cfa Move dialog styles, add styles for tip dialog
Signed-off-by: Kouya Heika <kouyaheika@canithesis.org>
2026-01-21 19:07:08 -06:00
Kouya Heika
1110893702 Replace history dialog style with new popout one
Signed-off-by: Kouya Heika <kouyaheika@canithesis.org>
2026-01-19 23:06:27 -06:00
Kouya Heika
6215e96643 Rename _weditdialog to _wdialog
Signed-off-by: Kouya Heika <kouyaheika@canithesis.org>
2026-01-17 11:26:12 -06:00
Kouya Heika
fcebe70fd0 Styling for new table section
Signed-off-by: Kouya Heika <kouyaheika@canithesis.org>
2025-12-16 03:57:21 -06:00
Kouya Heika
1a1ab64f32 Add UseNet icon for forum
Signed-off-by: Kouya Heika <kouyaheika@canithesis.org>
2025-12-16 03:55:00 -06:00
9 changed files with 196 additions and 97 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.2 KiB

BIN
core/icons/alerts/group.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.0 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.8 KiB

BIN
core/icons/forum/usenet.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.8 KiB

View File

@@ -62,6 +62,33 @@ table.alternating > tbody > tr:nth-of-type(even) {
background: var(--table-alternate); background: var(--table-alternate);
} }
table.section {
background: none;
border: none;
padding: 0px;
margin: 4px;
}
table.section > tbody > tr > th:first-child > div,
table.section > tbody > tr > th:last-child > div,
table.section > tbody > tr:first-child > td:first-child > div,
table.section > tbody > tr:first-child > td:last-child > div {
background: var(--secondary-container-background);
border: var(--secondary-container-border);
border-bottom: none;
padding: 8px;
position:relative;
top: 4px;
height: 100%;
font-family: var(--primary-font);
}
table.section > tbody > tr:not(:first-child) > td > div {
background: var(--secondary-container-background);
border: var(--secondary-container-border);
padding: 4px;
}
@media only screen and (orientation: landscape) { @media only screen and (orientation: landscape) {
:target::before { :target::before {
content: ""; content: "";
@@ -152,26 +179,6 @@ body > div.overlay .dialog table:not(.titlebox) {
overflow: auto; overflow: auto;
} }
body > div.overlay div.dialog.historylist {
display: flex;
flex-direction: column;
max-width: 500px;
max-height: 90%;
}
body > div.overlay div.dialog.historylist .history-view {
background: var(--history-background);
padding: 4px;
margin: 4px;
border: 1px solid var(--history-border-color);
overflow: auto;
font-family: monospace;
}
body > div.overlay div.dialog.historylist select {
width: 100%;
margin: 2px 0px;
}
.history-view div { .history-view div {
border-bottom: 1px dashed var(--history-border-color); border-bottom: 1px dashed var(--history-border-color);
white-space: break-spaces; white-space: break-spaces;
@@ -439,6 +446,16 @@ nav.top div.slideout.mail .dropdown .mail .message a {
text-decoration: underline; text-decoration: underline;
} }
nav.top div.slideout.alerts .dropdown .alerts .alert .header {
font-size: 12px;
}
nav.top div.slideout.alerts .dropdown .alerts .alert .header a:link,
nav.top div.slideout.alerts .dropdown .alerts .alert .header a:visited {
color: var(--subtitle);
text-decoration: none;
}
nav.top div.slideout.alerts .dropdown .alerts .alert .info, nav.top div.slideout.alerts .dropdown .alerts .alert .info,
nav.top div.slideout.mail .dropdown .mail .message .info { nav.top div.slideout.mail .dropdown .mail .message .info {
display: flex; display: flex;
@@ -672,14 +689,14 @@ nav.top .navbutton-bar .button.selected {
/* == HEADING/HEADER */ /* == HEADING/HEADER */
.header { body > .header {
display: flex; display: flex;
margin-bottom: 8px; margin-bottom: 8px;
} }
.header > .gap { flex-grow: 1;} body > .header > .gap { flex-grow: 1;}
.header > .title { body > .header > .title {
border: var(--primary-container-border); border: var(--primary-container-border);
border-top: none; border-top: none;
flex-shrink: 0; flex-grow: 0; flex-shrink: 0; flex-grow: 0;
@@ -696,7 +713,7 @@ nav.top .navbutton-bar .button.selected {
padding-top: 8px; padding-top: 8px;
} }
.heading { body > .heading {
z-index: 10; z-index: 10;
display: block; display: block;
background-repeat: repeat-x; background-repeat: repeat-x;
@@ -707,46 +724,29 @@ nav.top .navbutton-bar .button.selected {
font-family: var(--primary-font); font-family: var(--primary-font);
} }
.heading > div.head-contents { body > .heading > div.head-contents {
max-width: 1200px; max-width: 1200px;
margin-left: auto; margin-right: auto; margin-left: auto; margin-right: auto;
} }
.heading.main { body > .heading.main {
position: sticky; position: sticky;
background-size: 64px; background-size: 64px;
height: 60px; height: 60px;
z-index: -1; z-index: -1;
} }
.heading { body > .heading {
background-color: var(--header-bg); background-color: var(--header-bg);
background-image: var(--navbar-top); background-image: var(--navbar-top);
} }
.heading.sub, body > .heading.main > div.head-contents > a {
.heading.section {
height: 28px;
}
.heading.sub {
background-size: 64px;
background-position-y: -32px;
}
.heading.section {
background-size: 32px;
background-image: var(--nav-db);
background-color: var(--header-bg);
font-size: 1.5em;
}
.heading.main > div.head-contents > a {
font-size: 2em; font-size: 2em;
} }
.heading > div.head-contents > a { body > .heading > div.head-contents > a {
margin: 0px 0px 0px 4px; margin: 0px 0px 0px 4px;
display: inline-block; display: inline-block;
font-weight: bold; font-weight: bold;
@@ -758,17 +758,17 @@ nav.top .navbutton-bar .button.selected {
display: inline-block; display: inline-block;
} }
.heading.main img { body > .heading.main img {
height: 48px; height: 48px;
} }
.heading.main i { body > .heading.main i {
margin-left: 16px; margin-left: 16px;
font-weight: normal; font-weight: normal;
font-size: 1.5em !important; font-size: 1.5em !important;
} }
.heading hr { body > .heading hr {
margin: 0px 8px; margin: 0px 8px;
border: none; border: none;
border-left: var(--header-line); border-left: var(--header-line);
@@ -777,7 +777,7 @@ nav.top .navbutton-bar .button.selected {
height: 75%; height: 75%;
} }
.header div.buttontab { body > .header div.buttontab {
background: var(--default-button-background); background: var(--default-button-background);
border: var(--default-button-border); border: var(--default-button-border);
margin: -12px 4px 8px 4px; margin: -12px 4px 8px 4px;
@@ -785,7 +785,7 @@ nav.top .navbutton-bar .button.selected {
font-size: 12px; font-size: 12px;
} }
.header div.buttontab a { body > .header div.buttontab a {
color: var(--main-text); color: var(--main-text);
display: inline-block; display: inline-block;
text-decoration: none; text-decoration: none;
@@ -793,40 +793,28 @@ nav.top .navbutton-bar .button.selected {
height: 100%; height: 100%;
} }
.header div.buttontab a img { body > .header div.buttontab a img {
vertical-align: middle; vertical-align: middle;
} }
.header div.buttontab:hover { body > .header div.buttontab:hover {
background: var(--hover-button-background); background: var(--hover-button-background);
border: var(--hover-button-border); border: var(--hover-button-border);
} }
.header div.buttontab:active { body > .header div.buttontab:active {
background: var(--active-button-background); background: var(--active-button-background);
border: var(--active-button-border); border: var(--active-button-border);
} }
@media only screen and (orientation: landscape) { @media only screen and (orientation: landscape) {
.heading { body > .heading {
width: calc(100% + 8px); width: calc(100% + 8px);
padding: 2px 4px; padding: 2px 4px;
left: 64px; left: 64px;
} }
.heading.main, body > .heading.main { top: 0px; margin: -8px; margin-bottom: 8px; }
.heading.sub {
top: 0px;
}
.heading.main { margin: -8px; margin-bottom: 8px; }
.heading.sub { margin: -8px; margin-bottom: 8px; }
.heading.section { margin: 4px -8px; }
body > .header-title {
top: -8px;
margin-bottom: -8px;
}
/* Center header */ /* Center header */
body > .header { body > .header {
@@ -860,6 +848,91 @@ nav.top .navbutton-bar .button.selected {
} }
} }
/* == ALERTS */
body .page-container .alerts .alert {
padding: 4px;
margin: 4px;
background: var(--secondary-container-background);
border: var(--secondary-container-border);
}
body .page-container .alerts .alert.unread .content {
font-weight: bold;
}
body .page-container .alerts .alert .info {
display: flex;
color: var(--subtitle);
font-family: var(--primary-font);
font-size: 12px;
}
body .page-container .alerts .alert .info a[mark_read] {
text-decoration: none;
padding: 0px 4px;
}
body .page-container .alerts .alert .namespace {
flex-grow: 1;
}
body .page-container .alerts .alert .namespace a:link,
body .page-container .alerts .alert .namespace a:visited {
color: var(--subtitle);
text-decoration: none;
}
/* == NAMESPACE DISPLAYS */
.namespace-container {
padding: 8px;
}
.namespace-container.namespace-forum-post table.post-display,
.namespace-container.namespace-forum-thread table.board-display {
background: var(--forum-header);
border: var(--forum-header-border);
font-family: var(--primary-font);
table-layout: fixed;
}
.namespace-container.namespace-forum-post table.post-display th,
.namespace-container.namespace-forum-post table.post-display td,
.namespace-container.namespace-forum-thread table.board-display th,
.namespace-container.namespace-forum-thread table.board-display td {
padding: 4px;
}
.namespace-container.namespace-forum-post table.post-display tr:nth-of-type(1) {
background: var(--post-author);
border: var(--post-author-border);
}
.namespace-container.namespace-forum-post table.post-display tr:nth-of-type(2) {
background: var(--post);
border: var(--post-border);
}
.namespace-container.namespace-forum-thread table.board-display tr {
background: var(--forum-content);
border: var(--forum-content-border);
}
.namespace-container.namespace-forum-post table.post-display .thread-status,
.namespace-container.namespace-forum-thread table.board-display .thread-status {
text-align: right;
position: relative;
height: 0px;
top: -16px;
left: 4px;
}
.namespace-container.namespace-forum-post table.post-display tr th:nth-of-type(2),
.namespace-container.namespace-forum-thread table.board-display tr th:nth-of-type(2) {
text-align: left;
}
/* == ACCFORM PAGES */ /* == ACCFORM PAGES */
body.accform .page-container .formpart { body.accform .page-container .formpart {
max-width: 400px; max-width: 400px;
@@ -1095,23 +1168,6 @@ body.dashboard .userlink img.plan-icon {
top: -2px; top: -2px;
} }
body.dashboard .dash-container .primary .mainbox .alert {
padding: 4px;
margin: 4px;
background: var(--secondary-container-background);
border: var(--secondary-container-border);
}
body.dashboard .dash-container .primary .mainbox .alert.unread .content {
font-weight: bold;
}
body.dashboard .dash-container .primary .mainbox .alert .info {
text-align: right;
color: var(--subtitle);
font-family: var(--primary-font);
}
body.dashboard .dash-container .blogpost { body.dashboard .dash-container .blogpost {
padding: 4px; padding: 4px;
} }
@@ -1365,9 +1421,11 @@ table.board-display#poll input[type="text"] { width: 100%; }
@media only screen and (orientation: landscape) { @media only screen and (orientation: landscape) {
body.forum.index .page-container .newest { body.forum.index .page-container .newest {
display: flex; display: grid;
grid-template-columns: repeat(2, 1fr);
width: 100%; width: 100%;
margin: 4px; margin: 4px;
gap: 8px;
} }
body.forum.thread table.board-display { body.forum.thread table.board-display {
@@ -1375,7 +1433,7 @@ table.board-display#poll input[type="text"] { width: 100%; }
} }
body.forum.thread table.board-display colgroup col:nth-of-type(4), body.forum.thread table.board-display colgroup col:nth-of-type(4),
body.forum.thread table.post-display tr.author-row { body.forum.thread table.post-display tr.author-row:not(.force) {
display: none; display: none;
} }
} }
@@ -1422,6 +1480,7 @@ body.shop.items .page-container {
body.shop.items .page-container .sidebar { body.shop.items .page-container .sidebar {
display: flex; display: flex;
flex-direction: column;
flex-shrink: 0; flex-shrink: 0;
} }
@@ -1727,14 +1786,14 @@ body.group div.page-container div.group-section div.sidebar {
min-width: 200px; min-width: 200px;
flex-grow: 0; flex-grow: 0;
} }
*/
body.group div.page-container div.sidebar > .section { body.group div.page-container div.sidebar > .section {
background-color: var(--tab-selected); background-color: var(--tab-selected);
border: var(--tab-border); border: var(--tab-border);
margin: 4px auto; margin: 4px auto;
padding: 4px; padding: 4px;
} }
*/
body.group.create div.groupcard { body.group.create div.groupcard {
display: flex; display: flex;
background: var(--primary-container-background); background: var(--primary-container-background);
@@ -2332,18 +2391,18 @@ body.news.post div.subinfo i {
font-family: initial; font-family: initial;
} }
body > ._weditdialog { body > ._wdialog {
background: var(--primary-container-background); background: var(--primary-container-background);
border: var(--primary-container-border); border: var(--primary-container-border);
position: absolute; position: absolute;
width: 300px; width: 300px;
} }
body > ._weditdialog .button { body > ._wdialog .button {
cursor: pointer; cursor: pointer;
} }
body > ._weditdialog .chevron { body > ._wdialog .chevron {
background: var(--primary-container-background); background: var(--primary-container-background);
border: var(--primary-container-border); border: var(--primary-container-border);
position: relative; position: relative;
@@ -2356,26 +2415,66 @@ body > ._weditdialog .chevron {
border-right: none; border-right: none;
} }
body > ._weditdialog .titlerow { body > ._wdialog .titlerow {
display: flex; display: flex;
} }
body > ._weditdialog .titlerow b.name { body > ._wdialog .titlerow b.name {
flex-grow: 1; flex-grow: 1;
} }
body > ._weditdialog table { body > ._wdialog table {
margin: 0px; margin: 0px;
} }
body > ._weditdialog .buttonrow { body > ._wdialog .buttonrow {
display: flex; display: flex;
} }
body > ._weditdialog table tr th { body > ._wdialog table tr th {
text-align: left; text-align: left;
} }
body > div._wdialog[name="history"] {
width: 500px;
}
body > div._wdialog[name="history"] .history-view {
background: var(--history-background);
padding: 4px;
margin: 4px;
border: 1px solid var(--history-border-color);
overflow: auto;
font-family: monospace;
max-height: 400px;
}
body > div._wdialog[name="history"] > .chevron {
left: 226px;
}
body > div._wdialog[name="history"] div.wdropdown {
padding: 0px 2px;
}
body > div._wdialog[name="history"] div.wdropdown.active button { padding-bottom: 2px; }
body > div._wdialog[name="history"] button {
width: 100%;
}
body > div._wdialog[name="tips"] {
width: 200px;
}
body > div._wdialog[name="tips"] > .chevron {
left: 56px;
}
body > div._wdialog[name="tips"] .tiplist {
padding: 2px;
overflow: auto;
max-height: 300px;
}
div.smiley-list { div.smiley-list {
max-height: 200px; max-height: 200px;
overflow-y: scroll; overflow-y: scroll;