Animixplay.to ((Round)) Light

A rounded animixplay.to theme

  1. // ==UserScript==
  2. // @name Animixplay.to ((Round)) Light
  3. // @namespace https://tampermonkey.net/
  4. // @version 2.6
  5. // @description A rounded animixplay.to theme
  6. // @author DoggoOfSpeed
  7. // @match https://animixplay.to/*
  8. // @icon https://animixplay.to/icon.png
  9. // @grant none
  10. // @require https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js
  11. // ==/UserScript==
  12.  
  13. const style = document.createElement('style');
  14.  
  15. $('#disqus_thread').addClass('invert');
  16.  
  17. style.innerHTML = `
  18. :root {
  19. --bg-primary: #FFFFFF;
  20. --bg-secondary: #E3E5E8;
  21. --select-color: #444;
  22. --gradient1: #3494E6;
  23. --gradient2: #EC6EAD;
  24. --text-colour: black;
  25. --inverted-text-colour: white;
  26. --border-radius: 10px;
  27. --user-anime-width: 350px;
  28. }
  29.  
  30. * {
  31. transition: all .35s !important;
  32. }
  33.  
  34. body {
  35. background-color: var(--bg-primary) !important;
  36. }
  37.  
  38. .rightcard, .rightcardCenter, #opensidebarbtn, .searchresult > li, #announcement, #readmorebtn, .playerpage, .subpart, #disquscomment, .footer, .leftbottom, #playerleftsidebar, .nav-tabs > li, #lastwatch, .items li, #fullresultbtn, .quickresult {
  39. background-color: var(--bg-secondary) !important;
  40. }
  41.  
  42. body, .middle, .infotext, .topmenubtn, #announcement, #readmorebtn, #featuredtext, a, .nav-tabs li a, .form-control::placeholder, #eptitleplace, .altsourcenotif, #usernametop, .playerpage, .info, #malEpisodes, #malTotal, #genres, #status, .epsavailable, .usernameplace, #watchingstatus, #untrackbtn, #infocard, .airtime, .scheduletitle, #scheduletimezone, #lastwatch, #addTitle, #animepagetitle, #panelplace, .subtitleright, #addInfo, .label-default, #q, #azsearch, .halfright, .halfleft2 {
  43. color: var(--text-colour) !important;
  44. }
  45.  
  46. .webtitle, .customicon {
  47. filter: drop-shadow(1px 1px 2px black);
  48. }
  49.  
  50. #infocard, #readmorebtn, .rightcard:last-child, .quickresult {
  51. border-radius: 0 0 var(--border-radius) var(--border-radius);
  52. }
  53.  
  54. .eptitle, .playersidebar > div:first-of-type, .rightcard:first-child, .leftbottom, #announcement, #fullresultbtn {
  55. border-radius: var(--border-radius) var(--border-radius) 0 0;
  56. }
  57.  
  58. .playbutton, .playerpage, .imgusr, .plyr__menu__container, #showcommentbtn, #q, .resultimg, .searchresult li, #loadmorelist, #featuredcard, #featuredimg, #schedulenotice, #lastwatch, #progressnumber, #tracknumber, #manualtrackbtn, #playerbottomicon, #seasonalgobtn, #maincoverimage, #notifiaction, .logininput, .loginbtn, #gconnectbtnimg, #alphabetical > button, #azsearch, #backtotopbtn, .resultimg02, .inwardshadow, #featuredbgcont, #premiumnotice, .nav-tabs li a, #openschedulebtn, #disquscomment, .rightcard:only-child, .changepassbtn, #alretinfo, .changeuserbtn, #reportform, .items li, .resultimg2, #q:focus {
  59. border-radius: var(--border-radius);
  60. }
  61.  
  62. #followbtn, #trackbtn, #animebtn2, #fullresultbtn > a, select {
  63. border-radius: calc(var(--border-radius) /2);
  64. }
  65.  
  66. .rating, .timetext {
  67. border-radius: var(--border-radius) 0 var(--border-radius) 0;
  68. }
  69.  
  70. #opensidebarbtn, .nav-tabs > li:first-child{
  71. border-radius: var(--border-radius) 0 0 var(--border-radius);
  72. }
  73.  
  74. #lastwatchclosebtn, .nav-tabs > li:last-child {
  75. border-radius: 0 var(--border-radius) var(--border-radius) 0;
  76. }
  77.  
  78. .plyr__menu__container .plyr__control {
  79. color: white !important;
  80. }
  81.  
  82. #disquscomment, #maincoverimage {
  83. margin: 25px auto 25px auto;
  84. }
  85.  
  86. .plyr__menu__container {
  87. background: rgb(20,20,20);
  88. }
  89.  
  90. #menuclose, #reportclose {
  91. margin: 5px 5px 0 -25px;
  92. background: none;
  93. }
  94.  
  95. .infotext {
  96. bottom: 0
  97. }
  98.  
  99. #updatebtn {
  100. color: rgb(150, 189, 217);
  101. }
  102.  
  103. #updatebtn:hover {
  104. color: rgb(127, 195, 255);
  105. }
  106.  
  107. #playercountdown, #menumobilebtn, #menumobilebtn2, #showsearchbtn, #recomendedclosebtn, .glyphicon, #ongoingplace > a, p.name, .allitem > a, #animepagecountdown, #seasontitle, .scheduletitle > span, .questionFAQ {
  108. background: linear-gradient(to bottom right, var(--gradient1), var(--gradient2));
  109. -webkit-background-clip: text;
  110. -webkit-text-fill-color: transparent;
  111. }
  112.  
  113. span.typeTag {
  114. color: gray !important;
  115. }
  116.  
  117. #iconmenu .glyphicon:hover {
  118. opacity: .8;
  119. }
  120.  
  121. .playbutton, #seasonalgobtn, #alphabetical > button, .plyr__control--overlaid {
  122. background: linear-gradient(to bottom right, var(--gradient1), var(--gradient2));
  123. color: var(--inverted-text-colour);
  124. }
  125.  
  126. .btn-primary:hover, .plyr__control--overlaid:hover {
  127. opacity: .8;
  128. color: var(--inverted-text-colour);
  129. }
  130.  
  131. .tooltiptext {
  132. -webkit-text-fill-color: initial;
  133. }
  134.  
  135. .genresgrid .form-check-label:hover {
  136. background: none;
  137. }
  138.  
  139. #alphabetical {
  140. display: flex;
  141. justify-content: center;
  142. }
  143.  
  144. #alphabetical > button {
  145. width: 4ch
  146. }
  147.  
  148. .playbutton, .inwardshadow, #seasonalgobtn {
  149. box-shadow: 0px 0px 15px hsl(0, 0%, 5%) inset;
  150. }
  151.  
  152. .btn-primary, #seasonalgobtn {
  153. border: 1px solid transparent;
  154. }
  155.  
  156. #lastwatch {
  157. z-index: 10;
  158. }
  159.  
  160. .nav-tabs {
  161. display: flex;
  162. align-items: flex-end
  163. }
  164.  
  165. #featuredcard {
  166. background: initial;
  167. }
  168.  
  169. .nav-tabs {
  170. border-bottom: initial;
  171. }
  172.  
  173. .nav-tabs li a {
  174. background: none;
  175. }
  176.  
  177. .nav-tabs li a:hover, #openschedulebtn, #showcommentbtn, #manualtrackbtn, #animebtn2, .nav-tabs .active a, #followbtn, #trackbtn, #animebtn2, .nav-tabs .active a, #tracknumber, #progressnumber, #playerbottomicon, .changepassbtn, .changeuserbtn, .loginbtn, #fullresultbtn a {
  178. background: var(--select-color) !important;
  179. color: var(--inverted-text-colour) !important;
  180. }
  181.  
  182. #openschedulebtn > i, .rating > i {
  183. background: var(--inverted-text-colour);
  184. -webkit-background-clip: text;
  185. }
  186.  
  187. .rating > i {
  188. background: white;
  189. -webkit-background-clip: text;
  190. }
  191.  
  192. .leftbottom {
  193. opacity: 1;
  194. }
  195.  
  196. .mobilemenureplace {
  197. margin: 0
  198. }
  199.  
  200. #lastwatch {
  201. padding: 10px 10px 10px 20px;
  202. }
  203.  
  204. #songContent {
  205. background: transparent;
  206. }
  207.  
  208. #songContent, #playertopmenu {
  209. background: linear-gradient(to bottom, var(--bg-primary) 50%, transparent);
  210. }
  211.  
  212. .invert {
  213. filter: invert(1);
  214. }
  215.  
  216. #reportclose {
  217. -webkit-text-fill-color: initial;
  218. }
  219.  
  220. .resultcontainer {
  221. box-shadow: none;
  222. }
  223.  
  224. #fullresultbtn {
  225. border-top: 1px solid #5b5b5b;
  226. }
  227.  
  228. #allbtn {
  229. min-width: 8ch;
  230. }
  231.  
  232. #userlistcontainer {
  233. grid-template-columns: repeat(auto-fill,minmax(var(--user-anime-width),1fr));
  234. }
  235.  
  236. @media screen and (max-width: 1000px) {
  237. body, html, #playertopmenu {
  238. background-color: var(--bg-primary);
  239. }
  240.  
  241. .middle {
  242. padding: 10px;
  243. }
  244.  
  245. #lowerplayerpage {
  246. padding: 20px;
  247. }
  248.  
  249. .subpart {
  250. background: rgb(32, 32, 32);
  251. }
  252.  
  253. #showcommentbtn {
  254. width: max(30%, 200px);
  255. }
  256.  
  257. .playerpage {
  258. min-height: 0px !important;
  259. }
  260.  
  261. #disquscomment {
  262. background: transparent !important;
  263. }
  264.  
  265. .rightside {
  266. background-color: var(--bg-secondary) !important;
  267. filter: drop-shadow(-1px 1px 2px black);
  268. }
  269. }
  270. `;
  271.  
  272. document.head.appendChild(style);