Skip to content

Star Wars | Youtube Lightsaber Player by harshan

Write a review Install Get Stylus

Details

Authorharshan

LicenseNo License

Categorygre

Created

Updated

Size11 kB

Statistics

Learn how we calculate statistics in the FAQ.

Failed to fetch stats.

Description

gre

Notes

regre

Source code

Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link. 
/* ==UserStyle==
@name           Star Wars | Youtube Lightsaber Player
@namespace      USO Archive
@author         Amavir
@description    `If you've always dreamt of mastering The Force, well this will not help you. However, if you want to have some discrete but beautiful style modifications for your YouTube player, to watch Star Wars: The Last Jedi trailers, you're on the right side of the Internet! Wait, do you prefer Mace Windu's fancy purple lightsaber? No problem! Just use the settings below to customise your style!`
@version        20161218.0.38
@license        CC-BY-SA-4.0
@preprocessor   uso
@advanced color color_progbar "Video progress bar color" #5099FF
@advanced color color_vol "Volume slider" #ED0000
@advanced color color_true "Checked item" #5099FF
@advanced color color_false "Unchecked item" #ED0000
@advanced color color_hd "HD settings gear display" #ED0000
@advanced dropdown cog_badge "HD settings gear display size" {
	cog_badge_long "Long*" <<<EOT 40 EOT;
cog_badge_short "Short" <<<EOT 20 EOT;

}

==/UserStyle== */
@-moz-document domain("youtube.com") {
/*Def: color_progbar:#5099FF - color_vol:#ED0000 - color_hd:#ED0000 - color_true:#5099FF - color_false:#ED0000*/  
/* Barre de lecture */    /* Video progress bar */
.html5-play-progress, .ytp-play-progress {
   background: /*[[color_progbar]]*/;
   background: -moz-linear-gradient(top, /*[[color_progbar]]*/ 0%, /*[[color_progbar]]*/ 35%, #ffffff 65%, /*[[color_progbar]]*/ 100%);
   background: -webkit-linear-gradient(top, /*[[color_progbar]]*/ 0%,#ffffff 35%,#ffffff 65%,/*[[color_progbar]]*/ 100%);
   background: linear-gradient(to bottom, /*[[color_progbar]]*/ 0%,#ffffff 24%,#ffffff 65%,/*[[color_progbar]]*/ 100%);
   box-shadow: 0px 0px 20px /*[[color_progbar]]*/, 0px 0px 20px /*[[color_progbar]]*/, 0px 0px 20px /*[[color_progbar]]*/ !important;
}
   
/* Barre de chargement */    /* Video load bar */
.html5-load-progress, .ytp-load-progress {
   background: #70B9FF;
   background: -moz-linear-gradient(top, rgba(120, 120, 120, 0.3) 0%, rgba(120, 120, 120, 0.3) 45%,  rgba(255, 255, 255, 0.3) 55%, rgba(120, 120, 120, 0.3) 100%);
   background: -webkit-linear-gradient(top, rgba(120, 120, 120, 0.3) 0%, rgba(255, 255, 255, 0.3) 45%, rgba(255, 255, 255, 0.3) 55%,rgba(120, 120, 120, 0.3) 100%);
   background: linear-gradient(to bottom, rgba(120, 120, 120, 0.3) 0%, rgba(255, 255, 255, 0.3) 40%, rgba(255, 255, 255, 0.3) 55%,rgba(120, 120, 120, 0.3) 100%);
   box-shadow: 0px 0px 12px rgba(120, 120, 120, 0.3), 0px 0px 12px rgba(120, 120, 120, 0.3), 0px 0px 12px rgba(120, 120, 120, 0.3) !important;
}
   
/* Bouton de scroll */    /* Scrubber button */
.html5-scrubber-button, .ytp-scrubber-button {
   background: rgba(255, 255, 255, 0)  !important;
   border-color: rgba(255, 255, 255, 0)  !important;
   box-shadow: 0px 0px 0px rgba(255, 255, 255, 0), 0px 0px 0px rgba(255, 255, 255, 0), 0px 0px 0px rgba(255, 255, 255, 0) !important;
   transition: box-shadow 0.0s, background 0.0s !important;

      
}
/* Boutton de scroll — hover */    /* Scrubber button — hover */
.html5-scrubber-button:hover, .ytp-scrubber-button:hover {
   background: #FFFFFF !important;
   background: -moz-radial-gradient(center, ellipse cover, #ffffff 0%, #ffffff 20%, /*[[color_progbar]]*/ 100%) !important;
   background: -webkit-radial-gradient(center, ellipse cover, #ffffff 0%,#ffffff 20%,/*[[color_progbar]]*/ 100%) !important;
   background: radial-gradient(ellipse at center, #ffffff 0%,#ffffff 20%,/*[[color_progbar]]*/ 100%) !important;
   border-color: #ffffff !important;
   box-shadow: 0px 0px 10px /*[[color_progbar]]*/, 0px 0px 12px /*[[color_progbar]]*/, 0px 0px 14px /*[[color_progbar]]*/ !important; 
}

 
   
/* Réglage volume /    / Volume control bar */
.ytp-volume-slider-handle {
	position:absolute;
	top:50%;
	width:3px;
	height:14px;
	margin-top:-7px;
   margin-left:0px;
   background: /*[[color_vol]]*/ !important;
   background: -moz-linear-gradient(left, /*[[color_vol]]*/  0%, /*[[color_vol]]*/  35%, #ffffff 65%, /*[[color_vol]]*/  100%) !important;
   background: -webkit-linear-gradient(left, /*[[color_vol]]*/  0%,#ffffff 35%,#ffffff 65%,/*[[color_vol]]*/  100%) !important;
   background: linear-gradient(to right, /*[[color_vol]]*/ 0%,#ffffff 24%,#ffffff 65%,/*[[color_vol]]*/ 100%) !important;
   box-shadow: 0px 0px 10px /*[[color_vol]]*/, 0px 0px 10px /*[[color_vol]]*/, 0px 0px 10px /*[[color_vol]]*/ !important;
}
.ytp-big-mode .ytp-volume-slider-handle {
	width:4px;
	height:22px;
	margin-top:-11px
}


.ytp-volume-slider-handle:before,.ytp-volume-slider-handle:after {
   background: #ffffff !important;
   background: -moz-linear-gradient(top, /*[[color_vol]]*/ 0%, /*[[color_vol]]*/ 35%, #ffffff 65%, /*[[color_vol]]*/ 100%) !important;
   background: -webkit-linear-gradient(top, /*[[color_vol]]*/ 0%,#ffffff 35%,#ffffff 65%,/*[[color_vol]]*/ 100%) !important;
   background: linear-gradient(to bottom, /*[[color_vol]]*/ 0%,#ffffff 24%,#ffffff 65%,/*[[color_vol]]*/ 100%) !important;
/*   box-shadow: 0px 0px 5px #ED0000, 0px 0px 5px #ED0000, 0px 0px 5px #ED0000 !important;*/
	width:50px;
   margin-left:-50px;
}
.ytp-volume-slider-handle:after {
	left:0px;
	background:rgba(255,255,255,.2)
}
.ytp-big-mode .ytp-volume-slider-handle:before,.ytp-volume-slider-handle:after {
	width:50px;
	height:2.5px;
}
.ytp-big-mode .ytp-volume-slider-handle:after {
	left:-46px;
	background:rgba(255,255,255,.2)
}
   
/* Badge HD-4k-5k-8k-3D */
.ytp-settings-button.ytp-hd-quality-badge::after, .ytp-settings-button.ytp-4k-quality-badge::after, .ytp-settings-button.ytp-5k-quality-badge::after, .ytp-settings-button.ytp-8k-quality-badge::after {
   width:3px;
   height:/*[[cog_badge]]*/px;
 	 top:8px;
 	 right:17px;
   background: /*[[color_hd]]*/ !important;
   background: -moz-linear-gradient(left, /*[[color_hd]]*/ 0%, /*[[color_hd]]*/ 35%, #ffffff 65%, /*[[color_hd]]*/ 100%) !important;
   background: -webkit-linear-gradient(left, /*[[color_hd]]*/ 0%,#ffffff 35%,#ffffff 65%,/*[[color_hd]]*/ 100%) !important;
   background: linear-gradient(to right, /*[[color_hd]]*/ 0%,#ffffff 24%,#ffffff 65%,/*[[color_hd]]*/ 100%) !important;
   box-shadow: 0px 0px 10px /*[[color_hd]]*/, 0px 0px 10px /*[[color_hd]]*/, 0px 0px 10px /*[[color_hd]]*/ !important;
   content:''
}
.ytp-big-mode .ytp-settings-button.ytp-hd-quality-badge:after,.ytp-big-mode .ytp-settings-button.ytp-4k-quality-badge:after,.ytp-big-mode .ytp-settings-button.ytp-5k-quality-badge:after,.ytp-big-mode .ytp-settings-button.ytp-8k-quality-badge:after,.ytp-big-mode .ytp-settings-button.ytp-3d-badge-grey:after,.ytp-big-mode .ytp-settings-button.ytp-3d-badge:after {
   width:3px;
   height: calc(/*[[cog_badge]]*/px*1.4) ;
 	 top:10px;
 	 right:23px;
   content:'';
   background-image:none;

}
.ytp-settings-button.ytp-3d-badge::after {
   width:4px;
   height:/*[[cog_badge]]*/px;
 	 top:8px;
 	 right:16px;
   background: #00ED00 !important;
   background: -moz-linear-gradient(left, #00ED00 0%, #00ED00 35%, #ffffff 65%, #00ED00 100%) !important;
   background: -webkit-linear-gradient(left, #00ED00 0%,#ffffff 35%,#ffffff 65%,#00ED00 100%) !important;
   background: linear-gradient(to right, #00ED00 0%,#ffffff 24%,#ffffff 65%,#00ED00 100%) !important;
   box-shadow: 0px 0px 10px #00ED00, 0px 0px 10px #00ED00, 0px 0px 10px #00ED00 !important;
   content:''
}
.ytp-big-mode .ytp-settings-button.ytp-3d-badge::after {
   width:3px;
   height: calc(/*[[cog_badge]]*/px*1.4) ;
 	 top:10px;
 	 right:23px;
   content:''
}

   
   
/* Lettres HD dans menu */    /* HD letters in menu */
.ytp-swatch-color {
   color: /*[[color_progbar]]*/ !important;
}
   
/* Item coché */    /* Checked item */
.ytp-menuitem[aria-checked="true"] .ytp-menuitem-toggle-checkbox {
   background: #FFFFFF !important;
   background: -moz-radial-gradient(center, ellipse cover, #ffffff 0%, #ffffff 20%, /*[[color_true]]*/ 100%) !important;
   background: -webkit-radial-gradient(center, ellipse cover, #ffffff 0%,#ffffff 20%,/*[[color_true]]*/ 100%) !important;
   background: radial-gradient(ellipse at center, #ffffff 0%,#ffffff 20%,/*[[color_true]]*/ 100%) !important;
   border-color: #ffffff !important;
   box-shadow: 0px 0px 10px /*[[color_true]]*/, 0px 0px 12px /*[[color_true]]*/, 0px 0px 14px /*[[color_true]]*/ !important;
   content:''
}
.ytp-menuitem[aria-checked="true"] .ytp-menuitem-toggle-checkbox:before {
	-moz-transform:translateX(-50px);
	-ms-transform:translateX(-50px);
	-webkit-transform:translateX(-50px);
	transform:translateX(-50px)
}
.ytp-big-mode .ytp-menuitem[aria-checked="true"] .ytp-menuitem-toggle-checkbox:before {
	-moz-transform:translateX(-50px);
	-ms-transform:translateX(-50px);
	-webkit-transform:translateX(-50px);
	transform:translateX(-50px)
}

   
/* Item décoché */    /* Unchecked item */
.ytp-menuitem[aria-checked="false"] .ytp-menuitem-toggle-checkbox {
   background: #FFFFFF !important;
   background: -moz-radial-gradient(center, ellipse cover, #ffffff 0%, #ffffff 20%, /*[[color_false]]*/ 100%) !important;
   background: -webkit-radial-gradient(center, ellipse cover, #ffffff 0%,#ffffff 20%,/*[[color_false]]*/ 100%) !important;
   background: radial-gradient(ellipse at center, #ffffff 0%,#ffffff 20%,/*[[color_false]]*/ 100%) !important;
   box-shadow: 0px 0px 10px /*[[color_false]]*/, 0px 0px 12px /*[[color_true]]*/, 0px 0px 14px /*[[color_false]]*/ !important;
   content:'';
   background-image:none;

}
   
/* Logo 'Visionner sur YouTube' pour autres sites */    /* 'Watch on YouTube' logo for other websites */
.ytp-chrome-controls .ytp-button.ytp-youtube-button:hover:not([aria-disabled="true"]):not([disabled]) .ytp-svg-fill-logo-tube-lozenge {
   fill: #5099FF !important;
}
   
/* Roue réglages */     /* Settings gear */
.ytp-settings-button svg {
	-moz-transition:-moz-transform .4s cubic-bezier(.58,.24,.47,2.3);
	-webkit-transition:-webkit-transform .4s cubic-bezier(.58,.24,.47,1);
	-ms-transition:-ms-transform .4s cubic-bezier(.58,.24,.47,2.3);
   transiti...

Reviews

No reviews yet.