StarTube Early 2011 Aozora Tweaks by thxdeeply

Screenshot of StarTube Early 2011 Aozora Tweaks
Details

Authorthxdeeply
LicenseNo License
Categoryyoutube.com
Created1 week, 6 days ago
Updated6 days, 21 hours ago
Size40 kB
Statistics

Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description

This style, powered with V3 and StarTube's 2011 theme, makes YouTube look more accurate to 2011 while keeping modern features intact.
Notes

Requires Vorapis and StarTube. Enable the 2011 theme in StarTube's settings.
This is a fork of griffenhiggins' theme (https://userstyles.world/style/15437/youtube-2011-theme-for-startube)
2010-2011 player by 11pixels (https://github.com/XYZenix/XYZenixThemes/tree/master/YoutubeThemes/v3-themes)
20241005.3.0: Added meta stuff and checkbox/slider options
20241005.4.0: Added live chat and playlist designs
20241010.5.0: Added more accuracy, icon fixes, and a few other things
Source code

Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link.
/* ==UserStyle==
@name         StarTube Early 2011 Aozora Tweaks
@version      20241011.5.3
@namespace    https://userstyles.world/user/thxdeeply
@description  This style, powered with V3 and StarTube's 2011 theme, makes YouTube look more accurate to 2011 while keeping modern features intact.
@author       thxdeeply
@license      No License
@preprocessor   stylus

@var  select  autoplay-control "Autoplay Controls"  ["slider:Slider", "checkbox:Checkbox"]
@var  select  logo "Logo Color"  ["red:Red", "orange:Orange", "yellow:Yellow", "green:Green", "cyan:Cyan", "blue:Blue", "purple:Purple", "pink:Pink"]
@var  select  notifs "Notification Position"  ["left:Left", "right:Right"]
==/UserStyle== */

@-moz-document domain("youtube.com") {
    /* Red */
    if logo is red {
[exp-aozora-header] body .v3 #yt-masthead #logo {
  background: no-repeat url(https://s.ytimg.com/yt/imgbin/www-master-vflai4i-q.png) -41px -120px;
}
}
    if logo is orange {
[exp-aozora-header] body .v3 #yt-masthead #logo {
  background: no-repeat url(https://raw.githubusercontent.com/thxdeeply/tweaks/refs/heads/main/StarTubeYT2011/logos/orange.png) -41px -120px;
}
}
    if logo is yellow {
[exp-aozora-header] body .v3 #yt-masthead #logo {
  background: no-repeat url(https://raw.githubusercontent.com/thxdeeply/tweaks/refs/heads/main/StarTubeYT2011/logos/yellow.png) -41px -120px;
}
}
    if logo is green {
[exp-aozora-header] body .v3 #yt-masthead #logo {
  background: no-repeat url(https://raw.githubusercontent.com/thxdeeply/tweaks/refs/heads/main/StarTubeYT2011/logos/green.png) -41px -120px;
}
}
    if logo is cyan {
[exp-aozora-header] body .v3 #yt-masthead #logo {
  background: no-repeat url(https://raw.githubusercontent.com/thxdeeply/tweaks/refs/heads/main/StarTubeYT2011/logos/cyan.png) -41px -120px;
}
}
    if logo is blue {
[exp-aozora-header] body .v3 #yt-masthead #logo {
  background: no-repeat url(https://raw.githubusercontent.com/thxdeeply/tweaks/refs/heads/main/StarTubeYT2011/logos/blue.png) -41px -120px;
}
}
    if logo is purple {
[exp-aozora-header] body .v3 #yt-masthead #logo {
  background: no-repeat url(https://raw.githubusercontent.com/thxdeeply/tweaks/refs/heads/main/StarTubeYT2011/logos/purple.png) -41px -120px;
}
}
    if logo is pink {
[exp-aozora-header] body .v3 #yt-masthead #logo {
  background: no-repeat url(https://raw.githubusercontent.com/thxdeeply/tweaks/refs/heads/main/StarTubeYT2011/logos/pink.png) -41px -120px;
}
}
    if notifs is right {
#sb-button-notify {
    order: 3;
}
#yt-masthead-user-displayname {
  order: 1;
}
#yt-masthead-dropdown {
    order: 2;
}
}
    if notifs is left {
#sb-button-notify {
    order: 1;
}
#yt-masthead-user-displayname {
  order: 2;
  max-width: 169px;
  overflow: hidden;
  text-overflow: ellipsis;
}
#yt-masthead-dropdown {
    order: 3;
}
#yt-masthead-user #sb-button-notify {
  margin-right: 11.5px !important;
  padding-right: 9px !important;
  margin-left: 0!important;
  padding-left: 0!important;
  border-right: 1px solid #ccc!important;
  border-left: 0!important;
}
}
    /* Checkbox */
    if autoplay-control is checkbox {
.yt-uix-checkbox-on-off {
  width: 13px;
  height: 13px;
  position: relative;
  overflow: visible;
  top: -2px;
}
.yt-uix-checkbox-on-off label .toggle {
  display: none;
}
.yt-uix-checkbox-on-off input[type="checkbox"]:checked + label {
  background: transparent no-repeat url(https://raw.githubusercontent.com/thxdeeply/tweaks/refs/heads/main/StarTubeYT2011/checkbox.png) -15px -10px;
  border-radius: 0;
}
.yt-uix-checkbox-on-off input[type="checkbox"]:checked + label .checked {
  display: none;
}
.yt-uix-checkbox-on-off label {
  background: transparent no-repeat url(https://raw.githubusercontent.com/thxdeeply/tweaks/refs/heads/main/StarTubeYT2011/checkbox.png) -18px -29px;
    border-radius: 0
}
.checkbox-on-off > label {
  line-height: 1.3em;
  margin-right: -2px;
}
}
    /* Slider */
if autoplay-control is slider {
.yt-uix-checkbox-on-off {
  width: 18px;
  height: 11px;
  position: relative;
  overflow: visible;
  top: -2px;
}
.yt-uix-checkbox-on-off label .toggle {
  display: none;
}
.yt-uix-checkbox-on-off input[type="checkbox"]:checked + label {
  background: transparent no-repeat url(https://raw.githubusercontent.com/thxdeeply/tweaks/refs/heads/main/StarTubeYT2011/master-vfl181382_2010.png) -60px -142px;
    border-radius: 0
}
.yt-uix-checkbox-on-off input[type="checkbox"]:checked + label .checked {
  display: none;
}
.yt-uix-checkbox-on-off label {
  background: transparent no-repeat url(https://raw.githubusercontent.com/thxdeeply/tweaks/refs/heads/main/StarTubeYT2011/master-vfl181382_2010.png) -80px -142px;
    border-radius: 0
}
.checkbox-on-off > label {
  line-height: 1.3em;
  margin-right: -2px;
}
}
/* Other Code */
a:focus {
  background-color: #e7ecfa;
  outline: 1px solid #e7ecfa;
}
#yt-masthead-user .yt-uix-button-icon-bell {
visibility: visible;
}
#yt-masthead-dropdown {
border-top-color: #000;
margin-left: -3px;
margin-top: 10px;
}
#yt-masthead-dropdown.reversed {
border-bottom-color: #000;
}
#yt-masthead-user-displayname {
font: 12px arial,sans-serif !important;
color: #000 !important;
margin-top: 0;
}
#yt-masthead #appbar-guide-button ~ #masthead-search {
width: 410px;
}
#yt-masthead-content {
width: 630px;
}
body #masthead-expanded-container {
background: #fff;
}
#masthead-expanded .masthead-expanded-menu-item a, #footer-links-primary a, #footer-links-secondary a, .multirow-shelf .yt-uix-expander-head {
color: #03c !important;
}
#footer-links-primary a, #footer-links-secondary a, .multirow-shelf .yt-uix-expander-head {
font: 12px arial,sans-serif;
}
.distiller_yt-thread .channel_owner span {
background-color: #dbe4eb00;
}
.profileLink {
color: #4272db;
font: 11px arial,sans-serif;
}
.distiller_yt_headline {
font-size: 13px !important;
text-transform: capitalize;

}
.distiller_yt_instance {
margin-left: -25px;
}
[exp-legacy-comments] .entries .comment {
padding-left: 30px;
}
.distiller_yt-thread .channel_owner span {
padding-left: 0px;
}
.distiller_yt-thread .author .profileLink {
margin-top: 2px;
}
[exp-aozora-comments] .load-more-link:hover {
opacity: 100%;
}
[exp-aozora-comments] .proflinkPrefix {
visibility: hidden;
}
[exp-aozora-comments] .proflinkPrefix:before {
visibility: visible;
content: "@";
cursor: pointer;
}
[exp-legacy-comments] .proflink {
margin-left: -6px;
}

