Dark mode for the CSE website.
UNSW CSE CGI Dark Theme by psharma04
Details
Authorpsharma04
LicenseNo License
Categoryhttps://cgi.cse.unsw.edu.au/
Created
Updated
Size94 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
Userstyle doesn't have notes.Source code
Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link./* ==UserStyle==
@name cgi.cse.unsw.edu.au
@version 20231022.02.53
@namespace ?
==/UserStyle== */
@-moz-document url-prefix("https://cgi.cse.unsw.edu.au/") {
html {
background-color: #181a1b !important;
}
html {
color-scheme: dark !important;
}
html,
body {
background-color: #181a1b;
}
html,
body {
border-color: #736b5e;
color: #e8e6e3;
}
a {
color: #3391ff;
}
table {
border-color: #545b5e;
}
::placeholder {
color: #b2aba1;
}
input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill {
background-color: #404400 !important;
color: #e8e6e3 !important;
}
::selection {
background-color: #004daa !important;
color: #e8e6e3 !important;
}
::-moz-selection {
background-color: #004daa !important;
color: #e8e6e3 !important;
}
/* Invert Style */
.jfk-bubble.gtx-bubble,
.captcheck_answer_label > input + img,
span#closed_text > img[src^="https://www.gstatic.com/images/branding/googlelogo"],
span[data-href^="https://www.hcaptcha.com/"] > #icon,
#bit-notification-bar-iframe,
::-webkit-calendar-picker-indicator {
filter: invert(100%) hue-rotate(180deg) contrast(90%) !important;
}
/* Variables Style */
:root {
--darkmode-neutral-background: #131516;
--darkmode-neutral-text: #d8d4cf;
--darkmode-selection-background: #004daa;
--darkmode-selection-text: #e8e6e3;
}
/* Modified CSS */
:root {
--darkmode-border--blue: #0056b3;
--indigo: #6610f2;
--darkmode-bg--purple: #563298;
--darkmode-border--purple: #4c2c86;
--pink: #e83e8c;
--darkmode-bg--red: #a51d2a;
--darkmode-border--red: #941a25;
--darkmode-bg--orange: #c05802;
--darkmode-border--orange: #ac4f01;
--yellow: #ffc107;
--darkmode-bg--green: #208637;
--darkmode-border--green: #259c40;
--teal: #20c997;
--darkmode-bg--cyan: #128293;
--darkmode-border--cyan: #1597ab;
--darkmode-text--white: #e8e6e3;
--darkmode-text--gray: #9e9689;
--gray-dark: #343a40;
--primary: #007bff;
--secondary: #6c757d;
--success: #28a745;
--info: #17a2b8;
--warning: #ffc107;
--danger: #dc3545;
--light: #f8f9fa;
--dark: #343a40;
--breakpoint-xs: 0;
--breakpoint-sm: 576px;
--breakpoint-md: 768px;
--breakpoint-lg: 992px;
--breakpoint-xl: 1200px;
--font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
--font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New",
monospace;
}
html {
-webkit-tap-highlight-color: transparent;
}
body {
color: rgb(209, 205, 199);
background-color: rgb(24, 26, 27);
}
[tabindex="-1"]:focus:not(:focus-visible) {
outline-color: initial !important;
}
abbr[data-original-title],
abbr[title] {
text-decoration-color: initial;
border-bottom-color: initial;
}
a {
color: rgb(51, 162, 255);
text-decoration-color: initial;
background-color: transparent;
}
a:hover {
color: rgb(97, 183, 255);
text-decoration-color: initial;
}
a:not([href]) {
color: inherit;
text-decoration-color: initial;
}
a:not([href]):hover {
color: inherit;
text-decoration-color: initial;
}
caption {
color: rgb(158, 150, 137);
}
button:focus {
outline-color: rgb(186, 123, 0);
}
fieldset {
border-color: initial;
}
legend {
color: inherit;
}
hr {
border-right-color: initial;
border-bottom-color: initial;
border-left-color: initial;
border-top-color: rgba(140, 130, 115, 0.1);
}
.mark,
mark {
background-color: rgb(47, 40, 5);
}
.list-unstyled {
list-style-image: initial;
}
.list-inline {
list-style-image: initial;
}
.blockquote-footer {
color: rgb(158, 150, 137);
}
.img-thumbnail {
background-color: rgb(24, 26, 27);
border-color: rgb(56, 61, 63);
}
.figure-caption {
color: rgb(158, 150, 137);
}
code {
color: rgb(233, 74, 147);
}
a > code {
color: inherit;
}
kbd {
color: rgb(232, 230, 227);
background-color: rgb(28, 30, 31);
}
pre {
color: rgb(209, 205, 199);
}
pre code {
color: inherit;
}
.table {
color: rgb(209, 205, 199);
}
.table td,
.table th {
border-top-color: rgb(56, 61, 63);
}
.table thead th {
border-bottom-color: rgb(56, 61, 63);
}
.table tbody + tbody {
border-top-color: rgb(56, 61, 63);
}
.table-bordered {
border-color: rgb(56, 61, 63);
}
.table-bordered td,
.table-bordered th {
border-color: rgb(56, 61, 63);
}
.table-borderless tbody + tbody,
.table-borderless td,
.table-borderless th,
.table-borderless thead th {
border-color: initial;
}
.table-striped tbody tr:nth-of-type(2n+1) {
background-color: rgba(0, 0, 0, 0.05);
}
.table-hover tbody tr:hover {
color: rgb(209, 205, 199);
background-color: rgba(0, 0, 0, 0.07);
}
.table-primary,
.table-primary > td,
.table-primary > th {
background-color: rgb(44, 48, 50);
}
.table-primary tbody + tbody,
.table-primary td,
.table-primary th,
.table-primary thead th {
border-color: rgb(0, 68, 142);
}
.table-hover .table-primary:hover {
background-color: rgb(51, 55, 57);
}
.table-hover .table-primary:hover > td,
.table-hover .table-primary:hover > th {
background-color: rgb(51, 55, 57);
}
.table-secondary,
.table-secondary > td,
.table-secondary > th {
background-color: rgb(46, 50, 51);
}
.table-secondary tbody + tbody,
.table-secondary td,
.table-secondary th,
.table-secondary thead th {
border-color: rgb(68, 74, 77);
}
.table-hover .table-secondary:hover {
background-color: rgb(53, 58, 60);
}
.table-hover .table-secondary:hover > td,
.table-hover .table-secondary:hover > th {
background-color: rgb(53, 58, 60);
}
.table-success,
.table-success > td,
.table-success > th {
background-color: rgb(30, 72, 48);
}
.table-success tbody + tbody,
.table-success td,
.table-success th,
.table-success thead th {
border-color: rgb(43, 106, 58);
}
.table-hover .table-success:hover {
background-color: rgb(34, 83, 54);
}
.table-hover .table-success:hover > td,
.table-hover .table-success:hover > th {
background-color: rgb(34, 83, 54);
}
.table-info,
.table-info > td,
.table-info > th {
background-color: rgb(24, 71, 78);
}
.table-info tbody + tbody,
.table-info td,
.table-info th,
.table-info thead th {
border-color: rgb(35, 104, 114);
}
.table-hover .table-info:hover {
background-color: rgb(28, 81, 89);
}
.table-hover .table-info:hover > td,
.table-hover .table-info:hover > th {
background-color: rgb(28, 81, 89);
}
.table-warning,
.table-warning > td,
.table-warning > th {
background-color: rgb(69, 52, 0);
}
.table-warning tbody + tbody,
.table-warning td,
.table-warning th,
.table-warning thead th {
border-color: rgb(141, 106, 0);
}
.table-hover .table-warning:hover {
background-color: rgb(81, 61, 0);
}
.table-hover .table-warning:hover > td,
.table-hover .table-warning:hover > th {
background-color: rgb(81, 61, 0);
}
.table-danger,
.table-danger > td,
.table-danger > th {
background-color: rgb(78, 14, 20);
}
.table-danger tbody + tbody,
.table-danger td,
.table-danger th,
.table-danger thead th {
border-color: rgb(119, 20, 29);
}
.table-hover .table-danger:hover {
background-color: rgb(91, 16, 24);
}
.table-hover .table-danger:hover > td,
.table-hover .table-danger:hover > th {
background-color: rgb(91, 16, 24);
}
.table-light,
.table-light > td,
.table-light > th {
background-color: rgb(25, 27, 28);
}
.table-light tbody + tbody,
.table-light td,
.table-light th,
.table-light thead th {
border-color: rgb(49, 53, 55);
}
.table-hover .table-light:hover {
background-color: rgb(32, 35, 36);
}
.table-hover .table-light:hover > td,
.table-hover .table-light:hover > th {
background-color: rgb(32, 35, 36);
}
.table-dark,
.table-dark > td,
.table-dark > th {
background-color: rgb(55, 60, 62);
}
.table-dark tbody + tbody,
.table-dark td,
.table-dark th,
.table-dark thead th {
border-color: rgb(77, 83, 87);
}
.table-hover .table-dark:hover {
background-color: rgb(62, 67, 70);
}
.table-hover .table-dark:hover > td,
.table-hover .table-dark:hover > th {
background-color: rgb(62, 67, 70);
}
.table-active,
.table-active > td,
.table-active > th {
background-color: rgba(0, 0, 0, 0.07);
}
.table-hover .table-active:hover {
background-color: rgba(0, 0, 0, 0.07);
}
.table-hover .table-active:hover > td,
.table-hover .table-active:hover > th {
background-color: rgba(0, 0, 0, 0.07);
}
.table .thead-dark th {
color: rgb(232, 230, 227);
background-color: rgb(44, 47, 49);
border-color: rgb(115, 106, 94);
}
.table .thead-light th {
color: rgb(181, 175, 166);
background-color: rgb(35, 38, 39);
border-color: rgb(56, 61, 63);
}
.table-dark {
color: rgb(232, 230, 227);
background-color: rgb(44, 47, 49);
}
.table-dark td,
.table-dark th,
.table-dark thead th {
border-color: rgb(115, 106, 94);
}
.table-dark.table-bordered {
border-color: initial;
}
.table-dark.table-striped tbody tr:nth-of-type(2n+1) {
background-color: rgba(24, 26, 27, 0.05);
}
.table-dark.table-hover tbody tr:hover {
color: rgb(232, 230, 227);
background-color: rgba(24, 26, 27, 0.07);
}
@media (max-width: 575.98px) {
.table-responsive-sm > .table-bordered {
border-color: initial;
}
}
@media (max-width: 767.98px) {
.table-responsive-md > .table-bordered {
border-color: initial;
}
}
@media (max-width: 991.98px) {
.tab...