/* ==UserStyle==
@name Minesweeper Online Catppuccin
@namespace github.com/catppuccin/userstyles/styles/minesweeper
@homepageURL https://github.com/catppuccin/userstyles/tree/main/styles/minesweeper
@version 2025.09.06
@updateURL https://github.com/catppuccin/userstyles/raw/main/styles/minesweeper/catppuccin.user.less
@supportURL https://github.com/catppuccin/userstyles/issues?q=is%3Aopen+is%3Aissue+label%3Aminesweeper
@description Soothing pastel theme for Minesweeper Online
@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== */
@import "https://userstyles.catppuccin.com/lib/lib.less";
@-moz-document domain("minesweeper.online") {
:root {
@media (prefers-color-scheme: light) {
#catppuccin(@lightFlavor);
}
@media (prefers-color-scheme: dark) {
#catppuccin(@darkFlavor);
}
}
#catppuccin(@flavor) {
#lib.palette();
#lib.defaults();
--b0: @crust;
--b1: @base;
body {
background-color: @crust;
}
.navbar-desktop {
background-color: @base;
}
.header {
margin-top: 0;
}
.navbar-default {
background-color: @base;
}
.navbar-default .navbar-brand,
.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus,
.navbar-default .navbar-brand:focus:hover {
color: @text;
}
.navbar-default .navbar-toggle {
border-color: @surface0;
background-color: @base;
&:hover {
border-color: @surface1;
background-color: @mantle;
}
}
.navbar-default .navbar-toggle .icon-bar {
background-color: @text;
}
.navbar-desktop,
.main-content {
box-shadow: @surface0 0 0 0 1px;
}
hr,
.thumbnail,
.table-bordered {
border-color: @surface0 !important;
}
.main-column {
box-shadow: @surface0 1px 0 0 0 inset;
}
.main-content,
.thumbnail,
.table td {
background-color: @mantle;
}
.homepage-level {
background-color: @mantle;
border-color: @surface0;
}
a.homepage-level.active,
a.homepage-level:focus,
a.homepage-level:hover {
border-color: @accent;
}
a,
a:hover,
.text-primary {
color: @accent;
}
.text-success,
.level1-link,
.level1-link:hover,
.time-icon,
.end-icon,
.equipment-rarity-0 {
color: @green !important;
}
.btn-success,
.btn-success:hover,
.btn-success:focus,
.btn-success:focus:hover {
color: @mantle;
background-color: @green;
border-color: @green;
}
.btn-danger,
.btn-danger:hover,
.btn-danger:focus,
.btn-danger:focus:hover {
color: @mantle;
background-color: @red;
border-color: @red;
}
code {
background-color: fade(@red, 12.5%);
}
#premium_content > div:nth-child(21) {
> p:nth-child(3) > code:nth-child(1) {
color: @peach !important;
}
> p:nth-child(4) > code:nth-child(1) {
color: @blue !important;
}
> p:nth-child(5) > code:nth-child(1) {
color: @green !important;
}
}
.equipment-item-rarity-0 {
border-color: @green;
background-color: fade(@green, 12.5%);
}
.equipment-item-rarity-1 {
border-color: @blue;
background-color: fade(@blue, 12.5%);
}
.level2-link,
.level2-link:hover,
.blue,
.ws-icon,
.equipment-rarity-1,
.equipment-rarity-1:active,
.equipment-rarity-1:hover,
.equipment-rarity-1:visited {
color: @blue !important;
}
.equipment-rarity-2,
.equipment-rarity-2:active,
.equipment-rarity-2:hover,
.equipment-rarity-2:visited {
color: @mauve !important;
}
.equipment-item-rarity-2 {
border-color: @mauve;
background-color: fade(@mauve, 12.5%);
}
.equipment-rarity-3,
.equipment-rarity-3:active,
.equipment-rarity-3:hover,
.equipment-rarity-3:visited {
color: @peach !important;
}
.equipment-item-rarity-3 {
border-color: @peach;
background-color: fade(@peach, 12.5%);
}
.equipment-item-rarity-4,
.equipment-item-rarity-5 {
border-color: @red;
background-color: fade(@red, 12.5%);
}
.eff-icon,
.quality-icon {
color: @peach;
}
.text-danger,
.level3-link,
.level3-link:hover,
.eff-icon.eff-icon.level3,
.list-icon.level3,
.nf-icon.level3,
.time-icon.level3,
.wins-icon.level3,
.ws-icon.ws3,
.mastery-icon.mastery3,
.wins-icon,
.end-icon.end3,
.mastery-icon,
.equipment-rarity-4,
.equipment-rarity-4:active,
.equipment-rarity-4:hover,
.equipment-rarity-4:visited,
.equipment-rarity-5,
.equipment-rarity-5:active,
.equipment-rarity-5:hover,
.equipment-rarity-5:visited {
color: @red !important;
}
body,
.main-page h1,
.main-page h2,
.main-page h3,
.sidebar-nav ul li a,
.help-menu-item > strong,
.help-content h3,
.sidebar-nav ul li,
a.active,
.brand-link .brand-text,
.black-link,
.black-link:active,
.black-link:hover,
.black-link:visited,
.events-title {
color: @text !important;
}
.btn-primary,
.btn-primary:hover,
.btn-primary:active:hover,
.btn-primary:active {
border-color: @accent;
background-color: @accent;
color: @mantle;
}
.premium-product-descr {
color: fade(@yellow, 60%);
}
.shop-strike-danger {
background-image: linear-gradient(
rgba(0, 0, 0, 0) 8px,
@red 8px,
@red 10px,
rgba(0, 0, 0, 0) 10px
);
}
.gray,
.mediumgray,
.mediumgray:hover,
.dropdown-menu > li > a,
.dropdown-menu > li > a:hover,
.score-icon.icon-silver,
.gray:hover,
.icon-mobile {
color: @subtext0;
}
.dropdown-menu > li > a:focus,
.dropdown-menu > li > a:hover {
background-color: @base !important;
}
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:focus,
.nav-tabs > li.active > a:hover,
.nav-tabs > li > a:hover {
border-color: @surface0;
background-color: @base;
color: @text;
}
.chat-messages {
border-color: @surface0;
}
.btn-default,
.form-control {
color: @text;
background-color: @mantle;
border-color: @surface0;
&:hover {
color: @text;
background-color: @base;
border-color: @surface1;
}
}
.btn-info,
.btn-info:hover,
.btn-info:active:hover,
.btn-info:active {
border-color: @blue;
background-color: @blue;
color: @mantle;
}
.ticket.icon-filter {
color: @sky;
}
td[class="text-nowrap"],
.result-block,
.dropdown-menu,
td[class=""],
.table-bordered > tbody > tr > td {
background-color: @mantle;
border-color: @surface0 !important;
}
th[class="homepage-best-players-th"],
th[colspan="1"],
th[class="text-nowrap"],
th[class="text-nowrap quests-column-last"],
.help-table > thead:nth-child(1) > tr:nth-child(1) > th,
table.table:nth-child(3) > tbody:nth-child(1) > tr:nth-child(1) > th,
table.table:nth-child(1) > tbody:nth-child(1) > tr:nth-child(1) > th,
th[colspan="3"] {
border-color: @surface0 !important;
background-color: @base;
}
.pagination > li > a,
.pagination > li > span {
background-color: @mantle;
border-color: @surface0 !important;
color: @accent;
}
.pagination > .disabled > a {
background-color: @mantle;
border-color: @surface0 !important;
color: @subtext0;
}
.pagination > li > a:hover {
background-color: @base;
color: @accent;
}
.pagination-sm > li:first-child > a,
.pagination-sm > li:first-child > a:hover,
.pagination > .disabled > a:hover {
background-color: @crust;
color: @subtext0;
}
.pagination > .active > a,
.pagination > .active > a:hover {
background-color: @accent;
color: @mantle;
}
.open > .dropdown-toggle.btn-default,
.open > .dropdown-toggle.btn-default:focus,
.open > .dropdown-toggle.btn-default:hover,
.btn-default:active:hover {
background-color: @surface0;
border-color: @surface1 !important;
color: @text;
}
.footer-link,
.season {
color: @subtext0 !important;
}
.score-icon {
color: @yellow;
}
.dotted-underline,
.dotted-underline:hover {
border-bottom-color: @subtext0;
}
.ws-icon.ws11 {
color: @green;
}
.brand-logo {
@svg: escape(
''
);
content: url("data:image/svg+xml,@{svg}");
}
.exp-icon {
@svg: escape(
''
);
content: url("data:image/svg+xml,@{svg}");
}
.coin-icon {
@svg: escape(
''
);
content: url("data:image/svg+xml,@{svg}");
}
.diff-icon {
@svg: escape(
''
);
content: url("data:image/svg+xml,@{svg}");
filter: none;
}
.arena-icon {
@svg: escape(
''
);
content: url("data:image/svg+xml,@{svg}");
}
.event-item-icon.icon-filter {
@svg: escape(
''
);
content: url("data:image/svg+xml,@{svg}");
}
.quest-icon {
@svg: escape(
''
);
content: url("data:image/svg+xml,@{svg}");
}
.arena-coin-icon.icon-filter {
@svg: escape(
''
);
content: url("data:image/svg+xml,@{svg}");
}
}
}