Stream - Tolbek + Clones Widescreen + TMDB (USw) v.31

Adaptation de Stream - Tolbek + Clones Widescreen Pour "Remplacer div par card et ajouter posters sur les site de streaming [GreasyFork]". Celui-ci remplace les Titres des Films proposés par des cards et ajoute les posters depuis l'API The Movie Database.

  1. /* ==UserStyle==
  2. @name Stream - Tolbek + Clones Widescreen + TMDB (USw) v.31
  3. @namespace https://greasyfork.org/en/users/8-decembre
  4. @version 310.00
  5. @author decembre
  6. @description Adaptation de Stream - Tolbek + Clones Widescreen Pour "Remplacer div par card et ajouter posters sur les site de streaming [GreasyFork]". Celui-ci remplace les Titres des Films proposés par des cards et ajoute les posters depuis l'API The Movie Database.
  7. @license GPL version 3 or any later version;
  8.  
  9. ==/UserStyle== */
  10.  
  11. @-moz-document domain("boomycloud"), domain("yarkam.com"), domain("prifaz.com"), domain("iramiv.com"), domain("fimior.com"), domain("daykaz.com"), domain("bovriz.com"), domain("tomacloud.com"), domain("toblek.com"), domain("vistrov.com"), domain("narmid.com"), domain("slatok.com"), domain("komrav.com"), domain("sopror.com"), domain("vokorn.com"), domain("dabzov.com"), domain("zambod.com"), domain("ovoob.com"), domain("baflox.com"), domain("rizlov.com"), domain("skimox.com"), domain("brodok.com"), domain("toswi.com"), domain("brikoz.com"), domain("avbip.com"), domain("zinroz.com"), domain("vadrom.com"), domain("ladrov.com"), domain("zivbod.com"), domain("wavmiv.com"), domain("voldim.com"), domain("sevrim.com"), domain("nakrab.com"), domain("maxtrab.com"), domain("fridmax.com"), domain("mivpak.com"), domain("alkiom.com"), domain("trodak.com"), domain("podvix.com"), domain("ozpov.com"), domain("zodrop.com"), domain("padlim.com"), domain("opkap.com"), domain("batkip.com"), domain("lekrom.com"), domain("lofroz.com"), domain("roplim.com"), domain("plokim.com"), domain("zaltav.com"), domain("mokrof.com"), domain("fosrak.com"), domain("krosov.com"), domain("izorp.com"), domain("tartog.com"), domain("ofziv.com"), domain("saftim.com"), domain("fevloz.com"), domain("ziprov.com"), domain("kikraz.com"), domain("drovoo.com"), domain("kejrop.com"), domain("chotrom.com"), domain("dorcho.com"), domain("imzod.com"), domain("borbok.com"), domain("sodpak.com"), domain("lamdop.com"), domain("rivbip.com"), domain("azrov.com"), domain("blorog.com"), domain("didraf.com"), domain("viabak.com"), domain("kradax.com"), domain("quepom.com"), domain("zodrok.com"), domain("balvoz.com"), domain("movbor.com"), domain("faskap.com"), domain("aksolv.com"), domain("vifip.com"), domain("lizdi.com"), domain("fianzax.com"), domain("tiviob.com"), domain("parlif.com"), domain("vrewal.com"), domain("brafzo.com"), domain("todrak.com"), domain("yavdi.com"), domain("zadriv.com"), domain("ovgap.com"), domain("sorbod.com"), domain("trochox.com"), domain("xodop.com"), domain("ravkom.com"), domain("pavdo.com"), domain("tetriv.com"), domain("zirkad.com"), domain("grozov.com"), domain("yalkaz.com"), domain("droskop.com"), domain("nokrom.com"), domain("bigbov.com"), domain("xadrop.com"), domain("zadrip.com"), domain("friloz.com"), domain("azkov.com"), domain("diprak.com"), domain("rodzop.com"), domain("yortom.com"), domain("smitav.com"), domain("fotrov.com"), domain("kibriv.com"), domain("ivrab.com"), domain("dofroz.com"), domain("fedzak.com"), domain("govrad.com"), domain("badzap.com"), domain("bremob.com"), domain("edkoz.com"), domain("topkiv.com"), domain("kedarp.com"), domain("abokav.com"), domain("lokarn.com"), domain("apirv.com"), domain("rodkov.com"), domain("lotriz.com"), domain("urmaz.com"), domain("farliz.com"), domain("faljam.com"), domain("mobzax.com"), domain("nozgap.com"), domain("zostaz.com"), domain("domgrav.com"), domain("malgrim.com"), domain("idvram.com"), domain("karvaz.com"), domain("lomiox.com"), domain("vredap.com"), domain("biapoz.com"), domain("kambad.com"), domain("pimtip.com"), domain("awdrip.com"), domain("dolorv.com"), domain("bazrof.com"), domain("sakmiz.com"), domain("sapraz.com"), domain("titrov.com"), domain("doksov.com"), domain("prifaz.com"), domain("movpom.com"), domain("pokoli.com"), domain("veksab.com"), domain("staklam.com"), domain("vizvop.com"), domain("ikfroz.com"), domain("votark.com"), domain("sibrav.com"), domain("obivap.com"), domain("alrav.com"), domain("odvib.com"), domain("instov.com"), domain("dubraz.com"), domain("toktav.com"), domain("dromoy.com"), domain("gabanov.com"), domain("valdap.com"), domain("zorbov.com"), domain("dopriv.com"), domain("rogzov.com"), domain("fakoda.com"), domain("prokiz.com"), domain("noprak.com"), domain("madroy.com"), domain("batiav.com"), domain("lakrof.com"), domain("iramiv.com"), domain("bramtiv.com"), domain("gofram.com"), domain("azmip.com"), domain("idivov.com"), domain("frimiv.com"), domain("kobiom.com"), domain("vogfo.com"), domain("yarkam.com"), domain("okmaz.com"), domain("rolbob.com"), domain("dapwop.com"), domain("trifak.com"), domain("dozbob.com"), domain("robluv.com"), domain("drikpo.com"), domain("pradav.com"), domain("morzid.com"), domain("kolrag.com"), domain("akroov.com"), domain("folmiv.com"), domain("yakriv.com"), domain("savrod.com"), domain("fusov.com"), domain("fimior.com"), domain("lajma.com"), domain("xabriv.com"), domain("brimav.com"), domain("yisera.com"), domain("yisera.com"), domain("kidraz.com"), domain("seyav.com"), domain("epzir.com"), domain("yisera.com"), domain("yisera.com"), domain("yisera.com"), domain("yisera.com"), domain("yisera.com"), domain("yisera.com"), domain("yisera.com"), domain("yisera.com"), domain("yisera.com"), domain("yisera.com"), domain("yisera.com"), domain("yisera.com"), domain("yisera.com"), domain("yisera.com"), domain("yisera.com"), domain("yisera.com"), domain("yisera.com"), domain("yisera.com"), domain("yisera.com"), domain("yisera.com"), domain("yisera.com"), domain("yisera.com"), domain("yisera.com"), domain("yisera.com"), domain("yisera.com") {
  12. /* FOR GM "Remplacer div par card et ajouter posters sur les site de streaming" by matt1x (2023):
  13. https://greasyfork.org/fr/scripts/463692-remplacer-div-par-card-et-ajouter-posters-sur-les-site-de-streaming
  14. <a href="https://greasyfork.org/fr/scripts/463692-remplacer-div-par-card-et-ajouter-posters-sur-les-site-de-streaming">Remplacer div par card et ajouter posters sur les site de streaming</a>
  15. === */
  16.  
  17. /* ==== 0- Stream - Tolbek Clones Widescreen + TMDB (USw) v.31 ==== */
  18.  
  19. /* LAST VERSION AUTO UPDATE onn Userstyles.org - 20230727.18.24 */
  20.  
  21.  
  22. /* REQUEST API KEY TMDB:
  23. <a href="https://stackoverflow.com/questions/31047815/api-key-for-themoviedb-org">API key for themoviedb.org</a>
  24. ====== */
  25.  
  26. /* SUPP LEFT PANEl */
  27. .column1 + .column2 {
  28. display: none !important;
  29. }
  30.  
  31. /* (new6) WIDE RIGHT PANEL - ALL */
  32.  
  33. .column1 {
  34. display: inline-block !important;
  35. float: none !important;
  36. width: 100% !important;
  37. padding: 5px 5px 0 5px !important;
  38. /* border: 1px solid red !important; */
  39. }
  40.  
  41.  
  42. /* MOVIES CARDS - ALL */
  43. .movie-card {
  44. float: left !important;
  45. vertical-align: top;
  46. width: 100% !important;
  47. min-width: 10.75% !important;
  48. max-width: 10.75% !important;
  49. height: 32.5vh !important;
  50. margin: 0 4px 4px 0 !important;
  51. padding: 3px !important;
  52. border-radius: 5px;
  53. text-align: center;
  54. /* transition: transform 0.3s ease 0s; */
  55. transition: unset !important;
  56. box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  57. border: 1px solid #ccc;
  58. background: #222 !important;
  59. /* border: 1px solid red !important; */
  60. }
  61.  
  62.  
  63. /* (new6) MOVIE CARD - VISITED */
  64. .movie-card a .movie-poster {
  65. border: 1px solid #333 !important;
  66. }
  67. .movie-card a:visited .movie-poster {
  68. border: 1px solid green !important;
  69. }
  70. .movie-card a:visited .movie-info h3 {
  71. color: tomato !important;
  72. }
  73.  
  74. .movie-card:hover {
  75. transform: translateY(-5px);
  76. box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
  77. }
  78.  
  79. .movie-poster {
  80. position: relative;
  81. width: 100%;
  82. height: 23vh !important;
  83. border-radius: 5px;
  84. overflow: hidden;
  85. /* border: 1px solid aqua !important; */
  86. }
  87. .movie-poster img {
  88. display: block;
  89. height: 100% !important;
  90. width: 100%;
  91. transition: transform 0.3s ease 0s;
  92. object-fit: contain !important;
  93. }
  94.  
  95. .movie-info {
  96. float: left !important;
  97. height: 6vh !important;
  98. width: 100% !important;
  99. margin: 5px 0 0 0 !important;
  100. /* border: 1px solid red !important; */
  101. }
  102. .movie-info h3 {
  103. float: left !important;
  104. clear: none !important;
  105. width: 100% !important;
  106. height: 6vh !important;
  107. line-height: 0.9rem !important;
  108. margin: 0 0 2px 0 !important;
  109. font-size: 0.8rem !important;
  110. font-weight: bold;
  111. color: #000000;
  112. color: peru !important;
  113. }
  114. .movie-info p {
  115. float: left !important;
  116. margin: 0;
  117. font-size: 14px;
  118. color: #777;
  119. }
  120.  
  121. /* (new2) MOVIE CARD - PLAYER - FIRST */
  122. .movie-card:first-of-type {
  123. float: left !important;
  124. vertical-align: top;
  125. width: 100% !important;
  126. min-width: 42.50% !important;
  127. max-width: 42.50% !important;
  128. height: 32.5vh !important;
  129. margin: 0 16px 4px 10px !important;
  130. padding: 3px !important;
  131. border-radius: 5px;
  132. text-align: center;
  133. transition: transform 0.3s ease 0s;
  134. box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  135. background: #111 !important;
  136. border: 1px solid red !important;
  137. }
  138. .movie-card:first-of-type .movie-poster {
  139. position: relative;
  140. float: left !important;
  141. clear: none !important;
  142. width: 49% !important;
  143. height: 31.5vh !important;
  144. padding: 10px !important;
  145. border-radius: 5px;
  146. overflow: hidden;
  147. /* border: 1px solid aqua !important; */
  148. }
  149. .movie-card:first-of-type .movie-poster img {
  150. display: block;
  151. height: 100% !important;
  152. width: 100%;
  153. transition: transform 0.3s ease 0s;
  154. object-fit: contain !important;
  155. }
  156.  
  157. .movie-card:first-of-type .movie-info {
  158. float: right !important;
  159. clear: none !important;
  160. height: 18vh !important;
  161. width: 50% !important;
  162. margin: 9vh 0 0 0 !important;
  163. /* border: 1px solid red !important; */
  164. }
  165. .movie-card:first-of-type .movie-info h3 {
  166. display: inline-block !important;
  167. float: left !important;
  168. clear: none !important;
  169. vertical-align: middle !important;
  170. width: 100% !important;
  171. height: 18vh !important;
  172. line-height: 2rem !important;
  173. margin: 0 0 2px 0 !important;
  174. font-size: 2rem !important;
  175. font-weight: bold;
  176. color: #000000;
  177. color: peru !important;
  178. }
  179. .movie-card:first-of-type .movie-info p {
  180. float: left !important;
  181. margin: 0;
  182. font-size: 14px;
  183. color: #777;
  184. }
  185.  
  186.  
  187. /* (new2) MENU BOTTOM - IN PLAYER - DISPLAY NONE */
  188. br + #dernieajouts.couleur1 center#dernieresajouts {
  189. position: fixed;
  190. /* display: inline-block !important; */
  191. display: none !important;
  192. height: 20px !important;
  193. width: 25px !important;
  194. bottom: 0 !important;
  195. right: 35px !important;
  196. text-align: center !important;
  197. z-index: 5000000 !important;
  198. background-color: red !important;
  199. border: 1px solid red !important;
  200. }
  201. br + #dernieajouts.couleur1 center#dernieresajouts #navWrap {
  202. display: inline-block !important;
  203. width: 100%;
  204. height: 18px !important;
  205. width: 20px !important;
  206. padding: 0 !important;
  207. text-align: center !important;
  208. background-color: #2a2a2a;
  209. }
  210.  
  211. /* (new2) PLAYER - OPACITY */
  212.  
  213. br + #dernieajouts.couleur1 {
  214. transition-duration: 2s;
  215. /* opacity: 0.5 !important; */
  216. /* background: linear-gradient(to bottom, hsla(0,0%,1%,1) 0%,hsla(0,0%,7%,1) 100%); */ /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  217. }
  218.  
  219. br + #dernieajouts.couleur1:not(:hover) .movie-card:not(:first-of-type) {
  220. transition: opacity ease 0.7s !important;
  221. transition-duration: 2s;
  222. opacity: 0.8 !important;
  223. /* filter: opacity(0.1) !important; */
  224. filter: grayscale(1) brightness(0.15);
  225. /* background: red !important; */
  226. }
  227. br + #dernieajouts.couleur1:hover .movie-card:not(:first-of-type) {
  228. transition: opacity ease 0.7s !important;
  229. transition: filter ease 0.7s !important;
  230. transition-duration: 2s;
  231. opacity: 1 !important;
  232. /* background: red !important; */
  233. }
  234.  
  235. #dernieajouts.couleur1 .movie-card:hover {
  236. transform: translateY(0px) !important;
  237. box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
  238. }
  239.  
  240. /* (new2) MOVIES CARDS - PLAYER PAGE/ AFFICHE - NO ORIGINAL LINKS */
  241. .row .column1[style^="background-color:"] > b ~ #hann ,
  242. .column5 + .column1 #hann ,
  243. .column1 #hann {
  244. display: none !important;
  245. }
  246.  
  247. /* (new2) MOVIES CARDS - IN PLAYER */
  248. br + #dernieajouts.couleur1 .movie-card {
  249. /* float: left !important; */
  250. display: inline-block !important;
  251. vertical-align: top;
  252. width: 100% !important;
  253. min-width: 6.5% !important;
  254. max-width: 6.5% !important;
  255. height: 21vh !important;
  256. margin: 0 2px 2px 0 !important;
  257. padding: 3px !important;
  258. border-radius: 5px;
  259. text-align: center;
  260. transition: transform 0.3s ease 0s;
  261. box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  262. background-color: #111 !important;
  263. border: 1px solid #ccc;
  264. /* border: 1px solid aqua !important; */
  265. }
  266.  
  267. br + #dernieajouts.couleur1 .movie-poster {
  268. position: relative;
  269. width: 100% !important;
  270. height: 13vh !important;
  271. padding: 0 !important;
  272. border-radius: 5px;
  273. overflow: hidden;
  274. /* border: 1px solid aqua !important; */
  275. }
  276. br + #dernieajouts.couleur1 .movie-card .movie-poster img {
  277. display: block;
  278. height: 100% !important;
  279. width: 100%;
  280. transition: transform 0.3s ease 0s;
  281. object-fit: contain !important;
  282. }
  283.  
  284. br + #dernieajouts.couleur1 .movie-card .movie-info {
  285. float: left !important;
  286. height: 6vh !important;
  287. width: 100% !important;
  288. margin: 5px 0 0 0 !important;
  289. }
  290. br + #dernieajouts.couleur1 .movie-card .movie-info h3 {
  291. float: left !important;
  292. clear: none !important;
  293. width: 100% !important;
  294. height: 5vh !important;
  295. line-height: 0.9rem !important;
  296. margin: 0 0 2px 0 !important;
  297. font-size: 0.75rem !important;
  298. font-weight: bold;
  299. color: #000000;
  300. }
  301. br + #dernieajouts.couleur1 .movie-card .movie-info p {
  302. float: left !important;
  303. margin: 0;
  304. font-size: 0.7rem !important;
  305. color: #777;
  306. }
  307. /* (new2) IN AFFICHE */
  308. .row .column1[style^="background-color:"] > b ~ .movie-card {
  309. /* float: left !important; */
  310. display: inline-block !important;
  311. vertical-align: top;
  312. width: 100% !important;
  313. min-width: 8.75% !important;
  314. max-width: 8.75% !important;
  315. height: 32.5vh !important;
  316. margin: 0 6px 4px 0 !important;
  317. padding: 3px !important;
  318. border-radius: 5px;
  319. text-align: center;
  320. transition: transform 0.3s ease 0s;
  321. box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  322. background-color: #fff;
  323. }
  324.  
  325. /* (new2) FIRST CARD - LARGE - IN AFFICHE */
  326. .row .column1[style^="background-color:"] > b ~ .column20 + .movie-card {
  327. display: inline-block !important;
  328. vertical-align: top;
  329. width: 100% !important;
  330. min-width: 26.85% !important;
  331. max-width: 26.85% !important;
  332. height: 32.5vh !important;
  333. margin: 0 6px 4px 0 !important;
  334. padding: 3px !important;
  335. border-radius: 5px;
  336. text-align: center;
  337. transition: transform 0.3s ease 0s;
  338. box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
  339. background-color: #111 !important;
  340. /* border: 1px solid #ccc; */
  341. /* border: 1px solid tomato !important; */
  342. }
  343. .row .column1[style^="background-color:"] > b ~ .movie-card:hover ,
  344. .row .column1[style^="background-color:"] > b ~ .movie-card:hover .movie-poster img {
  345. transform: unset !important;
  346. }
  347. .row .column1[style^="background-color:"] > b ~ .column20 + .movie-card .movie-poster {
  348. position: relative;
  349. float: left;
  350. height: 100% !important;
  351. height: 32vh !important;
  352. width: 40% !important;
  353. margin: 0 0 0 0 !important;
  354. border-radius: 5px;
  355. overflow: hidden;
  356. /* border: 1px solid aqua !important; */
  357. }
  358. .row .column1[style^="background-color:"] > b ~ .column20 + .movie-card .movie-info {
  359. float: right !important;
  360. height: 100% !important;
  361. height: 32vh !important;
  362. width: 60% !important;
  363. margin: 0 0 0 0 !important;
  364. /* border: 1px solid olive !important; */
  365. }
  366. .row .column1[style^="background-color:"] > b ~ .column20 + .movie-card .movie-info h3 {
  367. display: inline-block !important;
  368. vertical-align: top;
  369. float: none !important;
  370. clear: none;
  371. width: 100%;
  372. height: 29vh !important;
  373. line-height: 1.9rem !important;
  374. margin: 0 0 2px !important;
  375. padding: 11vh 5px 0 5px !important;
  376. font-size: 1.8rem !important;
  377. font-weight: bold;
  378. color: peru;
  379. /* border: 1px solid olive !important; */
  380. }
  381.  
  382. /* === END ==== */
  383. }