API tools faq
paste
Advertisement
sarvagyagaur

Untitled

sarvagyagaur
Nov 13th, 2023
29
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 21.94 KB | None | 0 0
raw download clone embed print report
  1. /* Theme Customiser Settings
  2. https://github.com/ValerioLyndon/Theme-Customiser
  3. ^TC{"data":"https://valeriolyndon.github.io/MAL-Public-List-Designs/Clarity Theme/clarity.json","options":{"avatar":"https://cdn.myanimelist.net/s/common/userimages/28c6ffa0-22b2-4ab6-84a1-1bf6473ae61e_225w?s=8c58563e846c7d968352b61d48094f3f","character":"","banner":""},"mods":{"image-hover":{"hover":"on-row","username":"sarv_g"},"fav":{"align":"left"},"cat-background":{"1":"https://cdn.discordapp.com/attachments/1149041671980449843/1150508521436217434/wallpaperflare.com_wallpaper.jpg","2":"https://cdn.discordapp.com/attachments/1149041671980449843/1150479417701826670/peakpx_1.jpg","3":"https://cdn.discordapp.com/attachments/1149041671980449843/1150491233270116513/35865_1.gif","4":"https://cdn.discordapp.com/attachments/1149041671980449843/1150526030604423259/64106bbdbc193.jpg","6":"https://cdn.discordapp.com/attachments/1149041671980449843/1150573843207966801/to_watch_background.png","7":"https://cdn.discordapp.com/attachments/1149041671980449843/1150550617274732654/gintama_background.jpg"},"dark":{},"transparent-rows":{"colour":"rgba(42, 38, 38, 0.8)"},"status-width":{"width":"19px"},"header-line-cat":{},"cat-header":{},"colours":{"base":"dark","--bg-dark":"rgb(42, 33, 33)","--text":"rgb(255, 255, 255)","--text-h":"rgb(35, 128, 234)","--text-dim":"rgb(238, 36, 53)","--text-dark":"rgb(209, 208, 208)","--icon":"rgb(216, 216, 216)","--text-dim-h":"rgb(216, 216, 216)","--banner-text-shadow":"rgb(239, 4, 4)","--banner-text":"rgb(146, 176, 251)","--watching":"rgb(100, 251, 138)","--completed":"rgb(92, 112, 244)","--onhold":"rgb(240, 248, 82)","--dropped":"rgb(238, 6, 6)","--plantowatch":"rgb(199, 198, 198)","--text-head":"rgb(213, 194, 194)","--cover-bg":"rgb(8, 7, 7)","--checkmark":"rgb(14, 88, 225)"},"cat-banner":{"1":"https://cdn.discordapp.com/attachments/1149041671980449843/1150484030995828806/zom-100-mikazuki-shizuka.gif","2":"https://cdn.discordapp.com/attachments/1149041671980449843/1150478794113679380/peakpx.jpg","3":"https://cdn.discordapp.com/attachments/1149041671980449843/1150486315918438441/wallpaperflare.com_wallpaper.jpg","4":"https://cdn.discordapp.com/attachments/1149041671980449843/1150531806098116849/try1.png","6":"https://cdn.discordapp.com/attachments/1149041671980449843/1150566972203999293/to_watch_banner_final.png","7":"https://cdn.discordapp.com/attachments/1149041671980449843/1150551224127598733/image.png"},"horizontal":{}},"theme":"Clarity"}TC$*/
  4.  
  5. /*==============================*\
  6. | "Clarity" by Valerio Lyndon |
  7. | R27.5 |
  8. \*==============================*/
  9. @\import "https://fonts.googleapis.com/css2?family=Oswald&display=swap";
  10. @\import "https://valeriolyndon.github.io/MAL-Public-List-Designs/resources/font-awesome-4.7.0/css/font-awesome-force-legacy.min.css";
  11. @\import "https://malscraper.azurewebsites.net/covers/anime/sarv_g/presets/dataimagelinkbefore";
  12. @\import "https://malscraper.azurewebsites.net/covers/manga/sarv_g/presets/dataimagelinkbefore";
  13. @\import "https://cdn.discordapp.com/attachments/1149041671980449843/1152691414996631572/Info_Data.css";
  14. @\import "https://valeriolyndon.github.io/MAL-Public-List-Designs/Clarity%20Theme/Theme%20-%20Compressed.css";
  15.  
  16.  
  17. /*Synopsis and MAL SCORE addition. the .progress and .title is defined in the Import of the mal stats file I am doing above.
  18. */
  19.  
  20. /* SYNOPSIS BASIS */
  21. .rewatching, .rereading {
  22. display: inline !important;
  23. pointer-events: none;
  24. }
  25.  
  26. .rewatching:before, .rewatching:after,
  27. .rereading:before, .rereading:after {
  28. content: none;
  29. }
  30.  
  31. /* SYNOPSIS BUTTON */
  32. .title a~[class^="re"]: {
  33. width: 0;
  34. font-size: 0;
  35. margin: 0;
  36. pointer-events: none
  37. }
  38.  
  39. .title a ~ [class^="re"]::before {
  40. content: "Info";
  41. position: absolute;
  42. right: 37px;
  43. top: calc(50% + 1px);
  44. z-index: auto;
  45. width: 57px;
  46. background-color: rgb(0, 0, 0, .5);
  47. border-radius: 7px;
  48. border: 4px solid rgb(0,0,0);
  49. margin: 0 0 0 auto;
  50. font: 12px Inconsolata, monospace;
  51. color: #FFFFFF;
  52. text-align: center;
  53. transform: translate(50%, -50%);
  54. pointer-events: auto
  55. }
  56.  
  57. /* SYNOPSES ON HOVER */
  58. .title a ~ [class^="re"]::after {
  59. position: absolute;
  60. left: calc(-13% - 0px);
  61. top: calc(50% + 57px);
  62. z-index: auto;
  63. width: 1020px;
  64. padding-top: 20px;
  65. padding-bottom: 25px;
  66. padding-left: 21px;
  67. padding-right: 20px;
  68. --rounding: 0px;
  69. border-radius: 0 0 16px 16px;
  70. background-color: var(--category-colour);
  71. font: 14px Montserrat, Verdana, sans-serif;
  72. color: black;
  73. line-height: 1.4;
  74. text-align: Left;
  75. white-space: pre-wrap;
  76. opacity: 0;
  77. transition: opacity .3s ease
  78. }
  79. [data-query*='status":7']{
  80. .title a ~ [class^="re"]::after {
  81. position: absolute;
  82. right: -570px;
  83. top: calc(50% + 57px);
  84. z-index: auto;
  85. width: 1020px;
  86. padding-top: 20px;
  87. padding-bottom: 25px;
  88. padding-left: 21px;
  89. padding-right: 20px;
  90. --rounding: 0px;
  91. border-radius: 0 0 16px 16px;
  92. background-color: black;
  93. font: 14px Montserrat, Verdana, sans-serif;
  94. color: white;
  95. line-height: 1.4;
  96. text-align: Left;
  97. white-space: pre-wrap;
  98. opacity: 0;
  99. transition: opacity .3s ease
  100. }
  101. }
  102. .title a ~ [class^="re"]:hover::after {
  103. opacity: 1;
  104. }
  105.  
  106. /* AVATAR */
  107. body { --avatar: url(https://cdn.myanimelist.net/s/common/userimages/28c6ffa0-22b2-4ab6-84a1-1bf6473ae61e_225w?s=8c58563e846c7d968352b61d48094f3f); };
  108.  
  109.  
  110. /*-S-T-A-R-T--------------------*\
  111. | Dark Mode R3.5 |
  112. \*------------------------------*/
  113. :root{--banner:url(https://i.imgur.com/WaLokPG.jpg);--character:url(https://i.imgur.com/h8HW1jf.png);--pbg:#161616;--bg:#212121;--bg-dark:#444;--text:#ababab;--text-h:#416abe;--text-dim:#777;--text-dim-h:#999;--text-dark:#ababab;--shadow:rgba(0,0,0,0.8);--icon:#959595;--accent:#416abe;--banner-text:#f6f5ff;--banner-text-shadow:#e4bef4;--btn-bg:#191919;--btn-bg-h:#ababab;--btn-head-bg-h:#416abe;--btn-text-h:#212121;--text-head:#9b9b9b;--text-head-h:#ababab;--cover-bg:#090909;--edit-btn:#323232;--checkmark:#416abe}.cover-block:before{background:linear-gradient(to top,rgba(0,0,0,.8),rgba(0,0,0,0))}.status-menu-container:after{background:linear-gradient(to bottom,rgba(0,0,0,.6),rgba(0,0,0,0))}#footer-block:before{background:linear-gradient(to top,rgba(0,0,0,.3),rgba(0,0,0,0))}.data.score select{background-image:url(https://i.imgur.com/hFijppc.png)}#fancybox-overlay{opacity:.35!important}#advanced-options,#fancybox-outer{box-shadow:0 0 32px rgba(0,0,0,.75)}html:not(.dark-mode) #fancybox-frame{-webkit-filter:invert(87.8%) hue-rotate(197deg);filter:invert(87.8%) hue-rotate(197deg)}#advanced-options [class*="-widget"] select{background-image:url(https://i.imgur.com/KF8oOyC.png)}
  114. /*------------------------E-N-D-*/
  115.  
  116. /*-S-T-A-R-T--------------------*\
  117. | Hover Image R0.3 |
  118. \*------------------------------*/
  119. .data.image a{overflow:visible}.data.image a:before{content:"";position:absolute;top:50%;left:-166px;z-index:50;width:150px;height:0;background:var(--bg-dark) no-repeat center/cover;border-radius:8px;box-shadow:0 0 2px #000;opacity:0;pointer-events:none;transition:all .3s ease}.list-item:hover .data.image a:before{top:calc(50% - 100px);height:200px;opacity:1}.data.image a:after,.data.image img{border-radius:50%}
  120.  
  121. /*------------------------E-N-D-*/
  122.  
  123. /*-S-T-A-R-T--------------------*\
  124. | Horizontal Tags R0.3 |
  125.  
  126. Knight Rider's Comment: I have currently disabled this by adding "/*" line at the start and end
  127.  
  128. \*------------------------------*/
  129.  
  130.  
  131. /*
  132. .list-table-data{padding-bottom:11px}.data.tags{position:absolute;left:0;top:0;z-index:2;display:flex!important;width:0;height:100%;padding:0!important;align-items:flex-end}.data.tags div{max-width:980px;margin:0 0 4px 80px;font-size:0;white-space:nowrap}.data.tags span{display:inline-block;padding:0}.data.tags span a{padding:1px 8px!important;margin:0 4px 0 0;white-space:nowrap}.data.tags span a[href*="=Favo"]{padding:0!important}.data.tags a.edit{right:-1060px}.data.tags textarea{right:-1060px}
  133. */
  134.  
  135.  
  136. /*------------------------E-N-D-*/
  137.  
  138. /*-S-T-A-R-T--------------------*\
  139. | Favourite Hearts (Left) R0.4 |
  140. \*------------------------------*/
  141. .data.tags span{padding:0}.data.tags span a{margin:1px 0}.data.tags span a[href*="=Favorite"],.data.tags span a[href*="=Favourite"]{position:absolute;left:-34px;top:calc(50% - 13px);width:26px;height:26px;padding:0;background:var(--bg);border-radius:50%;color:#ff65ad!important;font-size:0!important;line-height:23px;overflow:hidden;box-shadow:0 1px 2px rgba(0,0,0,.2)}.data.tags span a[href*="=Favorite"]:before,.data.tags span a[href*="=Favourite"]:before{content:"♥";font-size:26px}
  142. /*------------------------E-N-D-*/
  143.  
  144. /*-S-T-A-R-T--------------------*\
  145. | Banner Image |
  146.  
  147. I have these disabled currently- Knight Rider. Only left it enabled for status 6
  148.  
  149. \*------------------------------*/
  150. [data-query*='status":1'] { --banner: url(https://cdn.discordapp.com/attachments/1149041671980449843/1150484030995828806/zom-100-mikazuki-shizuka.gif); }
  151. [data-query*='status":2'] { --banner: url(https://cdn.discordapp.com/attachments/1149041671980449843/1150478794113679380/peakpx.jpg); }
  152. [data-query*='status":3'] { --banner: url(https://cdn.discordapp.com/attachments/1149041671980449843/1150486315918438441/wallpaperflare.com_wallpaper.jpg); }
  153. [data-query*='status":4'] { --banner: url(https://cdn.discordapp.com/attachments/1149041671980449843/1150531806098116849/try1.png); }
  154. [data-query*='status":6'] { --banner: url(https://cdn.discordapp.com/attachments/1149041671980449843/1150566972203999293/to_watch_banner_final.png); }
  155. [data-query*='status":7'] { --banner: url(https://cdn.discordapp.com/attachments/1149041671980449843/1150551224127598733/image.png); }
  156. /*------------------------E-N-D-*/
  157.  
  158. /*-S-T-A-R-T--------------------*\
  159. | Per-Category Background Image |
  160. \*------------------------------*/
  161. [data-query*='status":1'] { --background: url(https://cdn.discordapp.com/attachments/1149041671980449843/1150508521436217434/wallpaperflare.com_wallpaper.jpg); }
  162. [data-query*='status":2'] { --background: url(https://cdn.discordapp.com/attachments/1149041671980449843/1150592574000726126/cyberpunk_new_background.jpg); }
  163. [data-query*='status":3'] { --background: url(https://cdn.discordapp.com/attachments/1149041671980449843/1150486315918438441/wallpaperflare.com_wallpaper.jpg); }
  164. [data-query*='status":4'] { --background: url(https://cdn.discordapp.com/attachments/1149041671980449843/1150526030604423259/64106bbdbc193.jpg); }
  165. [data-query*='status":6'] { --background: url(https://cdn.discordapp.com/attachments/1149041671980449843/1150918677168922764/another_attempt_1.png); }
  166. [data-query*='status":7'] { --background: url(https://cdn.discordapp.com/attachments/1149041671980449843/1150550617274732654/gintama_background.jpg); }
  167. /*------------------------E-N-D-*/
  168.  
  169. /*-S-T-A-R-T--------------------*\
  170. | List Row Transperancy |
  171. \*------------------------------*/
  172.  
  173. :root {
  174.  
  175. --row-tint: rgba(42, 38, 38, 0.8);
  176. }
  177.  
  178. .list-item, .data.priority, .data.number, .data.status:before, .data.status:after {
  179. background: linear-gradient(var(--row-tint),var(--row-tint)), var(--background) no-repeat center / cover fixed transparent !important;
  180. }
  181.  
  182. /*------------------------E-N-D-*/
  183.  
  184. /*-S-T-A-R-T--------------------*\
  185. | Change Status Bar Width |
  186. \*------------------------------*/
  187.  
  188. .data.status { width: 19px !important; }
  189. .list-table-data { padding-left: 0px; }
  190.  
  191. /*------------------------E-N-D-*/
  192.  
  193. /*-S-T-A-R-T--------------------*\
  194. | Header Outline (CatCol) R0.1 |
  195. \*------------------------------*/
  196. [data-query*='"status":7']{--header-border:var(--accent)}[data-query*='"status":1']{--header-border:var(--watching)}[data-query*='"status":2']{--header-border:var(--completed)}[data-query*='"status":3']{--header-border:var(--onhold)}[data-query*='"status":4']{--header-border:var(--dropped)}[data-query*='"status":6']{--header-border:var(--plantowatch)}.status-menu-container:before{height:56px;border-width:4px 0;border-style:solid;border-color:var(--header-border)}.status-menu:after{left:-4px;top:-47px;border-width:4px;box-shadow:0 0 0 4px var(--header-border)}.fixed .status-menu:after{top:4px}
  197. /*------------------------E-N-D-*/
  198.  
  199. /*-S-T-A-R-T--------------------*\
  200. | CatCol Header Text R0.0 |
  201. \*------------------------------*/
  202. .status-menu .status-button{transition:color .3s ease}.status-menu .status-button.on:nth-of-type(1),.status-menu .status-button:nth-of-type(1):hover{color:var(--accent)!important}.status-menu .status-button.on:nth-of-type(2),.status-menu .status-button:nth-of-type(2):hover{color:var(--watching)!important}.status-menu .status-button.on:nth-of-type(3),.status-menu .status-button:nth-of-type(3):hover{color:var(--completed)!important}.status-menu .status-button.on:nth-of-type(4),.status-menu .status-button:nth-of-type(4):hover{color:var(--onhold)!important}.status-menu .status-button.on:nth-of-type(5),.status-menu .status-button:nth-of-type(5):hover{color:var(--dropped)!important}.status-menu .status-button.on:nth-of-type(6),.status-menu .status-button:nth-of-type(6):hover{color:var(--plantowatch)!important}
  203. /*------------------------E-N-D-*/
  204.  
  205. /*-S-T-A-R-T--------------------*\
  206. | Theme Colours |
  207. \*------------------------------*/
  208.  
  209. :root {
  210. /* Generic Colours */
  211. --pbg: #161616;
  212. --bg: #212121;
  213. --bg-dark: rgb(42, 33, 33);
  214. --text: rgb(255, 255, 255);
  215. --text-h: rgb(35, 128, 234);
  216. --text-dim: rgb(238, 36, 53);
  217. --text-dim-h: rgb(216, 216, 216);
  218. --text-dark: rgb(209, 208, 208);
  219. --icon: rgb(216, 216, 216);
  220. --accent: #000000;
  221. --banner-text: rgb(146, 176, 251);
  222. --banner-text-shadow: rgb(239, 4, 4);
  223.  
  224. /* Button Colours */
  225. --btn-bg: #191919;
  226. --btn-bg-h: #ababab;
  227. --btn-head-bg-h: #416abe;
  228. --btn-text-h: #212121;
  229.  
  230. /* Header Colours */
  231. --text-head: rgb(213, 194, 194);
  232. --text-head-h: #ababab;
  233.  
  234. /* Status Colours */
  235. --watching: rgb(100, 251, 138);
  236. --completed: rgb(92, 112, 244);
  237. --onhold: rgb(240, 248, 82);
  238. --dropped: rgb(238, 6, 6);
  239. --plantowatch: rgb(199, 198, 198);
  240. --all-anime: rgb(0, 0, 0);
  241.  
  242. /* Single-Use Colours */
  243. --cover-bg: rgb(8, 7, 7);
  244. --edit-btn: #323232;
  245. --checkmark: rgb(14, 88, 225);
  246. }
  247.  
  248.  
  249.  
  250.  
  251.  
  252. /*------------------------------*
  253. Rows hover properties
  254. *------------------------------*/
  255.  
  256.  
  257. [data-query*='status":1'] { .list-table .list-table-data:hover{
  258. background-image: url(https://cdn.discordapp.com/attachments/1149041671980449843/1150879706057547837/currently_watching_trial.jpg);
  259. background-size: 1060px 100px;
  260. }}
  261.  
  262. [data-query*='status":2'] { .list-table .list-table-data:hover{
  263. background-image: url(https://cdn.discordapp.com/attachments/1149041671980449843/1150857104387739668/Completed_list_item_pic.jpg);
  264. background-size: 1060px 100px;
  265. }}
  266.  
  267. [data-query*='status":3'] { .list-table .list-table-data:hover{
  268. background-image: url(https://cdn.discordapp.com/attachments/1149041671980449843/1150889628593815652/comparison_hover.png);
  269. background-size: 1060px 100px;
  270. }}
  271.  
  272. [data-query*='status":4'] { .list-table .list-table-data:hover{
  273. background-image: url(https://cdn.discordapp.com/attachments/1149041671980449843/1150881773518061638/DROPPED_ANIME_ROW_HOVER.png);
  274. background-size: 1060px 100px;
  275. }}
  276.  
  277.  
  278. [data-query*='status":6'] { .list-table .list-table-data:hover{
  279. background-image: url(https://cdn.discordapp.com/attachments/1149041671980449843/1150919637584838698/soon_tm_background.jpg);
  280. background-size: 1060px 100px;
  281. }}
  282.  
  283.  
  284. [data-query*='status":7'] { .list-table .list-table-data:hover{
  285. background-image: url(https://cdn.discordapp.com/attachments/1149041671980449843/1150880260284502046/im_just_seeing.jpg);
  286. background-size: 1060px 100px;
  287. }}
  288.  
  289.  
  290.  
  291. /*------------------------------*
  292. *------------------------------*/
  293.  
  294. body:not([data-query*='status":6']) .header {
  295. top: calc(74px + 36px);
  296. margin: 0 auto -36px
  297. }
  298.  
  299. body:not([data-query*='status":6']) .cover-block {
  300. display: none
  301. }
  302.  
  303.  
  304.  
  305.  
  306.  
  307.  
  308.  
  309. /*------------------------------*
  310. GLOWING ROWS ON HOVER
  311. Make a new box shadow here
  312. https://html-css-js.com/css/generator/box-shadow/
  313. *------------------------------*/
  314. [data-query*='status":7'] {.list-table-data:hover{
  315. box-shadow: 1px 1px 15px 9px #000000 !important;
  316. position: relative;}
  317. }
  318.  
  319. [data-query*='status":1'] {.list-table-data:hover{
  320. box-shadow: 1px 1px 15px 9px #64FB8A !important;
  321. position: relative;}
  322. }
  323. [data-query*='status":2'] {.list-table-data:hover{
  324. box-shadow: 1px 1px 15px 9px #5C70F4 !important;
  325. position: relative;}
  326. }
  327. [data-query*='status":3'] {.list-table-data:hover{
  328. box-shadow: 1px 1px 15px 9px #F0F852 !important;
  329. position: relative;}
  330. }
  331. [data-query*='status":4'] {.list-table-data:hover{
  332. box-shadow: 1px 1px 15px 9px #EE0606 !important;
  333. position: relative;}
  334. }
  335. [data-query*='status":6'] {.list-table-data:hover{
  336. box-shadow: 1px 1px 15px 9px #878282 !important;
  337. position: relative;}
  338. }
  339. /*------------------------------*
  340. Rezing the Table List item when hovered
  341. 1st Method is this one, that I used. But this one has issues because in the code above, there is a "max width" attribute to table items.Because of which it only incrased its height but not width even if i changed the number to 1060px+
  342.  
  343. .list-table-data:hover{
  344. width: 1060px;
  345. height: 100px;
  346. }
  347. .list-item:hover {
  348. z-index: 3;
  349. transform: scale(1.025);
  350. }
  351.  
  352.  
  353. But 2nd method adjusts image height and is also not the best on its own. I am using the mix of both for this reason
  354.  
  355. *------------------------------*/
  356.  
  357. .list-item:hover {
  358. z-index: 3;
  359. transform: scale(1.025);
  360. }
  361.  
  362. .list-table-data:hover{
  363. height: 100px;
  364. }
  365. /*------------------------------*
  366. TAGS
  367. *------------------------------*/
  368.  
  369.  
  370. .data.tags span a[href*="=Romance"] { background: url(https://cdn.discordapp.com/attachments/1149041671980449843/1150924275134517320/giphy.gif)}
  371. .data.tags span a[href*="=Action"] { background: url(https://cdn.discordapp.com/attachments/1149041671980449843/1150925263069257799/ezgif-3-1fda5f0992.gif)}
  372. .data.tags span a[href*="=Comedy"] { background: url(https://cdn.discordapp.com/attachments/1149041671980449843/1150929322899673138/as.gif)}
  373. .data.tags span a[href*="=Adventure"] { background: url(https://cdn.discordapp.com/attachments/1149041671980449843/1150925840562012190/giphy_1.gif)}
  374. .data.tags span a[href*="=Drama"] { background: url(https://cdn.discordapp.com/attachments/1149041671980449843/1150932203014979687/aa.gif)}
  375. .data.tags span a[href*="=Fantasy"] { background: url(https://cdn.discordapp.com/attachments/1149041671980449843/1150930389649588305/g04L.gif)}
  376. .data.tags span a[href*="=Sci-Fi"] { background: ##00ffec}
  377.  
  378. /*------------------------------*
  379. Addition of "Sort by score" button right above the scores.
  380. *------------------------------*/
  381.  
  382.  
  383. .list-table .list-table-header .header-title.score {
  384. position: absolute;
  385. right: 495px;
  386. opacity: 1;
  387. pointer-events: auto
  388. }
  389. .list-table .list-table-header .header-title.score .link {
  390. width: 100px!important;
  391. margin: 0;
  392. border-radius: 13px;
  393. background: var(text);
  394. text-indent: 0;
  395. opacity: 1
  396. }
  397. .list-table .list-table-header .header-title.score .link::before {
  398. content: "Sort by "
  399. }
  400.  
  401.  
  402. /* =========================
  403. Variable Category-Colours
  404. Two things
  405. Making a new variable called --category-colour which has all the colors based on list-item's status.
  406.  
  407. And second thing
  408. I have set it so the text in all the different pages correspond with their respect category colour, EXCEPT for status '7', which will continue to be red
  409. */
  410. .list-item {
  411. --category-colour: var(--text)
  412. }
  413. .all_anime ~ .data{
  414. --category-colour: var(--all-anime)
  415. --item-shadow: 0 0 20px 2px black
  416. }
  417. .watching ~ .data {
  418. --category-colour: var(--watching);
  419. --item-shadow: 0 0 20px 2px green
  420. }
  421. .completed ~ .data {
  422. --category-colour: var(--completed);
  423. --item-shadow: 0 0 20px 2px blue
  424. }
  425. .onhold ~ .data {
  426. --category-colour: var(--onhold);
  427. --item-shadow: 0 0 20px 2px yellow
  428. }
  429. .dropped ~ .data {
  430. --category-colour: var(--dropped);
  431. --item-shadow: 0 0 20px 2px red
  432. }
  433. .plantowatch ~ .data {
  434. --category-colour: var(--plantowatch);
  435. --item-shadow: 0 0 20px 2px white
  436. }
  437.  
  438. body:not([data-query*='status":7']){.data {
  439. --text-dim: var(--category-colour)
  440. }};
  441.  
  442. body:not([data-query*='status":7']){.list-table .list-table-data .title .add-edit-more a {
  443. color: var(--category-colour) !important
  444. }};
  445.  
  446.  
  447.  
  448.  
  449. /* colors on seasons with changing the appearance of season as well */
  450.  
  451. .data.season::before {
  452. content: none
  453. }
  454.  
  455. .list-table-data .data.season a {
  456. display: block;
  457. width: 140px;
  458. padding: 1px;
  459. background: var(--btn-bg);
  460. border-radius: 8.5px;
  461. text-align: center;
  462. line-height: 15px;
  463. font-weight: 700
  464. }
  465.  
  466. .list-table-data .data.season a:hover {
  467. background: var(--btn-bg-h);
  468. color: var(--btn-text-h) !important
  469. }
  470.  
  471. .data.season span a[href$="winter"] {
  472. color: #A0E3F6 !important
  473. }
  474.  
  475. .data.season span a[href$="spring"] {
  476. color: #E487B1 !important
  477. }
  478.  
  479. .data.season span a[href$="summer"] {
  480. color: #FCDC5C !important
  481. }
  482.  
  483. .data.season span a[href$="fall"] {
  484. color: #DE591C !important
  485. }
  486.  
  487. .data.season span a[href*="season"]::before {
  488. content: var(--gicon)
  489. }
  490.  
  491. /* Winter */
  492. a[href$="/winter"]::before {
  493. --gicon: "❄️"
  494. }
  495.  
  496. /* Spring */
  497. a[href$="/spring"]::before {
  498. --gicon: "🌸"
  499. }
  500.  
  501. /* Summer */
  502. a[href$="/summer"]::before {
  503. --gicon: "☀️"
  504. }
  505.  
  506. /* Fall */
  507. a[href$="/fall"]::before {
  508. --gicon: "🍂"
  509. }
  510.  
  511.  
  512.  
  513.  
  514. /*------------------------E-N-D-*/
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!