pinkdark.css 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166
  1. :root {
  2. --background-color-hover: #2f1d22;
  3. }
  4. .btn:hover {
  5. background: unset;
  6. border-color: #ff449a;
  7. color: unset;
  8. }
  9. .btn-important {
  10. background: #ffb6c1;
  11. color: #000;
  12. border-color: #ffa1af;
  13. }
  14. .btn-important:hover {
  15. background: #ffa1af;
  16. color: #000;
  17. }
  18. .switch.active {
  19. background-color: #ffb6c1;
  20. }
  21. .nav-list .item.active a,
  22. .nav-list .item.active .as-link {
  23. color: #ffb6c1;
  24. }
  25. .tree-folder.active .tree-folder-title .title {
  26. color: #ffb6c1;
  27. }
  28. .tree-folder-title:hover button.dropdown-toggle .icon {
  29. filter: sepia(21%) brightness(44%) hue-rotate(112deg) saturate(1000%) contrast(132%) invert(100%);
  30. }
  31. .tree-folder-title button.dropdown-toggle:hover .icon {
  32. filter: sepia(21%) brightness(94%) hue-rotate(112deg) saturate(1000%) contrast(132%) invert(100%)
  33. }
  34. #new-article {
  35. background: #ffa1af;
  36. }
  37. #new-article > a {
  38. color: #000;
  39. }
  40. #new-article > a:hover {
  41. background: #ff92a2;
  42. }
  43. .transition {
  44. color: #ffb6c1;
  45. }
  46. .transition .name {
  47. color: #ffb6c1;
  48. }
  49. .flux.current {
  50. border-color: #787394;
  51. }
  52. .content hr {
  53. box-shadow: 0 2px 5px #ffb6c1;
  54. }
  55. #bigMarkAsRead.big {
  56. color: #787394;
  57. }
  58. .nav label {
  59. color: #4f5e78;
  60. }
  61. input:focus {
  62. outline: none;
  63. border: 1px solid #ff449a;
  64. }
  65. .notification.good {
  66. border-color: #ffb6c1;
  67. }
  68. .notification.bad {
  69. border-color: #ff449a;
  70. }
  71. .notification.good .close:hover {
  72. background: #ffb6c1;
  73. }
  74. .notification.bad .close:hover {
  75. background: #ff449a;
  76. }
  77. .notification.good .close:hover .icon {
  78. filter: brightness(0.3);
  79. }
  80. .notification.bad .close .icon {
  81. filter: brightness(0.3);
  82. }
  83. .notification.bad .close:hover .icon {
  84. filter: brightness(3);
  85. }
  86. .stick .btn-important:first-child {
  87. border-right-color: #fd6aae;
  88. }
  89. /*=== Change icon colors */
  90. .header > .item.title .logo {
  91. /* Color FreshRSS logo */
  92. filter: sepia(62%) brightness(107%) hue-rotate(315deg) saturate(248%) contrast(104%) invert(100%);
  93. }
  94. .header > .item.title a:hover .logo {
  95. filter: sepia(62%) brightness(70%) hue-rotate(315deg) saturate(248%) contrast(104%) invert(100%);
  96. }
  97. .icon[src*="/all"],
  98. .icon[src*="/down"],
  99. .icon[src*="/help"],
  100. .icon[src*="/label"],
  101. .icon[src*="/link"],
  102. .icon[src*="/login"],
  103. .icon[src*="/logout"],
  104. .icon[src*="/non-starred"],
  105. .icon[src*="/read"],
  106. .icon[src*="/share"],
  107. .icon[src*="/tag"],
  108. .icon[src*="/up"] {
  109. /* Color dark grey icons */
  110. filter: sepia(21%) brightness(44%) hue-rotate(112deg) saturate(1000%) contrast(132%) invert(100%);
  111. }
  112. .icon[src*="/view-normal"],
  113. .icon[src*="/view-global"],
  114. .icon[src*="/view-reader"],
  115. .icon[src*="/bookmark-tag"],
  116. .icon[src*="/view-rss"],
  117. .icon[src*="/refresh"],
  118. .icon[src*="/search"],
  119. .icon[src*="/rss"],
  120. .icon[src*="/sort-up"],
  121. .icon[src*="/sort-down"],
  122. .icon[src*="/key"],
  123. .icon[src*="/opml-dyn"],
  124. .icon[src*="/configure"],
  125. .icon[src*="/category"] {
  126. /* Color light grey icons */
  127. filter: sepia(62%) brightness(47%) hue-rotate(116deg) saturate(1000%) contrast(119%) invert(100%);
  128. }
  129. #btn-add > img {
  130. filter: brightness(0.75);
  131. }
  132. .theme-preview-list .nav label.btn:hover {
  133. background-color: var(--background-color-hover);
  134. }