forum update and fixes

.history/wikidot-advance_20240215195927.wd

@@ -0,0 +1,88 @@
+[[module css]]
+@import url('https://arknights.wikidot.com/component:fonts-srcs-2/code/1');
+[[/module]]
+[[module css]]
+div.wrong-demo,div.correct-demo {
+    --accent: 228, 93, 93;
+    margin: .5rem;
+    padding:0;
+    color: var(--scale-2);
+    background-color: rgb(var(--accent),.5);
+    border: 2px solid rgb(var(--accent));
+    position: relative;
+
+    display: grid;
+    grid-auto-columns: 1fr;
+    grid-auto-rows: 1fr;
+    grid-template-columns: 1fr;
+    grid-template-rows: auto 1fr;
+    gap: 0;
+    grid-template-areas:
+      "bar-title"
+      "bar-content";
+}
+div.correct-demo, div.correct-demo .bar-title,div.correct-demo::before {
+    --accent: 33,58,142;
+}
+:is(div.wrong-demo,div.correct-demo) > .bar-title {
+    display: inline-flex;
+    align-items: center;
+    height: fit-content;
+    padding: .25rem 0;
+    font-size: 1.15rem;
+    text-indent: 2rem;
+    letter-spacing: -.05rem;
+    font-weight: 900;
+    font-family: var(--title-font);
+    color: var(--scale-1);
+    background-color: rgb(var(--accent),.6);
+    padding-left: .5rem;
+}
+div.correct-demo .bar-title p, div.correct-demo .bar-content :is(ul,p) {
+    color: rgb(var(--scale-7-sub));
+}
+:is(.bar-title,.bar-content) p {
+    margin-block-start: 0;
+    margin-block-end: 0;
+}
+:is(div.wrong-demo,div.correct-demo) > .bar-content {
+    padding: .5rem
+}
+:is(div.wrong-demo,div.correct-demo) > .bar-content p:not(a) {
+    text-indent: 2rem;
+}
+:is(div.wrong-demo,div.correct-demo)::before {
+    content: "X";
+    display: inline-flex;
+    width: 1.5rem;
+    height: 1.5rem;
+    font-size: 1.25rem;
+    position: absolute;
+    padding:.35rem .25rem .15rem;
+    top: 0;
+    left: 0;
+    font-family: 'Kings_Gambit', serif;
+    background-color: rgb(var(--accent));
+    justify-content: center;
+    align-items: center;
+}
+div.correct-demo::before {
+    content: "√";
+    color:rgb(var(--scale-7-sub))
+}
+div.correct-demo a {
+    color: rgb(var(--secondary-accent))
+}
+div.correct-demo a.footnoteref {
+    -webkit-text-stroke: .5px rgb(var(--secondary-accent));
+}
+div.correct-demo a.footnoteref:hover {
+    mix-blend-mode: lighten
+}
+[[/module]]
+[[div class="wrong-demo"]]
+[[div class="bar-title"]]
+[[/div]]
+[[div class="bar-content"]]
+[[/div]]
+[[/div]]

component/forum.css

@@ -89,11 +89,11 @@
 #new-thread-form > table.form {
     grid-area: title;
 }
-table.form td div.sub, form div.sub {
+form#new-thread-form div.sub div.sub {
     font-size: 80%;
-    color: #777;
+    color: #444;
     margin-left: 0.5rem;
-    margin-top: -1.5rem;
+    margin-top: 0rem;
     text-align: left;
 }
 #new-thread-form > div:nth-child(4) {
@@ -133,7 +133,112 @@ table.form td div.sub, form div.sub {
     grid-area: buttons-center;
     text-align: center;
 }
