@-moz-document url("https://habitica.com/") {
/* ==UserStyle==
@name Helix's Habitica Dark
@version 2.0.2
@description This is a theme for Habitica that changes the UI to something more comfortable to the eye, especially at night. Tested on Chrome, should work on Firefox and Edge.
@author tripplehelix
@license CC-BY-4.0
@namespace https://greasyfork.org/users/697440
==/UserStyle== */
/* colours:
Task Background: #36205D (Habitica Purple)
Fore Text: #fff (White)
Subtle Text: #a5a1ac (Light Grey)
Box Shadows: 0px 0px 5px #00002A
Border Color: #00002A
Highlight Colour: #573496
Habitica Default:
--blue: #007bff;
--indigo: #6610f2;
--purple: #6f42c1;
--pink: #e83e8c;
--red: #dc3545;
--orange: #fd7e14;
--yellow: #ffc107;
--green: #28a745;
--teal: #20c997;
--cyan: #17a2b8;
--white: #fff;
--gray: #6c757d;
--gray-dark: #343a40;
--primary: #007bff;
--secondary: #6c757d;
--success: #28a745;
--info: #17a2b8;
--warning: #ffc107;
--danger: #dc3545;
--light: #f8f9fa;
--dark: #343a40;
*/
* {
color: white !important;
}
body {
background-color: #36205D;
}
:focus {
/* When Item is clicked */
outline: unset;
}
.btn-secondary,
.dropdown > .btn-secondary.dropdown-toggle:not(.btn-success),
.show > .btn-secondary.dropdown-toggle:not(.btn-success) {
/* Buttons */
color: #fff !important;
background-color: #4e4a57;
}
.btn-secondary:not(:disabled):not(.disabled):hover,
.dropdown > .btn-secondary.dropdown-toggle:not(.btn-success):not(:disabled):not(.disabled):hover,
.show > .btn-secondary.dropdown-toggle:not(.btn-success):not(:disabled):not(.disabled):hover {
/* Buttons When Hovered */
color: #fff !important;
background: #4e4a57 !important;
}
/****** Top MENU *****/
.dropdown-item,
.dropdown-item:hover {
/* Drop Down Text Colour */
color: #fff !important;
}
.dropdown .dropdown-menu[data-v-6b6f97f6] .dropdown-separated {
/* User Menu */
border: none;
}
.dropdown.open .dropdown-menu[data-v-6b6f97f6] {
/* Drop Down Menu */
background-color: #271b3d !important;
color: #fff !important;
}
/****** TASK SCREEN ******/
#app-header[data-v-32fb4284] {
/* Party Header */
box-shadow: 0px 0px 5px #00002A;
}
.tasks-navigation {
display: none !important;
/* Hide Tags*/
}
.tasks-list[data-v-a51310ce] {
/* Background of Tasks */
background-color: #36205D;
border: 1px solid #000;
box-shadow: 0px 0px 5px #00002A;
}
.filter[data-v-a51310ce] {
/* Task Filters */
color: #fff;
}
.task-neutral-modal-headings,
.task-neutral-modal-text {
color: #fff !important;
}
.badge-purple {
background-color: #573496;
}
#task-modal input,
#task-modal textarea {
background-color: #36205D;
}
.filter[data-v-a51310ce]:hover {
/* Task Filters Text */
color: #fff !important;
}
.quick-add[data-v-a51310ce],
.quick-add[data-v-a51310ce]:hover {
/* Quick Add Task Box */
border: none;
}
.filter.active[data-v-a51310ce] {
/* Tab Links on Tasks */
color: #fff !important;
border-bottom: 2px solid #fff;
}
.task-content[data-v-02609699] {
/* Background of Individual Tasks */
background-color: #573496;
box-shadow: 0px 0px 5px #00002A;
}
.task-title[data-v-02609699] {
/* Text Colour of Individual Tasks */
color: #fff;
}
.task-best-modal-headings,
.task-best-modal-text {
color: #fff!important;
}
.item[data-v-2ae7992c] {
/* Rewards Background */
background-color: #573496;
}
.price-label.gold[data-v-2ae7992c] {
/* Gold Cost Label */
color: #fff;
}
.modal-body,
#task-modal .advanced-settings {
/* Background of Edit Task */
background-color: #36205D;
}
.input-group:not(.checklist-group) .input-group-append,
.input-group:not(.checklist-group) .input-group-prepend,
.input-group input,
.dropdown-item,
.btn-secondary:not(:disabled):not(.disabled).active,
.btn-secondary:not(:disabled):not(.disabled):active,
.dropdown > .btn-secondary.dropdown-toggle:not(.btn-success):not(:disabled):not(.disabled).active,
.dropdown > .btn-secondary.dropdown-toggle:not(.btn-success):not(:disabled):not(.disabled):active,
.show > .btn-secondary.dropdown-toggle:not(.btn-success):not(:disabled):not(.disabled).active,
.show > .btn-secondary.dropdown-toggle:not(.btn-success):not(:disabled):not(.disabled):active,
.select-multi .dropdown-header,
.btn-secondary:active,
#task-modal input:active:not(:disabled),
#task-modal input:focus:not(:disabled),
#task-modal input:hover:not(:disabled),
#task-modal textarea:active:not(:disabled),
#task-modal textarea:focus:not(:disabled),
#task-modal textarea:hover:not(:disabled) {
/* Drop Down Lists & Input Boxes */
background-color: #4e4a57 !important;
}
.btn-secondary:focus,
.dropdown > .btn-secondary.dropdown-toggle:not(.btn-success):active,
.dropdown > .btn-secondary.dropdown-toggle:not(.btn-success):focus,
.show > .btn-secondary.dropdown-toggle:not(.btn-success):active,
.show > .btn-secondary.dropdown-toggle:not(.btn-success):focus,
.dropdown-item.active,
.dropdown-item:active,
.dropdown-item:focus,
.dropdown-item:hover {
/* Drop Down Lists & Input Boxes Active */
background-color: #6c757d !important;
}
.chat-row textarea {
background-color: #4e4a57 !important;
}
.input-group-spaced {
/* Repeat Label */
background-color: #6133b4;
}
.checklist-component .checklist-group {
/* Checklist Items */
border-bottom: none;
}
.checklist-component .checklist-group:first-of-type,
.checklist-component .top-border {
/* First Checklist Item */
border-top: none;
}
.vdp-datepicker__calendar,
.vdp-datepicker .vdp-datepicker__calendar .datetime-buttons button,
.vdp-datepicker__calendar header .prev:not(.disabled):hover,
.vdp-datepicker__calendar header .next:not(.disabled):hover,
.vdp-datepicker__calendar header .up:not(.disabled):hover,
.toggle-checkbox[data-v-17699435],
.toggle-checkbox[data-v-17699435]:not(.disabled):not(:disabled):not(.checked):hover,
.toggle-checkbox[data-v-17699435]:not(.disabled):not(:disabled):not(.checked):active,
.toggle-checkbox[data-v-17699435]:not(.disabled):not(:disabled):not(.checked):focus {
/* Calendar Selection */
background-color: #36205D;
}
.toggle-checkbox[data-v-17699435] {
/* Select Button */
border: none;
}
.vdp-datepicker .vdp-datepicker__calendar .datetime-buttons,
.vdp-datepicker .vdp-datepicker__calendar header {
/* Calendar Picker Header */
background-color: #6f42c1 !important;
}
/***** PARTY SCREEN *****/
.sidebar[data-v-4052e15e] {
/* Party Sidebar */
box-shadow: 0px 5px 5px #00002A;
background-color: #36205D;
}
.card-body[data-v-4ce44a78] {
/* Chat Card Body*/
background-color: #573496;
box-shadow: 0px 0px 5px #00002A;
}
h1[data-v-4052e15e] {
/* Party Header */
color: #fff;
}
a.leader[data-v-e895429a] {
/* Leader Name */
color: #fff;
}
.item-with-icon[data-v-4052e15e] {
/* Member List Icon */
background-color: unset;
}
.quest-active-section .quest-box[data-v-55afabf7] {
/* Quest Collection Items */
background-image: unset;
}
.card {
/* Remove Bug from Chat Card */
background-color: unset;
margin-bottom: 5px !important;
}
.at-text {
color: #fff;
}
footer {
/* Remove Footer */
display: none;
}
}