Use css for darkmode

This commit is contained in:
cuom1999 2022-12-18 03:31:31 -06:00
parent de875bd384
commit 97a56145b2
62 changed files with 6748 additions and 1034 deletions

View file

@ -234,6 +234,70 @@ ul.problem-list {
.submit-bar {
float: right;
}
#submit-wrapper {
margin-top: 0.7em;
}
#submit-wrapper #editor, #submit-wrapper #language {
margin-top: 4px;
}
#id_language {
width: 100%;
}
#result-version-info {
border-bottom: 1px solid rgb(148, 148, 148);
margin: 0px 1em;
color: #757575;
font-weight: 600;
padding: 0.2em 0;
text-align: right;
}
#language-select2 .select2-results__message {
white-space: nowrap
}
#language-select2.select2-dropdown--above {
display: flex;
flex-direction: column-reverse;
}
#language-select2 .select2-results__option {
color: #757575 !important;
background: white !important;
}
#language-select2 .select2-results__option--highlighted {
text-decoration: underline;
}
#language-select2 .select2-results__option[aria-selected=true] {
font-weight: bold;
color: black !important;
}
#language-select2 .select2-results__option {
padding: 4px 0px;
}
#language-select2 .select2-results__options {
overflow-y: visible !important;
}
#language-select2 .select2-results__option {
break-inside: avoid-column;
}
#language-select2 .select2-results {
-webkit-columns: 10 7em;
-moz-columns: 10 7em;
columns: 10 7em;
padding-left: 1.5em;
padding-top: 0.5em;
}
}
@media (max-width: 550px) {
@ -329,6 +393,40 @@ ul.problem-list {
color: darkblue;
}
.problem-data-form {
.bad-file input, .bad-file .select2-selection {
border-color: red;
}
}
.problem-clarification {
border-bottom: 1px solid #ccc;
margin-top: 1em;
margin-bottom: 1em;
}
#clarification_header {
color: red;
cursor: pointer;
}
#clarification_header:hover {
color: orange;
}
#comment-announcement {
margin-top: 1em;
background-color: lightgray;
border-radius: 30px;
padding: 0.5em;
text-align: center;
cursor: pointer;
color: dimgrey;
font-weight: bold;
}
#comment-announcement:hover {
background-color: gray;
}
@media (max-width: 799px) {
.problem-middle-right {
display: flex;