-
+.thread-container .post .long .changes {
+    color: rgb(var(--plain-secondary-color));
+}
+.thread-container .post .long .changes > span.odate:after {
+    content: " ;";
+}
+.thread-container .post .long .revisions:not([style*="none"]) {
+    display: grid !important;
+    grid-auto-columns: 1fr;
+    grid-auto-rows: 1fr;
+    grid-template-columns: 1fr;
+    grid-template-rows: 1em 0 1fr;
+    gap: 2px 1px;
+    grid-template-areas:
+        "history-toggle"
+        "history-title"
+        "post-history";
+    max-width: min(100vw,30rem);
+    margin: 0 0 0 auto;
+}
+.thread-container .post .long .changes a,.thread-container .post .long .revisions a {
+    color: rgb(var(--lowlight-secondary-color));
+    border-bottom: none;
+}
+.thread-container .post .long .changes a:hover,.thread-container .post .long .revisions a:hover {
+    color: rgb(var(--lowlight-primary-color));
+}
+a[onclick*="showHistory"] {
+    position: relative;
+    padding: 2px;
+}
+a[onclick*="hideHistory"] {
+    position: relative;
+    display: inline-flex;
+    grid-area: history-toggle;
+    height: fit-content;
+    width: fit-content;
+    padding: 2px;
+    transform: translate(3px,-7px);
+    margin: 0 0 0 auto;
+}
+:is(a[onclick*="hideHistory"],a[onclick*="showHistory"]):after {
+    z-index: -1;
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    content: "";
+    width: 101%;
+    height: 100%;
+    background: rgb(var(--plain-secondary-color));
+    box-shadow: 0 0 1px 1px rgb(var(--plain-third-color));
+    transform: scaleX(0);
+    transform-origin: right top;
+    transition: transform .3s;
+}
+:is(a[onclick*="hideHistory"],a[onclick*="showHistory"]):hover {
+    color: rgb(var(--scale-7-sub)) !important
+}
+:is(a[onclick*="hideHistory"],a[onclick*="showHistory"]):hover:after {
+    transform-origin: left top;
+    transform: scale(1);
+}
+.thread-container .post .long .revisions .title {
+    z-index:1;
+    grid-area: post-history/history-toggle;
+    padding: 0;
+    display: flex;
+    justify-content: center;
+    background: rgb(var(--dark-primary-color));
+    color: rgb(var(--scale-8));
+    box-shadow: 2px 0 0 2px rgb(var(--dark-primary-color)), -2px 0 0 2px rgb(var(--dark-primary-color)),0 0 3px 2px rgb(var(--dark-primary-color));
+}
+.thread-container .post .long .revisions table {
+    z-index: 2;
+    border-spacing: 0 2px;
+    grid-area: post-history;
+    width: 100%;
+    margin-top: calc(1rem + 6px);
+}
+.thread-container .post .long .revisions td {
+    position:relative;
+    background-color: #fff;
+    box-shadow: 0px 0 3px 0px white;
+    padding: 1px 2px;
+    transition: background-color .2s var(--moderato-curve);
+}
+.thread-container .post .long .revisions td:after {
+    position: absolute;
+    bottom: -1px;
+    left: -1px;
+    content: "";
+    width: 101%;
+    height: 2px;
+    background: rgb(var(--plain-third-color));
+    transform: scaleX(0);
+    transform-origin: right top;
+    transition: transform .3s;
+}
+.thread-container .post .long .revisions td:hover:after {
+    transform-origin: left top;
+    transform: scale(1);
+}
+.thread-container .post .long .revisions table tr.active td {
+    background-color: rgb(var(--bright-secondary-color));
+    border: 1px solid rgb(var(--bright-secondary-color));
+}
 /* OWINDOW */
 #new-thread-form > table > tbody > tr:nth-child(1) > td:nth-child(1), #new-thread-form > table > tbody > tr:nth-child(2) > td:nth-child(1) {
     width: 6em;

component/miscellus.css

@@ -1295,13 +1295,19 @@ select {
     -webkit-transition: all .2s var(--standard-curve);
     transition: all .2s var(--standard-curve)
 }
-select:is(:focus-within,:focus-visible) {
-    border: none;
+select:is(:focus-within,:focus-visible),input:is(:focus-within,:focus-visible) {
     background-color: rgb(var(--scale-8));
     box-shadow: 0 0 0 2px rgb(var(--focus-border),1);
     -webkit-transition: all .2s var(--standard-curve);
     transition: all .2s var(--standard-curve)
 }
+input.text {
+    border: 1px solid rgb(var(--scale-2));
+    margin: 0;
+    padding: 2px;
+    background-color: rgb(var(--scale-8));
+    color: rgb(var(--plain-primary-color));
+}
 .changes-list-item table {
     width: -webkit-fill-available;
 }

component/popups.css

@@ -290,6 +290,10 @@ a.btn.btn-default.button.button-no\,-cancel:before {
 a.btn.btn-default.button.button-yes\,-delete:before {
     content: var(--yes-delete-txt)
 }
+a.btn.btn-primary[onclick*=forcePageEditLockRemove],a#edit-recheck-lock {
+    width: fit-content;
+    width: -webkit-fit-content;
+}
 input#selectLink {
     color: transparent !important;
 }
@@ -528,7 +532,7 @@ form#edit-page-form table.form:first-of-type td:last-of-type input {
     border: none;
     outline: 0 solid #000;
     background-color: rgb(var(--scale-8));
-    box-shadow: 0 0 0 3px transparent;
+    box-shadow: 0 0 0 2px rgb(var(--focus-border),1);
     font-weight: var(--wght);
     transition: box-shadow .2s var(--standard-curve),color .15s var(--standard-curve),background-color .15s var(--standard-curve),transform .2s var(--standard-curve),font-weight .2s var(--standard-curve),font-variation-settings .2s var(--standard-curve);
     will-change: box-shadow,color,background-color,transform,font-weight,font-variation-settings;
@@ -544,23 +548,14 @@ form#edit-page-form table.form:first-of-type tr:focus-within td:first-of-type {
     z-index: -1;
     padding: 2px;
 }