b {
font-weight: 100 !important;
}
.stream_content > .continuation_item_wrapper > .load-more-button > .jfk-button-text {
background-image: linear-gradient(rgb(255, 255, 255) 0%, rgb(239, 239, 239) 100%) !important;
}
.stream_content > .continuation_item_wrapper > .load-more-button > .jfk-button-text .run {
background-image: linear-gradient(rgb(255, 255, 255) 0%, rgb(239, 239, 239) 100%) !important;
font-weight: normal;
}

.distiller-standard-button .jfk-button-text {
  font-size: 12px;
    font-weight: normal;
  margin-right: 5px;
}
.distiller-standard-button, .distiller-button.jfk-button-action {
  padding: 0 6px !important;
  height: 25px !important;
  border: 1px solid #ccc !important;
  color: #000;
  background-image: linear-gradient(rgb(255, 255, 255) 0%, rgb(239, 239, 239) 100%) !important;
  border-radius: 3px;
  font-weight: normal;
  font-size: 12px;
  box-shadow: none;
  opacity: 1;
}
.distiller-standard-button:hover, .distiller-button.jfk-button-action:hover {
  box-shadow: rgb(153, 153, 153) 0px 0px 3px 0px;
  border-color: #999 !important;
  background-image: linear-gradient(rgb(255, 255, 255) 0%, rgb(235, 235, 235) 100%) !important;
}
.distiller-standard-button:active, .distiller-button.jfk-button-action:active {
  background-image: linear-gradient(rgb(204, 204, 204) 0%, rgb(255, 255, 255) 100%) !important;
  border-color: #999;
}
.autoplay-bar .checkbox-on-off {
  font-size: 13px;
  font-weight: normal;
  color: #666;
}
#watch7-sidebar-contents .autoplay-bar .watch-sidebar-head {
  color: #666;
  font-weight: normal;
}
[exp-watch5d] #watch-headline-title {
  margin-bottom: 5px;
}
[exp-watch5d] #page.watch {
  padding-top: 5px;
}
[exp-aozora-styles] #watch7-sidebar-contents .autoplay-bar .watch-sidebar-head {
  padding: 0 0 4px 0;
  border-bottom: 1px solid #e2e2e2;
  margin: 0 0 10px;
}
[exp-aozora-styles] #watch7-sidebar .watch-sidebar-separation-line {
  border-bottom: 0;
}
.all-comments {
padding: 0 3px;
border-bottom: 1px solid #e2e2e2;
color: #666;
font-weight: 400;
line-height: 1.9231em;
font-size: 1.0833em;
}
[exp-watch5c] .watch5 #watch-description-text {
  font-size: 13px;
}
.video-time, .video-actions {
  right: 5px;
  bottom: 5px;
  position: absolute;
}
#watch7-sidebar .watch-sidebar-section {
  position: relative;
  z-index: 2;
  margin: 0 0 15px 20px;
}
#watch-description #watch-description-content {
  margin-top: -2px;
}
#watch-description-extra-info {
  padding-top: 13px;
}
#watch5-description {
  margin-top: -3px;
}
#watch-description-extra-info .offer-image-thumbnail {
  margin: 5px 0 0 30px;
}
#watch5-action-panels {
  margin: 8px 0;
}
#watch-description-extra-info .metadata-info-title {
  color: #666;
  font-weight: normal;
}
#watch-description-extra-info .metadata-info {
  margin-left: 30px;
}
#watch-description-extra-info .offer-image-thumbnail {
  float: left;
  margin: 6px 0 0 30px;
  width: 60px;
}
#watch-description-extra-info .offer-links-with-thumbnail {
  margin: 6px 0 0 96px !important;
}
.watch-extras-section .title {
  text-align: left;
}
.video-list .video-list-item .description, .video-list .video-list-item .stat {
  color: #666;
}
html {
  --related-item-width: 106px;
}
[exp-watch5d] .watch5 #watch7-sentiment-actions {
  margin-top: 0;
  margin-right: 4px;
}
[exp-watch5d] #watch...
Reviews

No reviews yet.