feat: changed from hex to hsl
This commit is contained in:
parent
63f0984f6e
commit
73ba169772
|
@ -1,7 +1,7 @@
|
||||||
/* ==UserStyle==
|
/* ==UserStyle==
|
||||||
@name Catppuccin Codeberg
|
@name Catppuccin Codeberg
|
||||||
@namespace github.com/catppuccin/codeberg
|
@namespace github.com/catppuccin/codeberg
|
||||||
@version 1.0.0
|
@version 1.0.1
|
||||||
@description Soothing pastel theme for Codeberg
|
@description Soothing pastel theme for Codeberg
|
||||||
@author Catppuccin
|
@author Catppuccin
|
||||||
@updateURL https://github.com/catppuccin/codeberg/raw/main/catppuccin.user.css
|
@updateURL https://github.com/catppuccin/codeberg/raw/main/catppuccin.user.css
|
||||||
|
@ -15,127 +15,126 @@
|
||||||
if (theme=="Latte") {
|
if (theme=="Latte") {
|
||||||
$type = light
|
$type = light
|
||||||
|
|
||||||
$rosewater = #dc8a78
|
$rosewater = hsl(10.8, 58.8%, 66.7%)
|
||||||
$flamingo = #dd7878
|
$flamingo = hsl(0, 59.8%, 66.9%)
|
||||||
$pink = #ea76cb
|
$pink = hsl(316, 73.4%, 69%)
|
||||||
$mauve = #8839ef
|
$mauve = hsl(266, 85%, 58%)
|
||||||
$red = #d20f39
|
$red = hsl(347.1, 86.7%, 44.1%)
|
||||||
$maroon = #e64553
|
$maroon = hsl(354.8, 76.3%, 58.6%)
|
||||||
$peach = #fe640b
|
$peach = hsl(22, 99.2%, 52%)
|
||||||
$yellow = #df8e1d
|
$yellow = hsl(34.9, 77%, 49.4%)
|
||||||
$green = #40a02b
|
$green = hsl(109.2, 57.6%, 39.8%)
|
||||||
$teal = #179299
|
$teal = hsl(183.2, 73.9%, 34.5%)
|
||||||
$sky = #04a5e5
|
$sky = hsl(197.1, 96.6%, 45.7%)
|
||||||
$sapphire = #209fb5
|
$sapphire = hsl(188.9, 70%, 41.8%)
|
||||||
$blue = #1e66f5
|
$blue = hsl(219.9, 91.5%, 53.9%)
|
||||||
$lavender = #7287fd
|
$lavender = hsl(230.9, 97.2%, 72%)
|
||||||
$text = #4c4f69
|
$text = hsl(233.8, 16%, 35.5%)
|
||||||
$subtext1 = #5c5f77
|
$subtext1 = hsl(233.3, 12.8%, 41.4%)
|
||||||
$subtext0 = #6c6f85
|
$subtext0 = hsl(232.8, 10.4%, 47.3%)
|
||||||
$overlay2 = #7c7f93
|
$overlay2 = hsl(232.2, 9.6%, 53.1%)
|
||||||
$overlay1 = #8c8fa1
|
$overlay1 = hsl(231.4, 10%, 59%)
|
||||||
$overlay0 = #9ca0b0
|
$overlay0 = hsl(228, 11.2%, 65.1%)
|
||||||
$surface2 = #acb0be
|
$surface2 = hsl(226.7, 12.2%, 71%)
|
||||||
$surface1 = #bcc0cc
|
$surface1 = hsl(225, 13.6%, 76.9%)
|
||||||
$surface0 = #ccd0da
|
$surface0 = hsl(222.9, 15.9%, 82.7%)
|
||||||
$base = #eff1f5
|
$base = hsl(220, 23.1%, 94.9%)
|
||||||
$mantle = #e6e9ef
|
$mantle = hsl(220, 22%, 92%)
|
||||||
$crust = #dce0e8
|
$crust = hsl(220, 20.7%, 88.6%)
|
||||||
}
|
}
|
||||||
else if (theme=="Frappe") {
|
else if (theme=="Frappe") {
|
||||||
$type = dark
|
$type = dark
|
||||||
|
|
||||||
$rosewater = #f2d5cf
|
$rosewater = hsl(10.3, 57.4%, 88%)
|
||||||
$flamingo = #eebebe
|
$flamingo = hsl(0, 58.5%, 83.9%)
|
||||||
$pink = #f4b8e4
|
$pink = hsl(316, 73.2%, 83.9%)
|
||||||
$mauve = #ca9ee6
|
$mauve = hsl(276.7, 59%, 76.1%)
|
||||||
$red = #e78284
|
$red = hsl(358.8, 67.8%, 70.8%)
|
||||||
$maroon = #ea999c
|
$maroon = hsl(357.8, 65.9%, 75.9%)
|
||||||
$peach = #ef9f76
|
$peach = hsl(20.3, 79.1%, 70%)
|
||||||
$yellow = #e5c890
|
$yellow = hsl(39.5, 62%, 73.1%)
|
||||||
$green = #a6d189
|
$green = hsl(95.8, 43.9%, 67.8%)
|
||||||
$teal = #81c8be
|
$teal = hsl(171.5, 39.2%, 64.5%)
|
||||||
$sky = #99d1db
|
$sky = hsl(189.1, 47.8%, 72.9%)
|
||||||
$sapphire = #85c1dc
|
$sapphire = hsl(198.6, 55.4%, 69.2%)
|
||||||
$blue = #8caaee
|
$blue = hsl(221.6, 74.2%, 74.1%)
|
||||||
$lavender = #babbf1
|
$lavender = hsl(238.9, 66.3%, 83.7%)
|
||||||
$text = #c6d0f5
|
$text = hsl(227.2, 70.1%, 86.9%)
|
||||||
$subtext1 = #b5bfe2
|
$subtext1 = hsl(226.7, 43.7%, 79.8%)
|
||||||
$subtext0 = #a5adce
|
$subtext0 = hsl(228.3, 29.5%, 72.7%)
|
||||||
$overlay2 = #949cbb
|
$overlay2 = hsl(227.7, 22.3%, 65.7%)
|
||||||
$overlay1 = #838ba7
|
$overlay1 = hsl(226.7, 17%, 58.4%)
|
||||||
$overlay0 = #737994
|
$overlay0 = hsl(229.1, 13.4%, 51.6%)
|
||||||
$surface2 = #626880
|
$surface2 = hsl(228, 13.3%, 44.3%)
|
||||||
$surface1 = #51576d
|
$surface1 = hsl(227.1, 14.7%, 37.3%)
|
||||||
$surface0 = #414559
|
$surface0 = hsl(230, 15.6%, 30.2%)
|
||||||
$base = #303446
|
$base = hsl(229.1, 18.6%, 23.1%)
|
||||||
$mantle = #292c3c
|
$mantle = hsl(230.5, 18.8%, 19.8%)
|
||||||
$crust = #232634
|
$crust = hsl(229.4, 19.5%, 17.1%)
|
||||||
}
|
}
|
||||||
else if (theme=="Macchiato") {
|
else if (theme=="Macchiato") {
|
||||||
$type = dark
|
$type = dark
|
||||||
|
|
||||||
$rosewater = #f4dbd6
|
$rosewater = hsl(10, 57.7%, 89.8%)
|
||||||
$flamingo = #f0c6c6
|
$flamingo = hsl(0, 58.3%, 85.9%)
|
||||||
$pink = #f5bde6
|
$pink = hsl(316.1, 73.7%, 85.1%)
|
||||||
$mauve = #c6a0f6
|
$mauve = hsl(266.5, 82.7%, 79.6%)
|
||||||
$red = #ed8796
|
$red = hsl(351.2, 73.9%, 72.9%)
|
||||||
$maroon = #ee99a0
|
$maroon = hsl(355.1, 71.4%, 76.7%)
|
||||||
$peach = #f5a97f
|
$peach = hsl(21.4, 85.5%, 72.9%)
|
||||||
$yellow = #eed49f
|
$yellow = hsl(40.3, 69.9%, 77.8%)
|
||||||
$green = #a6da95
|
$green = hsl(105.2, 48.3%, 72%)
|
||||||
$teal = #8bd5ca
|
$teal = hsl(171.1, 46.8%, 69%)
|
||||||
$sky = #91d7e3
|
$sky = hsl(188.8, 59.4%, 72.9%)
|
||||||
$sapphire = #7dc4e4
|
$sapphire = hsl(198.6, 65.6%, 69.2%)
|
||||||
$blue = #8aadf4
|
$blue = hsl(220.2, 82.8%, 74.9%)
|
||||||
$lavender = #b7bdf8
|
$lavender = hsl(234.5, 82.3%, 84.5%)
|
||||||
$text = #cad3f5
|
$text = hsl(227.4, 68.3%, 87.6%)
|
||||||
$subtext1 = #b8c0e0
|
$subtext1 = hsl(228, 39.2%, 80%)
|
||||||
$subtext0 = #a5adcb
|
$subtext0 = hsl(227.4, 26.8%, 72.2%)
|
||||||
$overlay2 = #939ab7
|
$overlay2 = hsl(228.3, 20%, 64.7%)
|
||||||
$overlay1 = #8087a2
|
$overlay1 = hsl(227.6, 15.5%, 56.9%)
|
||||||
$overlay0 = #6e738d
|
$overlay0 = hsl(230.3, 12.4%, 49.2%)
|
||||||
$surface2 = #5b6078
|
$surface2 = hsl(229.7, 13.7%, 41.4%)
|
||||||
$surface1 = #494d64
|
$surface1 = hsl(231.1, 15.6%, 33.9%)
|
||||||
$surface0 = #363a4f
|
$surface0 = hsl(230.4, 18.8%, 26.1%)
|
||||||
$base = #24273a
|
$base = hsl(231.8, 23.4%, 18.4%)
|
||||||
$mantle = #1e2030
|
$mantle = hsl(233.3, 23.1%, 15.3%)
|
||||||
$crust = #181926
|
$crust = hsl(235.7, 22.6%, 12.2%)
|
||||||
}
|
}
|
||||||
else if (theme=="Mocha") {
|
else if (theme=="Mocha") {
|
||||||
$type = dark
|
$type = dark
|
||||||
|
|
||||||
$rosewater = #f5e0dc
|
$rosewater = hsl(9.6, 55.6%, 91.2%)
|
||||||
$flamingo = #f2cdcd
|
$flamingo = hsl(0, 58.7%, 87.6%)
|
||||||
$pink = #f5c2e7
|
$pink = hsl(316.5, 71.8%, 86.1%)
|
||||||
$mauve = #cba6f7
|
$mauve = hsl(267.4, 83.5%, 81%)
|
||||||
$red = #f38ba8
|
$red = hsl(343.3, 81.2%, 74.9%)
|
||||||
$maroon = #eba0ac
|
$maroon = hsl(350.4, 65.2%, 77.5%)
|
||||||
$peach = #fab387
|
$peach = hsl(23, 92%, 75.5%)
|
||||||
$yellow = #f9e2af
|
$yellow = hsl(41.4, 86%, 83.1%)
|
||||||
$green = #a6e3a1
|
$green = hsl(115.5, 54.1%, 76.1%)
|
||||||
$teal = #94e2d5
|
$teal = hsl(170, 57.4%, 73.3%)
|
||||||
$sky = #89dceb
|
$sky = hsl(189.2, 71%, 72.9%)
|
||||||
$sapphire = #74c7ec
|
$sapphire = hsl(198.5, 75.9%, 69%)
|
||||||
$lavender = #b4befe
|
$lavender = hsl(231.9, 97.4%, 85.1%)
|
||||||
$blue = #89b4fa
|
$blue = hsl(217.2, 91.9%, 75.9%)
|
||||||
$text = #cdd6f4
|
$text = hsl(226.2, 63.9%, 88%)
|
||||||
$subtext1 = #bac2de
|
$subtext1 = hsl(226.7, 35.3%, 80%)
|
||||||
$subtext0 = #a6adc8
|
$subtext0 = hsl(227.6, 23.6%, 71.8%)
|
||||||
$overlay2 = #9399b2
|
$overlay2 = hsl(228.4, 16.8%, 63.7%)
|
||||||
$overlay1 = #7f849c
|
$overlay1 = hsl(229.7, 12.8%, 55.5%)
|
||||||
$overlay0 = #6c7086
|
$overlay0 = hsl(230.8, 10.7%, 47.5%)
|
||||||
$surface2 = #585b70
|
$surface2 = hsl(232.5, 12%, 39.2%)
|
||||||
$surface1 = #45475a
|
$surface1 = hsl(234.3, 13.2%, 31.2%)
|
||||||
$surface0 = #313244
|
$surface0 = hsl(236.8, 16.2%, 22.9%)
|
||||||
$base = #1e1e2e
|
$base = hsl(240, 21.1%, 14.9%)
|
||||||
$mantle = #181825
|
$mantle = hsl(240, 21.3%, 12%)
|
||||||
$crust = #11111b
|
$crust = hsl(240, 22.7%, 8.6%)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
:root {
|
:root {
|
||||||
|
|
||||||
--color-body: $base;
|
--color-body: $base;
|
||||||
--color-text: $text;
|
--color-text: $text;
|
||||||
--color-text-light: $subtext0;
|
--color-text-light: $subtext0;
|
||||||
|
@ -352,7 +351,7 @@
|
||||||
.chroma .nx {
|
.chroma .nx {
|
||||||
color: $text;
|
color: $text;
|
||||||
}
|
}
|
||||||
|
|
||||||
.chroma .nf {
|
.chroma .nf {
|
||||||
color: $yellow;
|
color: $yellow;
|
||||||
}
|
}
|
||||||
|
@ -363,3 +362,4 @@
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue