Advertisement
mass0070

YouTube Style

May 31st, 2021
60
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 10.15 KB | None | 0 0
  1. ytd-button-renderer.style-suggestive[is-paper-button] paper-button.ytd-button-renderer {
  2. border: 1px solid #f00;
  3. padding: var(--yt-button-padding-minus-border);
  4. }
  5. ytd-button-renderer.style-suggestive[is-paper-button] {
  6. -yt-formatted-string-deemphasize-color: rgb(255 0 0 / 0.6);
  7. background-color: transparent;
  8. color: #fff;
  9. }
  10. ytd-mini-guide-entry-renderer[active] .guide-icon.ytd-mini-guide-entry-renderer {
  11. color: #f00;
  12. }
  13. ytd-guide-entry-renderer[active] .guide-icon.ytd-guide-entry-renderer {
  14. color: #f00;
  15. }
  16. paper-toggle-button[checked]:not([disabled]) .toggle-button.paper-toggle-button {
  17. background-color: #f00;
  18. }
  19. ytd-button-renderer.style-blue-text[is-icon-button] {
  20. color: #f00;
  21. }
  22. ytd-button-renderer.style-blue-text[is-paper-button] {
  23. -yt-formatted-string-deemphasize-color: var(--yt-spec-icon-disabled);
  24. color: #f00;
  25. }
  26. a.ytd-mini-guide-entry-renderer:hover,
  27. a.ytd-mini-guide-entry-renderer:focus {
  28. background-color: rgb(255 0 0 / 0.1);
  29. }
  30. ytd-multi-page-menu-renderer > *.ytd-multi-page-menu-renderer:not(:last-child) {
  31. border-bottom: 1px solid rgb(255 0 0 / 1);
  32. }
  33. yt-icon-button.ytd-masthead {
  34. -yt-icon-button-icon-width: 24px;
  35. -yt-icon-button-icon-height: 24px;
  36. color: #f00;
  37. width: 40px;
  38. height: 40px;
  39. padding: 8px;
  40. margin-right: 8px;
  41. box-sizing: border-box;
  42. }
  43. ytd-section-list-renderer:not([hide-bottom-separator]):not([page-subtype=history]):not([page-subtype=memberships-and-purchases]):not([page-subtype=ypc-offers]) #contents.ytd-section-list-renderer > *.ytd-section-list-renderer:not(:last-child):not(ytd-page-introduction-renderer):not([item-dismissed]).ytd-section-list-renderer {
  44. border-bottom: 1px solid rgb(255 0 0 / 0.1);
  45. }
  46. #sections.ytd-guide-renderer > *.ytd-guide-renderer:not(:last-child) {
  47. border-bottom: 1px solid rgb(255 0 0 / 0.1);
  48. }
  49. ytd-guide-collapsible-section-entry-renderer.ytd-guide-section-renderer:not(:first-child) {
  50. border-top: 1px solid rgb(255 0 0 / 0.1);
  51. margin-top: 12px;
  52. padding-top: 12px;
  53. }
  54. ytd-app:not([background-color-update_]) app-drawer.ytd-app:not([persistent]).ytd-app #header.ytd-app {
  55. border-bottom: 1px solid rgb(255 0 0 / 0.1);
  56. }
  57. ytd-notification-renderer.unread #new.ytd-notification-renderer {
  58. background-color: #f00;
  59. }
  60. #sections.ytd-multi-page-menu-renderer > *.ytd-multi-page-menu-renderer:not(:last-child) {
  61. border-bottom: 1px solid rgb(255 0 0 / 0.1);
  62. }
  63. #items.yt-multi-page-menu-section-renderer > *.yt-multi-page-menu-section-renderer:hover {
  64. background-color: rgb(255 0 0 / 0.1);
  65. }
  66. ytd-compact-link-renderer[compact-link-style=compact-link-style-type-settings-sidebar][active] {
  67. background-color: rgb(255 0 0 / 0.1);
  68. }
  69. .badge-style-type-featured.ytd-badge-supported-renderer {
  70. background: #f00;
  71. color: #fff;
  72. }
  73. yt-icon.ytd-badge-supported-renderer {
  74. width: var(--ytd-badge-icon-size, 14px);
  75. height: var(--ytd-badge-icon-size, 14px);
  76. color: #f00;
  77. }
  78. .ytd-menu-renderer[button-renderer].ytd-menu-renderer:hover yt-icon.ytd-menu-renderer,
  79. #button.ytd-menu-renderer:hover yt-icon.ytd-menu-renderer {
  80. color: #f00;
  81. }
  82. paper-ripple.yt-icon-button {
  83. opacity: 0.6;
  84. color: #f00;
  85. }
  86. ytd-multi-page-menu-renderer {
  87. display: inline-block;
  88. background: var(--yt-spec-brand-background-primary);
  89. border: 1px solid rgb(255 0 0 / 0.1);
  90. border-top: none;
  91. display: -ms-flexbox;
  92. display: -webkit-flex;
  93. display: flex;
  94. -ms-flex-direction: column;
  95. -webkit-flex-direction: column;
  96. flex-direction: column;
  97. }
  98. a.yt-simple-endpoint.yt-formatted-string {
  99. color: #f00;
  100. text-decoration: var(--yt-endpoint-text-regular-decoration, none);
  101. }
  102. a.yt-simple-endpoint.yt-formatted-string:visited {
  103. color: #f00;
  104. }
  105. a.yt-simple-endpoint.yt-formatted-string:hover {
  106. color: #f00;
  107. }
  108. paper-toggle-button[checked]:not([disabled]) .toggle-button.paper-toggle-button {
  109. background-color: #f00;
  110. }
  111. ytd-sentiment-bar-renderer[activated_] #like-bar.ytd-sentiment-bar-renderer {
  112. background-color: #f00;
  113. }
  114. ytd-toggle-button-renderer.style-default-active[is-icon-button] {
  115. color: #f00;
  116. }
  117. a:-webkit-any-link {
  118. color: #bfbfbf !important;
  119. cursor: pointer;
  120. margin-left: 5px;
  121. }
  122. yt-icon.ytd-pinned-comment-badge-renderer {
  123. -iron-icon-height: 14px;
  124. -iron-icon-width: 14px;
  125. margin-right: 4px;
  126. margin-bottom: 1px;
  127. fill: #f00;
  128. }
  129. .badge-style-type-simple.ytd-badge-supported-renderer {
  130. background: rgb(255 0 0 / 1);
  131. color: #fff;
  132. }
  133. element.style {
  134. -ytd-author-comment-badge-background-color: #f00;
  135. -ytd-author-comment-badge-name-color: #ffffff;
  136. -ytd-author-comment-badge-icon-color: #ffffff;
  137. }
  138. paper-ripple.paper-button {
  139. color: rgb(255 0 0 / 0.6);
  140. }
  141. paper-button.ytd-subscribe-button-renderer {
  142. background-color: #f00;
  143. border-radius: 2px;
  144. color: var(--yt-spec-static-brand-white);
  145. padding: var(--yt-button-padding);
  146. margin: auto var(--ytd-subscribe-button-margin, 4px);
  147. white-space: nowrap;
  148. font-size: var(--ytd-tab-system_-_font-size);
  149. font-weight: var(--ytd-tab-system_-_font-weight);
  150. letter-spacing: var(--ytd-tab-system_-_letter-spacing);
  151. text-transform: var(--ytd-tab-system_-_text-transform);
  152. display: -ms-flexbox;
  153. display: -webkit-flex;
  154. display: flex;
  155. -ms-flex-direction: row;
  156. -webkit-flex-direction: row;
  157. flex-direction: row;
  158. }
  159. .more-button.ytd-comment-replies-renderer,
  160. .less-button.ytd-comment-replies-renderer {
  161. color: #f00;
  162. -iron-icon_-_margin-left: -6px;
  163. -iron-icon_-_margin-bottom: initial;
  164. -iron-icon_-_margin-right: initial;
  165. -iron-icon_-_width: initial;
  166. -iron-icon_-_height: initial;
  167. -iron-icon_-_margin-top: initial;
  168. -ms-flex-align: center;
  169. -webkit-align-items: center;
  170. align-items: center;
  171. display: -ms-inline-flexbox;
  172. display: -webkit-inline-flex;
  173. display: inline-flex;
  174. }
  175. yt-button-renderer #button.yt-button-renderer {
  176. color: #f00;
  177. background-color: transparent;
  178. text-transform: inherit;
  179. }
  180. ytd-video-secondary-info-renderer {
  181. display: block;
  182. border-bottom: 1px solid rgb(255 0 0 / 0.1);
  183. margin-bottom: 24px;
  184. padding-bottom: 16px;
  185. }
  186. ytd-metadata-row-header-renderer[has-divider-line] {
  187. margin-top: 16px;
  188. border-top: 1px solid rgb(255 0 0 / 0.1);
  189. }
  190. ytd-video-primary-info-renderer {
  191. -yt-button-icon-size: 36px;
  192. display: block;
  193. border-bottom: 1px solid rgb(255 0 0 / 0.1);
  194. padding: 20px 0 8px;
  195. }
  196. #placeholder-area.ytd-comment-simplebox-renderer {
  197. cursor: text;
  198. padding-bottom: 4px;
  199. border-bottom: 1px solid rgb(255 0 0 / 0.1);
  200. -webkit-flex: 1;
  201. flex: 1;
  202. }
  203. ytd-author-comment-badge-renderer {
  204. -ytd-author-comment-badge-name-color: var(--yt-spec-text-primary);
  205. height: 20px;
  206. background-color: #f00;
  207. border-radius: 12px;
  208. margin-bottom: 2px;
  209. max-width: 100%;
  210. box-sizing: border-box;
  211. display: -ms-flexbox;
  212. display: -webkit-flex;
  213. display: flex;
  214. -ms-flex-direction: row;
  215. -webkit-flex-direction: row;
  216. flex-direction: row;
  217. -ms-flex-align: center;
  218. -webkit-align-items: center;
  219. align-items: center;
  220. display: -ms-inline-flexbox;
  221. display: -webkit-inline-flex;
  222. display: inline-flex;
  223. }
  224. #search-icon-legacy.ytd-searchbox {
  225. cursor: pointer;
  226. width: 65px;
  227. border: 1px solid rgb(255 0 0 / 0.1);
  228. background-color: var(--ytd-searchbox-legacy-button-color);
  229. border-radius: 0 2px 2px 0;
  230. margin: 0;
  231. -yt-icon-button-icon-width: 24px;
  232. -yt-icon-button-icon-height: 24px;
  233. }
  234. .more-button.ytd-video-secondary-info-renderer,
  235. .less-button.ytd-video-secondary-info-renderer {
  236. background-color: #f00;
  237. border-radius: 12px;
  238. color: var(--yt-spec-static-brand-white);
  239. padding: 2px 8px;
  240. margin: auto var(4px);
  241. white-space: nowrap;
  242. font-size: 12px;
  243. font-weight: var(--ytd-tab-system_-_font-weight);
  244. letter-spacing: var(--ytd-tab-system_-_letter-spacing);
  245. text-transform: var(--ytd-tab-system_-_text-transform);
  246. display: -ms-flexbox;
  247. display: -webkit-flex;
  248. display: flex;
  249. -ms-flex-direction: row;
  250. -webkit-flex-direction: row;
  251. flex-direction: row;
  252. }
  253. #shop-button.ytd-merch-shelf-item-renderer {
  254. background-color: #f00;
  255. border-radius: 2px;
  256. color: #ffffff;
  257. padding: 8px 12px;
  258. font-size: 1.3rem;
  259. font-weight: 500;
  260. letter-spacing: 0.007px;
  261. text-transform: uppercase;
  262. }
  263. #container.ytd-searchbox {
  264. position: relative;
  265. align-items: center;
  266. background-color: var(--yt-searchbox-background);
  267. border: 1px solid rgb(255 0 0 / 0.1);
  268. border-right: none;
  269. border-radius: 2px 0 0 2px;
  270. box-shadow: inset 0 1px 2px var(--ytd-searchbox-legacy-border-shadow-color);
  271. color: var(--yt-searchbox-text-color);
  272. padding: 2px 6px;
  273. -webkit-flex: 1;
  274. flex: 1;
  275. display: -ms-flexbox;
  276. display: -webkit-flex;
  277. display: flex;
  278. -ms-flex-direction: row;
  279. -webkit-flex-direction: row;
  280. flex-direction: row;
  281. }
  282. ytd-channel-list-sub-menu-renderer.ytd-section-list-renderer {
  283. display: block;
  284. padding: 16px 0;
  285. border-bottom: 1px solid rgb(255 0 0 / 0.1);
  286. }
  287. ytd-feed-filter-chip-bar-renderer {
  288. background-color: var(--yt-spec-brand-background-primary);
  289. border-top: 1px solid rgb(255 0 0 / 0.1);
  290. border-bottom: 1px solid rgb(255 0 0 / 0.1);
  291. display: -ms-flexbox;
  292. display: -webkit-flex;
  293. display: flex;
  294. -ms-flex-pack: center;
  295. -webkit-justify-content: center;
  296. justify-content: center;
  297. }
  298. yt-chip-cloud-chip-renderer[chip-style="STYLE_DEFAULT"],
  299. yt-chip-cloud-chip-renderer[chip-style="STYLE_HOME_FILTER"] {
  300. background-color: #f00;
  301. border: 1px solid var(--yt-spec-10-percent-layer);
  302. color: var(--yt-spec-text-primary);
  303. padding: 0 var(--ytd-margin-3x);
  304. transition: background-color 0.5s cubic-bezier(0.05, 0.0, 0.0, 1);
  305. }
  306. ytd-guide-entry-renderer[active] {
  307. background-color: rgb(255 0 0 / 0.1);
  308. }
  309. #newness-dot.ytd-guide-entry-renderer {
  310. width: 4px;
  311. height: 4px;
  312. border-radius: 50%;
  313. background-color: #f00;
  314. margin: 0 6px;
  315. display: none;
  316. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement