Created new theme: Dark pink (#4311)
* Added Dark pink theme * Added myself * Auto-fix whitespace * Fixed log navigation button coloring * Optimized SVGs * Removed black background of png files * Use the main theme and change only colors * Fixed new article text coloring * Fixed dropdown arrow coloring * Added icon coloring * Removed unneeded icons * Color the input borders with pink, too on focus * Added coloring to missing icons * Found better way to color the icons * Color notification borders with pink * Fix tests `make fix-all` `make test` * important is not actually needed * Updated thumbnail * Colored Subscription management button's right border Co-authored-by: Alexandre Alapetite <alexandre@alapetite.fr> Co-authored-by: maTh <math-home@web.de>pull/4333/head
parent
0b86e347ef
commit
347290aae6
7 changed files with 271 additions and 0 deletions
@ -0,0 +1,9 @@ |
||||
# FreshRSS Dark pink theme |
||||
|
||||
[Dark pink theme](https://gitlab.com/miicat/freshrss-dark-pink-theme) based on **Alternative Dark** theme made by Ghost for [FreshRSS](https://github.com/FreshRSS/FreshRSS) |
||||
|
||||
![screenshot](https://gitlab.com/miicat/freshrss-dark-pink-theme/-/raw/main/Dark-pink/thumbs/original.png) |
||||
|
||||
## License |
||||
|
||||
This theme is licensed under GPLv3 |
After Width: | Height: | Size: 4.1 KiB |
@ -0,0 +1,7 @@ |
||||
{ |
||||
"name": "Dark pink", |
||||
"author": "Miicat_47", |
||||
"description": "Nice dawk pink theme. >_< UwU", |
||||
"version": 0.1, |
||||
"files": ["_template.css", "../Alternative-Dark/adark.css", "pinkdark.css"] |
||||
} |
@ -0,0 +1,127 @@ |
||||
.btn:hover { |
||||
background: unset; |
||||
border-color: #ff449a; |
||||
color: unset; |
||||
} |
||||
|
||||
.btn-important { |
||||
background: #ffb6c1; |
||||
color: #000; |
||||
border-color: #ffa1af; |
||||
} |
||||
|
||||
.btn-important:hover { |
||||
background: #ffa1af; |
||||
color: #000; |
||||
} |
||||
|
||||
.switch.active { |
||||
background-color: #ffb6c1; |
||||
} |
||||
|
||||
.nav-list .item.active a { |
||||
color: #ffb6c1; |
||||
} |
||||
|
||||
.tree-folder.active .tree-folder-title .title { |
||||
color: #ffb6c1; |
||||
} |
||||
|
||||
.aside_feed .tree-folder-items .item .dropdown-target:target ~ .dropdown-toggle > .icon, |
||||
.aside_feed .tree-folder-items .item.active .dropdown-toggle > .icon { |
||||
background-color: #000; |
||||
} |
||||
|
||||
#new-article { |
||||
background: #ffa1af; |
||||
} |
||||
|
||||
#new-article > a { |
||||
color: #000; |
||||
} |
||||
|
||||
#new-article > a:hover { |
||||
background: #ff92a2; |
||||
} |
||||
|
||||
.day { |
||||
color: #ffb6c1; |
||||
} |
||||
|
||||
.day .name { |
||||
color: #ffb6c1; |
||||
} |
||||
|
||||
.flux.current { |
||||
border-color: #787394; |
||||
} |
||||
|
||||
.content hr { |
||||
box-shadow: 0 2px 5px #ffb6c1; |
||||
} |
||||
|
||||
#bigMarkAsRead { |
||||
color: #787394; |
||||
} |
||||
|
||||
.nav label { |
||||
color: #4f5e78; |
||||
} |
||||
|
||||
.dropdown-menu::after { |
||||
border-color: #ffb6c1; |
||||
} |
||||
|
||||
input:focus { |
||||
outline: none; |
||||
border: 1px solid #ff449a; |
||||
} |
||||
|
||||
.notification.good { |
||||
border-color: #ffb6c1; |
||||
} |
||||
|
||||
.stick .btn-important:first-child { |
||||
border-right-color: #fd6aae; |
||||
} |
||||
|
||||
/*=== Change icon colors */ |
||||
.header > .item.title .logo { |
||||
/* Color FreshRSS logo */ |
||||
filter: sepia(62%) brightness(107%) hue-rotate(315deg) saturate(248%) contrast(104%) invert(100%); |
||||
} |
||||
|
||||
.icon[src*="/all"], |
||||
.icon[src*="/down"], |
||||
.icon[src*="/help"], |
||||
.icon[src*="/link"], |
||||
.icon[src*="/login"], |
||||
.icon[src*="/logout"], |
||||
.icon[src*="/non-starred"], |
||||
.icon[src*="/read"], |
||||
.icon[src*="/share"], |
||||
.icon[src*="/tag"], |
||||
.icon[src*="/up"] { |
||||
/* Color dark grey icons */ |
||||
filter: sepia(21%) brightness(44%) hue-rotate(112deg) saturate(1000%) contrast(132%) invert(100%); |
||||
} |
||||
|
||||
.icon[src*="/view-normal"], |
||||
.icon[src*="/view-global"], |
||||
.icon[src*="/view-reader"], |
||||
.icon[src*="/bookmark-tag"], |
||||
.icon[src*="/view-rss"], |
||||
.icon[src*="/refresh"], |
||||
.icon[src*="/search"], |
||||
.icon[src*="/rss"], |
||||
.icon[src*="/sort-up"], |
||||
.icon[src*="/sort-down"], |
||||
.icon[src*="/key"], |
||||
.icon[src*="/configure"] { |
||||
/* Color light grey icons */ |
||||
filter: sepia(62%) brightness(47%) hue-rotate(116deg) saturate(1000%) contrast(119%) invert(100%); |
||||
} |
||||
|
||||
#btn-add > img { |
||||
filter: invert(100%); |
||||
} |
@ -0,0 +1,127 @@ |
||||
.btn:hover { |
||||
background: unset; |
||||
border-color: #ff449a; |
||||
color: unset; |
||||
} |
||||
|
||||
.btn-important { |
||||
background: #ffb6c1; |
||||
color: #000; |
||||
border-color: #ffa1af; |
||||
} |
||||
|
||||
.btn-important:hover { |
||||
background: #ffa1af; |
||||
color: #000; |
||||
} |
||||
|
||||
.switch.active { |
||||
background-color: #ffb6c1; |
||||
} |
||||
|
||||
.nav-list .item.active a { |
||||
color: #ffb6c1; |
||||
} |
||||
|
||||
.tree-folder.active .tree-folder-title .title { |
||||
color: #ffb6c1; |
||||
} |
||||
|
||||
.aside_feed .tree-folder-items .item .dropdown-target:target ~ .dropdown-toggle > .icon, |
||||
.aside_feed .tree-folder-items .item.active .dropdown-toggle > .icon { |
||||
background-color: #000; |
||||
} |
||||
|
||||
#new-article { |
||||
background: #ffa1af; |
||||
} |
||||
|
||||
#new-article > a { |
||||
color: #000; |
||||
} |
||||
|
||||
#new-article > a:hover { |
||||
background: #ff92a2; |
||||
} |
||||
|
||||
.day { |
||||
color: #ffb6c1; |
||||
} |
||||
|
||||
.day .name { |
||||
color: #ffb6c1; |
||||
} |
||||
|
||||
.flux.current { |
||||
border-color: #787394; |
||||
} |
||||
|
||||
.content hr { |
||||
box-shadow: 0 2px 5px #ffb6c1; |
||||
} |
||||
|
||||
#bigMarkAsRead { |
||||
color: #787394; |
||||
} |
||||
|
||||
.nav label { |
||||
color: #4f5e78; |
||||
} |
||||
|
||||
.dropdown-menu::after { |
||||
border-color: #ffb6c1; |
||||
} |
||||
|
||||
input:focus { |
||||
outline: none; |
||||
border: 1px solid #ff449a; |
||||
} |
||||
|
||||
.notification.good { |
||||
border-color: #ffb6c1; |
||||
} |
||||
|
||||
.stick .btn-important:first-child { |
||||
border-left-color: #fd6aae; |
||||
} |
||||
|
||||
/*=== Change icon colors */ |
||||
.header > .item.title .logo { |
||||
/* Color FreshRSS logo */ |
||||
filter: sepia(62%) brightness(107%) hue-rotate(315deg) saturate(248%) contrast(104%) invert(100%); |
||||
} |
||||
|
||||
.icon[src*="/all"], |
||||
.icon[src*="/down"], |
||||
.icon[src*="/help"], |
||||
.icon[src*="/link"], |
||||
.icon[src*="/login"], |
||||
.icon[src*="/logout"], |
||||
.icon[src*="/non-starred"], |
||||
.icon[src*="/read"], |
||||
.icon[src*="/share"], |
||||
.icon[src*="/tag"], |
||||
.icon[src*="/up"] { |
||||
/* Color dark grey icons */ |
||||
filter: sepia(21%) brightness(44%) hue-rotate(112deg) saturate(1000%) contrast(132%) invert(100%); |
||||
} |
||||
|
||||
.icon[src*="/view-normal"], |
||||
.icon[src*="/view-global"], |
||||
.icon[src*="/view-reader"], |
||||
.icon[src*="/bookmark-tag"], |
||||
.icon[src*="/view-rss"], |
||||
.icon[src*="/refresh"], |
||||
.icon[src*="/search"], |
||||
.icon[src*="/rss"], |
||||
.icon[src*="/sort-up"], |
||||
.icon[src*="/sort-down"], |
||||
.icon[src*="/key"], |
||||
.icon[src*="/configure"] { |
||||
/* Color light grey icons */ |
||||
filter: sepia(62%) brightness(47%) hue-rotate(116deg) saturate(1000%) contrast(119%) invert(100%); |
||||
} |
||||
|
||||
#btn-add > img { |
||||
filter: invert(100%); |
||||
} |
After Width: | Height: | Size: 200 KiB |
Loading…
Reference in new issue