khub style based off of the catppuccin color palette
not even close to finished but it succeeds in its goal of not singing my eyes out whenever im trying to do acads
Authortapilyoca
LicenseNo License
Categorykhub.mc.pshs.edu.ph
Created
Updated
Size7.6 kB
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
khub style based off of the catppuccin color palette
not even close to finished but it succeeds in its goal of not singing my eyes out whenever im trying to do acads
/* ==UserStyle==
@name khub.mc.pshs.edu.ph - 12/13/2022, 8:58:04 PM
@namespace github.com/openstyles/stylus
@version 1.0.0
@description A new userstyle
@author Me
==/UserStyle== */
@-moz-document domain("khub.mc.pshs.edu.ph") {
:root {
--main-text: #c5cff5;
--main-text-accent: #f5c5f5;
--main-text-accent2: #c5f5d3;
--main-text-dark: #3c3f4b;
--main-bg-dark: #181825;
--main-bg-darker: #0c0c14;
--main-bg: #1e1e32;
--main-bg-transparent: #1e1e32aa;
--blue: #8aadf4;
--red: #fa74b2;
}
body {
font-family: Roboto Mono;
background-color: var(--main-bg-darker) !important;
color: var(--main-text);
}
a {
color: var(--blue) !important;
}
.d-inline {
color: var(--main-text-accent2) !important;
margin-bottom: 40px !important;
}
#page.drawers .main-inner {
background-color: var(--main-bg-darker) !important;
}
.card {
background-color: var(--main-bg) !important;
}
.bg-white,
.bars,
#accessibilitybar {
background-color: var(--main-bg-darker) !important;
}
.navbar-light .navbar-nav .show > .nav-link,
.navbar-light .navbar-nav .active > .nav-link,
.navbar-light .navbar-nav .nav-link.show,
.navbar-light .navbar-nav .nav-link.active {
color: var(--main-text);
}
.primary-navigation .navigation .nav-link {
color: #3c3f4b;
}
.nav-link:hover {
background-color: var(--main-bg) !important;
color: var(--main-text) !important;
}
.form-control {
background-color: var(--main-bg-darker)!important;
color: var(--main-text) !important;
border: unset !important;
}
.card-title {
color: var(--main-text-accent) !important;
}
.list-group,
.list-group-flush {
background-color: var(--main-bg-dark) !important;
padding-top: 10px !important;
}
.list-group-flush {
border-radius: 5px !important;
}
.d-flex,
.flex-wrap,
.pb-1,
.pt-2 {
background-color: var(--main-bg-dark) !important;
}
.pt-2 {
border-bottom: unset !important;
}
.btn {
color: var(--main-text-accent) !important;
border: 1px solid var(--main-text-accent) !important;
background-color: var(--main-bg) !important;
}
.paging-bar-container {
padding: 10px !important;
border-radius: 5px !important;
}
#instance-10264-header {
padding: 10px !important;
margin-bottom: unset !important;
position: relative !important;
top: 18px !important;
}
.d-none:hover,
.day:hover {
background-color: var(--main-bg-dark) !important;
transition: 0.1s !important;
}
th,
td {
border: 2px solid var(--main-text-accent) !important;
color: var(--main-text) !important;
}
.card {
border: 2px solid var(--main-text-accent) !important;
}
.dashboard-card > .card-body {
background-color: var(--main-bg-dark) !important;
}
h1.h2 {
position: relative;
top: 10px !important;
margin: 0 auto !important;
}
.page-item,
.page-link {
background-color: var(--main-bg-dark) !important;
border: unset !important;
}
.page-link {
border: 2px solid var(--main-text-dark) !important;
}
#yui_3_17_2_1_1671025504706_32 {
background-color: var(--main-bg) !important;
}
#loginbtn {
background-color: var(--main-bg-dark) !important;
}
.alert-danger {
background-color: var(--main-bg-dark) !important;
color: var(--red) !important;
}
#region-main {
background-color: var(--main-bg-darker) !important;
}
.activity-header {
background-color: var(--main-bg-dark) !important;
}
.submissionstatustable > h3 {
color: var(--main-text-accent) !important;
}
.loginform {
background-color: var(--main-bg-darker) !important;
}
.card-footer {
background-color: var(--main-bg-dark) !important;
}
#yui_3_17_2_1_1673083940582_30 {
background-color: var(--main-text-accent) !important;
}
#page-footer {
background-color: var(--main-bg-dark) !important;
}
.content {
background-color: var(--main-bg-dark) !important;
padding: 10px !important;
border-radius: 5px !important;
}
#section-0 {
background-color: var(--main-bg-darker) !important;
}
.tile {
box-shadow: none !important;
border-color: var(--main-text) !important;
}
.tile-bg {
background-color: var(--main-bg-dark) !important;
z-index: -100 !important;
box-shadow: none !important;
}
.tile-textinner > h3 {
color: var(--main-text-accent2) !important;
}
.section {
background-color: var(--main-bg-darker) !important;
}
.progress-indic {
color: var(--main-text-accent) !important;
}
h1.h2 {
color: var(--main-text-accent) !important;
}
.subtile {
background-color: var(--main-bg-dark) !important;
border: none !important;
border-top: 5px solid var(--main-text-accent) !important;
}
.sectiontitle > h2 {
color: var(--main-text-accent) !important;
}
.sectiontitle {
border: none !Important;
}
.formulation {
color: var(--main-text) !important;
background-color: var(--main-bg) !important;
}
.info {
background-color: var(--main-bg) !important;
color: var(--main-text-accent2) !important;
border: unset !important;
}
.form-inline > label {
color: var(--main-text-accent) !important;
}
#quiz-timer {
background-color: var(--main-bg-dark) !important;
border-color: var(--main-text-accent) !important;
}
.cell {
background-color: var(--main-bg-dark) !important;
border-color: var(--main-text-dark) !important;
}
.flex-fill, .answernumber {
background-color: var(--main-bg) !important;
}
.flex-fill {
margin: unset !important;
padding-left: 5px !important;
}
label > .btn {
background-color: var(--main-bg-darker) !important;
margin-bottom: 5px !important;
}
h1.h2 {
margin-bottom: 10px !important;
}
.mod_quiz-prev-nav {
color: var(--main-text-accent) !important;
}
.mod_quiz-next-nav {
color: var(--main-text-accent2) !important;
}
.closebutton {
color: var(--main-text-accent) !important
}
.moodle-dialogue-hd {
color: var(--main-text-accent2) !important;
background-color: var(--main-bg-dark) !important;
border-color: var(--main-text-accent2) !important;
}
#id_yuiconfirmyes-yui_3_17_2_2_1673919985214_7{
margin: 5px !important;
}
.moodle-dialogue-bd{
background-color: var(--main-bg) !important;
border-color: var(--main-text-accent) !important;
}
.drawer{
background-color: var(--main-bg-darker) !important;
}
#yui_3_17_2_1_1674015103744_300{
border-color: var(--main-text-dark) !important;
}
.qnbutton{
background-color: var(--main-bg-dark) !important;
}
}