-form#edit-page-form table.form:first-of-type td:last-of-type input:focus-within {
-    --wght: 500;
-    border: none;
-    outline: 0 solid rgb(var(--focus-border),1);
-    background-color: rgb(var(--scale-8));
-    box-shadow: 0 0 0 2px rgb(var(--focus-border),1);
-    font-weight: var(--wght);
-}
-form#edit-page-form table.form:first-of-type td:last-of-type input:focus-visible {
+form#edit-page-form table.form:first-of-type td:last-of-type input:focus-within,form#edit-page-form table.form:first-of-type td:last-of-type input:focus-visible {
     --wght: 500;
     border: none;
     outline: 0 solid rgb(var(--focus-border),1);
     background-color: rgb(var(--scale-8));
     box-shadow: 0 0 0 3px rgb(var(--focus-border),1);
     font-weight: var(--wght);
 }
-
 form#edit-page-form #wd-editor-toolbar-panel+div {
     position: relative;
     grid-area: editbox;
@@ -611,8 +606,7 @@ form#edit-page-form .edit-page-bottomtable div.sub {
     z-index: 5;
     grid-area: descsub;
     height: 1rem;
-    margin: -1.5em 1rem 0 0;
-    padding: 0 1.25em 0 0;
+    margin: -1.5em 0 0 0;
     font-size: .8em;
     text-align: right;
 }
@@ -655,20 +649,20 @@ form#edit-page-form .edit-page-bottomtable tr>td:first-of-type>div:first-of-type
     height: 100%;
     min-height: 5rem;
     margin: -1.325em auto 0;
-    padding: .75em 0;
+    padding: .25rem;
     outline: 0 solid rgb(var(--focus-border),1);
-    box-shadow: 0 0 0 0 rgb(var(--focus-border),1);
+    box-shadow: 0 0 0 1.5px rgb(var(--focus-border),1);
     color: #333;
     font-weight: var(--wght);
     resize: none;
     transition: box-shadow .2s var(--standard-curve),background-color .15s var(--standard-curve);
     will-change: box-shadow, background-color;
 }
-form#edit-page-form .edit-page-bottomtable tr>td:first-of-type>div:first-of-type:focus-within textarea {
+form#edit-page-form .edit-page-bottomtable tr>td:first-of-type>div:first-of-type:focus-within textarea,form#edit-page-form .edit-page-bottomtable tr>td:first-of-type>div:first-of-type:focus-visible textarea {
     border: none;
     outline: 0 solid rgb(var(--focus-border),1);
     background-color: rgb(252, 252, 252, 1);
-    box-shadow: 0 0 0 .125rem rgb(var(--focus-border),1);
+    box-shadow: 0 0 0 2.5px rgb(var(--focus-border),1);
     color: #111;
 }
 form#edit-page-form:not(.data-form)>table, form#edit-page-form:not(.data-form)>table tbody, form#edit-page-form:not(.data-form)>table tr, form#edit-page-form:not(.data-form)>table:not(.form) td {
@@ -683,7 +677,8 @@ form#edit-page-form #lock-info {
     text-align: center;
     background-color: rgb(var(--scale-8));
     padding: 0.5em 1em;
-    font-family: 'Noto Serif SC';
+    box-shadow: 0 0 2.5px rgb(var(--scale-0));
+    font-family: var(--Serif-font);
     color:rgb(var(--scale-0));
     text-shadow: none;
     font-weight: 600;
@@ -1246,9 +1241,20 @@ img#wd-ed-imagewizard-byfile-preview {
     content:var(--img-size-txt);
     font-size: .85rem
 }
-div#wd-ed-imagewizard-checkresult ~ table.form input {
+div#wd-ed-imagewizard-checkresult ~ table.form input,input#wd-ed-imagewizard-flickr {
     max-width: max(25vw,10rem);
 }
+div#wd-ed-imagewizard-checkresult p[style*=red] {
+    font-size: 0;
+}
+div#wd-ed-imagewizard-checkresult p[style*=red]:before {
+    content: var(--img-check-txt);
+    font-size: 0.8rem;
+    line-height: 130%;
+    display: flex;
+    margin-block-start: 1em;
+    margin-block-end: 1em;
+}
 div#rename-option-delete p {
     font-size:0;
 }
@@ -1333,7 +1339,7 @@ div#owindow-1[style*="width: 60em;"]:not([class*="info"]) .content.modal-body td
     margin: 10px;
     background-repeat: no-repeat;
     background-position: bottom center;
-    background-image: none !important; 
+    background-image: none !important;
 }
 #owindow-1 > div {
     padding: 1rem 2rem !important;
@@ -1365,6 +1371,23 @@ div#odialog-container > .owindow.osuccess > .content.modal-body::before {
     display: inline-flex;
     justify-content: center;
 }
+div#owindow-1.owindow > div.content.modal-body:has(p:only-child):not(:has(table,form)) > p {
+    font-size:0
+}
+div#owindow-1.owindow > div.content.modal-body:has(p:only-child):not(:has(table,form)) > p:before {
+    content: var(--draft-options-txt);
+    display: block;
+    font-size: 0.8rem;
+    margin-block-start: 1em;
+    margin-block-end: 1em;
+    line-height: 130%;
+}
+.button-bar.modal-fotoer {
+    font-size: 0;
+}
+.button-bar.modal-fotoer a {
+    font-size: 0.8rem;
+}
 .owindow.owait .content::after {
    content: " ";
    display: block;