/* ==UserStyle==
@name PythonAnywhere Catppuccin
@namespace github.com/catppuccin/userstyles/styles/pythonanywhere
@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/pythonanywhere
@version 0.0.1
@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/pythonanywhere/catppuccin.user.css
@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Apythonanywhere
@description Soothing pastel theme for PythonAnywhere
@author Catppuccin
@license MIT
@preprocessor less
@var select lightFlavor "Light Flavor" ["latte:Latte*", "frappe:Frappé", "macchiato:Macchiato", "mocha:Mocha"]
@var select darkFlavor "Dark Flavor" ["latte:Latte", "frappe:Frappé", "macchiato:Macchiato", "mocha:Mocha*"]
@var select accentColor "Accent" ["rosewater:Rosewater", "flamingo:Flamingo", "pink:Pink", "mauve:Mauve*", "red:Red", "maroon:Maroon", "peach:Peach", "yellow:Yellow", "green:Green", "teal:Teal", "blue:Blue", "sapphire:Sapphire", "sky:Sky", "lavender:Lavender", "subtext0:Gray"]
==/UserStyle== */
@-moz-document domain('www.pythonanywhere.com'), domain('eu.pythonanywhere.com'), domain('blog.pythonanywhere.com') {
@import url("https://python.catppuccin.com/pygments/catppuccin-variables.important.css");
@import (css)
url("https://chroma.catppuccin.com/@{lightFlavor}-chroma-style.css")
(prefers-color-scheme: light);
@import (css)
url("https://chroma.catppuccin.com/@{darkFlavor}-chroma-style.css")
(prefers-color-scheme: dark);
@media (prefers-color-scheme: light) {
:root {
#catppuccin(@lightFlavor, @accentColor);
}
}
@media (prefers-color-scheme: dark) {
:root {
#catppuccin(@darkFlavor, @accentColor);
}
}
#catppuccin(@lookup, @accent) {
@rosewater: @catppuccin[@@lookup][@rosewater];
@flamingo: @catppuccin[@@lookup][@flamingo];
@pink: @catppuccin[@@lookup][@pink];
@mauve: @catppuccin[@@lookup][@mauve];
@red: @catppuccin[@@lookup][@red];
@red-filter: @catppuccin[@@lookup][@red-filter];
@maroon: @catppuccin[@@lookup][@maroon];
@peach: @catppuccin[@@lookup][@peach];
@yellow: @catppuccin[@@lookup][@yellow];
@green: @catppuccin[@@lookup][@green];
@green-filter: @catppuccin[@@lookup][@green-filter];
@teal: @catppuccin[@@lookup][@teal];
@sky: @catppuccin[@@lookup][@sky];
@sapphire: @catppuccin[@@lookup][@sapphire];
@blue: @catppuccin[@@lookup][@blue];
@lavender: @catppuccin[@@lookup][@lavender];
@text: @catppuccin[@@lookup][@text];
@text-filter: @catppuccin[@@lookup][@text-filter];
@subtext1: @catppuccin[@@lookup][@subtext1];
@subtext0: @catppuccin[@@lookup][@subtext0];
@overlay2: @catppuccin[@@lookup][@overlay2];
@overlay1: @catppuccin[@@lookup][@overlay1];
@overlay0: @catppuccin[@@lookup][@overlay0];
@surface2: @catppuccin[@@lookup][@surface2];
@surface1: @catppuccin[@@lookup][@surface1];
@surface0: @catppuccin[@@lookup][@surface0];
@base: @catppuccin[@@lookup][@base];
@mantle: @catppuccin[@@lookup][@mantle];
@crust: @catppuccin[@@lookup][@crust];
@accent-color: @catppuccin[@@lookup][@@accent];
--ctp-rosewater: @rosewater;
--ctp-flamingo: @flamingo;
--ctp-pink: @pink;
--ctp-mauve: @mauve;
--ctp-red: @red;
--ctp-maroon: @maroon;
--ctp-peach: @peach;
--ctp-yellow: @yellow;
--ctp-green: @green;
--ctp-teal: @teal;
--ctp-sky: @sky;
--ctp-sapphire: @sapphire;
--ctp-blue: @blue;
--ctp-lavender: @lavender;
--ctp-text: @text;
--ctp-subtext1: @subtext1;
--ctp-subtext0: @subtext0;
--ctp-overlay2: @overlay2;
--ctp-overlay1: @overlay1;
--ctp-overlay0: @overlay0;
--ctp-surface2: @surface2;
--ctp-surface1: @surface1;
--ctp-surface0: @surface0;
--ctp-base: @base;
--ctp-mantle: @mantle;
--ctp-crust: @crust;
color-scheme: if(@lookup = latte, light, dark);
::selection {
background-color: fade(@accent-color, 30%);
}
input,
textarea {
&::placeholder {
color: @subtext0;
}
}
/* Ace file editor */
.ace_editor {
background-color: @crust;
color: @text;
.ace_gutter,
.ace_gutter-cell {
background: @mantle;
color: @overlay1;
}
.ace_print-margin {
background: @mantle;
}
.ace_marker-layer {
.ace_active-line {
background-color: fade(@yellow, 20%);
}
.highlight-line-error {
background-color: fade(@red, 20%);
}
.ace_bracket {
border-color: @overlay1;
}
}
.ace_doctype {
color: @mauve;
}
.ace_cursor,
.ace_xml.ace_text {
color: @text;
}
.ace_heading {
&.ace_1,
&.ace_1 + .ace_heading {
color: @red;
}
&.ace_2,
&.ace_2 + .ace_heading {
color: @peach;
}
&.ace_3,
&.ace_3 + .ace_heading {
color: @yellow;
}
&.ace_4,
&.ace_4 + .ace_heading {
color: @green;
}
&.ace_5,
&.ace_5 + .ace_heading {
color: @blue;
}
&.ace_6,
&.ace_6 + .ace_heading {
color: @mauve;
}
}
.ace_list {
color: @text;
&.ace_markup {
color: @sky;
}
}
.ace_marker-layer .ace_selection {
background: fade(@accent-color, 30%);
}
.ace_fold {
background-color: @surface0;
border-color: @surface1;
}
.ace_constant.ace_language,
.ace_keyword,
.ace_meta {
color: @mauve;
}
.ace_xml,
.ace_support.ace_class,
.ace_support.ace_type {
color: @yellow;
}
.ace_line .ace_identifier:not(:first-of-type),
.ace_entity.ace_name.ace_function,
.ace_constant {
color: @blue;
}
.ace_paren,
.ace_variable.ace_language {
color: @red;
}
.ace_constant.ace_numeric {
color: @peach;
}
.ace_entity.ace_other.ace_attribute-name,
.ace_support.ace_constant,
.ace_support.ace_function {
color: @teal;
}
.ace_entity.ace_name.ace_tag,
.ace_variable {
color: @blue;
}
.ace_storage {
color: @peach;
}
.ace_string {
color: @green;
}
.ace_comment {
color: @overlay2;
}
.ace_indent-guide {
@svg: escape(
''
);
background-image: url("data:image/svg+xml;utf8,@{svg}");
}
}
.ace_tooltip {
background-color: @crust;
color: @text;
border-color: @surface0;
}
#ace_settingsmenu {
background-color: @mantle;
box-shadow: none;
color: @subtext0;
}
#kbshortcutmenu {
background-color: @mantle;
box-shadow: none;
.ace_optionsMenuEntry {
&:hover,
&:focus {
background-color: @base;
}
}
&,
.ace_optionsMenuCommand {
color: @subtext0;
}
.ace_optionsMenuKey {
color: @accent-color;
}
}
/* Console */
x-screen {
background-color: @base !important;
color: @text !important;
}
.cursor-node {
border-color: @accent-color !important;
&[focus="true"] {
background-color: @accent-color !important;
}
}
/* $ prompt character */
[style*="color: rgb(0, 186, 19);"] {
color: @green !important;
}
/* ANSI colors */
x-row span {
/* Black & Bright Black */
&[style^="color: rgb(0, 0, 0);"] {
color: if(@lookup = latte, @subtext1, @surface1) !important;
}
&[style*="background-color: rgb(0, 0, 0);"] {
background-color: if(@lookup = latte, @subtext1, @surface1) !important;
}
&[style^="color: rgb(85, 87, 83);"] {
color: if(@lookup = latte, @subtext1, @surface2) !important;
}
&[style*="background-color: rgb(85, 87, 83);"] {
background-color: if(@lookup = latte, @subtext1, @surface2) !important;
}
/* Red and Bright Red */
&[style^="color: rgb(204, 0, 0);"],
&[style^="color: rgb(239, 41, 41);"] {
color: @red !important;
}
&[style*="background-color: rgb(204, 0, 0);"],
&[style*="background-color: rgb(239, 41, 41);"] {
background-color: @red !important;
}
/* Dim Red */
&[style^="color: rgb(136, 0, 0);"] {
color: fade(@red, 80%) !important;
}
/* Green and Bright Green */
&[style^="color: rgb(78, 154, 6);"],
&[style^="color: rgb(0, 186, 19);"] {
color: @green !important;
}
&[style*="background-color: rgb(78, 154, 6);"],
&[style*="background-color: rgb(0, 186, 19);"] {
background-color: @green !important;
}
/* Dim Green */
&[style^="color: rgb(52, 103, 4);"] {
color: fade(@green, 80%) !important;
}
/* Yellow and Bright Yellow */
&[style^="color: rgb(196, 160, 0);"],
&[style^="color: rgb(252, 233, 79);"] {
color: @yellow !important;
}
&[style*="background-color: rgb(196, 160, 0);"],
&[style*="background-color: rgb(252, 233, 79);"] {
background-color: @yellow !important;
}
/* Dim Yellow */
&[style^="color: rgb(131, 107, 0);"] {
color: fade(@yellow, 80%) !important;
}
/* Blue and Bright Blue */
&[style^="color: rgb(52, 101, 164);"],
&[style^="color: rgb(114, 159, 207);"] {
color: @blue !important;
}
&[style*="background-color: rgb(52, 101, 164);"],
&[style*="background-color: rgb(114, 159, 207);"] {
background-color: @blue !important;
}
/* Dim Blue */
&[style^="color: rgb(35, 67, 109);"] {
color: fade(@blue, 80%) !important;
}
/* Pink and Bright Pink */
&[style^="color: rgb(117, 80, 123);"],
&[style^="color: rgb(242, 0, 203);"] {
color: @pink !important;
}
&[style*="background-color: rgb(117, 80, 123);"],
&[style*="background-color: rgb(242, 0, 203);"] {
background-color: @pink !important;
}
/* Dim Pink */
&[style^="color: rgb(78, 53, 82);"] {
color: fade(@pink, 80%) !important;
}
/* Teal and Bright Teal */
&[style^="color: rgb(6, 152, 154);"],
&[style^="color: rgb(0, 181, 189);"] {
color: @teal !important;
}
&[style*="background-color: rgb(6, 152, 154);"],
&[style*="background-color: rgb(0, 181, 189);"] {
background-color: @teal !important;
}
/* Dim Teal */
&[style^="color: rgb(4, 101, 103);"] {
color: fade(@teal, 80%) !important;
}
/* White */
&[style^="color: rgb(211, 215, 207);"] {
color: if(@lookup = latte, @surface2, @subtext1) !important;
}
&[style*="background-color: rgb(211, 215, 207);"] {
background-color: if(@lookup = latte, @surface2, @subtext1) !important;
}
/* Bright White */
&[style^="color: rgb(238, 238, 236);"] {
color: if(@lookup = latte, @surface1, @subtext0) !important;
}
&[style*="background-color: rgb(238, 238, 236);"] {
background-color: if(@lookup = latte, @surface1, @subtext0) !important;
}
/* Dim White */
&[style^="color: rgb(141, 143, 138);"] {
color: fade(if(@lookup = latte, @surface2, @subtext1), 80%) !important;
}
}
#terminal div {
&[style*="color: rgb(16, 16, 16);"] {
color: @text !important;
}
&[style*="background-color: rgb(240, 240, 240);"] {
background-color: @crust !important;
}
}
body,
.dark {
background-color: @base;
color: @text;
}
a {
&,
&:hover,
&:focus {
color: @accent-color;
}
}
hr,
pre {
border-color: @surface0;
}
small,
.small {
color: @subtext0;
}
input,
button:not(.close, [class*="btn"], [data-toggle="dropdown"]) {
background-color: @crust;
border-color: @surface0;
&:hover,
&:focus {
background-color: @mantle;
}
i.glyphicon {
pointer-events: none;
}
}
blockquote {
border-color: @surface0;
footer,
small,
.small {
color: @subtext0;
}
}
.footer p {
color: @text;
}
.gsc-modal-background-image {
background-color: @base;
}
.gsc-results-wrapper-overlay {
background-color: @mantle;
color: @subtext0;
}
input.gsc-input,
.gsc-input-box,
.gsc-input-box-hover,
.gsc-input-box-focus {
border-color: @surface0;
}
.gsc-completion-container {
background-color: @crust;
border-color: @surface0;
}
.gsc-completion-selected {
background-color: @mantle;
}
input.gsc-input {
background-color: @mantle;
}
.gsc-input-box,
.gsc-results {
background-color: @mantle;
}
.gsc-option-menu-item-highlighted {
background-color: @base;
color: @text;
}
.gsc-selected-option-container {
background-color: @crust;
color: @text;
border-color: @surface0;
}
.gsc-webResult.gsc-result {
border-color: @surface0;
background-color: @mantle;
}
.gsc-search-button-v2 {
&,
&:hover,
&:focus {
border-color: @surface0;
background-color: @crust;
color: @text;
}
svg {
fill: @text;
}
}
.gsc-result-info,
.gsc-orderby-label,
.gsc-option-menu-item {
color: @subtext0;
}
.gcsc-find-more-on-google {
color: @accent-color;
}
.gcsc-find-more-on-google-magnifier {
fill: @accent-color;
}
.gsc-results .gsc-cursor-box .gsc-cursor-page {
color: @text;
background-color: unset;
}
.gsc-control-cse .gsc-option-menu {
background-color: @crust;
}
.gs-webResult div.gs-visibleUrl {
color: @subtext0;
}
.gs-webResult.gs-result a.gs-title {
&,
&:hover,
&:focus,
b {
color: @accent-color;
}
}
.gs-webResult .gs-snippet {
color: @text;
}
.badge {
background-color: @crust;
&:hover,
&:focus {
background-color: @mantle;
}
}
.dashboard-panel__headline a {
text-decoration-color: @accent-color;
}
.dashboard-columns {
border-top-color: @surface0;
&::before {
background-color: @surface0;
}
.row > div {
border-color: @surface0;
}
}
.pagination > li {
> span,
> a {
background-color: @crust;
border-color: @surface0;
color: @text;
&:hover,
&:focus {
background-color: @mantle;
}
}
}
textarea {
background-color: @crust;
outline-color: @surface0;
border-color: none;
outline-style: solid;
&:focus {
outline-color: @accent-color;
}
}
.jumbotron {
background-color: @mantle;
}
.jumbotron > hr {
border-top-color: @mantle;
}
.top-nav {
background: @crust;
li a,
li button.btn-link {
color: @text;
}
button:focus,
a:focus,
li a:focus {
background-color: @crust;
}
}
.err {
border-color: @red;
}
.btn-success,
.open > .dropdown-toggle.btn-success {
&,
&:focus,
&.focus,
&:active,
&.active,
&:hover {
color: @mantle;
background-color: @green;
border-color: @surface0;
}
}
.btn-success .badge {
color: @green;
background-color: @crust;
}
tr.hoverable:hover {
background-color: @mantle;
}
td {
&.file_size,
&.file_timestamp {
color: @subtext0;
}
}
span[style="color: blue;"] {
color: @text !important;
}
[style="color: #888"],
[style="color: #444"] {
color: @text !important;
}
.btn-info,
.btn-primary,
.open > .dropdown-toggle.btn-info,
.open > .dropdown-toggle.btn-primary {
&,
&:focus,
&.focus,
&:active,
&.active,
&:hover {
color: @base;
background-color: @accent-color;
border-color: @surface0;
}
}
.label-primary {
background-color: @accent-color;
color: @crust;
}
.label-info {
background-color: @accent-color;
color: @crust;
}
.label-danger {
background-color: @red;
color: @crust;
}
.btn-danger {
background-color: @red;
border-color: @red;
color: @crust;
&:hover,
&:focus {
background-color: darken(@red, 5%);
color: @mantle;
}
}
.btn-warning {
background-color: @yellow;
border-color: @yellow;
color: @mantle;
&:hover,
&:focus {
background-color: darken(@yellow, 5%);
color: @mantle;
}
}
.edit_value {
color: @accent-color;
}
.btn-info .badge,
.btn-primary .badge {
color: @accent-color;
background-color: @crust;
}
.alert-success,
.alert-info,
.alert-warning,
.alert-danger {
border-color: @surface0;
&,
small {
color: @base;
}
button {
background-color: unset;
}
hr {
border-top-color: @surface0;
}
a {
color: @base;
text-decoration: underline;
}
.close {
&,
&:hover,
&:focus {
color: @crust;
}
}
}
.alert-success {
background-color: @green;
}
.alert-info {
background-color: @accent-color;
}
.alert-warning {
background-color: @yellow;
}
.alert-danger {
background-color: @red;
}
.close {
opacity: 100%;
text-shadow: none;
&,
&:hover,
&:focus {
color: @text;
background: none;
}
}
.form-control {
color: @text;
background-color: @crust;
border-color: @surface0;
box-shadow: inset 0 1px 1px @surface0;
&:focus {
border-color: @surface0;
box-shadow: inset 0 1px 1px @surface0;
}
&[disabled],
&[readonly] {
background-color: @mantle;
}
}
.help-block {
color: @text;
}
.pricing_table ul {
background-color: @base;
}
.pricing_table ul li {
background: @mantle;
}
.pricing_table ul li:first-child,
.account_type_header {
color: @text;
}
.sub_and_dark_blue,
.scheduled_task:not(.enabled) {
color: @subtext0;
}
#id_initializing_mysql_spinner {
background-color: @crust !important;
color: @text;
}
.directory_listing_table i.pale {
color: @subtext0;
opacity: 100%;
}
.pricing_table ul.Free li {
background-color: @mantle;
}
.col-md-12 {
div[style*="background-color"] {
background-color: @mantle !important;
}
h1[style*="color"] {
color: @text !important;
}
}
.table {
background-color: @base;
th,
td {
border-top-color: @surface0;
}
> thead th {
border-bottom-color: @surface0;
}
.success,
.info,
.warning,
.danger {
background-color: @base;
&,
td,
th {
&,
&:hover {
background-color: @base;
}
}
}
td.active,
th.active,
&.active td,
&.active th {
background-color: @mantle;
}
}
.table-bordered {
border-color: @surface0;
th,
td {
border-color: @surface0;
}
}
.table-striped > tbody > tr:nth-of-type(odd),
.table-hover > tbody > tr:hover {
background-color: @mantle;
}
.highlighted_feature_text {
color: @green;
}
.text-muted {
color: @subtext0;
}
.modal-header {
border-bottom-color: @surface0;
}
.modal-content {
background-color: @base;
border-color: @surface0;
box-shadow: 0 3px 9px @crust;
}
.modal-backdrop {
background-color: @crust;
}
.directories_listing_group h4,
.page-header,
.gsc-above-wrapper-area,
.nav-tabs,
.property_group_header {
border-bottom-color: @surface0;
}
.nav-tabs a {
&:hover,
&:focus {
border-color: @surface0 !important;
}
}
.popover {
background-color: @mantle;
border-color: @surface0;
box-shadow: none;
&.top > .arrow {
&,
&::after {
border-top-color: @mantle;
}
}
&.right > .arrow {
&,
&::after {
border-right-color: @mantle;
}
}
&.left > .arrow {
&,
&::after {
border-left-color: @mantle;
}
}
&.bottom > .arrow {
&,
&::after {
border-bottom-color: @mantle;
}
}
}
.popover-title {
background-color: @mantle;
border-bottom-color: @surface0;
}
.modal-footer {
border-top-color: @surface0;
}
.unsorted {
color: @subtext0;
}
.sorted-up,
.sorted-down {
color: @accent-color;
}
.ui-widget-content {
border-color: @surface0;
background: @mantle;
color: @text;
}
.ui-state-default {
border-color: @surface0;
background: @surface1;
color: @text;
}
.bootstrap-switch {
border-color: @surface0;
&.bootstrap-switch-focused {
border-color: @surface0;
box-shadow: none;
}
.bootstrap-switch-label {
color: @text;
background-color: @surface0;
}
.bootstrap-switch-handle-off,
.bootstrap-switch-handle-on {
color: @text;
background-color: @crust;
&.bootstrap-switch-success,
&.bootstrap-switch-warning,
&.bootstrap-switch-danger,
&.bootstrap-switch-primary {
color: @base;
}
&.bootstrap-switch-success {
background-color: @green;
}
&.bootstrap-switch-warning {
background-color: @yellow;
}
&.bootstrap-switch-danger {
background-color: @red;
}
&.bootstrap-switch-primary {
background-color: @accent-color;
}
}
}
.tooltip-inner {
color: @text;
background-color: @crust;
}
.tooltip {
&.right .tooltip-arrow {
border-right-color: @crust;
}
&.left .tooltip-arrow {
border-left-color: @crust;
}
&.top,
&.top-left,
&.top-right {
.tooltip-arrow {
border-top-color: @crust;
}
}
&.bottom,
&.bottom-left,
&.bottom-right {
.tooltip-arrow {
border-bottom-color: @crust;
}
}
}
.has-error {
.help-block,
.control-label,
.radio,
.checkbox,
.radio-inline,
.checkbox-inline,
label {
color: @red;
}
}
.success-stories-container {
background-color: @mantle;
color: @text;
h3 {
color: @text;
}
}
.gsc-control-cse {
border-color: @surface0;
background-color: @base;
}
.post_metadata {
color: @subtext0;
}
.ui-widget-header {
background-color: @base;
border-color: @surface0;
color: @text;
}
.fullscreen-main-navbar {
background-color: @mantle;
}
.dropdown-menu {
background-color: @mantle;
border-color: @surface0;
box-shadow: none;
> li > a {
color: @text;
&:hover,
&:focus {
background-color: @base;
}
}
}
.fullscreen-main-navbar button.btn-link {
&:hover,
&:focus {
background-color: @base;
}
}
.navbar-default .btn-link {
&,
&:hover,
&:focus {
color: @text;
}
}
.btn.btn-default {
border-color: @accent-color;
color: @accent-color;
background-color: @base;
&:hover,
&:focus {
background-color: @surface0;
}
}
.well {
background-color: @mantle;
border-color: @surface0;
}
.icon-bar {
background-color: @text;
}
.nav-tabs > li,
.nav-pills > li {
> a {
border-color: @surface0;
&,
&:hover,
&:focus {
color: @accent-color;
}
}
&.active > a {
&,
&:focus {
background-color: @mantle;
}
&:hover,
&:focus {
background-color: @crust;
}
}
&:not(.active) > a {
&:hover,
&:focus {
background-color: @mantle;
}
}
}
.ui-state-highlight {
border-color: @accent-color;
background: @accent-color;
color: @base;
}
.primary-navbar {
a,
form,
.active {
background-color: @base;
}
form .btn-link {
color: @accent-color;
}
.active a {
color: @text;
}
}
.post,
.topic {
background-color: @mantle;
border-color: @surface0;
}
.editable-click {
&,
&:hover,
&:focus {
border-bottom-color: @subtext0;
}
}
[style*="background: whitesmoke;"] {
background-color: @mantle !important;
}
@media (min-width: 768px) {
.modal-content {
box-shadow: 0 5px 15px @crust;
}
}
@media screen and (max-width: 767px) {
.table-responsive {
border-color: @surface0;
}
}
#id_main_screenshot {
box-shadow: 12px 12px 29px @surface1;
}
#id_hosting_details,
#id_education_details {
&,
h1,
h2,
h3 {
background-color: @mantle;
color: @text;
}
.btn {
color: @crust !important;
}
a {
color: @accent-color;
}
}
#id_develop_anywhere_details {
background-color: @base;
}
#id_support_details {
background-color: @base;
a {
color: @accent-color !important;
}
}
#id_company_info_strip {
color: @text;
}
.console_table .info_tooltip {
color: @accent-color;
}
#id_console_name {
color: @text;
}
.beginner_pane,
.pricing_pane {
background-color: @mantle;
}
#id_error_message,
#id_login_error {
color: @red;
}
.post_preview {
background-color: @base;
h3 {
color: @text;
}
}
.teacher-navbar {
background-color: @mantle;
color: @text;
}
.nav > li > a:focus {
background: none;
}
/* blog */
.site-header {
background-color: @crust;
}
h1,
h2,
h3,
h4,
code {
color: @text !important;
}
button code {
background: none !important;
color: inherit !important;
}
p,
.tipue_search_content_text,
.tipue_search_content_bold,
#tipue_search_error,
#tipue_search_results_count,
.post-meta {
color: @subtext0;
}
.navbar-default .navbar-toggle {
&:hover,
&:focus {
background-color: @mantle;
}
}
button:not(.btn-link, .btn, [data-toggle="dropdown"]),
.pagination a,
#tipue_search_foot_boxes li.current,
#tipue_search_foot_boxes li a {
background-color: @accent-color;
color: @crust;
border-color: @accent-color;
}
button:disabled,
.pagination .disabled {
background-color: darken(@accent-color, 5%);
border-color: darken(@accent-color, 5%);
}
#tipue_search_input,
form.navbar-search {
background-color: @mantle;
color: @text;
}
svg {
fill: @subtext0;
}
.fa-at,
.fa-twitter,
.fa-rss {
filter: @text-filter;
}
.hide_search_icon path {
stroke: @subtext0;
}
footer,
footer .wrap {
background-color: @crust;
color: @text;
border-color: @crust;
}
.pagination a,
#tipue_search_foot_boxes li.current,
#tipue_search_foot_boxes li a {
background-color: @accent-color;
color: @crust;
border-color: @accent-color;
}
img[src*="ssl.gstatic.com/ui/v1/disclosure/small-grey-disclosure-arrow-down.png"],
img[src*="/static/anywhere/images/staff.png"],
img[src*="/static/glyphicons/glyphicons_"],
img[src="/static/anywhere/images/PA-logo-snake-only.svg"],
.testimonial-content,
.quickstart_logo:not([src$="/django-logo-negative-small.png"]),
.ui-icon {
filter: @text-filter;
}
img[src*="/static/anywhere/images/cross.png"] {
filter: @red-filter;
}
img[src*="/static/anywhere/images/tick.png"] {
filter: @green-filter;
}
.quickstart_logo[src$="/django-logo-negative-small.png"] {
// Original image has background - can't filter
@svg: escape(
''
);
content: url("data:image/svg+xml,@{svg}");
}
img[src$="/images/PA-logo.svg"] {
@svg: escape(
''
);
content: url("data:image/svg+xml;utf8,@{svg}");
}
}
}
/* prettier-ignore */
@catppuccin: {
@latte: { @rosewater: #dc8a78; @flamingo: #dd7878; @pink: #ea76cb; @mauve: #8839ef; @red: #d20f39; @red-filter: brightness(0) saturate(100%) invert(25%) sepia(97%) saturate(4962%) hue-rotate(337deg) brightness(81%) contrast(106%); @maroon: #e64553; @peach: #fe640b; @yellow: #df8e1d; @green: #40a02b; @green-filter: brightness(0) saturate(100%) invert(47%) sepia(78%) saturate(440%) hue-rotate(63deg) brightness(94%) contrast(93%); @teal: #179299; @sky: #04a5e5; @sapphire: #209fb5; @blue: #1e66f5; @lavender: #7287fd; @text: #4c4f69; @text-filter: brightness(0) saturate(100%) invert(30%) sepia(7%) saturate(1674%) hue-rotate(196deg) brightness(97%) contrast(91%); @subtext1: #5c5f77; @subtext0: #6c6f85; @overlay2: #7c7f93; @overlay1: #8c8fa1; @overlay0: #9ca0b0; @surface2: #acb0be; @surface1: #bcc0cc; @surface0: #ccd0da; @base: #eff1f5; @mantle: #e6e9ef; @crust: #dce0e8; };
@frappe: { @rosewater: #f2d5cf; @flamingo: #eebebe; @pink: #f4b8e4; @mauve: #ca9ee6; @red: #e78284; @red-filter: brightness(0) saturate(100%) invert(68%) sepia(21%) saturate(4617%) hue-rotate(312deg) brightness(110%) contrast(81%); @maroon: #ea999c; @peach: #ef9f76; @yellow: #e5c890; @green: #a6d189; @green-filter: brightness(0) saturate(100%) invert(84%) sepia(22%) saturate(540%) hue-rotate(51deg) brightness(90%) contrast(92%); @teal: #81c8be; @sky: #99d1db; @sapphire: #85c1dc; @blue: #8caaee; @lavender: #babbf1; @text: #c6d0f5; @text-filter: brightness(0) saturate(100%) invert(74%) sepia(16%) saturate(454%) hue-rotate(192deg) brightness(110%) contrast(92%); @subtext1: #b5bfe2; @subtext0: #a5adce; @overlay2: #949cbb; @overlay1: #838ba7; @overlay0: #737994; @surface2: #626880; @surface1: #51576d; @surface0: #414559; @base: #303446; @mantle: #292c3c; @crust: #232634; };
@macchiato: { @rosewater: #f4dbd6; @flamingo: #f0c6c6; @pink: #f5bde6; @mauve: #c6a0f6; @red: #ed8796; @red-filter: brightness(0) saturate(100%) invert(61%) sepia(16%) saturate(1882%) hue-rotate(306deg) brightness(111%) contrast(86%); @maroon: #ee99a0; @peach: #f5a97f; @yellow: #eed49f; @green: #a6da95; @green-filter: brightness(0) saturate(100%) invert(83%) sepia(35%) saturate(356%) hue-rotate(57deg) brightness(94%) contrast(88%); @teal: #8bd5ca; @sky: #91d7e3; @sapphire: #7dc4e4; @blue: #8aadf4; @lavender: #b7bdf8; @text: #cad3f5; @text-filter: brightness(0) saturate(100%) invert(82%) sepia(77%) saturate(662%) hue-rotate(181deg) brightness(103%) contrast(92%); @subtext1: #b8c0e0; @subtext0: #a5adcb; @overlay2: #939ab7; @overlay1: #8087a2; @overlay0: #6e738d; @surface2: #5b6078; @surface1: #494d64; @surface0: #363a4f; @base: #24273a; @mantle: #1e2030; @crust: #181926; };
@mocha: { @rosewater: #f5e0dc; @flamingo: #f2cdcd; @pink: #f5c2e7; @mauve: #cba6f7; @red: #f38ba8; @red-filter: brightness(0) saturate(100%) invert(58%) sepia(60%) saturate(462%) hue-rotate(299deg) brightness(107%) contrast(91%); @maroon: #eba0ac; @peach: #fab387; @yellow: #f9e2af; @green: #a6e3a1; @green-filter: brightness(0) saturate(100%) invert(95%) sepia(57%) saturate(525%) hue-rotate(47deg) brightness(93%) contrast(91%); @teal: #94e2d5; @sky: #89dceb; @sapphire: #74c7ec; @blue: #89b4fa; @lavender: #b4befe; @text: #cdd6f4; @text-filter: brightness(0) saturate(100%) invert(88%) sepia(10%) saturate(1247%) hue-rotate(191deg) brightness(99%) contrast(93%); @subtext1: #bac2de; @subtext0: #a6adc8; @overlay2: #9399b2; @overlay1: #7f849c; @overlay0: #6c7086; @surface2: #585b70; @surface1: #45475a; @surface0: #313244; @base: #1e1e2e; @mantle: #181825; @crust: #11111b; };
}
// vim:ft=less