init

2026-10-24 14:03:52 +07:00
commit 4fe046de58
4790 changed files with 311146 additions and 0 deletions
@@ -0,0 +1,442 @@
+/* Color */
+
+body {
+    --movim-background-main: 238, 238, 238;
+    --movim-background: 255, 255, 255;
+    --movim-gray: 35, 35, 35;
+    --movim-font: 0, 0, 0;
+    --movim-header-font: 200, 200, 200;
+    --movim-element-action: 153, 153, 153;
+    scrollbar-color: rgba(var(--movim-font), 0.2) transparent;
+    --movim-shadow: 0, 0, 0;
+    --movim-shadow-strength: 1;
+}
+
+/* Night mode, using an enforced class and with the browser media-query, the two following
+sections are therefore copy pasted */
+
+body.nightmode {
+    --movim-background-main: 20, 26, 33;
+    --movim-background: 25, 32, 40;
+    --movim-gray: var(--movim-background-main);
+    --movim-font: 255, 255, 255;
+    --movim-element-action: 74, 86, 99;
+    scrollbar-color: rgba(var(--movim-font), 0.1) transparent;
+    --movim-shadow-strength: 1.2;
+}
+
+@media (prefers-color-scheme: dark) {
+    body {
+        --movim-background-main: 20, 26, 33;
+        --movim-background: 25, 32, 40;
+        --movim-gray: var(--movim-background-main);
+        --movim-font: 255, 255, 255;
+        --movim-element-action: 74, 86, 99;
+        scrollbar-color: rgba(var(--movim-font), 0.1) transparent;
+        --movim-shadow-strength: 1.6;
+    }
+}
+
+body>*,
+.context_menu,
+.icon-text,
+.tabs a,
+input,
+textarea,
+select {
+    color: rgba(var(--movim-font), 0.87);
+}
+
+input::placeholder,
+textarea::placeholder,
+select::placeholder {
+    color: rgba(var(--movim-font), 0.67);
+}
+
+ul.list li.divided:after,
+*.divided:not(.spaced):not(li)>*:not(:last-child):not(.subheader):after,
+*.divided.spaced>*:not(:last-child):after,
+hr:not(.clear),
+.card>.block:not(.subheader):not(.simple),
+*.divided>*:not(:last-child) {
+    border-color: rgba(var(--movim-font), 0.12);
+}
+
+ul.list li span.control.divided:before {
+    border-color: rgba(var(--movim-font), 0.128);
+}
+
+label,
+span.info,
+li div.bubble:after,
+ul.list li>div>p>span.second,
+table tr th {
+    color: rgba(var(--movim-font), 0.54);
+}
+
+ul.list li.color>div>p>span.second {
+    color: rgba(255, 255, 255, 0.54);
+}
+
+body,
+#drawer .card>.block:not(.subheader):not(.simple):not(.color) {
+    background-color: rgb(var(--movim-background-main));
+}
+
+.drawer,
+.dialog,
+ul.context_menu,
+ul>li.date>div>p,
+.card>.block:not(.subheader):not(.simple):not(.color) {
+    background-color: rgb(var(--movim-background));
+}
+
+main>header a,
+.icon:not(.placeholder):not(.active) a,
+.color input {
+    color: rgb(var(--movim-font));
+}
+
+.button.color,
+.color,
+span.icon span.counter,
+span.icon[data-counter]:after,
+span.icon.composing:after,
+form>div .checkbox>input[type="checkbox"]:checked:before,
+form>div .radio>input[type="radio"]:checked+label {
+    border-color: var(--movim-accent);
+    background-color: var(--movim-accent);
+    color: white;
+}
+
+span.icon span.counter:not(.alt) {
+    color: white;
+}
+
+span.icon span.counter.alt {
+    color: var(--movim-font);
+    background-color: rgb(var(--movim-background-main));
+}
+
+/* Elements */
+
+ul li.action>div.action,
+ul li.action>form>div.action,
+.button.dorange,
+.icon.dorange,
+span.resource.dorange {
+    color: var(--p-dorange)
+}
+
+li div.bubble.moderator:after,
+ul li div>p>span.moderator,
+.button.orange,
+.icon.orange,
+span.resource.orange {
+    color: var(--p-orange);
+}
+
+.button.amber,
+.icon.anber,
+span.resource.amber {
+    color: var(--p-amber)
+}
+
+.button.yellow,
+.icon.yellow,
+span.resource.yellow {
+    color: var(--p-yellow);
+}
+
+.button.lime,
+.icon.lime,
+span.resource.lime {
+    color: var(--p-lime)
+}
+
+.button.lgreen,
+.icon.lgreen,
+span.resource.lgreen {
+    color: var(--p-lgreen);
+}
+
+.button.green,
+.icon.green,
+span.resource.green {
+    color: var(--p-green);
+}
+
+.button.teal,
+.icon.teal,
+span.resource.teal {
+    color: var(--p-teal)
+}
+
+.button.cyan,
+.icon.cyan,
+span.resource.cyan {
+    color: var(--p-cyan)
+}
+
+.button.lblue,
+.icon.lblue,
+span.resource.lblue {
+    color: var(--p-lblue)
+}
+
+.button.blue,
+.icon.blue,
+span.resource.blue {
+    color: var(--p-blue);
+}
+
+.button.red,
+.icon.red,
+span.resource.red,
+p.encrypted.error {
+    color: var(--p-red);
+}
+
+.button.indigo,
+.icon.indigo,
+span.resource.indigo {
+    color: var(--p-indigo);
+}
+
+.button.dpurple,
+.icon.dpurple,
+span.resource.dpurple {
+    color: var(--p-dpurple);
+}
+
+.button.purple,
+.icon.purple,
+span.resource.purple {
+    color: var(--p-purple);
+}
+
+.button.pink,
+.icon.pink,
+span.resource.pink {
+    color: var(--p-pink)
+}
+
+.button.black,
+.icon.black,
+span.resource.black {
+    color: var(--p-black);
+}
+
+.button.gray,
+.icon.gray,
+span.resource.gray {
+    color: var(--p-gray);
+}
+
+.color {
+    color: white;
+    background-color: var(--movim-accent);
+    border-color: var(--movim-accent)
+}
+
+.color.gray {
+    color: white;
+    background-color: var(--p-gray);
+    border-color: var(--p-gray)
+}
+
+.color.dorange {
+    color: white;
+    background-color: var(--p-dorange);
+    border-color: var(--p-dorange)
+}
+
+.color.orange {
+    color: white;
+    background-color: var(--p-orange);
+    border-color: var(--p-orange)
+}
+
+.color.amber {
+    color: white;
+    background-color: var(--p-amber);
+    border-color: var(--p-amber)
+}
+
+span.icon:not(.composing):not([data-counter]):not(.story).status.away:after,
+.color.yellow {
+    color: white;
+    background-color: var(--p-yellow);
+    border-color: var(--p-yellow)
+}
+
+.color.lime {
+    color: white;
+    background-color: var(--p-lime);
+    border-color: var(--p-lime)
+}
+
+span.icon:not(.composing):not([data-counter]):not(.story).status.chat:after,
+span.icon:not(.composing):not([data-counter]):not(.story).status.online:after,
+.color.lgreen {
+    color: white;
+    background-color: var(--p-lgreen);
+    border-color: var(--p-lgreen)
+}
+
+.color.green {
+    color: white;
+    background-color: var(--p-green);
+    border-color: var(--p-green)
+}
+
+.color.teal {
+    color: white;
+    background-color: var(--p-teal);
+    border-color: var(--p-teal)
+}
+
+.color.cyan {
+    color: white;
+    background-color: var(--p-cyan);
+    border-color: var(--p-cyan)
+}
+
+.color.lblue {
+    color: white;
+    background-color: var(--p-lblue);
+    border-color: var(--p-lblue)
+}
+
+.color.blue {
+    color: white;
+    background-color: var(--p-blue);
+    border-color: var(--p-blue)
+}
+
+span.icon:not(.composing):not([data-counter]):not(.story).status.server_error:after,
+.color.indigo {
+    color: white;
+    background-color: var(--p-indigo);
+    border-color: var(--p-indigo)
+}
+
+.color.dpurple {
+    color: white;
+    background-color: var(--p-dpurple);
+    border-color: var(--p-dpurple)
+}
+
+span.icon:not(.composing):not([data-counter]):not(.story).status.xa:after,
+.color.purple {
+    color: white;
+    background-color: var(--p-purple);
+    border-color: var(--p-purple)
+}
+
+.color.pink {
+    color: white;
+    background-color: var(--p-pink);
+    border-color: var(--p-pink)
+}
+
+span.icon:not(.composing):not([data-counter]):not(.story).status.dnd:after,
+.color.red {
+    color: white;
+    background-color: var(--p-red);
+    border-color: var(--p-red)
+}
+
+.color.black {
+    color: white;
+    background-color: var(--p-black);
+    border-color: var(--p-black)
+}
+
+.color.none {
+    color: white;
+    background-color: transparent;
+}
+
+.color.transparent {
+    color: white;
+    backdrop-filter: blur(1rem);
+    background-color: rgba(0, 0, 0, 0.25);
+}
+
+.color.semi {
+    color: rgba(var(--movim-font), 0.87);
+    background-color: rgba(var(--movim-background-main), 0.75);
+}
+
+form>div>input:focus:invalid,
+form>div>input:focus:required {
+    box-shadow: 0px 2px 0px var(--p-red);
+}
+
+form>div>input:invalid,
+form input:focus:invalid+label,
+form textarea:focus:invalid+label {
+    color: var(--p-red);
+}
+
+ul.list li>div>p:not(:first-of-type):not(.main):not(.brief) {
+    color: rgba(var(--movim-font), 0.6);
+}
+
+ul.list li.color>div>p:not(:first-of-type):not(.main) {
+    color: rgba(255, 255, 255, 0.8);
+}
+
+header.big ul.list li>div>p:not(:first-of-type):not(.main),
+div.snackbar ul.list li>div>p:not(:first-of-type):not(.main) {
+    color: rgb(var(--movim-header-font));
+}
+
+header.big ul.list li>div>p>span.second {
+    color: rgba(var(--movim-header-font), 0.9);
+}
+
+/* Default color : indigo */
+
+input[type=button].color,
+header.big,
+mark,
+main>header {
+    background-color: var(--movim-accent);
+    border-color: var(--movim-accent);
+}
+
+/* Accent color */
+
+.tabs,
+.button,
+header:not(.big) .icon a,
+a {
+    color: var(--movim-accent);
+    border-color: var(--movim-accent);
+}
+
+span.control.icon a > i,
+span.primary.icon a > i {
+    color: rgba(var(--movim-font), 0.68);
+}
+
+a.normal {
+    color: inherit;
+}
+
+form>div .checkbox:before {
+    background-color: var(--movim-accent);
+}
+
+form input:focus:not(:invalid)+label,
+form textarea:focus:not(:invalid)+label {
+    color: var(--movim-accent);
+}
+
+form>div .select:has(:focus),
+form input:focus:not(:invalid):not(.button),
+form textarea:focus:not(:invalid):not(.button) {
+    box-shadow: 0px 2px 0px var(--movim-accent);
+}