mirror of
https://github.com/xfgryujk/blivechat.git
synced 2025-03-13 03:10:47 +08:00
把YouTube的CSS移到单独文件
This commit is contained in:
John Smith
parent
3808609963
commit
2ec6096d4d
362
frontend/src/assets/css/youtube/yt-html.css
Normal file
362
frontend/src/assets/css/youtube/yt-html.css
Normal file
@ -0,0 +1,362 @@
|
||||
html:not(.style-scope) {
|
||||
--yt-live-chat-background-color: hsl(0, 0%, 100%);
|
||||
--yt-live-chat-action-panel-background-color: hsla(0, 0%, 93.3%, .4);
|
||||
--yt-live-chat-action-panel-background-color-transparent: hsla(0, 0%, 97%, .8);
|
||||
--yt-live-chat-mode-change-background-color: hsla(0, 0%, 93.3%, .4);
|
||||
--yt-live-chat-primary-text-color: hsl(0, 0%, 6.7%);
|
||||
--yt-live-chat-secondary-text-color: hsla(0, 0%, 6.7%, .6);
|
||||
--yt-live-chat-tertiary-text-color: hsla(0, 0%, 6.7%, .4);
|
||||
--yt-live-chat-text-input-field-inactive-underline-color: #b8b8b8;
|
||||
--yt-live-chat-text-input-field-placeholder-color: hsla(0, 0%, 6.7%, .6);
|
||||
--yt-live-chat-icon-button-color: hsla(0, 0%, 6.7%, .4);
|
||||
--yt-live-chat-enabled-send-button-color: #4285f4;
|
||||
--yt-live-chat-disabled-icon-button-color: hsla(0, 0%, 6.7%, .2);
|
||||
--yt-live-chat-picker-button-color: hsla(0, 0%, 6.7%, .4);
|
||||
--yt-live-chat-picker-button-active-color: hsla(0, 0%, 6.7%, .8);
|
||||
--yt-live-chat-picker-button-disabled-color: var(--yt-live-chat-disabled-icon-button-color);
|
||||
--yt-live-chat-picker-button-hover-color: hsla(0, 0%, 6.7%, .6);
|
||||
--yt-live-chat-mention-background-color: #ff5722;
|
||||
--yt-live-chat-mention-text-color: hsl(0, 0%, 100%);
|
||||
--yt-live-chat-deleted-message-color: rgba(0, 0, 0, .5);
|
||||
--yt-live-chat-deleted-message-bar-color: rgba(11, 11, 11, .2);
|
||||
--yt-live-chat-disabled-button-background-color: hsl(0, 0%, 93.3%);
|
||||
--yt-live-chat-disabled-button-text-color: hsla(0, 0%, 6.7%, .4);
|
||||
--yt-live-chat-sub-panel-background-color: hsl(0, 0%, 93.3%);
|
||||
--yt-live-chat-sub-panel-background-color-transparent: hsla(0, 0%, 93%, .7);
|
||||
--yt-live-chat-header-background-color: hsla(0, 0%, 93.3%, .4);
|
||||
--yt-live-chat-header-button-color: hsl(0, 0%, 6.7%);
|
||||
--yt-live-chat-error-message-color: hsl(10, 51%, 49%);
|
||||
--yt-live-chat-reconnect-message-color: hsla(0, 0%, 7%, 0.2);
|
||||
--yt-live-chat-moderator-color: hsl(225, 84%, 66%);
|
||||
--yt-live-chat-owner-color: hsl(40, 76%, 55%);
|
||||
--yt-live-chat-author-chip-owner-text-color: rgba(0,0,0,0.87);
|
||||
--yt-live-chat-author-chip-verified-background-color: #CCCCCC;
|
||||
--yt-live-chat-author-chip-verified-text-color: #606060;
|
||||
--yt-live-chat-message-highlight-background-color: #f8f8f8;
|
||||
--yt-live-chat-sponsor-color: #107516;
|
||||
--yt-live-chat-overlay-color: hsla(0, 0%, 0%, 0.6);
|
||||
--yt-live-chat-dialog-background-color: hsl(0, 0%, 100%);
|
||||
--yt-live-chat-dialog-text-color: hsla(0, 0%, 6.7%, .6);
|
||||
--yt-live-chat-poll-choice-text-color: var(--yt-spec-text-secondary);
|
||||
--yt-live-chat-poll-choice-border-color: var(--yt-spec-10-percent-layer);
|
||||
--yt-live-chat-poll-choice-vote-bar-background-color: hsla(0, 0%, 93.3%, .8);
|
||||
--yt-live-chat-poll-choice-vote-bar-background-color-selected: #F2F8FF;
|
||||
--yt-live-chat-poll-choice-color-selected: #065FD4;
|
||||
--yt-live-chat-moderation-mode-hover-background-color: hsla(0, 0%, 6.7%, .2);
|
||||
--yt-live-chat-additional-inline-action-button-color: hsl(0, 0%, 100%);
|
||||
--yt-live-chat-additional-inline-action-button-background-color: hsla(0, 0%, 26%, 0.8);
|
||||
--yt-live-chat-additional-inline-action-button-background-color-hover: hsla(0, 0%, 26%, 1.0);
|
||||
--yt-formatted-string-emoji-size: 24px;
|
||||
--yt-live-chat-emoji-size: 24px;
|
||||
--yt-live-chat-text-input-field-suggestion-background-color: hsl(0, 0%, 100%);
|
||||
--yt-live-chat-text-input-field-suggestion-background-color-hover: #eee;
|
||||
--yt-live-chat-text-input-field-suggestion-text-color: #666;
|
||||
--yt-live-chat-text-input-field-suggestion-text-color-hover: #333;
|
||||
--yt-live-chat-ticker-arrow-background: hsl(0, 0%, 97.3%);
|
||||
--yt-emoji-picker-category-background-color: var(--yt-live-chat-action-panel-background-color-transparent);
|
||||
--yt-emoji-picker-category-color: var(--yt-live-chat-secondary-text-color);
|
||||
--yt-emoji-picker-category-button-color: var(--yt-live-chat-picker-button-color);
|
||||
--yt-emoji-picker-search-background-color: hsla(0, 0%, 100%, .6);
|
||||
--yt-emoji-picker-search-color: hsla(0, 0%, 6.7%, .8);
|
||||
--yt-emoji-picker-search-placeholder-color: hsla(0, 0%, 6.7%, .6);
|
||||
--yt-live-chat-slider-active-color: #2196f3;
|
||||
--yt-live-chat-slider-container-color: #c8c8c8;
|
||||
--yt-live-chat-slider-markers-color: #505050;
|
||||
--yt-live-chat-toast-background-color: hsl(0, 0%, 20%);
|
||||
--yt-live-chat-toast-text-color: hsl(0, 0%, 100%);
|
||||
--yt-live-chat-automod-button-background-color: hsl(0, 0%, 93.3%);
|
||||
--yt-live-chat-automod-button-background-color-hover: hsla(0, 0%, 6.7%, .2);
|
||||
--yt-live-chat-countdown-opacity: 0.3;
|
||||
--yt-live-chat-shimmer-background-color: rgba(136, 136, 136, 0.2);
|
||||
--yt-live-chat-shimmer-linear-gradient: linear-gradient(0deg, rgba(255, 255, 255, 0) 40%, rgba(255, 255, 255, 0.5) 50%, rgba(255, 255, 255, 0) 65%);
|
||||
--yt-live-chat-vem-background-color: hsl(0, 0%, 93.3%);
|
||||
--yt-live-chat-upsell-dialog-renderer-button-padding: 10px 16px;
|
||||
--yt-live-chat-product-picker-icon-color: rgba(17, 17, 17, 0.6);
|
||||
--yt-live-chat-product-picker-hover-color: rgba(17, 17, 16, 0.1);
|
||||
--yt-live-chat-product-picker-disabled-icon-color: rgba(17, 17, 17, 0.4);
|
||||
--yt-pdg-paid-stickers-tab-selection-bar-color: #065FD4;
|
||||
--yt-pdg-paid-stickers-author-name-font-size: 13px;
|
||||
--yt-pdg-paid-stickers-margin-left: 38px;
|
||||
}
|
||||
|
||||
html:not(.style-scope) {
|
||||
--layout_-_display: flex;
|
||||
;
|
||||
|
||||
--layout-inline_-_display: inline-flex;
|
||||
;
|
||||
|
||||
--layout-horizontal_-_display: var(--layout_-_display);
|
||||
--layout-horizontal_-_-ms-flex-direction: row;
|
||||
--layout-horizontal_-_-webkit-flex-direction: row;
|
||||
--layout-horizontal_-_flex-direction: row;
|
||||
;
|
||||
|
||||
--layout-horizontal-reverse_-_display: var(--layout_-_display);
|
||||
--layout-horizontal-reverse_-_-ms-flex-direction: row-reverse;
|
||||
--layout-horizontal-reverse_-_-webkit-flex-direction: row-reverse;
|
||||
--layout-horizontal-reverse_-_flex-direction: row-reverse;
|
||||
;
|
||||
|
||||
--layout-vertical_-_display: var(--layout_-_display);
|
||||
--layout-vertical_-_-ms-flex-direction: column;
|
||||
--layout-vertical_-_-webkit-flex-direction: column;
|
||||
--layout-vertical_-_flex-direction: column;
|
||||
;
|
||||
|
||||
--layout-vertical-reverse_-_display: var(--layout_-_display);
|
||||
--layout-vertical-reverse_-_-ms-flex-direction: column-reverse;
|
||||
--layout-vertical-reverse_-_-webkit-flex-direction: column-reverse;
|
||||
--layout-vertical-reverse_-_flex-direction: column-reverse;
|
||||
;
|
||||
|
||||
--layout-wrap_-_-ms-flex-wrap: wrap;
|
||||
--layout-wrap_-_-webkit-flex-wrap: wrap;
|
||||
--layout-wrap_-_flex-wrap: wrap;
|
||||
;
|
||||
|
||||
--layout-wrap-reverse_-_-ms-flex-wrap: wrap-reverse;
|
||||
--layout-wrap-reverse_-_-webkit-flex-wrap: wrap-reverse;
|
||||
--layout-wrap-reverse_-_flex-wrap: wrap-reverse;
|
||||
;
|
||||
|
||||
--layout-flex-auto_-_-ms-flex: 1 1 auto;
|
||||
--layout-flex-auto_-_-webkit-flex: 1 1 auto;
|
||||
--layout-flex-auto_-_flex: 1 1 auto;
|
||||
;
|
||||
|
||||
--layout-flex-none_-_-ms-flex: none;
|
||||
--layout-flex-none_-_-webkit-flex: none;
|
||||
--layout-flex-none_-_flex: none;
|
||||
;
|
||||
|
||||
--layout-flex_-_-ms-flex: 1 1 0.000000001px;
|
||||
--layout-flex_-_-webkit-flex: 1;
|
||||
--layout-flex_-_flex: 1;
|
||||
--layout-flex_-_-webkit-flex-basis: 0.000000001px;
|
||||
--layout-flex_-_flex-basis: 0.000000001px;
|
||||
;
|
||||
|
||||
--layout-flex-2_-_-ms-flex: 2;
|
||||
--layout-flex-2_-_-webkit-flex: 2;
|
||||
--layout-flex-2_-_flex: 2;
|
||||
;
|
||||
|
||||
--layout-flex-3_-_-ms-flex: 3;
|
||||
--layout-flex-3_-_-webkit-flex: 3;
|
||||
--layout-flex-3_-_flex: 3;
|
||||
;
|
||||
|
||||
--layout-flex-4_-_-ms-flex: 4;
|
||||
--layout-flex-4_-_-webkit-flex: 4;
|
||||
--layout-flex-4_-_flex: 4;
|
||||
;
|
||||
|
||||
--layout-flex-5_-_-ms-flex: 5;
|
||||
--layout-flex-5_-_-webkit-flex: 5;
|
||||
--layout-flex-5_-_flex: 5;
|
||||
;
|
||||
|
||||
--layout-flex-6_-_-ms-flex: 6;
|
||||
--layout-flex-6_-_-webkit-flex: 6;
|
||||
--layout-flex-6_-_flex: 6;
|
||||
;
|
||||
|
||||
--layout-flex-7_-_-ms-flex: 7;
|
||||
--layout-flex-7_-_-webkit-flex: 7;
|
||||
--layout-flex-7_-_flex: 7;
|
||||
;
|
||||
|
||||
--layout-flex-8_-_-ms-flex: 8;
|
||||
--layout-flex-8_-_-webkit-flex: 8;
|
||||
--layout-flex-8_-_flex: 8;
|
||||
;
|
||||
|
||||
--layout-flex-9_-_-ms-flex: 9;
|
||||
--layout-flex-9_-_-webkit-flex: 9;
|
||||
--layout-flex-9_-_flex: 9;
|
||||
;
|
||||
|
||||
--layout-flex-10_-_-ms-flex: 10;
|
||||
--layout-flex-10_-_-webkit-flex: 10;
|
||||
--layout-flex-10_-_flex: 10;
|
||||
;
|
||||
|
||||
--layout-flex-11_-_-ms-flex: 11;
|
||||
--layout-flex-11_-_-webkit-flex: 11;
|
||||
--layout-flex-11_-_flex: 11;
|
||||
;
|
||||
|
||||
--layout-flex-12_-_-ms-flex: 12;
|
||||
--layout-flex-12_-_-webkit-flex: 12;
|
||||
--layout-flex-12_-_flex: 12;
|
||||
;
|
||||
|
||||
|
||||
|
||||
--layout-start_-_-ms-flex-align: start;
|
||||
--layout-start_-_-webkit-align-items: flex-start;
|
||||
--layout-start_-_align-items: flex-start;
|
||||
;
|
||||
|
||||
--layout-center_-_-ms-flex-align: center;
|
||||
--layout-center_-_-webkit-align-items: center;
|
||||
--layout-center_-_align-items: center;
|
||||
;
|
||||
|
||||
--layout-end_-_-ms-flex-align: end;
|
||||
--layout-end_-_-webkit-align-items: flex-end;
|
||||
--layout-end_-_align-items: flex-end;
|
||||
;
|
||||
|
||||
--layout-baseline_-_-ms-flex-align: baseline;
|
||||
--layout-baseline_-_-webkit-align-items: baseline;
|
||||
--layout-baseline_-_align-items: baseline;
|
||||
;
|
||||
|
||||
|
||||
|
||||
--layout-start-justified_-_-ms-flex-pack: start;
|
||||
--layout-start-justified_-_-webkit-justify-content: flex-start;
|
||||
--layout-start-justified_-_justify-content: flex-start;
|
||||
;
|
||||
|
||||
--layout-center-justified_-_-ms-flex-pack: center;
|
||||
--layout-center-justified_-_-webkit-justify-content: center;
|
||||
--layout-center-justified_-_justify-content: center;
|
||||
;
|
||||
|
||||
--layout-end-justified_-_-ms-flex-pack: end;
|
||||
--layout-end-justified_-_-webkit-justify-content: flex-end;
|
||||
--layout-end-justified_-_justify-content: flex-end;
|
||||
;
|
||||
|
||||
--layout-around-justified_-_-ms-flex-pack: distribute;
|
||||
--layout-around-justified_-_-webkit-justify-content: space-around;
|
||||
--layout-around-justified_-_justify-content: space-around;
|
||||
;
|
||||
|
||||
--layout-justified_-_-ms-flex-pack: justify;
|
||||
--layout-justified_-_-webkit-justify-content: space-between;
|
||||
--layout-justified_-_justify-content: space-between;
|
||||
;
|
||||
|
||||
--layout-center-center_-_-ms-flex-align: var(--layout-center_-_-ms-flex-align);
|
||||
--layout-center-center_-_-webkit-align-items: var(--layout-center_-_-webkit-align-items);
|
||||
--layout-center-center_-_align-items: var(--layout-center_-_align-items);
|
||||
--layout-center-center_-_-ms-flex-pack: var(--layout-center-justified_-_-ms-flex-pack);
|
||||
--layout-center-center_-_-webkit-justify-content: var(--layout-center-justified_-_-webkit-justify-content);
|
||||
--layout-center-center_-_justify-content: var(--layout-center-justified_-_justify-content);
|
||||
;
|
||||
|
||||
|
||||
|
||||
--layout-self-start_-_-ms-align-self: flex-start;
|
||||
--layout-self-start_-_-webkit-align-self: flex-start;
|
||||
--layout-self-start_-_align-self: flex-start;
|
||||
;
|
||||
|
||||
--layout-self-center_-_-ms-align-self: center;
|
||||
--layout-self-center_-_-webkit-align-self: center;
|
||||
--layout-self-center_-_align-self: center;
|
||||
;
|
||||
|
||||
--layout-self-end_-_-ms-align-self: flex-end;
|
||||
--layout-self-end_-_-webkit-align-self: flex-end;
|
||||
--layout-self-end_-_align-self: flex-end;
|
||||
;
|
||||
|
||||
--layout-self-stretch_-_-ms-align-self: stretch;
|
||||
--layout-self-stretch_-_-webkit-align-self: stretch;
|
||||
--layout-self-stretch_-_align-self: stretch;
|
||||
;
|
||||
|
||||
--layout-self-baseline_-_-ms-align-self: baseline;
|
||||
--layout-self-baseline_-_-webkit-align-self: baseline;
|
||||
--layout-self-baseline_-_align-self: baseline;
|
||||
;
|
||||
|
||||
|
||||
|
||||
--layout-start-aligned_-_-ms-flex-line-pack: start;
|
||||
--layout-start-aligned_-_-ms-align-content: flex-start;
|
||||
--layout-start-aligned_-_-webkit-align-content: flex-start;
|
||||
--layout-start-aligned_-_align-content: flex-start;
|
||||
;
|
||||
|
||||
--layout-end-aligned_-_-ms-flex-line-pack: end;
|
||||
--layout-end-aligned_-_-ms-align-content: flex-end;
|
||||
--layout-end-aligned_-_-webkit-align-content: flex-end;
|
||||
--layout-end-aligned_-_align-content: flex-end;
|
||||
;
|
||||
|
||||
--layout-center-aligned_-_-ms-flex-line-pack: center;
|
||||
--layout-center-aligned_-_-ms-align-content: center;
|
||||
--layout-center-aligned_-_-webkit-align-content: center;
|
||||
--layout-center-aligned_-_align-content: center;
|
||||
;
|
||||
|
||||
--layout-between-aligned_-_-ms-flex-line-pack: justify;
|
||||
--layout-between-aligned_-_-ms-align-content: space-between;
|
||||
--layout-between-aligned_-_-webkit-align-content: space-between;
|
||||
--layout-between-aligned_-_align-content: space-between;
|
||||
;
|
||||
|
||||
--layout-around-aligned_-_-ms-flex-line-pack: distribute;
|
||||
--layout-around-aligned_-_-ms-align-content: space-around;
|
||||
--layout-around-aligned_-_-webkit-align-content: space-around;
|
||||
--layout-around-aligned_-_align-content: space-around;
|
||||
;
|
||||
|
||||
|
||||
|
||||
--layout-block_-_display: block;
|
||||
;
|
||||
|
||||
--layout-invisible_-_visibility: hidden !important;
|
||||
;
|
||||
|
||||
--layout-relative_-_position: relative;
|
||||
;
|
||||
|
||||
--layout-fit_-_position: absolute;
|
||||
--layout-fit_-_top: 0;
|
||||
--layout-fit_-_right: 0;
|
||||
--layout-fit_-_bottom: 0;
|
||||
--layout-fit_-_left: 0;
|
||||
;
|
||||
|
||||
--layout-scroll_-_-webkit-overflow-scrolling: touch;
|
||||
--layout-scroll_-_overflow: auto;
|
||||
;
|
||||
|
||||
--layout-fullbleed_-_margin: 0;
|
||||
--layout-fullbleed_-_height: 100vh;
|
||||
;
|
||||
|
||||
|
||||
|
||||
--layout-fixed-top_-_position: fixed;
|
||||
--layout-fixed-top_-_top: 0;
|
||||
--layout-fixed-top_-_left: 0;
|
||||
--layout-fixed-top_-_right: 0;
|
||||
;
|
||||
|
||||
--layout-fixed-right_-_position: fixed;
|
||||
--layout-fixed-right_-_top: 0;
|
||||
--layout-fixed-right_-_right: 0;
|
||||
--layout-fixed-right_-_bottom: 0;
|
||||
;
|
||||
|
||||
--layout-fixed-bottom_-_position: fixed;
|
||||
--layout-fixed-bottom_-_right: 0;
|
||||
--layout-fixed-bottom_-_bottom: 0;
|
||||
--layout-fixed-bottom_-_left: 0;
|
||||
;
|
||||
|
||||
--layout-fixed-left_-_position: fixed;
|
||||
--layout-fixed-left_-_top: 0;
|
||||
--layout-fixed-left_-_bottom: 0;
|
||||
--layout-fixed-left_-_left: 0;
|
||||
;
|
||||
}
|
||||
30
frontend/src/assets/css/youtube/yt-icon.css
Normal file
30
frontend/src/assets/css/youtube/yt-icon.css
Normal file
@ -0,0 +1,30 @@
|
||||
canvas.yt-icon, caption.yt-icon, center.yt-icon, cite.yt-icon, code.yt-icon, dd.yt-icon, del.yt-icon, dfn.yt-icon, div.yt-icon, dl.yt-icon, dt.yt-icon, em.yt-icon, embed.yt-icon, fieldset.yt-icon, font.yt-icon, form.yt-icon, h1.yt-icon, h2.yt-icon, h3.yt-icon, h4.yt-icon, h5.yt-icon, h6.yt-icon, hr.yt-icon, i.yt-icon, iframe.yt-icon, img.yt-icon, ins.yt-icon, kbd.yt-icon, label.yt-icon, legend.yt-icon, li.yt-icon, menu.yt-icon, object.yt-icon, ol.yt-icon, p.yt-icon, pre.yt-icon, q.yt-icon, s.yt-icon, samp.yt-icon, small.yt-icon, span.yt-icon, strike.yt-icon, strong.yt-icon, sub.yt-icon, sup.yt-icon, table.yt-icon, tbody.yt-icon, td.yt-icon, tfoot.yt-icon, th.yt-icon, thead.yt-icon, tr.yt-icon, tt.yt-icon, u.yt-icon, ul.yt-icon, var.yt-icon {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.yt-icon[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
yt-icon, .yt-icon-container.yt-icon {
|
||||
display: inline-flex;
|
||||
-ms-flex-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-ms-flex-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
position: relative;
|
||||
vertical-align: middle;
|
||||
fill: currentcolor;
|
||||
stroke: none;
|
||||
width: var(--iron-icon-width, 24px);
|
||||
height: var(--iron-icon-height, 24px);
|
||||
}
|
||||
|
||||
yt-icon.external-container {
|
||||
display: none !important;
|
||||
}
|
||||
68
frontend/src/assets/css/youtube/yt-img-shadow.css
Normal file
68
frontend/src/assets/css/youtube/yt-img-shadow.css
Normal file
@ -0,0 +1,68 @@
|
||||
canvas.yt-img-shadow, caption.yt-img-shadow, center.yt-img-shadow, cite.yt-img-shadow, code.yt-img-shadow, dd.yt-img-shadow, del.yt-img-shadow, dfn.yt-img-shadow, div.yt-img-shadow, dl.yt-img-shadow, dt.yt-img-shadow, em.yt-img-shadow, embed.yt-img-shadow, fieldset.yt-img-shadow, font.yt-img-shadow, form.yt-img-shadow, h1.yt-img-shadow, h2.yt-img-shadow, h3.yt-img-shadow, h4.yt-img-shadow, h5.yt-img-shadow, h6.yt-img-shadow, hr.yt-img-shadow, i.yt-img-shadow, iframe.yt-img-shadow, img.yt-img-shadow, ins.yt-img-shadow, kbd.yt-img-shadow, label.yt-img-shadow, legend.yt-img-shadow, li.yt-img-shadow, menu.yt-img-shadow, object.yt-img-shadow, ol.yt-img-shadow, p.yt-img-shadow, pre.yt-img-shadow, q.yt-img-shadow, s.yt-img-shadow, samp.yt-img-shadow, small.yt-img-shadow, span.yt-img-shadow, strike.yt-img-shadow, strong.yt-img-shadow, sub.yt-img-shadow, sup.yt-img-shadow, table.yt-img-shadow, tbody.yt-img-shadow, td.yt-img-shadow, tfoot.yt-img-shadow, th.yt-img-shadow, thead.yt-img-shadow, tr.yt-img-shadow, tt.yt-img-shadow, u.yt-img-shadow, ul.yt-img-shadow, var.yt-img-shadow {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.yt-img-shadow[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
yt-img-shadow {
|
||||
display: inline-block;
|
||||
opacity: 0;
|
||||
transition: opacity 0.2s;
|
||||
-ms-flex: none;
|
||||
-webkit-flex: none;
|
||||
flex: none;
|
||||
}
|
||||
|
||||
yt-img-shadow.no-transition {
|
||||
opacity: 1;
|
||||
transition: none;
|
||||
}
|
||||
|
||||
yt-img-shadow.with-placeholder {
|
||||
background-color: transparent;
|
||||
min-height: unset;
|
||||
min-width: unset;
|
||||
}
|
||||
|
||||
yt-img-shadow[loaded] {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
yt-img-shadow.empty img.yt-img-shadow {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
yt-img-shadow[object-fit="FILL"] img.yt-img-shadow, yt-img-shadow[fit] img.yt-img-shadow {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
yt-img-shadow[object-fit="COVER"] img.yt-img-shadow {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
yt-img-shadow[object-fit="CONTAIN"] img.yt-img-shadow {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
yt-img-shadow[object-position="LEFT"] img.yt-img-shadow {
|
||||
object-position: left;
|
||||
}
|
||||
|
||||
img.yt-img-shadow {
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
max-height: none;
|
||||
max-width: 100%;
|
||||
border-radius: none;
|
||||
}
|
||||
@ -0,0 +1,36 @@
|
||||
canvas.yt-live-chat-author-badge-renderer, caption.yt-live-chat-author-badge-renderer, center.yt-live-chat-author-badge-renderer, cite.yt-live-chat-author-badge-renderer, code.yt-live-chat-author-badge-renderer, dd.yt-live-chat-author-badge-renderer, del.yt-live-chat-author-badge-renderer, dfn.yt-live-chat-author-badge-renderer, div.yt-live-chat-author-badge-renderer, dl.yt-live-chat-author-badge-renderer, dt.yt-live-chat-author-badge-renderer, em.yt-live-chat-author-badge-renderer, embed.yt-live-chat-author-badge-renderer, fieldset.yt-live-chat-author-badge-renderer, font.yt-live-chat-author-badge-renderer, form.yt-live-chat-author-badge-renderer, h1.yt-live-chat-author-badge-renderer, h2.yt-live-chat-author-badge-renderer, h3.yt-live-chat-author-badge-renderer, h4.yt-live-chat-author-badge-renderer, h5.yt-live-chat-author-badge-renderer, h6.yt-live-chat-author-badge-renderer, hr.yt-live-chat-author-badge-renderer, i.yt-live-chat-author-badge-renderer, iframe.yt-live-chat-author-badge-renderer, img.yt-live-chat-author-badge-renderer, ins.yt-live-chat-author-badge-renderer, kbd.yt-live-chat-author-badge-renderer, label.yt-live-chat-author-badge-renderer, legend.yt-live-chat-author-badge-renderer, li.yt-live-chat-author-badge-renderer, menu.yt-live-chat-author-badge-renderer, object.yt-live-chat-author-badge-renderer, ol.yt-live-chat-author-badge-renderer, p.yt-live-chat-author-badge-renderer, pre.yt-live-chat-author-badge-renderer, q.yt-live-chat-author-badge-renderer, s.yt-live-chat-author-badge-renderer, samp.yt-live-chat-author-badge-renderer, small.yt-live-chat-author-badge-renderer, span.yt-live-chat-author-badge-renderer, strike.yt-live-chat-author-badge-renderer, strong.yt-live-chat-author-badge-renderer, sub.yt-live-chat-author-badge-renderer, sup.yt-live-chat-author-badge-renderer, table.yt-live-chat-author-badge-renderer, tbody.yt-live-chat-author-badge-renderer, td.yt-live-chat-author-badge-renderer, tfoot.yt-live-chat-author-badge-renderer, th.yt-live-chat-author-badge-renderer, thead.yt-live-chat-author-badge-renderer, tr.yt-live-chat-author-badge-renderer, tt.yt-live-chat-author-badge-renderer, u.yt-live-chat-author-badge-renderer, ul.yt-live-chat-author-badge-renderer, var.yt-live-chat-author-badge-renderer {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.yt-live-chat-author-badge-renderer[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
yt-live-chat-author-badge-renderer {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
yt-live-chat-author-badge-renderer[type='moderator'] {
|
||||
color: var(--yt-live-chat-moderator-color, #5e84f1);
|
||||
}
|
||||
|
||||
yt-live-chat-author-badge-renderer[type='owner'] {
|
||||
color: var(--yt-live-chat-owner-color, #ffd600);
|
||||
}
|
||||
|
||||
yt-live-chat-author-badge-renderer[type='member'] {
|
||||
color: var(--yt-live-chat-sponsor-color, #107516);
|
||||
}
|
||||
|
||||
yt-live-chat-author-badge-renderer[type='verified'] {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
img.yt-live-chat-author-badge-renderer, yt-icon.yt-live-chat-author-badge-renderer {
|
||||
display: block;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
64
frontend/src/assets/css/youtube/yt-live-chat-author-chip.css
Normal file
64
frontend/src/assets/css/youtube/yt-live-chat-author-chip.css
Normal file
@ -0,0 +1,64 @@
|
||||
canvas.yt-live-chat-author-chip, caption.yt-live-chat-author-chip, center.yt-live-chat-author-chip, cite.yt-live-chat-author-chip, code.yt-live-chat-author-chip, dd.yt-live-chat-author-chip, del.yt-live-chat-author-chip, dfn.yt-live-chat-author-chip, div.yt-live-chat-author-chip, dl.yt-live-chat-author-chip, dt.yt-live-chat-author-chip, em.yt-live-chat-author-chip, embed.yt-live-chat-author-chip, fieldset.yt-live-chat-author-chip, font.yt-live-chat-author-chip, form.yt-live-chat-author-chip, h1.yt-live-chat-author-chip, h2.yt-live-chat-author-chip, h3.yt-live-chat-author-chip, h4.yt-live-chat-author-chip, h5.yt-live-chat-author-chip, h6.yt-live-chat-author-chip, hr.yt-live-chat-author-chip, i.yt-live-chat-author-chip, iframe.yt-live-chat-author-chip, img.yt-live-chat-author-chip, ins.yt-live-chat-author-chip, kbd.yt-live-chat-author-chip, label.yt-live-chat-author-chip, legend.yt-live-chat-author-chip, li.yt-live-chat-author-chip, menu.yt-live-chat-author-chip, object.yt-live-chat-author-chip, ol.yt-live-chat-author-chip, p.yt-live-chat-author-chip, pre.yt-live-chat-author-chip, q.yt-live-chat-author-chip, s.yt-live-chat-author-chip, samp.yt-live-chat-author-chip, small.yt-live-chat-author-chip, span.yt-live-chat-author-chip, strike.yt-live-chat-author-chip, strong.yt-live-chat-author-chip, sub.yt-live-chat-author-chip, sup.yt-live-chat-author-chip, table.yt-live-chat-author-chip, tbody.yt-live-chat-author-chip, td.yt-live-chat-author-chip, tfoot.yt-live-chat-author-chip, th.yt-live-chat-author-chip, thead.yt-live-chat-author-chip, tr.yt-live-chat-author-chip, tt.yt-live-chat-author-chip, u.yt-live-chat-author-chip, ul.yt-live-chat-author-chip, var.yt-live-chat-author-chip {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.yt-live-chat-author-chip[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
yt-live-chat-author-chip {
|
||||
display: inline-flex;
|
||||
-ms-flex-align: baseline;
|
||||
-webkit-align-items: baseline;
|
||||
align-items: baseline;
|
||||
}
|
||||
|
||||
#author-name.yt-live-chat-author-chip {
|
||||
box-sizing: border-box;
|
||||
border-radius: 2px;
|
||||
color: var(--yt-live-chat-secondary-text-color);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
yt-live-chat-author-chip[is-highlighted] #author-name.yt-live-chat-author-chip {
|
||||
padding: 2px 4px;
|
||||
color: var(--yt-live-chat-author-chip-verified-text-color);
|
||||
background-color: var(--yt-live-chat-author-chip-verified-background-color);
|
||||
}
|
||||
|
||||
#author-name.yt-live-chat-author-chip[type='moderator'] {
|
||||
color: var(--yt-live-chat-moderator-color);
|
||||
}
|
||||
|
||||
yt-live-chat-author-chip[is-highlighted] #author-name.yt-live-chat-author-chip[type='owner'], #author-name.yt-live-chat-author-chip[type='owner'] {
|
||||
background-color: #ffd600;
|
||||
color: var(--yt-live-chat-author-chip-owner-text-color);
|
||||
}
|
||||
|
||||
#author-name.yt-live-chat-author-chip[type='member'] {
|
||||
color: var(--yt-live-chat-sponsor-color);
|
||||
}
|
||||
|
||||
#chip-badges.yt-live-chat-author-chip:empty {
|
||||
display: none;
|
||||
}
|
||||
|
||||
yt-live-chat-author-chip[is-highlighted] #chat-badges.yt-live-chat-author-chip:not(:empty) {
|
||||
margin-left: 1px;
|
||||
}
|
||||
|
||||
yt-live-chat-author-badge-renderer.yt-live-chat-author-chip {
|
||||
margin: 0 0 0 2px;
|
||||
vertical-align: sub;
|
||||
}
|
||||
|
||||
yt-live-chat-author-chip[is-highlighted] #chip-badges.yt-live-chat-author-chip yt-live-chat-author-badge-renderer.yt-live-chat-author-chip {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
#chip-badges.yt-live-chat-author-chip yt-live-chat-author-badge-renderer.yt-live-chat-author-chip:last-of-type {
|
||||
margin-right: -2px;
|
||||
}
|
||||
@ -0,0 +1,140 @@
|
||||
canvas.yt-live-chat-item-list-renderer, caption.yt-live-chat-item-list-renderer, center.yt-live-chat-item-list-renderer, cite.yt-live-chat-item-list-renderer, code.yt-live-chat-item-list-renderer, dd.yt-live-chat-item-list-renderer, del.yt-live-chat-item-list-renderer, dfn.yt-live-chat-item-list-renderer, div.yt-live-chat-item-list-renderer, dl.yt-live-chat-item-list-renderer, dt.yt-live-chat-item-list-renderer, em.yt-live-chat-item-list-renderer, embed.yt-live-chat-item-list-renderer, fieldset.yt-live-chat-item-list-renderer, font.yt-live-chat-item-list-renderer, form.yt-live-chat-item-list-renderer, h1.yt-live-chat-item-list-renderer, h2.yt-live-chat-item-list-renderer, h3.yt-live-chat-item-list-renderer, h4.yt-live-chat-item-list-renderer, h5.yt-live-chat-item-list-renderer, h6.yt-live-chat-item-list-renderer, hr.yt-live-chat-item-list-renderer, i.yt-live-chat-item-list-renderer, iframe.yt-live-chat-item-list-renderer, img.yt-live-chat-item-list-renderer, ins.yt-live-chat-item-list-renderer, kbd.yt-live-chat-item-list-renderer, label.yt-live-chat-item-list-renderer, legend.yt-live-chat-item-list-renderer, li.yt-live-chat-item-list-renderer, menu.yt-live-chat-item-list-renderer, object.yt-live-chat-item-list-renderer, ol.yt-live-chat-item-list-renderer, p.yt-live-chat-item-list-renderer, pre.yt-live-chat-item-list-renderer, q.yt-live-chat-item-list-renderer, s.yt-live-chat-item-list-renderer, samp.yt-live-chat-item-list-renderer, small.yt-live-chat-item-list-renderer, span.yt-live-chat-item-list-renderer, strike.yt-live-chat-item-list-renderer, strong.yt-live-chat-item-list-renderer, sub.yt-live-chat-item-list-renderer, sup.yt-live-chat-item-list-renderer, table.yt-live-chat-item-list-renderer, tbody.yt-live-chat-item-list-renderer, td.yt-live-chat-item-list-renderer, tfoot.yt-live-chat-item-list-renderer, th.yt-live-chat-item-list-renderer, thead.yt-live-chat-item-list-renderer, tr.yt-live-chat-item-list-renderer, tt.yt-live-chat-item-list-renderer, u.yt-live-chat-item-list-renderer, ul.yt-live-chat-item-list-renderer, var.yt-live-chat-item-list-renderer {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.yt-live-chat-item-list-renderer[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
yt-live-chat-item-list-renderer {
|
||||
position: relative;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
yt-live-chat-item-list-renderer[moderation-mode-enabled] {
|
||||
--yt-live-chat-item-with-inline-actions-context-menu-display: none;
|
||||
--yt-live-chat-inline-action-button-container-display: flex;
|
||||
}
|
||||
|
||||
#contents.yt-live-chat-item-list-renderer {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
display: flex;
|
||||
-ms-flex-direction: column;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
#empty-state-message.yt-live-chat-item-list-renderer {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
display: flex;
|
||||
-ms-flex-direction: column;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
-ms-flex-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
#empty-state-message.yt-live-chat-item-list-renderer>yt-live-chat-message-renderer.yt-live-chat-item-list-renderer {
|
||||
color: var(--yt-live-chat-tertiary-text-color);
|
||||
background: transparent;
|
||||
font-size: 18px;
|
||||
--yt-live-chat-message-renderer-text-align: center;
|
||||
}
|
||||
|
||||
yt-icon-button.yt-live-chat-item-list-renderer {
|
||||
background-color: #2196f3;
|
||||
border-radius: 999px;
|
||||
bottom: 0;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
margin: 0 calc(50% - 16px) 8px calc(50% - 16px);
|
||||
padding: 4px;
|
||||
position: absolute;
|
||||
transition-property: bottom;
|
||||
transition-timing-function: cubic-bezier(0.0, 0.0, 0.2, 1);
|
||||
transition-duration: 0.15s;
|
||||
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
yt-icon-button.yt-live-chat-item-list-renderer[disabled] {
|
||||
bottom: -42px;
|
||||
color: #fff;
|
||||
transition-timing-function: cubic-bezier(0.4, 0.0, 1, 1);
|
||||
}
|
||||
|
||||
#item-scroller.yt-live-chat-item-list-renderer {
|
||||
-ms-flex: 1 1 0.000000001px;
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
-webkit-flex-basis: 0.000000001px;
|
||||
flex-basis: 0.000000001px;
|
||||
overflow-x: hidden;
|
||||
overflow-y: hidden;
|
||||
padding-right: var(--scrollbar-width);
|
||||
}
|
||||
|
||||
yt-live-chat-item-list-renderer[allow-scroll] #item-scroller.yt-live-chat-item-list-renderer {
|
||||
overflow-y: scroll;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
#item-offset.yt-live-chat-item-list-renderer {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#item-scroller.animated.yt-live-chat-item-list-renderer #item-offset.yt-live-chat-item-list-renderer {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#items.yt-live-chat-item-list-renderer {
|
||||
-ms-flex: 1 1 0.000000001px;
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
-webkit-flex-basis: 0.000000001px;
|
||||
flex-basis: 0.000000001px;
|
||||
padding: var(--yt-live-chat-item-list-renderer-padding, 4px 0);
|
||||
}
|
||||
|
||||
#items.yt-live-chat-item-list-renderer>*.yt-live-chat-item-list-renderer:not(:first-child) {
|
||||
border-top: var(--yt-live-chat-item-list-item-border, none);
|
||||
}
|
||||
|
||||
#item-scroller.animated.yt-live-chat-item-list-renderer #items.yt-live-chat-item-list-renderer {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
#docked-messages.yt-live-chat-item-list-renderer {
|
||||
z-index: 1;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-sticker-renderer.yt-live-chat-item-list-renderer {
|
||||
padding: 4px 24px;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-sticker-renderer.yt-live-chat-item-list-renderer[dashboard-money-feed] {
|
||||
padding: 8px 16px;
|
||||
}
|
||||
@ -0,0 +1,360 @@
|
||||
#timestamp.yt-live-chat-membership-item-renderer {
|
||||
display: var(--yt-live-chat-item-timestamp-display, inline);
|
||||
margin: var(--yt-live-chat-item-timestamp-margin, 0 8px 0 0);
|
||||
color: var(--yt-live-chat-tertiary-text-color);
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
#author-photo.yt-live-chat-membership-item-renderer {
|
||||
display: block;
|
||||
margin-right: 16px;
|
||||
|
||||
overflow: hidden;
|
||||
border-radius: 50%;
|
||||
|
||||
-ms-flex: var(--layout-flex-none_-_-ms-flex);
|
||||
-webkit-flex: var(--layout-flex-none_-_-webkit-flex);
|
||||
flex: var(--layout-flex-none_-_flex);
|
||||
}
|
||||
|
||||
#menu-button.yt-live-chat-membership-item-renderer {
|
||||
width: var(--yt-live-chat-32px-icon-button_-_width);
|
||||
height: var(--yt-live-chat-32px-icon-button_-_height);
|
||||
padding: var(--yt-live-chat-32px-icon-button_-_padding);
|
||||
}
|
||||
|
||||
#menu.yt-live-chat-membership-item-renderer {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
|
||||
|
||||
transform: translateX(100px);
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer:hover #menu.yt-live-chat-membership-item-renderer,
|
||||
yt-live-chat-membership-item-renderer[menu-visible] #menu.yt-live-chat-membership-item-renderer {
|
||||
transform: none;
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer:focus-within #menu.yt-live-chat-membership-item-renderer {
|
||||
transform: none;
|
||||
}
|
||||
|
||||
#inline-action-button-container.yt-live-chat-membership-item-renderer {
|
||||
position: absolute;
|
||||
top: -4px;
|
||||
right: 0;
|
||||
bottom: -4px;
|
||||
left: 0;
|
||||
|
||||
background-color: var(--yt-live-chat-moderation-mode-hover-background-color);
|
||||
display: none;
|
||||
|
||||
-ms-flex-align: var(--layout-center-center_-_-ms-flex-align);
|
||||
-webkit-align-items: var(--layout-center-center_-_-webkit-align-items);
|
||||
align-items: var(--layout-center-center_-_align-items);
|
||||
-ms-flex-pack: var(--layout-center-center_-_-ms-flex-pack);
|
||||
-webkit-justify-content: var(--layout-center-center_-_-webkit-justify-content);
|
||||
justify-content: var(--layout-center-center_-_justify-content);
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[has-inline-action-buttons]:hover #inline-action-button-container.yt-live-chat-membership-item-renderer {
|
||||
display: var(--layout-horizontal_-_display);
|
||||
-ms-flex-direction: var(--layout-horizontal_-_-ms-flex-direction);
|
||||
-webkit-flex-direction: var(--layout-horizontal_-_-webkit-flex-direction);
|
||||
flex-direction: var(--layout-horizontal_-_flex-direction);
|
||||
|
||||
|
||||
display: var(--yt-live-chat-inline-action-button-container-display, none);
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[has-inline-action-buttons][hide-inline-action-buttons]:hover #inline-action-button-container.yt-live-chat-membership-item-renderer {
|
||||
display: none;
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[has-inline-action-buttons]:hover #menu.yt-live-chat-membership-item-renderer {
|
||||
display: var(--yt-live-chat-item-with-inline-actions-context-menu-display, block);
|
||||
}
|
||||
|
||||
#inline-action-buttons.yt-live-chat-membership-item-renderer>*.yt-live-chat-membership-item-renderer,
|
||||
#additional-inline-action-buttons.yt-live-chat-membership-item-renderer>*.yt-live-chat-membership-item-renderer {
|
||||
--yt-button-icon-size: 36px;
|
||||
--yt-button-icon-padding: 6px;
|
||||
|
||||
color: var(--yt-white);
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
#inline-action-buttons.yt-live-chat-membership-item-renderer>*.yt-live-chat-membership-item-renderer {
|
||||
background: var(--yt-luna-black-opacity-lighten-1);
|
||||
}
|
||||
|
||||
#inline-action-buttons.yt-live-chat-membership-item-renderer>.yt-live-chat-membership-item-renderer:hover {
|
||||
background: var(--yt-luna-black);
|
||||
}
|
||||
|
||||
#additional-inline-action-buttons.yt-live-chat-membership-item-renderer>*.yt-live-chat-membership-item-renderer {
|
||||
color: var(--yt-live-chat-additional-inline-action-button-color);
|
||||
background: var(--yt-live-chat-additional-inline-action-button-background-color);
|
||||
}
|
||||
|
||||
#additional-inline-action-buttons.yt-live-chat-membership-item-renderer>.yt-live-chat-membership-item-renderer:hover {
|
||||
background: var(--yt-live-chat-additional-inline-action-button-background-color-hover);
|
||||
}
|
||||
|
||||
#additional-inline-action-buttons.yt-live-chat-membership-item-renderer:not(:empty) {
|
||||
margin-left: 32px;
|
||||
}
|
||||
|
||||
#inline-action-buttons.yt-live-chat-membership-item-renderer>*.yt-live-chat-membership-item-renderer:not(:first-child),
|
||||
#additional-inline-action-buttons.yt-live-chat-membership-item-renderer>*.yt-live-chat-membership-item-renderer:not(:first-child) {
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer {
|
||||
position: relative;
|
||||
display: block;
|
||||
|
||||
--yt-live-chat-sponsor-header-color: #0a8043;
|
||||
--yt-live-chat-sponsor-color: #0f9d58;
|
||||
--yt-live-chat-sponsor-text-color: #fff;
|
||||
--yt-live-chat-item-timestamp-display: var(--yt-live-chat-paid-message-timestamp-display, none);
|
||||
|
||||
padding: 4px 24px;
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[dashboard-money-feed] {
|
||||
padding: 0;
|
||||
|
||||
--yt-live-chat-item-timestamp-display: block;
|
||||
}
|
||||
|
||||
#card.yt-live-chat-membership-item-renderer {
|
||||
overflow: hidden;
|
||||
font-size: 14px;
|
||||
border-radius: 4px;
|
||||
|
||||
display: var(--layout-vertical_-_display);
|
||||
-ms-flex-direction: var(--layout-vertical_-_-ms-flex-direction);
|
||||
-webkit-flex-direction: var(--layout-vertical_-_-webkit-flex-direction);
|
||||
flex-direction: var(--layout-vertical_-_flex-direction);
|
||||
box-shadow: var(--shadow-elevation-2dp_-_box-shadow);
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[dashboard-money-feed] #card.yt-live-chat-membership-item-renderer {
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#header.yt-live-chat-membership-item-renderer {
|
||||
position: relative;
|
||||
|
||||
background-color: var(--yt-live-chat-sponsor-header-color);
|
||||
padding: 8px 16px;
|
||||
color: #fff;
|
||||
min-height: 20px;
|
||||
|
||||
display: var(--layout-horizontal_-_display);
|
||||
-ms-flex-direction: var(--layout-horizontal_-_-ms-flex-direction);
|
||||
-webkit-flex-direction: var(--layout-horizontal_-_-webkit-flex-direction);
|
||||
flex-direction: var(--layout-horizontal_-_flex-direction);
|
||||
-ms-flex-align: var(--layout-center_-_-ms-flex-align);
|
||||
-webkit-align-items: var(--layout-center_-_-webkit-align-items);
|
||||
align-items: var(--layout-center_-_align-items);
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[show-only-header] #header.yt-live-chat-membership-item-renderer {
|
||||
background-color: var(--yt-live-chat-sponsor-color);
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[dashboard-money-feed] #header.yt-live-chat-membership-item-renderer {
|
||||
color: var(--yt-live-chat-secondary-text-color);
|
||||
background-color: var(--yt-live-chat-background-color);
|
||||
-ms-flex-align: var(--layout-start_-_-ms-flex-align);
|
||||
-webkit-align-items: var(--layout-start_-_-webkit-align-items);
|
||||
align-items: var(--layout-start_-_align-items);
|
||||
}
|
||||
|
||||
#header-content.yt-live-chat-membership-item-renderer {
|
||||
display: var(--layout-horizontal_-_display);
|
||||
-ms-flex-direction: var(--layout-horizontal_-_-ms-flex-direction);
|
||||
-webkit-flex-direction: var(--layout-horizontal_-_-webkit-flex-direction);
|
||||
flex-direction: var(--layout-horizontal_-_flex-direction);
|
||||
-ms-flex-pack: var(--layout-justified_-_-ms-flex-pack);
|
||||
-webkit-justify-content: var(--layout-justified_-_-webkit-justify-content);
|
||||
justify-content: var(--layout-justified_-_justify-content);
|
||||
-ms-flex: var(--layout-flex_-_-ms-flex);
|
||||
-webkit-flex: var(--layout-flex_-_-webkit-flex);
|
||||
flex: var(--layout-flex_-_flex);
|
||||
-webkit-flex-basis: var(--layout-flex_-_-webkit-flex-basis);
|
||||
flex-basis: var(--layout-flex_-_flex-basis);
|
||||
-ms-flex-align: var(--layout-baseline_-_-ms-flex-align);
|
||||
-webkit-align-items: var(--layout-baseline_-_-webkit-align-items);
|
||||
align-items: var(--layout-baseline_-_align-items);
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[dashboard-money-feed] #header-content.yt-live-chat-membership-item-renderer {
|
||||
display: var(--layout-vertical_-_display);
|
||||
-ms-flex-direction: var(--layout-vertical_-_-ms-flex-direction);
|
||||
-webkit-flex-direction: var(--layout-vertical_-_-webkit-flex-direction);
|
||||
flex-direction: var(--layout-vertical_-_flex-direction);
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[dashboard-money-feed] #header-content-inner-column.yt-live-chat-membership-item-renderer {
|
||||
margin-bottom: 4px;
|
||||
|
||||
display: var(--layout-horizontal_-_display);
|
||||
-ms-flex-direction: var(--layout-horizontal_-_-ms-flex-direction);
|
||||
-webkit-flex-direction: var(--layout-horizontal_-_-webkit-flex-direction);
|
||||
flex-direction: var(--layout-horizontal_-_flex-direction);
|
||||
-ms-flex-align: var(--layout-center_-_-ms-flex-align);
|
||||
-webkit-align-items: var(--layout-center_-_-webkit-align-items);
|
||||
align-items: var(--layout-center_-_align-items);
|
||||
-ms-flex: var(--layout-flex-none_-_-ms-flex);
|
||||
-webkit-flex: var(--layout-flex-none_-_-webkit-flex);
|
||||
flex: var(--layout-flex-none_-_flex);
|
||||
}
|
||||
|
||||
#author-photo.yt-live-chat-membership-item-renderer {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
yt-icon#author-photo.yt-live-chat-membership-item-renderer {
|
||||
display: none;
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[dashboard-money-feed] yt-icon#author-photo.yt-live-chat-membership-item-renderer {
|
||||
display: block;
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer:not([dashboard-money-feed]) yt-live-chat-author-chip.yt-live-chat-membership-item-renderer {
|
||||
--yt-live-chat-sponsor-color: var(--yt-live-chat-sponsor-text-color);
|
||||
--yt-live-chat-secondary-text-color: var(--yt-live-chat-sponsor-text-color);
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[dashboard-money-feed] yt-live-chat-author-chip.yt-live-chat-membership-item-renderer {
|
||||
margin-right: 8px;
|
||||
font-weight: 500;
|
||||
--yt-live-chat-sponsor-color: var(--yt-live-chat-secondary-text-color);
|
||||
}
|
||||
|
||||
#header-subtext.yt-live-chat-membership-item-renderer {
|
||||
margin-top: 2px;
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
font-weight: 500;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
#header-subtext.yt-live-chat-membership-item-renderer:empty {
|
||||
display: none;
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[dashboard-money-feed] #header-subtext.yt-live-chat-membership-item-renderer {
|
||||
margin: 4px 0 13px;
|
||||
font-size: 11px;
|
||||
font-weight: normal;
|
||||
color: var(--yt-live-chat-secondary-text-color);
|
||||
}
|
||||
|
||||
#header-primary-text.yt-live-chat-membership-item-renderer {
|
||||
word-wrap: break-word;
|
||||
word-break: break-word;
|
||||
font-weight: 500;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
}
|
||||
|
||||
#header-primary-text.yt-live-chat-membership-item-renderer:empty {
|
||||
display: none;
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[has-primary-header-text]:not([dashboard-money-feed]) yt-live-chat-author-chip.yt-live-chat-membership-item-renderer,
|
||||
yt-live-chat-membership-item-renderer[has-primary-header-text]:not([dashboard-money-feed]) #header-subtext.yt-live-chat-membership-item-renderer {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[dashboard-money-feed] #header-primary-text.yt-live-chat-membership-item-renderer {
|
||||
display: inline;
|
||||
height: 24px;
|
||||
min-width: 16px;
|
||||
border-radius: 12px;
|
||||
margin-right: 8px;
|
||||
padding: 0 12px;
|
||||
background-color: var(--yt-live-chat-sponsor-color);
|
||||
color: var(--yt-white);
|
||||
display: var(--layout-inline_-_display, inline);
|
||||
-ms-flex-align: var(--layout-center-center_-_-ms-flex-align);
|
||||
-webkit-align-items: var(--layout-center-center_-_-webkit-align-items);
|
||||
align-items: var(--layout-center-center_-_align-items);
|
||||
-ms-flex-pack: var(--layout-center-center_-_-ms-flex-pack);
|
||||
-webkit-justify-content: var(--layout-center-center_-_-webkit-justify-content);
|
||||
justify-content: var(--layout-center-center_-_justify-content);
|
||||
font-size: var(--ytd-badge_-_font-size);
|
||||
font-weight: var(--ytd-badge_-_font-weight);
|
||||
line-height: var(--ytd-badge_-_line-height);
|
||||
}
|
||||
|
||||
#content.yt-live-chat-membership-item-renderer {
|
||||
background-color: var(--yt-live-chat-sponsor-color);
|
||||
color: var(--yt-live-chat-sponsor-text-color);
|
||||
padding: 8px 16px;
|
||||
word-wrap: break-word;
|
||||
word-break: break-word;
|
||||
font-size: 15px;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[dashboard-money-feed] #content.yt-live-chat-membership-item-renderer {
|
||||
background-color: unset;
|
||||
font-size: unset;
|
||||
color: var(--yt-live-chat-secondary-text-color);
|
||||
padding: 0 0 16px 72px;
|
||||
}
|
||||
|
||||
#content.yt-live-chat-membership-item-renderer img.yt-live-chat-membership-item-renderer {
|
||||
width: var(--yt-live-chat-emoji-size);
|
||||
height: var(--yt-live-chat-emoji-size);
|
||||
|
||||
margin: -1px 2px 1px 2px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[show-only-header] #content.yt-live-chat-membership-item-renderer,
|
||||
#deleted-state.yt-live-chat-membership-item-renderer:empty {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#deleted-state.yt-live-chat-membership-item-renderer {
|
||||
display: block;
|
||||
font-style: italic;
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
a.yt-live-chat-membership-item-renderer {
|
||||
display: inline;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
#message.yt-live-chat-membership-item-renderer a.yt-live-chat-membership-item-renderer {
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
#message.yt-live-chat-membership-item-renderer a.yt-live-chat-membership-item-renderer .mention.yt-live-chat-membership-item-renderer {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
#menu.yt-live-chat-membership-item-renderer {
|
||||
background: linear-gradient(to right, transparent, var(--yt-live-chat-sponsor-header-color) 100%);
|
||||
border-radius: 0 4px 4px 0;
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[show-only-header] #menu.yt-live-chat-membership-item-renderer {
|
||||
background: linear-gradient(to right, transparent, var(--yt-live-chat-sponsor-color) 100%);
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[dashboard-money-feed] #menu.yt-live-chat-membership-item-renderer {
|
||||
margin-top: 8px;
|
||||
background: linear-gradient(to right, transparent, var(--yt-live-chat-background-color) 40%);
|
||||
}
|
||||
@ -0,0 +1,378 @@
|
||||
canvas.yt-live-chat-paid-message-renderer, caption.yt-live-chat-paid-message-renderer, center.yt-live-chat-paid-message-renderer, cite.yt-live-chat-paid-message-renderer, code.yt-live-chat-paid-message-renderer, dd.yt-live-chat-paid-message-renderer, del.yt-live-chat-paid-message-renderer, dfn.yt-live-chat-paid-message-renderer, div.yt-live-chat-paid-message-renderer, dl.yt-live-chat-paid-message-renderer, dt.yt-live-chat-paid-message-renderer, em.yt-live-chat-paid-message-renderer, embed.yt-live-chat-paid-message-renderer, fieldset.yt-live-chat-paid-message-renderer, font.yt-live-chat-paid-message-renderer, form.yt-live-chat-paid-message-renderer, h1.yt-live-chat-paid-message-renderer, h2.yt-live-chat-paid-message-renderer, h3.yt-live-chat-paid-message-renderer, h4.yt-live-chat-paid-message-renderer, h5.yt-live-chat-paid-message-renderer, h6.yt-live-chat-paid-message-renderer, hr.yt-live-chat-paid-message-renderer, i.yt-live-chat-paid-message-renderer, iframe.yt-live-chat-paid-message-renderer, img.yt-live-chat-paid-message-renderer, ins.yt-live-chat-paid-message-renderer, kbd.yt-live-chat-paid-message-renderer, label.yt-live-chat-paid-message-renderer, legend.yt-live-chat-paid-message-renderer, li.yt-live-chat-paid-message-renderer, menu.yt-live-chat-paid-message-renderer, object.yt-live-chat-paid-message-renderer, ol.yt-live-chat-paid-message-renderer, p.yt-live-chat-paid-message-renderer, pre.yt-live-chat-paid-message-renderer, q.yt-live-chat-paid-message-renderer, s.yt-live-chat-paid-message-renderer, samp.yt-live-chat-paid-message-renderer, small.yt-live-chat-paid-message-renderer, span.yt-live-chat-paid-message-renderer, strike.yt-live-chat-paid-message-renderer, strong.yt-live-chat-paid-message-renderer, sub.yt-live-chat-paid-message-renderer, sup.yt-live-chat-paid-message-renderer, table.yt-live-chat-paid-message-renderer, tbody.yt-live-chat-paid-message-renderer, td.yt-live-chat-paid-message-renderer, tfoot.yt-live-chat-paid-message-renderer, th.yt-live-chat-paid-message-renderer, thead.yt-live-chat-paid-message-renderer, tr.yt-live-chat-paid-message-renderer, tt.yt-live-chat-paid-message-renderer, u.yt-live-chat-paid-message-renderer, ul.yt-live-chat-paid-message-renderer, var.yt-live-chat-paid-message-renderer {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.yt-live-chat-paid-message-renderer[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
#timestamp.yt-live-chat-paid-message-renderer {
|
||||
display: var(--yt-live-chat-item-timestamp-display, inline);
|
||||
margin: var(--yt-live-chat-item-timestamp-margin, 0 8px 0 0);
|
||||
color: var(--yt-live-chat-tertiary-text-color);
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
#author-photo.yt-live-chat-paid-message-renderer {
|
||||
display: block;
|
||||
margin-right: 16px;
|
||||
overflow: hidden;
|
||||
border-radius: 50%;
|
||||
-ms-flex: none;
|
||||
-webkit-flex: none;
|
||||
flex: none;
|
||||
}
|
||||
|
||||
#menu-button.yt-live-chat-paid-message-renderer {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
#menu.yt-live-chat-paid-message-renderer {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
transform: translateX(100px);
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer:hover #menu.yt-live-chat-paid-message-renderer, yt-live-chat-paid-message-renderer[menu-visible] #menu.yt-live-chat-paid-message-renderer {
|
||||
transform: none;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer:focus-within #menu.yt-live-chat-paid-message-renderer {
|
||||
transform: none;
|
||||
}
|
||||
|
||||
#inline-action-button-container.yt-live-chat-paid-message-renderer {
|
||||
position: absolute;
|
||||
top: -4px;
|
||||
right: 0;
|
||||
bottom: -4px;
|
||||
left: 0;
|
||||
background-color: var(--yt-live-chat-moderation-mode-hover-background-color);
|
||||
display: none;
|
||||
-ms-flex-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-ms-flex-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[has-inline-action-buttons]:hover #inline-action-button-container.yt-live-chat-paid-message-renderer {
|
||||
display: flex;
|
||||
-ms-flex-direction: row;
|
||||
-webkit-flex-direction: row;
|
||||
flex-direction: row;
|
||||
display: var(--yt-live-chat-inline-action-button-container-display, none);
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[has-inline-action-buttons][hide-inline-action-buttons]:hover #inline-action-button-container.yt-live-chat-paid-message-renderer {
|
||||
display: none;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[has-inline-action-buttons]:hover #menu.yt-live-chat-paid-message-renderer {
|
||||
display: var(--yt-live-chat-item-with-inline-actions-context-menu-display, block);
|
||||
}
|
||||
|
||||
#inline-action-buttons.yt-live-chat-paid-message-renderer>*.yt-live-chat-paid-message-renderer, #additional-inline-action-buttons.yt-live-chat-paid-message-renderer>*.yt-live-chat-paid-message-renderer {
|
||||
--yt-button-icon-size: 36px;
|
||||
--yt-button-icon-padding: 6px;
|
||||
color: hsl(0, 0%, 100%);
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
#inline-action-buttons.yt-live-chat-paid-message-renderer>*.yt-live-chat-paid-message-renderer {
|
||||
background: hsla(0, 0%, 6.7%, .8);
|
||||
}
|
||||
|
||||
#inline-action-buttons.yt-live-chat-paid-message-renderer>.yt-live-chat-paid-message-renderer:hover {
|
||||
background: hsl(0, 0%, 6.7%);
|
||||
}
|
||||
|
||||
#additional-inline-action-buttons.yt-live-chat-paid-message-renderer>*.yt-live-chat-paid-message-renderer {
|
||||
color: var(--yt-live-chat-additional-inline-action-button-color);
|
||||
background: var(--yt-live-chat-additional-inline-action-button-background-color);
|
||||
}
|
||||
|
||||
#additional-inline-action-buttons.yt-live-chat-paid-message-renderer>.yt-live-chat-paid-message-renderer:hover {
|
||||
background: var(--yt-live-chat-additional-inline-action-button-background-color-hover);
|
||||
}
|
||||
|
||||
#additional-inline-action-buttons.yt-live-chat-paid-message-renderer:not(:empty) {
|
||||
margin-left: 32px;
|
||||
}
|
||||
|
||||
#inline-action-buttons.yt-live-chat-paid-message-renderer>*.yt-live-chat-paid-message-renderer:not(:first-child), #additional-inline-action-buttons.yt-live-chat-paid-message-renderer>*.yt-live-chat-paid-message-renderer:not(:first-child) {
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer {
|
||||
position: relative;
|
||||
display: block;
|
||||
padding: 4px 24px;
|
||||
font-size: 15px;
|
||||
--yt-live-chat-paid-message-background-color: var(--yt-live-chat-paid-message-primary-color);
|
||||
--yt-live-chat-paid-message-header-background-color: var(--yt-live-chat-paid-message-secondary-color);
|
||||
--yt-live-chat-text-input-field-placeholder-color: var(--yt-live-chat-paid-message-color);
|
||||
--yt-live-chat-item-timestamp-display: var(--yt-live-chat-paid-message-timestamp-display, none);
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] {
|
||||
padding: 0;
|
||||
padding-bottom: 8px;
|
||||
--yt-live-chat-paid-message-background-color: transparent;
|
||||
--yt-live-chat-paid-message-header-background-color: transparent;
|
||||
--yt-live-chat-item-timestamp-display: block;
|
||||
}
|
||||
|
||||
#card.yt-live-chat-paid-message-renderer {
|
||||
border-radius: 4px;
|
||||
display: flex;
|
||||
-ms-flex-direction: column;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #card.yt-live-chat-paid-message-renderer {
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#header.yt-live-chat-paid-message-renderer {
|
||||
position: relative;
|
||||
background-color: var(--yt-live-chat-paid-message-header-background-color, #125aac);
|
||||
color: var(--yt-live-chat-paid-message-header-color, #fff);
|
||||
font-weight: 500;
|
||||
padding: 8px 16px;
|
||||
min-height: 20px;
|
||||
display: flex;
|
||||
-ms-flex-direction: row;
|
||||
-webkit-flex-direction: row;
|
||||
flex-direction: row;
|
||||
-ms-flex-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
border-top-left-radius: 4px;
|
||||
border-top-right-radius: 4px;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[show-only-header] #header.yt-live-chat-paid-message-renderer {
|
||||
border-bottom-left-radius: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #header.yt-live-chat-paid-message-renderer {
|
||||
color: var(--yt-live-chat-secondary-text-color);
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
#author-photo.yt-live-chat-paid-message-renderer {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
yt-icon#author-photo.yt-live-chat-paid-message-renderer {
|
||||
display: none;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] yt-icon#author-photo.yt-live-chat-paid-message-renderer {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#header-content.yt-live-chat-paid-message-renderer {
|
||||
display: flex;
|
||||
-ms-flex-direction: row;
|
||||
-webkit-flex-direction: row;
|
||||
flex-direction: row;
|
||||
-ms-flex-pack: justify;
|
||||
-webkit-justify-content: space-between;
|
||||
justify-content: space-between;
|
||||
-ms-flex: 1 1 0.000000001px;
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
-webkit-flex-basis: 0.000000001px;
|
||||
flex-basis: 0.000000001px;
|
||||
-ms-flex-align: baseline;
|
||||
-webkit-align-items: baseline;
|
||||
align-items: baseline;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #header-content.yt-live-chat-paid-message-renderer {
|
||||
display: flex;
|
||||
-ms-flex-direction: column;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
#header-content-primary-column.yt-live-chat-paid-message-renderer {
|
||||
display: flex;
|
||||
-ms-flex-direction: column;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
-ms-flex-pack: justify;
|
||||
-webkit-justify-content: space-between;
|
||||
justify-content: space-between;
|
||||
-ms-flex: 1 1 0.000000001px;
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
-webkit-flex-basis: 0.000000001px;
|
||||
flex-basis: 0.000000001px;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #header-content-primary-column.yt-live-chat-paid-message-renderer {
|
||||
margin-bottom: 4px;
|
||||
display: flex;
|
||||
-ms-flex-direction: row;
|
||||
-webkit-flex-direction: row;
|
||||
flex-direction: row;
|
||||
-ms-flex-align: baseline;
|
||||
-webkit-align-items: baseline;
|
||||
align-items: baseline;
|
||||
-ms-flex: none;
|
||||
-webkit-flex: none;
|
||||
flex: none;
|
||||
}
|
||||
|
||||
#author-name.yt-live-chat-paid-message-renderer {
|
||||
color: var(--yt-live-chat-paid-message-author-name-color, rgba(255, 255, 255, 0.7));
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #author-name.yt-live-chat-paid-message-renderer {
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #purchase-amount.yt-live-chat-paid-message-renderer {
|
||||
display: inline;
|
||||
height: 24px;
|
||||
min-width: 16px;
|
||||
border-radius: 12px;
|
||||
margin-right: 8px;
|
||||
padding: 0 12px;
|
||||
background-color: var(--yt-live-chat-paid-message-primary-color);
|
||||
color: var(--yt-live-chat-paid-message-color);
|
||||
display: inline-flex;
|
||||
-ms-flex-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-ms-flex-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
font-size: 1.2rem;
|
||||
font-weight: 500;
|
||||
line-height: 1.2rem;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #author-name.yt-live-chat-paid-message-renderer {
|
||||
display: block;
|
||||
color: var(--yt-live-chat-secondary-text-color);
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #author-name.yt-live-chat-paid-message-renderer[is-deleted] {
|
||||
margin: 4px 0 0;
|
||||
order: 1;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #author-name.yt-live-chat-paid-message-renderer[is-deleted].yt-live-chat-paid-message-renderer::before {
|
||||
content: '​';
|
||||
display: inline;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
#menu.yt-live-chat-paid-message-renderer {
|
||||
background: linear-gradient(to right, transparent, var(--yt-live-chat-paid-message-header-background-color, #125aac) 100%);
|
||||
border-radius: 0 4px 4px 0;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #menu.yt-live-chat-paid-message-renderer {
|
||||
margin-top: 8px;
|
||||
background: linear-gradient(to right, transparent, var(--yt-live-chat-background-color) 40%);
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[allow-animations] #content.yt-live-chat-paid-message-renderer, yt-live-chat-paid-message-renderer[allow-animations] #header.yt-live-chat-paid-message-renderer {
|
||||
transition-property: background-color, color;
|
||||
transition-duration: 0.2s;
|
||||
}
|
||||
|
||||
#content.yt-live-chat-paid-message-renderer {
|
||||
background-color: var(--yt-live-chat-paid-message-background-color, #1565c0);
|
||||
color: var(--yt-live-chat-paid-message-color, #fff);
|
||||
padding: 8px 16px;
|
||||
word-wrap: break-word;
|
||||
word-break: break-word;
|
||||
border-bottom-left-radius: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
}
|
||||
|
||||
#content.yt-live-chat-paid-message-renderer img.yt-live-chat-paid-message-renderer {
|
||||
width: var(--yt-live-chat-emoji-size);
|
||||
height: var(--yt-live-chat-emoji-size);
|
||||
margin: -1px 2px 1px 2px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #content.yt-live-chat-paid-message-renderer {
|
||||
padding: 0;
|
||||
padding-left: 72px;
|
||||
color: var(--yt-live-chat-secondary-text-color);
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[show-only-header] #content.yt-live-chat-paid-message-renderer {
|
||||
visibility: hidden;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
a.yt-live-chat-paid-message-renderer {
|
||||
display: inline;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
#message.yt-live-chat-paid-message-renderer a.yt-live-chat-paid-message-renderer {
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #message.yt-live-chat-paid-message-renderer {
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
#message.yt-live-chat-paid-message-renderer a.yt-live-chat-paid-message-renderer .mention.yt-live-chat-paid-message-renderer {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
#message.yt-live-chat-paid-message-renderer:empty, #author-name.yt-live-chat-paid-message-renderer:empty:not([is-deleted]).yt-live-chat-paid-message-renderer, #deleted-state.yt-live-chat-paid-message-renderer:empty {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#deleted-state.yt-live-chat-paid-message-renderer {
|
||||
display: block;
|
||||
font-style: italic;
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #deleted-state.yt-live-chat-paid-message-renderer[is-deleted] {
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #author-name.yt-live-chat-paid-message-renderer {
|
||||
-ms-flex: none;
|
||||
-webkit-flex: none;
|
||||
flex: none;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[show-footer-divider] #footer.yt-live-chat-paid-message-renderer::before {
|
||||
content: "";
|
||||
display: flex;
|
||||
border-top: 1px solid rgba(0, 0, 0, 0.12);
|
||||
margin: 8px 0;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[is-user-editable] #footer.yt-live-chat-paid-message-renderer:not(:empty) {
|
||||
padding-top: 8px;
|
||||
}
|
||||
252
frontend/src/assets/css/youtube/yt-live-chat-renderer.css
Normal file
252
frontend/src/assets/css/youtube/yt-live-chat-renderer.css
Normal file
@ -0,0 +1,252 @@
|
||||
yt-live-chat-renderer, yt-live-chat-item-list-renderer #item-scroller {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
yt-live-chat-renderer ::-webkit-scrollbar {
|
||||
content: '';
|
||||
}
|
||||
|
||||
yt-live-chat-renderer ::-webkit-scrollbar-thumb {
|
||||
background-color: hsla(0, 0%, 53.3%, .2);
|
||||
border: 2px solid #fcfcfc;
|
||||
min-height: 30px;
|
||||
}
|
||||
|
||||
yt-live-chat-renderer ::-webkit-scrollbar-track {
|
||||
background-color: #fcfcfc;
|
||||
}
|
||||
|
||||
|
||||
canvas.yt-live-chat-renderer, caption.yt-live-chat-renderer, center.yt-live-chat-renderer, cite.yt-live-chat-renderer, code.yt-live-chat-renderer, dd.yt-live-chat-renderer, del.yt-live-chat-renderer, dfn.yt-live-chat-renderer, div.yt-live-chat-renderer, dl.yt-live-chat-renderer, dt.yt-live-chat-renderer, em.yt-live-chat-renderer, embed.yt-live-chat-renderer, fieldset.yt-live-chat-renderer, font.yt-live-chat-renderer, form.yt-live-chat-renderer, h1.yt-live-chat-renderer, h2.yt-live-chat-renderer, h3.yt-live-chat-renderer, h4.yt-live-chat-renderer, h5.yt-live-chat-renderer, h6.yt-live-chat-renderer, hr.yt-live-chat-renderer, i.yt-live-chat-renderer, iframe.yt-live-chat-renderer, img.yt-live-chat-renderer, ins.yt-live-chat-renderer, kbd.yt-live-chat-renderer, label.yt-live-chat-renderer, legend.yt-live-chat-renderer, li.yt-live-chat-renderer, menu.yt-live-chat-renderer, object.yt-live-chat-renderer, ol.yt-live-chat-renderer, p.yt-live-chat-renderer, pre.yt-live-chat-renderer, q.yt-live-chat-renderer, s.yt-live-chat-renderer, samp.yt-live-chat-renderer, small.yt-live-chat-renderer, span.yt-live-chat-renderer, strike.yt-live-chat-renderer, strong.yt-live-chat-renderer, sub.yt-live-chat-renderer, sup.yt-live-chat-renderer, table.yt-live-chat-renderer, tbody.yt-live-chat-renderer, td.yt-live-chat-renderer, tfoot.yt-live-chat-renderer, th.yt-live-chat-renderer, thead.yt-live-chat-renderer, tr.yt-live-chat-renderer, tt.yt-live-chat-renderer, u.yt-live-chat-renderer, ul.yt-live-chat-renderer, var.yt-live-chat-renderer {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.yt-live-chat-renderer[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
yt-live-chat-renderer {
|
||||
font-size: 13px;
|
||||
--yt-emoji-picker-renderer-height: 180px;
|
||||
--yt-button-default-text-color: var(--yt-live-chat-button-default-text-color);
|
||||
--yt-button-default-background-color: var(--yt-live-chat-button-default-background-color);
|
||||
--yt-button-dark-text-color: var(--yt-live-chat-button-dark-text-color);
|
||||
--yt-button-dark-background-color: var(--yt-live-chat-button-dark-background-color);
|
||||
--yt-button-payment-background-color: var(--yt-live-chat-sponsor-color);
|
||||
}
|
||||
|
||||
yt-live-chat-renderer {
|
||||
position: relative;
|
||||
background: var(--yt-live-chat-background-color);
|
||||
color: var(--yt-live-chat-primary-text-color);
|
||||
overflow: hidden;
|
||||
z-index: 0;
|
||||
display: flex;
|
||||
-ms-flex-direction: column;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
yt-live-chat-renderer[hide-timestamps] {
|
||||
--yt-live-chat-item-timestamp-display: none;
|
||||
}
|
||||
|
||||
#separator.yt-live-chat-renderer {
|
||||
border-bottom: var(--yt-live-chat-header-bottom-border, none);
|
||||
}
|
||||
|
||||
#content-pages.yt-live-chat-renderer {
|
||||
display: flex;
|
||||
-ms-flex-direction: column;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
-ms-flex: 1 1 0.000000001px;
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
-webkit-flex-basis: 0.000000001px;
|
||||
flex-basis: 0.000000001px;
|
||||
}
|
||||
|
||||
#panel-pages.yt-live-chat-renderer {
|
||||
max-height: 100%;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
#contents.yt-live-chat-renderer {
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
#chat-messages.yt-live-chat-renderer, #contents.yt-live-chat-renderer, #item-list.yt-live-chat-renderer {
|
||||
display: flex;
|
||||
-ms-flex-direction: column;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
-ms-flex: 1 1 0.000000001px;
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
-webkit-flex-basis: 0.000000001px;
|
||||
flex-basis: 0.000000001px;
|
||||
}
|
||||
|
||||
#ticker.yt-live-chat-renderer {
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
#chat.yt-live-chat-renderer {
|
||||
position: relative;
|
||||
display: flex;
|
||||
-ms-flex-direction: column;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
-ms-flex: 1 1 0.000000001px;
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
-webkit-flex-basis: 0.000000001px;
|
||||
flex-basis: 0.000000001px;
|
||||
}
|
||||
|
||||
#chat.yt-live-chat-renderer::after {
|
||||
content: '';
|
||||
display: none;
|
||||
animation: gradient-slide 1.2s ease infinite;
|
||||
animation-name: gradient-slide;
|
||||
background-color: var(--yt-live-chat-shimmer-background-color);
|
||||
background-image: var(--yt-live-chat-shimmer-linear-gradient);
|
||||
background-size: 300% 300%;
|
||||
transform: rotateX(180deg);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
yt-live-chat-renderer[loading] #chat.yt-live-chat-renderer::after {
|
||||
display: block;
|
||||
}
|
||||
|
||||
yt-live-chat-pinned-message-renderer.yt-live-chat-renderer {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
yt-live-chat-item-list-renderer.yt-live-chat-renderer, yt-live-chat-ninja-message-renderer.yt-live-chat-renderer {
|
||||
-ms-flex: 1 1 0.000000001px;
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
-webkit-flex-basis: 0.000000001px;
|
||||
flex-basis: 0.000000001px;
|
||||
}
|
||||
|
||||
#action-panel.yt-live-chat-renderer {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
yt-live-chat-renderer[has-action-panel-renderer] yt-live-chat-action-panel-renderer.yt-live-chat-renderer {
|
||||
animation: slideUp cubic-bezier(0.05, 0.00, 0.00, 1.00) forwards;
|
||||
animation-duration: 0.5s;
|
||||
}
|
||||
|
||||
#action-panel-backdrop.yt-live-chat-renderer {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
yt-live-chat-renderer[has-action-panel-renderer] #action-panel-backdrop.yt-live-chat-renderer {
|
||||
visibility: visible;
|
||||
animation: fadeIn cubic-bezier(0.05, 0.00, 0.00, 1.00) forwards;
|
||||
animation-duration: 0.5s;
|
||||
}
|
||||
|
||||
#input-panel.yt-live-chat-renderer {
|
||||
-ms-flex: none;
|
||||
-webkit-flex: none;
|
||||
flex: none;
|
||||
}
|
||||
|
||||
#input-panel.yt-live-chat-renderer:not(:empty) {
|
||||
border-top: var(--yt-live-chat-action-panel-top-border, none);
|
||||
}
|
||||
|
||||
.hide-on-collapse.yt-live-chat-renderer {
|
||||
transition: opacity 0.3s;
|
||||
}
|
||||
|
||||
yt-live-chat-renderer[collapsed] .hide-on-collapse.yt-live-chat-renderer {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
#loading.yt-live-chat-renderer {
|
||||
height: 387px;
|
||||
background-color: var(--yt-live-chat-action-panel-background-color);
|
||||
display: flex;
|
||||
-ms-flex-direction: column;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
-ms-flex-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-ms-flex-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
#loading.yt-live-chat-renderer>paper-spinner-lite.yt-live-chat-renderer {
|
||||
--paper-spinner-color: var(--yt-live-chat-primary-text-color);
|
||||
}
|
||||
|
||||
#nitrate-promo.yt-live-chat-renderer>*.yt-live-chat-renderer {
|
||||
background: var(--yt-live-chat-overlay-color);
|
||||
z-index: 3;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
@keyframes gradient-slide {
|
||||
0% {
|
||||
background-position: 100% 100%;
|
||||
}
|
||||
to {
|
||||
background-position: 0% 0%;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes slideUp {
|
||||
0% {
|
||||
transform: translateY(15%);
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
transform: translateY(0);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes fadeIn {
|
||||
0% {
|
||||
background-color: transparent;
|
||||
}
|
||||
100% {
|
||||
background-color: rgba(0, 0, 0, 0.60);
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,230 @@
|
||||
canvas.yt-live-chat-text-message-renderer, caption.yt-live-chat-text-message-renderer, center.yt-live-chat-text-message-renderer, cite.yt-live-chat-text-message-renderer, code.yt-live-chat-text-message-renderer, dd.yt-live-chat-text-message-renderer, del.yt-live-chat-text-message-renderer, dfn.yt-live-chat-text-message-renderer, div.yt-live-chat-text-message-renderer, dl.yt-live-chat-text-message-renderer, dt.yt-live-chat-text-message-renderer, em.yt-live-chat-text-message-renderer, embed.yt-live-chat-text-message-renderer, fieldset.yt-live-chat-text-message-renderer, font.yt-live-chat-text-message-renderer, form.yt-live-chat-text-message-renderer, h1.yt-live-chat-text-message-renderer, h2.yt-live-chat-text-message-renderer, h3.yt-live-chat-text-message-renderer, h4.yt-live-chat-text-message-renderer, h5.yt-live-chat-text-message-renderer, h6.yt-live-chat-text-message-renderer, hr.yt-live-chat-text-message-renderer, i.yt-live-chat-text-message-renderer, iframe.yt-live-chat-text-message-renderer, img.yt-live-chat-text-message-renderer, ins.yt-live-chat-text-message-renderer, kbd.yt-live-chat-text-message-renderer, label.yt-live-chat-text-message-renderer, legend.yt-live-chat-text-message-renderer, li.yt-live-chat-text-message-renderer, menu.yt-live-chat-text-message-renderer, object.yt-live-chat-text-message-renderer, ol.yt-live-chat-text-message-renderer, p.yt-live-chat-text-message-renderer, pre.yt-live-chat-text-message-renderer, q.yt-live-chat-text-message-renderer, s.yt-live-chat-text-message-renderer, samp.yt-live-chat-text-message-renderer, small.yt-live-chat-text-message-renderer, span.yt-live-chat-text-message-renderer, strike.yt-live-chat-text-message-renderer, strong.yt-live-chat-text-message-renderer, sub.yt-live-chat-text-message-renderer, sup.yt-live-chat-text-message-renderer, table.yt-live-chat-text-message-renderer, tbody.yt-live-chat-text-message-renderer, td.yt-live-chat-text-message-renderer, tfoot.yt-live-chat-text-message-renderer, th.yt-live-chat-text-message-renderer, thead.yt-live-chat-text-message-renderer, tr.yt-live-chat-text-message-renderer, tt.yt-live-chat-text-message-renderer, u.yt-live-chat-text-message-renderer, ul.yt-live-chat-text-message-renderer, var.yt-live-chat-text-message-renderer {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.yt-live-chat-text-message-renderer[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
#timestamp.yt-live-chat-text-message-renderer {
|
||||
display: var(--yt-live-chat-item-timestamp-display, inline);
|
||||
margin: var(--yt-live-chat-item-timestamp-margin, 0 8px 0 0);
|
||||
color: var(--yt-live-chat-tertiary-text-color);
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
#author-photo.yt-live-chat-text-message-renderer {
|
||||
display: block;
|
||||
margin-right: 16px;
|
||||
overflow: hidden;
|
||||
border-radius: 50%;
|
||||
-ms-flex: none;
|
||||
-webkit-flex: none;
|
||||
flex: none;
|
||||
}
|
||||
|
||||
#menu-button.yt-live-chat-text-message-renderer {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
#menu.yt-live-chat-text-message-renderer {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
transform: translateX(100px);
|
||||
}
|
||||
|
||||
yt-live-chat-text-message-renderer:hover #menu.yt-live-chat-text-message-renderer, yt-live-chat-text-message-renderer[menu-visible] #menu.yt-live-chat-text-message-renderer {
|
||||
transform: none;
|
||||
}
|
||||
|
||||
yt-live-chat-text-message-renderer:focus-within #menu.yt-live-chat-text-message-renderer {
|
||||
transform: none;
|
||||
}
|
||||
|
||||
#inline-action-button-container.yt-live-chat-text-message-renderer {
|
||||
position: absolute;
|
||||
top: -4px;
|
||||
right: 0;
|
||||
bottom: -4px;
|
||||
left: 0;
|
||||
background-color: var(--yt-live-chat-moderation-mode-hover-background-color);
|
||||
display: none;
|
||||
-ms-flex-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-ms-flex-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
yt-live-chat-text-message-renderer[has-inline-action-buttons]:hover #inline-action-button-container.yt-live-chat-text-message-renderer {
|
||||
display: flex;
|
||||
-ms-flex-direction: row;
|
||||
-webkit-flex-direction: row;
|
||||
flex-direction: row;
|
||||
display: var(--yt-live-chat-inline-action-button-container-display, none);
|
||||
}
|
||||
|
||||
yt-live-chat-text-message-renderer[has-inline-action-buttons][hide-inline-action-buttons]:hover #inline-action-button-container.yt-live-chat-text-message-renderer {
|
||||
display: none;
|
||||
}
|
||||
|
||||
yt-live-chat-text-message-renderer[has-inline-action-buttons]:hover #menu.yt-live-chat-text-message-renderer {
|
||||
display: var(--yt-live-chat-item-with-inline-actions-context-menu-display, block);
|
||||
}
|
||||
|
||||
#inline-action-buttons.yt-live-chat-text-message-renderer>*.yt-live-chat-text-message-renderer, #additional-inline-action-buttons.yt-live-chat-text-message-renderer>*.yt-live-chat-text-message-renderer {
|
||||
--yt-button-icon-size: 36px;
|
||||
--yt-button-icon-padding: 6px;
|
||||
color: hsl(0, 0%, 100%);
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
#inline-action-buttons.yt-live-chat-text-message-renderer>*.yt-live-chat-text-message-renderer {
|
||||
background: hsla(0, 0%, 6.7%, .8);
|
||||
}
|
||||
|
||||
#inline-action-buttons.yt-live-chat-text-message-renderer>.yt-live-chat-text-message-renderer:hover {
|
||||
background: hsl(0, 0%, 6.7%);
|
||||
}
|
||||
|
||||
#additional-inline-action-buttons.yt-live-chat-text-message-renderer>*.yt-live-chat-text-message-renderer {
|
||||
color: var(--yt-live-chat-additional-inline-action-button-color);
|
||||
background: var(--yt-live-chat-additional-inline-action-button-background-color);
|
||||
}
|
||||
|
||||
#additional-inline-action-buttons.yt-live-chat-text-message-renderer>.yt-live-chat-text-message-renderer:hover {
|
||||
background: var(--yt-live-chat-additional-inline-action-button-background-color-hover);
|
||||
}
|
||||
|
||||
#additional-inline-action-buttons.yt-live-chat-text-message-renderer:not(:empty) {
|
||||
margin-left: 32px;
|
||||
}
|
||||
|
||||
#inline-action-buttons.yt-live-chat-text-message-renderer>*.yt-live-chat-text-message-renderer:not(:first-child), #additional-inline-action-buttons.yt-live-chat-text-message-renderer>*.yt-live-chat-text-message-renderer:not(:first-child) {
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
yt-live-chat-text-message-renderer {
|
||||
position: relative;
|
||||
font-size: 13px;
|
||||
padding: 4px 24px;
|
||||
overflow: hidden;
|
||||
--yt-endpoint-color: var(--yt-live-chat-primary-text-color, hsl(0, 0%, 6.7%));
|
||||
--yt-endpoint-hover-color: var(--yt-live-chat-primary-text-color, var(--yt-endpoint-color));
|
||||
display: flex;
|
||||
-ms-flex-direction: row;
|
||||
-webkit-flex-direction: row;
|
||||
flex-direction: row;
|
||||
-ms-flex-align: start;
|
||||
-webkit-align-items: flex-start;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
yt-live-chat-text-message-renderer:hover {
|
||||
overflow: initial;
|
||||
}
|
||||
|
||||
yt-live-chat-text-message-renderer[author-is-owner] {
|
||||
background-color: var(--yt-live-chat-message-highlight-background-color);
|
||||
}
|
||||
|
||||
#content.yt-live-chat-text-message-renderer {
|
||||
-ms-align-self: center;
|
||||
-webkit-align-self: center;
|
||||
align-self: center;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
yt-live-chat-author-chip.yt-live-chat-text-message-renderer {
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
#message.yt-live-chat-text-message-renderer {
|
||||
color: var(--yt-live-chat-primary-text-color, var(--yt-primary-text-color));
|
||||
line-height: 16px;
|
||||
overflow: hidden;
|
||||
overflow-wrap: break-word;
|
||||
word-wrap: break-word;
|
||||
word-break: break-word;
|
||||
font-style: var(--yt-live-chat-text-message-renderer-message-message-style_-_font-style);
|
||||
opacity: var(--yt-live-chat-text-message-renderer-message-message-style_-_opacity);
|
||||
}
|
||||
|
||||
#message.yt-live-chat-text-message-renderer .emoji.yt-live-chat-text-message-renderer {
|
||||
width: var(--yt-live-chat-emoji-size);
|
||||
height: var(--yt-live-chat-emoji-size);
|
||||
margin: -1px 2px 1px 2px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
a.yt-live-chat-text-message-renderer {
|
||||
display: inline;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
#message.yt-live-chat-text-message-renderer a.yt-live-chat-text-message-renderer {
|
||||
display: inline;
|
||||
text-decoration: underline;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
#message.yt-live-chat-text-message-renderer a.yt-live-chat-text-message-renderer .mention.yt-live-chat-text-message-renderer {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
#show-original.yt-live-chat-text-message-renderer {
|
||||
margin-left: 2px;
|
||||
}
|
||||
|
||||
#message.yt-live-chat-text-message-renderer:empty, #deleted-state.yt-live-chat-text-message-renderer:empty, #show-original.yt-live-chat-text-message-renderer:empty, yt-live-chat-text-message-renderer[show-original] #deleted-state.yt-live-chat-text-message-renderer, yt-live-chat-text-message-renderer[show-original] #show-original.yt-live-chat-text-message-renderer, yt-live-chat-text-message-renderer[is-deleted]:not([show-original]) #message.yt-live-chat-text-message-renderer {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#menu.yt-live-chat-text-message-renderer {
|
||||
color: var(--yt-live-chat-secondary-text-color);
|
||||
background: linear-gradient(to right, transparent, var(--yt-live-chat-background-color, hsl(0, 0%, 100%)) 100%);
|
||||
}
|
||||
|
||||
.mention.yt-live-chat-text-message-renderer {
|
||||
background: var(--yt-live-chat-mention-background-color);
|
||||
color: var(--yt-live-chat-mention-text-color);
|
||||
padding: 2px 4px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
#deleted-state.yt-live-chat-text-message-renderer, #show-original.yt-live-chat-text-message-renderer, yt-live-chat-text-message-renderer[is-deleted] #message.yt-live-chat-text-message-renderer {
|
||||
font-style: italic;
|
||||
color: var(--yt-live-chat-deleted-message-color, rgba(0, 0, 0, 0.5));
|
||||
}
|
||||
|
||||
yt-live-chat-text-message-renderer[show-bar]::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
display: block;
|
||||
left: 8px;
|
||||
top: 4px;
|
||||
bottom: 4px;
|
||||
width: 4px;
|
||||
box-sizing: border-box;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
yt-live-chat-text-message-renderer[is-deleted]::before {
|
||||
background: var(--yt-live-chat-deleted-message-bar-color, rgba(0, 0, 0, 0.5));
|
||||
}
|
||||
|
||||
yt-live-chat-text-message-renderer[is-dimmed] #message.yt-live-chat-text-message-renderer {
|
||||
opacity: 0.25;
|
||||
}
|
||||
|
||||
yt-live-chat-text-message-renderer[is-dimmed]::before {
|
||||
background: var(--yt-live-chat-error-message-color, #f44336);
|
||||
}
|
||||
@ -0,0 +1,80 @@
|
||||
canvas.yt-live-chat-ticker-paid-message-item-renderer, caption.yt-live-chat-ticker-paid-message-item-renderer, center.yt-live-chat-ticker-paid-message-item-renderer, cite.yt-live-chat-ticker-paid-message-item-renderer, code.yt-live-chat-ticker-paid-message-item-renderer, dd.yt-live-chat-ticker-paid-message-item-renderer, del.yt-live-chat-ticker-paid-message-item-renderer, dfn.yt-live-chat-ticker-paid-message-item-renderer, div.yt-live-chat-ticker-paid-message-item-renderer, dl.yt-live-chat-ticker-paid-message-item-renderer, dt.yt-live-chat-ticker-paid-message-item-renderer, em.yt-live-chat-ticker-paid-message-item-renderer, embed.yt-live-chat-ticker-paid-message-item-renderer, fieldset.yt-live-chat-ticker-paid-message-item-renderer, font.yt-live-chat-ticker-paid-message-item-renderer, form.yt-live-chat-ticker-paid-message-item-renderer, h1.yt-live-chat-ticker-paid-message-item-renderer, h2.yt-live-chat-ticker-paid-message-item-renderer, h3.yt-live-chat-ticker-paid-message-item-renderer, h4.yt-live-chat-ticker-paid-message-item-renderer, h5.yt-live-chat-ticker-paid-message-item-renderer, h6.yt-live-chat-ticker-paid-message-item-renderer, hr.yt-live-chat-ticker-paid-message-item-renderer, i.yt-live-chat-ticker-paid-message-item-renderer, iframe.yt-live-chat-ticker-paid-message-item-renderer, img.yt-live-chat-ticker-paid-message-item-renderer, ins.yt-live-chat-ticker-paid-message-item-renderer, kbd.yt-live-chat-ticker-paid-message-item-renderer, label.yt-live-chat-ticker-paid-message-item-renderer, legend.yt-live-chat-ticker-paid-message-item-renderer, li.yt-live-chat-ticker-paid-message-item-renderer, menu.yt-live-chat-ticker-paid-message-item-renderer, object.yt-live-chat-ticker-paid-message-item-renderer, ol.yt-live-chat-ticker-paid-message-item-renderer, p.yt-live-chat-ticker-paid-message-item-renderer, pre.yt-live-chat-ticker-paid-message-item-renderer, q.yt-live-chat-ticker-paid-message-item-renderer, s.yt-live-chat-ticker-paid-message-item-renderer, samp.yt-live-chat-ticker-paid-message-item-renderer, small.yt-live-chat-ticker-paid-message-item-renderer, span.yt-live-chat-ticker-paid-message-item-renderer, strike.yt-live-chat-ticker-paid-message-item-renderer, strong.yt-live-chat-ticker-paid-message-item-renderer, sub.yt-live-chat-ticker-paid-message-item-renderer, sup.yt-live-chat-ticker-paid-message-item-renderer, table.yt-live-chat-ticker-paid-message-item-renderer, tbody.yt-live-chat-ticker-paid-message-item-renderer, td.yt-live-chat-ticker-paid-message-item-renderer, tfoot.yt-live-chat-ticker-paid-message-item-renderer, th.yt-live-chat-ticker-paid-message-item-renderer, thead.yt-live-chat-ticker-paid-message-item-renderer, tr.yt-live-chat-ticker-paid-message-item-renderer, tt.yt-live-chat-ticker-paid-message-item-renderer, u.yt-live-chat-ticker-paid-message-item-renderer, ul.yt-live-chat-ticker-paid-message-item-renderer, var.yt-live-chat-ticker-paid-message-item-renderer {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.yt-live-chat-ticker-paid-message-item-renderer[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
canvas.yt-live-chat-ticker-paid-message-item-renderer, caption.yt-live-chat-ticker-paid-message-item-renderer, center.yt-live-chat-ticker-paid-message-item-renderer, cite.yt-live-chat-ticker-paid-message-item-renderer, code.yt-live-chat-ticker-paid-message-item-renderer, dd.yt-live-chat-ticker-paid-message-item-renderer, del.yt-live-chat-ticker-paid-message-item-renderer, dfn.yt-live-chat-ticker-paid-message-item-renderer, div.yt-live-chat-ticker-paid-message-item-renderer, dl.yt-live-chat-ticker-paid-message-item-renderer, dt.yt-live-chat-ticker-paid-message-item-renderer, em.yt-live-chat-ticker-paid-message-item-renderer, embed.yt-live-chat-ticker-paid-message-item-renderer, fieldset.yt-live-chat-ticker-paid-message-item-renderer, font.yt-live-chat-ticker-paid-message-item-renderer, form.yt-live-chat-ticker-paid-message-item-renderer, h1.yt-live-chat-ticker-paid-message-item-renderer, h2.yt-live-chat-ticker-paid-message-item-renderer, h3.yt-live-chat-ticker-paid-message-item-renderer, h4.yt-live-chat-ticker-paid-message-item-renderer, h5.yt-live-chat-ticker-paid-message-item-renderer, h6.yt-live-chat-ticker-paid-message-item-renderer, hr.yt-live-chat-ticker-paid-message-item-renderer, i.yt-live-chat-ticker-paid-message-item-renderer, iframe.yt-live-chat-ticker-paid-message-item-renderer, img.yt-live-chat-ticker-paid-message-item-renderer, ins.yt-live-chat-ticker-paid-message-item-renderer, kbd.yt-live-chat-ticker-paid-message-item-renderer, label.yt-live-chat-ticker-paid-message-item-renderer, legend.yt-live-chat-ticker-paid-message-item-renderer, li.yt-live-chat-ticker-paid-message-item-renderer, menu.yt-live-chat-ticker-paid-message-item-renderer, object.yt-live-chat-ticker-paid-message-item-renderer, ol.yt-live-chat-ticker-paid-message-item-renderer, p.yt-live-chat-ticker-paid-message-item-renderer, pre.yt-live-chat-ticker-paid-message-item-renderer, q.yt-live-chat-ticker-paid-message-item-renderer, s.yt-live-chat-ticker-paid-message-item-renderer, samp.yt-live-chat-ticker-paid-message-item-renderer, small.yt-live-chat-ticker-paid-message-item-renderer, span.yt-live-chat-ticker-paid-message-item-renderer, strike.yt-live-chat-ticker-paid-message-item-renderer, strong.yt-live-chat-ticker-paid-message-item-renderer, sub.yt-live-chat-ticker-paid-message-item-renderer, sup.yt-live-chat-ticker-paid-message-item-renderer, table.yt-live-chat-ticker-paid-message-item-renderer, tbody.yt-live-chat-ticker-paid-message-item-renderer, td.yt-live-chat-ticker-paid-message-item-renderer, tfoot.yt-live-chat-ticker-paid-message-item-renderer, th.yt-live-chat-ticker-paid-message-item-renderer, thead.yt-live-chat-ticker-paid-message-item-renderer, tr.yt-live-chat-ticker-paid-message-item-renderer, tt.yt-live-chat-ticker-paid-message-item-renderer, u.yt-live-chat-ticker-paid-message-item-renderer, ul.yt-live-chat-ticker-paid-message-item-renderer, var.yt-live-chat-ticker-paid-message-item-renderer {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.yt-live-chat-ticker-paid-message-item-renderer[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
yt-live-chat-ticker-paid-message-item-renderer {
|
||||
display: inline-block;
|
||||
font-size: 14px;
|
||||
outline: none;
|
||||
transition: width 0.2s;
|
||||
vertical-align: top;
|
||||
cursor: pointer;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
#container.yt-live-chat-ticker-paid-message-item-renderer {
|
||||
border-radius: 999px;
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
yt-live-chat-ticker-paid-message-item-renderer.sliding-down #container.yt-live-chat-ticker-paid-message-item-renderer {
|
||||
opacity: 0.5;
|
||||
transform: translateY(44px);
|
||||
transition: opacity 0.2s, transform 0.2s cubic-bezier(0.4, 0.0, 1, 1);
|
||||
}
|
||||
|
||||
yt-live-chat-ticker-paid-message-item-renderer.collapsing {
|
||||
margin-right: 0;
|
||||
transition: margin-right 0.2s cubic-bezier(0.4, 0.0, 0.2, 1), width 0.2s cubic-bezier(0.4, 0.0, 0.2, 1);
|
||||
}
|
||||
|
||||
yt-live-chat-ticker-paid-message-item-renderer[dimmed] {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
yt-img-shadow.yt-live-chat-ticker-paid-message-item-renderer {
|
||||
margin-right: -4px;
|
||||
overflow: hidden;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
#content.yt-live-chat-ticker-paid-message-item-renderer {
|
||||
height: 24px;
|
||||
display: flex;
|
||||
-ms-flex-direction: row;
|
||||
-webkit-flex-direction: row;
|
||||
flex-direction: row;
|
||||
-ms-flex-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#text.yt-live-chat-ticker-paid-message-item-renderer {
|
||||
margin: 0 8px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
yt-live-chat-ticker-paid-message-item-renderer[is-deleted] #author-photo.yt-live-chat-ticker-paid-message-item-renderer {
|
||||
display: none;
|
||||
}
|
||||
@ -0,0 +1,65 @@
|
||||
canvas.yt-live-chat-ticker-renderer, caption.yt-live-chat-ticker-renderer, center.yt-live-chat-ticker-renderer, cite.yt-live-chat-ticker-renderer, code.yt-live-chat-ticker-renderer, dd.yt-live-chat-ticker-renderer, del.yt-live-chat-ticker-renderer, dfn.yt-live-chat-ticker-renderer, div.yt-live-chat-ticker-renderer, dl.yt-live-chat-ticker-renderer, dt.yt-live-chat-ticker-renderer, em.yt-live-chat-ticker-renderer, embed.yt-live-chat-ticker-renderer, fieldset.yt-live-chat-ticker-renderer, font.yt-live-chat-ticker-renderer, form.yt-live-chat-ticker-renderer, h1.yt-live-chat-ticker-renderer, h2.yt-live-chat-ticker-renderer, h3.yt-live-chat-ticker-renderer, h4.yt-live-chat-ticker-renderer, h5.yt-live-chat-ticker-renderer, h6.yt-live-chat-ticker-renderer, hr.yt-live-chat-ticker-renderer, i.yt-live-chat-ticker-renderer, iframe.yt-live-chat-ticker-renderer, img.yt-live-chat-ticker-renderer, ins.yt-live-chat-ticker-renderer, kbd.yt-live-chat-ticker-renderer, label.yt-live-chat-ticker-renderer, legend.yt-live-chat-ticker-renderer, li.yt-live-chat-ticker-renderer, menu.yt-live-chat-ticker-renderer, object.yt-live-chat-ticker-renderer, ol.yt-live-chat-ticker-renderer, p.yt-live-chat-ticker-renderer, pre.yt-live-chat-ticker-renderer, q.yt-live-chat-ticker-renderer, s.yt-live-chat-ticker-renderer, samp.yt-live-chat-ticker-renderer, small.yt-live-chat-ticker-renderer, span.yt-live-chat-ticker-renderer, strike.yt-live-chat-ticker-renderer, strong.yt-live-chat-ticker-renderer, sub.yt-live-chat-ticker-renderer, sup.yt-live-chat-ticker-renderer, table.yt-live-chat-ticker-renderer, tbody.yt-live-chat-ticker-renderer, td.yt-live-chat-ticker-renderer, tfoot.yt-live-chat-ticker-renderer, th.yt-live-chat-ticker-renderer, thead.yt-live-chat-ticker-renderer, tr.yt-live-chat-ticker-renderer, tt.yt-live-chat-ticker-renderer, u.yt-live-chat-ticker-renderer, ul.yt-live-chat-ticker-renderer, var.yt-live-chat-ticker-renderer {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.yt-live-chat-ticker-renderer[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
yt-live-chat-ticker-renderer {
|
||||
display: block;
|
||||
background-color: var(--yt-live-chat-header-background-color);
|
||||
}
|
||||
|
||||
#container.yt-live-chat-ticker-renderer {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#items.yt-live-chat-ticker-renderer {
|
||||
height: 32px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
padding: 0 24px 8px 24px;
|
||||
}
|
||||
|
||||
#items.yt-live-chat-ticker-renderer>*.yt-live-chat-ticker-renderer {
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
#left-arrow-container.yt-live-chat-ticker-renderer {
|
||||
background: linear-gradient(to right, var(--yt-live-chat-ticker-arrow-background) 0, var(--yt-live-chat-ticker-arrow-background) 52px, transparent 60px);
|
||||
left: 0;
|
||||
padding: 0 16px 0 12px;
|
||||
}
|
||||
|
||||
#right-arrow-container.yt-live-chat-ticker-renderer {
|
||||
background: linear-gradient(to left, var(--yt-live-chat-ticker-arrow-background) 0, var(--yt-live-chat-ticker-arrow-background) 52px, transparent 60px);
|
||||
right: 0;
|
||||
padding: 0 12px 0 16px;
|
||||
}
|
||||
|
||||
#container.yt-live-chat-ticker-renderer:hover #left-arrow-container.yt-live-chat-ticker-renderer, #container.yt-live-chat-ticker-renderer:hover #right-arrow-container.yt-live-chat-ticker-renderer {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
#left-arrow-container.yt-live-chat-ticker-renderer, #right-arrow-container.yt-live-chat-ticker-renderer {
|
||||
height: 32px;
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
top: 0;
|
||||
transition: opacity 0.3s 0.1s;
|
||||
}
|
||||
|
||||
yt-icon.yt-live-chat-ticker-renderer {
|
||||
background-color: #2196f3;
|
||||
border-radius: 999px;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
height: 24px;
|
||||
padding: 4px;
|
||||
width: 24px;
|
||||
}
|
||||
@ -46,76 +46,5 @@ export default {
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- yt-live-chat-author-badge-renderer -->
|
||||
<style>
|
||||
canvas.yt-live-chat-author-badge-renderer, caption.yt-live-chat-author-badge-renderer, center.yt-live-chat-author-badge-renderer, cite.yt-live-chat-author-badge-renderer, code.yt-live-chat-author-badge-renderer, dd.yt-live-chat-author-badge-renderer, del.yt-live-chat-author-badge-renderer, dfn.yt-live-chat-author-badge-renderer, div.yt-live-chat-author-badge-renderer, dl.yt-live-chat-author-badge-renderer, dt.yt-live-chat-author-badge-renderer, em.yt-live-chat-author-badge-renderer, embed.yt-live-chat-author-badge-renderer, fieldset.yt-live-chat-author-badge-renderer, font.yt-live-chat-author-badge-renderer, form.yt-live-chat-author-badge-renderer, h1.yt-live-chat-author-badge-renderer, h2.yt-live-chat-author-badge-renderer, h3.yt-live-chat-author-badge-renderer, h4.yt-live-chat-author-badge-renderer, h5.yt-live-chat-author-badge-renderer, h6.yt-live-chat-author-badge-renderer, hr.yt-live-chat-author-badge-renderer, i.yt-live-chat-author-badge-renderer, iframe.yt-live-chat-author-badge-renderer, img.yt-live-chat-author-badge-renderer, ins.yt-live-chat-author-badge-renderer, kbd.yt-live-chat-author-badge-renderer, label.yt-live-chat-author-badge-renderer, legend.yt-live-chat-author-badge-renderer, li.yt-live-chat-author-badge-renderer, menu.yt-live-chat-author-badge-renderer, object.yt-live-chat-author-badge-renderer, ol.yt-live-chat-author-badge-renderer, p.yt-live-chat-author-badge-renderer, pre.yt-live-chat-author-badge-renderer, q.yt-live-chat-author-badge-renderer, s.yt-live-chat-author-badge-renderer, samp.yt-live-chat-author-badge-renderer, small.yt-live-chat-author-badge-renderer, span.yt-live-chat-author-badge-renderer, strike.yt-live-chat-author-badge-renderer, strong.yt-live-chat-author-badge-renderer, sub.yt-live-chat-author-badge-renderer, sup.yt-live-chat-author-badge-renderer, table.yt-live-chat-author-badge-renderer, tbody.yt-live-chat-author-badge-renderer, td.yt-live-chat-author-badge-renderer, tfoot.yt-live-chat-author-badge-renderer, th.yt-live-chat-author-badge-renderer, thead.yt-live-chat-author-badge-renderer, tr.yt-live-chat-author-badge-renderer, tt.yt-live-chat-author-badge-renderer, u.yt-live-chat-author-badge-renderer, ul.yt-live-chat-author-badge-renderer, var.yt-live-chat-author-badge-renderer {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.yt-live-chat-author-badge-renderer[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
yt-live-chat-author-badge-renderer {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
yt-live-chat-author-badge-renderer[type='moderator'] {
|
||||
color: var(--yt-live-chat-moderator-color, #5e84f1);
|
||||
}
|
||||
|
||||
yt-live-chat-author-badge-renderer[type='owner'] {
|
||||
color: var(--yt-live-chat-owner-color, #ffd600);
|
||||
}
|
||||
|
||||
yt-live-chat-author-badge-renderer[type='member'] {
|
||||
color: var(--yt-live-chat-sponsor-color, #107516);
|
||||
}
|
||||
|
||||
yt-live-chat-author-badge-renderer[type='verified'] {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
img.yt-live-chat-author-badge-renderer, yt-icon.yt-live-chat-author-badge-renderer {
|
||||
display: block;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- yt-icon -->
|
||||
<style>
|
||||
canvas.yt-icon, caption.yt-icon, center.yt-icon, cite.yt-icon, code.yt-icon, dd.yt-icon, del.yt-icon, dfn.yt-icon, div.yt-icon, dl.yt-icon, dt.yt-icon, em.yt-icon, embed.yt-icon, fieldset.yt-icon, font.yt-icon, form.yt-icon, h1.yt-icon, h2.yt-icon, h3.yt-icon, h4.yt-icon, h5.yt-icon, h6.yt-icon, hr.yt-icon, i.yt-icon, iframe.yt-icon, img.yt-icon, ins.yt-icon, kbd.yt-icon, label.yt-icon, legend.yt-icon, li.yt-icon, menu.yt-icon, object.yt-icon, ol.yt-icon, p.yt-icon, pre.yt-icon, q.yt-icon, s.yt-icon, samp.yt-icon, small.yt-icon, span.yt-icon, strike.yt-icon, strong.yt-icon, sub.yt-icon, sup.yt-icon, table.yt-icon, tbody.yt-icon, td.yt-icon, tfoot.yt-icon, th.yt-icon, thead.yt-icon, tr.yt-icon, tt.yt-icon, u.yt-icon, ul.yt-icon, var.yt-icon {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.yt-icon[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
yt-icon, .yt-icon-container.yt-icon {
|
||||
display: inline-flex;
|
||||
-ms-flex-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-ms-flex-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
position: relative;
|
||||
vertical-align: middle;
|
||||
fill: currentcolor;
|
||||
stroke: none;
|
||||
width: var(--iron-icon-width, 24px);
|
||||
height: var(--iron-icon-height, 24px);
|
||||
}
|
||||
|
||||
yt-icon.external-container {
|
||||
display: none !important;
|
||||
}
|
||||
</style>
|
||||
<style src="@/assets/css/youtube/yt-live-chat-author-badge-renderer.css"></style>
|
||||
<style src="@/assets/css/youtube/yt-icon.css"></style>
|
||||
|
||||
@ -15,74 +15,4 @@ export default {
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- yt-img-shadow -->
|
||||
<style>
|
||||
canvas.yt-img-shadow, caption.yt-img-shadow, center.yt-img-shadow, cite.yt-img-shadow, code.yt-img-shadow, dd.yt-img-shadow, del.yt-img-shadow, dfn.yt-img-shadow, div.yt-img-shadow, dl.yt-img-shadow, dt.yt-img-shadow, em.yt-img-shadow, embed.yt-img-shadow, fieldset.yt-img-shadow, font.yt-img-shadow, form.yt-img-shadow, h1.yt-img-shadow, h2.yt-img-shadow, h3.yt-img-shadow, h4.yt-img-shadow, h5.yt-img-shadow, h6.yt-img-shadow, hr.yt-img-shadow, i.yt-img-shadow, iframe.yt-img-shadow, img.yt-img-shadow, ins.yt-img-shadow, kbd.yt-img-shadow, label.yt-img-shadow, legend.yt-img-shadow, li.yt-img-shadow, menu.yt-img-shadow, object.yt-img-shadow, ol.yt-img-shadow, p.yt-img-shadow, pre.yt-img-shadow, q.yt-img-shadow, s.yt-img-shadow, samp.yt-img-shadow, small.yt-img-shadow, span.yt-img-shadow, strike.yt-img-shadow, strong.yt-img-shadow, sub.yt-img-shadow, sup.yt-img-shadow, table.yt-img-shadow, tbody.yt-img-shadow, td.yt-img-shadow, tfoot.yt-img-shadow, th.yt-img-shadow, thead.yt-img-shadow, tr.yt-img-shadow, tt.yt-img-shadow, u.yt-img-shadow, ul.yt-img-shadow, var.yt-img-shadow {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.yt-img-shadow[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
yt-img-shadow {
|
||||
display: inline-block;
|
||||
opacity: 0;
|
||||
transition: opacity 0.2s;
|
||||
-ms-flex: none;
|
||||
-webkit-flex: none;
|
||||
flex: none;
|
||||
}
|
||||
|
||||
yt-img-shadow.no-transition {
|
||||
opacity: 1;
|
||||
transition: none;
|
||||
}
|
||||
|
||||
yt-img-shadow.with-placeholder {
|
||||
background-color: transparent;
|
||||
min-height: unset;
|
||||
min-width: unset;
|
||||
}
|
||||
|
||||
yt-img-shadow[loaded] {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
yt-img-shadow.empty img.yt-img-shadow {
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
yt-img-shadow[object-fit="FILL"] img.yt-img-shadow, yt-img-shadow[fit] img.yt-img-shadow {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
yt-img-shadow[object-fit="COVER"] img.yt-img-shadow {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
yt-img-shadow[object-fit="CONTAIN"] img.yt-img-shadow {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: contain;
|
||||
}
|
||||
|
||||
yt-img-shadow[object-position="LEFT"] img.yt-img-shadow {
|
||||
object-position: left;
|
||||
}
|
||||
|
||||
img.yt-img-shadow {
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
max-height: none;
|
||||
max-width: 100%;
|
||||
border-radius: none;
|
||||
}
|
||||
</style>
|
||||
<style src="@/assets/css/youtube/yt-img-shadow.css"></style>
|
||||
|
||||
@ -56,366 +56,4 @@ export default {
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- yt-live-chat-membership-item-renderer -->
|
||||
<style>
|
||||
#timestamp.yt-live-chat-membership-item-renderer {
|
||||
display: var(--yt-live-chat-item-timestamp-display, inline);
|
||||
margin: var(--yt-live-chat-item-timestamp-margin, 0 8px 0 0);
|
||||
color: var(--yt-live-chat-tertiary-text-color);
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
#author-photo.yt-live-chat-membership-item-renderer {
|
||||
display: block;
|
||||
margin-right: 16px;
|
||||
|
||||
overflow: hidden;
|
||||
border-radius: 50%;
|
||||
|
||||
-ms-flex: var(--layout-flex-none_-_-ms-flex);
|
||||
-webkit-flex: var(--layout-flex-none_-_-webkit-flex);
|
||||
flex: var(--layout-flex-none_-_flex);
|
||||
}
|
||||
|
||||
#menu-button.yt-live-chat-membership-item-renderer {
|
||||
width: var(--yt-live-chat-32px-icon-button_-_width);
|
||||
height: var(--yt-live-chat-32px-icon-button_-_height);
|
||||
padding: var(--yt-live-chat-32px-icon-button_-_padding);
|
||||
}
|
||||
|
||||
#menu.yt-live-chat-membership-item-renderer {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
|
||||
|
||||
transform: translateX(100px);
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer:hover #menu.yt-live-chat-membership-item-renderer,
|
||||
yt-live-chat-membership-item-renderer[menu-visible] #menu.yt-live-chat-membership-item-renderer {
|
||||
transform: none;
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer:focus-within #menu.yt-live-chat-membership-item-renderer {
|
||||
transform: none;
|
||||
}
|
||||
|
||||
#inline-action-button-container.yt-live-chat-membership-item-renderer {
|
||||
position: absolute;
|
||||
top: -4px;
|
||||
right: 0;
|
||||
bottom: -4px;
|
||||
left: 0;
|
||||
|
||||
background-color: var(--yt-live-chat-moderation-mode-hover-background-color);
|
||||
display: none;
|
||||
|
||||
-ms-flex-align: var(--layout-center-center_-_-ms-flex-align);
|
||||
-webkit-align-items: var(--layout-center-center_-_-webkit-align-items);
|
||||
align-items: var(--layout-center-center_-_align-items);
|
||||
-ms-flex-pack: var(--layout-center-center_-_-ms-flex-pack);
|
||||
-webkit-justify-content: var(--layout-center-center_-_-webkit-justify-content);
|
||||
justify-content: var(--layout-center-center_-_justify-content);
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[has-inline-action-buttons]:hover #inline-action-button-container.yt-live-chat-membership-item-renderer {
|
||||
display: var(--layout-horizontal_-_display);
|
||||
-ms-flex-direction: var(--layout-horizontal_-_-ms-flex-direction);
|
||||
-webkit-flex-direction: var(--layout-horizontal_-_-webkit-flex-direction);
|
||||
flex-direction: var(--layout-horizontal_-_flex-direction);
|
||||
|
||||
|
||||
display: var(--yt-live-chat-inline-action-button-container-display, none);
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[has-inline-action-buttons][hide-inline-action-buttons]:hover #inline-action-button-container.yt-live-chat-membership-item-renderer {
|
||||
display: none;
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[has-inline-action-buttons]:hover #menu.yt-live-chat-membership-item-renderer {
|
||||
display: var(--yt-live-chat-item-with-inline-actions-context-menu-display, block);
|
||||
}
|
||||
|
||||
#inline-action-buttons.yt-live-chat-membership-item-renderer>*.yt-live-chat-membership-item-renderer,
|
||||
#additional-inline-action-buttons.yt-live-chat-membership-item-renderer>*.yt-live-chat-membership-item-renderer {
|
||||
--yt-button-icon-size: 36px;
|
||||
--yt-button-icon-padding: 6px;
|
||||
|
||||
color: var(--yt-white);
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
#inline-action-buttons.yt-live-chat-membership-item-renderer>*.yt-live-chat-membership-item-renderer {
|
||||
background: var(--yt-luna-black-opacity-lighten-1);
|
||||
}
|
||||
|
||||
#inline-action-buttons.yt-live-chat-membership-item-renderer>.yt-live-chat-membership-item-renderer:hover {
|
||||
background: var(--yt-luna-black);
|
||||
}
|
||||
|
||||
#additional-inline-action-buttons.yt-live-chat-membership-item-renderer>*.yt-live-chat-membership-item-renderer {
|
||||
color: var(--yt-live-chat-additional-inline-action-button-color);
|
||||
background: var(--yt-live-chat-additional-inline-action-button-background-color);
|
||||
}
|
||||
|
||||
#additional-inline-action-buttons.yt-live-chat-membership-item-renderer>.yt-live-chat-membership-item-renderer:hover {
|
||||
background: var(--yt-live-chat-additional-inline-action-button-background-color-hover);
|
||||
}
|
||||
|
||||
#additional-inline-action-buttons.yt-live-chat-membership-item-renderer:not(:empty) {
|
||||
margin-left: 32px;
|
||||
}
|
||||
|
||||
#inline-action-buttons.yt-live-chat-membership-item-renderer>*.yt-live-chat-membership-item-renderer:not(:first-child),
|
||||
#additional-inline-action-buttons.yt-live-chat-membership-item-renderer>*.yt-live-chat-membership-item-renderer:not(:first-child) {
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer {
|
||||
position: relative;
|
||||
display: block;
|
||||
|
||||
--yt-live-chat-sponsor-header-color: #0a8043;
|
||||
--yt-live-chat-sponsor-color: #0f9d58;
|
||||
--yt-live-chat-sponsor-text-color: #fff;
|
||||
--yt-live-chat-item-timestamp-display: var(--yt-live-chat-paid-message-timestamp-display, none);
|
||||
|
||||
padding: 4px 24px;
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[dashboard-money-feed] {
|
||||
padding: 0;
|
||||
|
||||
--yt-live-chat-item-timestamp-display: block;
|
||||
}
|
||||
|
||||
#card.yt-live-chat-membership-item-renderer {
|
||||
overflow: hidden;
|
||||
font-size: 14px;
|
||||
border-radius: 4px;
|
||||
|
||||
display: var(--layout-vertical_-_display);
|
||||
-ms-flex-direction: var(--layout-vertical_-_-ms-flex-direction);
|
||||
-webkit-flex-direction: var(--layout-vertical_-_-webkit-flex-direction);
|
||||
flex-direction: var(--layout-vertical_-_flex-direction);
|
||||
box-shadow: var(--shadow-elevation-2dp_-_box-shadow);
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[dashboard-money-feed] #card.yt-live-chat-membership-item-renderer {
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#header.yt-live-chat-membership-item-renderer {
|
||||
position: relative;
|
||||
|
||||
background-color: var(--yt-live-chat-sponsor-header-color);
|
||||
padding: 8px 16px;
|
||||
color: #fff;
|
||||
min-height: 20px;
|
||||
|
||||
display: var(--layout-horizontal_-_display);
|
||||
-ms-flex-direction: var(--layout-horizontal_-_-ms-flex-direction);
|
||||
-webkit-flex-direction: var(--layout-horizontal_-_-webkit-flex-direction);
|
||||
flex-direction: var(--layout-horizontal_-_flex-direction);
|
||||
-ms-flex-align: var(--layout-center_-_-ms-flex-align);
|
||||
-webkit-align-items: var(--layout-center_-_-webkit-align-items);
|
||||
align-items: var(--layout-center_-_align-items);
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[show-only-header] #header.yt-live-chat-membership-item-renderer {
|
||||
background-color: var(--yt-live-chat-sponsor-color);
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[dashboard-money-feed] #header.yt-live-chat-membership-item-renderer {
|
||||
color: var(--yt-live-chat-secondary-text-color);
|
||||
background-color: var(--yt-live-chat-background-color);
|
||||
-ms-flex-align: var(--layout-start_-_-ms-flex-align);
|
||||
-webkit-align-items: var(--layout-start_-_-webkit-align-items);
|
||||
align-items: var(--layout-start_-_align-items);
|
||||
}
|
||||
|
||||
#header-content.yt-live-chat-membership-item-renderer {
|
||||
display: var(--layout-horizontal_-_display);
|
||||
-ms-flex-direction: var(--layout-horizontal_-_-ms-flex-direction);
|
||||
-webkit-flex-direction: var(--layout-horizontal_-_-webkit-flex-direction);
|
||||
flex-direction: var(--layout-horizontal_-_flex-direction);
|
||||
-ms-flex-pack: var(--layout-justified_-_-ms-flex-pack);
|
||||
-webkit-justify-content: var(--layout-justified_-_-webkit-justify-content);
|
||||
justify-content: var(--layout-justified_-_justify-content);
|
||||
-ms-flex: var(--layout-flex_-_-ms-flex);
|
||||
-webkit-flex: var(--layout-flex_-_-webkit-flex);
|
||||
flex: var(--layout-flex_-_flex);
|
||||
-webkit-flex-basis: var(--layout-flex_-_-webkit-flex-basis);
|
||||
flex-basis: var(--layout-flex_-_flex-basis);
|
||||
-ms-flex-align: var(--layout-baseline_-_-ms-flex-align);
|
||||
-webkit-align-items: var(--layout-baseline_-_-webkit-align-items);
|
||||
align-items: var(--layout-baseline_-_align-items);
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[dashboard-money-feed] #header-content.yt-live-chat-membership-item-renderer {
|
||||
display: var(--layout-vertical_-_display);
|
||||
-ms-flex-direction: var(--layout-vertical_-_-ms-flex-direction);
|
||||
-webkit-flex-direction: var(--layout-vertical_-_-webkit-flex-direction);
|
||||
flex-direction: var(--layout-vertical_-_flex-direction);
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[dashboard-money-feed] #header-content-inner-column.yt-live-chat-membership-item-renderer {
|
||||
margin-bottom: 4px;
|
||||
|
||||
display: var(--layout-horizontal_-_display);
|
||||
-ms-flex-direction: var(--layout-horizontal_-_-ms-flex-direction);
|
||||
-webkit-flex-direction: var(--layout-horizontal_-_-webkit-flex-direction);
|
||||
flex-direction: var(--layout-horizontal_-_flex-direction);
|
||||
-ms-flex-align: var(--layout-center_-_-ms-flex-align);
|
||||
-webkit-align-items: var(--layout-center_-_-webkit-align-items);
|
||||
align-items: var(--layout-center_-_align-items);
|
||||
-ms-flex: var(--layout-flex-none_-_-ms-flex);
|
||||
-webkit-flex: var(--layout-flex-none_-_-webkit-flex);
|
||||
flex: var(--layout-flex-none_-_flex);
|
||||
}
|
||||
|
||||
#author-photo.yt-live-chat-membership-item-renderer {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
yt-icon#author-photo.yt-live-chat-membership-item-renderer {
|
||||
display: none;
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[dashboard-money-feed] yt-icon#author-photo.yt-live-chat-membership-item-renderer {
|
||||
display: block;
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer:not([dashboard-money-feed]) yt-live-chat-author-chip.yt-live-chat-membership-item-renderer {
|
||||
--yt-live-chat-sponsor-color: var(--yt-live-chat-sponsor-text-color);
|
||||
--yt-live-chat-secondary-text-color: var(--yt-live-chat-sponsor-text-color);
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[dashboard-money-feed] yt-live-chat-author-chip.yt-live-chat-membership-item-renderer {
|
||||
margin-right: 8px;
|
||||
font-weight: 500;
|
||||
--yt-live-chat-sponsor-color: var(--yt-live-chat-secondary-text-color);
|
||||
}
|
||||
|
||||
#header-subtext.yt-live-chat-membership-item-renderer {
|
||||
margin-top: 2px;
|
||||
color: rgba(255, 255, 255, 0.7);
|
||||
font-weight: 500;
|
||||
font-size: 15px;
|
||||
}
|
||||
|
||||
#header-subtext.yt-live-chat-membership-item-renderer:empty {
|
||||
display: none;
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[dashboard-money-feed] #header-subtext.yt-live-chat-membership-item-renderer {
|
||||
margin: 4px 0 13px;
|
||||
font-size: 11px;
|
||||
font-weight: normal;
|
||||
color: var(--yt-live-chat-secondary-text-color);
|
||||
}
|
||||
|
||||
#header-primary-text.yt-live-chat-membership-item-renderer {
|
||||
word-wrap: break-word;
|
||||
word-break: break-word;
|
||||
font-weight: 500;
|
||||
color: rgba(255, 255, 255, 1);
|
||||
}
|
||||
|
||||
#header-primary-text.yt-live-chat-membership-item-renderer:empty {
|
||||
display: none;
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[has-primary-header-text]:not([dashboard-money-feed]) yt-live-chat-author-chip.yt-live-chat-membership-item-renderer,
|
||||
yt-live-chat-membership-item-renderer[has-primary-header-text]:not([dashboard-money-feed]) #header-subtext.yt-live-chat-membership-item-renderer {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[dashboard-money-feed] #header-primary-text.yt-live-chat-membership-item-renderer {
|
||||
display: inline;
|
||||
height: 24px;
|
||||
min-width: 16px;
|
||||
border-radius: 12px;
|
||||
margin-right: 8px;
|
||||
padding: 0 12px;
|
||||
background-color: var(--yt-live-chat-sponsor-color);
|
||||
color: var(--yt-white);
|
||||
display: var(--layout-inline_-_display, inline);
|
||||
-ms-flex-align: var(--layout-center-center_-_-ms-flex-align);
|
||||
-webkit-align-items: var(--layout-center-center_-_-webkit-align-items);
|
||||
align-items: var(--layout-center-center_-_align-items);
|
||||
-ms-flex-pack: var(--layout-center-center_-_-ms-flex-pack);
|
||||
-webkit-justify-content: var(--layout-center-center_-_-webkit-justify-content);
|
||||
justify-content: var(--layout-center-center_-_justify-content);
|
||||
font-size: var(--ytd-badge_-_font-size);
|
||||
font-weight: var(--ytd-badge_-_font-weight);
|
||||
line-height: var(--ytd-badge_-_line-height);
|
||||
}
|
||||
|
||||
#content.yt-live-chat-membership-item-renderer {
|
||||
background-color: var(--yt-live-chat-sponsor-color);
|
||||
color: var(--yt-live-chat-sponsor-text-color);
|
||||
padding: 8px 16px;
|
||||
word-wrap: break-word;
|
||||
word-break: break-word;
|
||||
font-size: 15px;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[dashboard-money-feed] #content.yt-live-chat-membership-item-renderer {
|
||||
background-color: unset;
|
||||
font-size: unset;
|
||||
color: var(--yt-live-chat-secondary-text-color);
|
||||
padding: 0 0 16px 72px;
|
||||
}
|
||||
|
||||
#content.yt-live-chat-membership-item-renderer img.yt-live-chat-membership-item-renderer {
|
||||
width: var(--yt-live-chat-emoji-size);
|
||||
height: var(--yt-live-chat-emoji-size);
|
||||
|
||||
margin: -1px 2px 1px 2px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[show-only-header] #content.yt-live-chat-membership-item-renderer,
|
||||
#deleted-state.yt-live-chat-membership-item-renderer:empty {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#deleted-state.yt-live-chat-membership-item-renderer {
|
||||
display: block;
|
||||
font-style: italic;
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
a.yt-live-chat-membership-item-renderer {
|
||||
display: inline;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
#message.yt-live-chat-membership-item-renderer a.yt-live-chat-membership-item-renderer {
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
#message.yt-live-chat-membership-item-renderer a.yt-live-chat-membership-item-renderer .mention.yt-live-chat-membership-item-renderer {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
#menu.yt-live-chat-membership-item-renderer {
|
||||
background: linear-gradient(to right, transparent, var(--yt-live-chat-sponsor-header-color) 100%);
|
||||
border-radius: 0 4px 4px 0;
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[show-only-header] #menu.yt-live-chat-membership-item-renderer {
|
||||
background: linear-gradient(to right, transparent, var(--yt-live-chat-sponsor-color) 100%);
|
||||
}
|
||||
|
||||
yt-live-chat-membership-item-renderer[dashboard-money-feed] #menu.yt-live-chat-membership-item-renderer {
|
||||
margin-top: 8px;
|
||||
background: linear-gradient(to right, transparent, var(--yt-live-chat-background-color) 40%);
|
||||
}
|
||||
</style>
|
||||
<style src="@/assets/css/youtube/yt-live-chat-membership-item-renderer.css"></style>
|
||||
|
||||
@ -63,383 +63,4 @@ export default {
|
||||
</script>
|
||||
|
||||
<!-- yt-live-chat-paid-message-renderer -->
|
||||
<style>
|
||||
canvas.yt-live-chat-paid-message-renderer, caption.yt-live-chat-paid-message-renderer, center.yt-live-chat-paid-message-renderer, cite.yt-live-chat-paid-message-renderer, code.yt-live-chat-paid-message-renderer, dd.yt-live-chat-paid-message-renderer, del.yt-live-chat-paid-message-renderer, dfn.yt-live-chat-paid-message-renderer, div.yt-live-chat-paid-message-renderer, dl.yt-live-chat-paid-message-renderer, dt.yt-live-chat-paid-message-renderer, em.yt-live-chat-paid-message-renderer, embed.yt-live-chat-paid-message-renderer, fieldset.yt-live-chat-paid-message-renderer, font.yt-live-chat-paid-message-renderer, form.yt-live-chat-paid-message-renderer, h1.yt-live-chat-paid-message-renderer, h2.yt-live-chat-paid-message-renderer, h3.yt-live-chat-paid-message-renderer, h4.yt-live-chat-paid-message-renderer, h5.yt-live-chat-paid-message-renderer, h6.yt-live-chat-paid-message-renderer, hr.yt-live-chat-paid-message-renderer, i.yt-live-chat-paid-message-renderer, iframe.yt-live-chat-paid-message-renderer, img.yt-live-chat-paid-message-renderer, ins.yt-live-chat-paid-message-renderer, kbd.yt-live-chat-paid-message-renderer, label.yt-live-chat-paid-message-renderer, legend.yt-live-chat-paid-message-renderer, li.yt-live-chat-paid-message-renderer, menu.yt-live-chat-paid-message-renderer, object.yt-live-chat-paid-message-renderer, ol.yt-live-chat-paid-message-renderer, p.yt-live-chat-paid-message-renderer, pre.yt-live-chat-paid-message-renderer, q.yt-live-chat-paid-message-renderer, s.yt-live-chat-paid-message-renderer, samp.yt-live-chat-paid-message-renderer, small.yt-live-chat-paid-message-renderer, span.yt-live-chat-paid-message-renderer, strike.yt-live-chat-paid-message-renderer, strong.yt-live-chat-paid-message-renderer, sub.yt-live-chat-paid-message-renderer, sup.yt-live-chat-paid-message-renderer, table.yt-live-chat-paid-message-renderer, tbody.yt-live-chat-paid-message-renderer, td.yt-live-chat-paid-message-renderer, tfoot.yt-live-chat-paid-message-renderer, th.yt-live-chat-paid-message-renderer, thead.yt-live-chat-paid-message-renderer, tr.yt-live-chat-paid-message-renderer, tt.yt-live-chat-paid-message-renderer, u.yt-live-chat-paid-message-renderer, ul.yt-live-chat-paid-message-renderer, var.yt-live-chat-paid-message-renderer {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.yt-live-chat-paid-message-renderer[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
#timestamp.yt-live-chat-paid-message-renderer {
|
||||
display: var(--yt-live-chat-item-timestamp-display, inline);
|
||||
margin: var(--yt-live-chat-item-timestamp-margin, 0 8px 0 0);
|
||||
color: var(--yt-live-chat-tertiary-text-color);
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
#author-photo.yt-live-chat-paid-message-renderer {
|
||||
display: block;
|
||||
margin-right: 16px;
|
||||
overflow: hidden;
|
||||
border-radius: 50%;
|
||||
-ms-flex: none;
|
||||
-webkit-flex: none;
|
||||
flex: none;
|
||||
}
|
||||
|
||||
#menu-button.yt-live-chat-paid-message-renderer {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
#menu.yt-live-chat-paid-message-renderer {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
transform: translateX(100px);
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer:hover #menu.yt-live-chat-paid-message-renderer, yt-live-chat-paid-message-renderer[menu-visible] #menu.yt-live-chat-paid-message-renderer {
|
||||
transform: none;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer:focus-within #menu.yt-live-chat-paid-message-renderer {
|
||||
transform: none;
|
||||
}
|
||||
|
||||
#inline-action-button-container.yt-live-chat-paid-message-renderer {
|
||||
position: absolute;
|
||||
top: -4px;
|
||||
right: 0;
|
||||
bottom: -4px;
|
||||
left: 0;
|
||||
background-color: var(--yt-live-chat-moderation-mode-hover-background-color);
|
||||
display: none;
|
||||
-ms-flex-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-ms-flex-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[has-inline-action-buttons]:hover #inline-action-button-container.yt-live-chat-paid-message-renderer {
|
||||
display: flex;
|
||||
-ms-flex-direction: row;
|
||||
-webkit-flex-direction: row;
|
||||
flex-direction: row;
|
||||
display: var(--yt-live-chat-inline-action-button-container-display, none);
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[has-inline-action-buttons][hide-inline-action-buttons]:hover #inline-action-button-container.yt-live-chat-paid-message-renderer {
|
||||
display: none;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[has-inline-action-buttons]:hover #menu.yt-live-chat-paid-message-renderer {
|
||||
display: var(--yt-live-chat-item-with-inline-actions-context-menu-display, block);
|
||||
}
|
||||
|
||||
#inline-action-buttons.yt-live-chat-paid-message-renderer>*.yt-live-chat-paid-message-renderer, #additional-inline-action-buttons.yt-live-chat-paid-message-renderer>*.yt-live-chat-paid-message-renderer {
|
||||
--yt-button-icon-size: 36px;
|
||||
--yt-button-icon-padding: 6px;
|
||||
color: hsl(0, 0%, 100%);
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
#inline-action-buttons.yt-live-chat-paid-message-renderer>*.yt-live-chat-paid-message-renderer {
|
||||
background: hsla(0, 0%, 6.7%, .8);
|
||||
}
|
||||
|
||||
#inline-action-buttons.yt-live-chat-paid-message-renderer>.yt-live-chat-paid-message-renderer:hover {
|
||||
background: hsl(0, 0%, 6.7%);
|
||||
}
|
||||
|
||||
#additional-inline-action-buttons.yt-live-chat-paid-message-renderer>*.yt-live-chat-paid-message-renderer {
|
||||
color: var(--yt-live-chat-additional-inline-action-button-color);
|
||||
background: var(--yt-live-chat-additional-inline-action-button-background-color);
|
||||
}
|
||||
|
||||
#additional-inline-action-buttons.yt-live-chat-paid-message-renderer>.yt-live-chat-paid-message-renderer:hover {
|
||||
background: var(--yt-live-chat-additional-inline-action-button-background-color-hover);
|
||||
}
|
||||
|
||||
#additional-inline-action-buttons.yt-live-chat-paid-message-renderer:not(:empty) {
|
||||
margin-left: 32px;
|
||||
}
|
||||
|
||||
#inline-action-buttons.yt-live-chat-paid-message-renderer>*.yt-live-chat-paid-message-renderer:not(:first-child), #additional-inline-action-buttons.yt-live-chat-paid-message-renderer>*.yt-live-chat-paid-message-renderer:not(:first-child) {
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer {
|
||||
position: relative;
|
||||
display: block;
|
||||
padding: 4px 24px;
|
||||
font-size: 15px;
|
||||
--yt-live-chat-paid-message-background-color: var(--yt-live-chat-paid-message-primary-color);
|
||||
--yt-live-chat-paid-message-header-background-color: var(--yt-live-chat-paid-message-secondary-color);
|
||||
--yt-live-chat-text-input-field-placeholder-color: var(--yt-live-chat-paid-message-color);
|
||||
--yt-live-chat-item-timestamp-display: var(--yt-live-chat-paid-message-timestamp-display, none);
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] {
|
||||
padding: 0;
|
||||
padding-bottom: 8px;
|
||||
--yt-live-chat-paid-message-background-color: transparent;
|
||||
--yt-live-chat-paid-message-header-background-color: transparent;
|
||||
--yt-live-chat-item-timestamp-display: block;
|
||||
}
|
||||
|
||||
#card.yt-live-chat-paid-message-renderer {
|
||||
border-radius: 4px;
|
||||
display: flex;
|
||||
-ms-flex-direction: column;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #card.yt-live-chat-paid-message-renderer {
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#header.yt-live-chat-paid-message-renderer {
|
||||
position: relative;
|
||||
background-color: var(--yt-live-chat-paid-message-header-background-color, #125aac);
|
||||
color: var(--yt-live-chat-paid-message-header-color, #fff);
|
||||
font-weight: 500;
|
||||
padding: 8px 16px;
|
||||
min-height: 20px;
|
||||
display: flex;
|
||||
-ms-flex-direction: row;
|
||||
-webkit-flex-direction: row;
|
||||
flex-direction: row;
|
||||
-ms-flex-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
border-top-left-radius: 4px;
|
||||
border-top-right-radius: 4px;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[show-only-header] #header.yt-live-chat-paid-message-renderer {
|
||||
border-bottom-left-radius: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #header.yt-live-chat-paid-message-renderer {
|
||||
color: var(--yt-live-chat-secondary-text-color);
|
||||
padding-bottom: 0;
|
||||
}
|
||||
|
||||
#author-photo.yt-live-chat-paid-message-renderer {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
}
|
||||
|
||||
yt-icon#author-photo.yt-live-chat-paid-message-renderer {
|
||||
display: none;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] yt-icon#author-photo.yt-live-chat-paid-message-renderer {
|
||||
display: block;
|
||||
}
|
||||
|
||||
#header-content.yt-live-chat-paid-message-renderer {
|
||||
display: flex;
|
||||
-ms-flex-direction: row;
|
||||
-webkit-flex-direction: row;
|
||||
flex-direction: row;
|
||||
-ms-flex-pack: justify;
|
||||
-webkit-justify-content: space-between;
|
||||
justify-content: space-between;
|
||||
-ms-flex: 1 1 0.000000001px;
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
-webkit-flex-basis: 0.000000001px;
|
||||
flex-basis: 0.000000001px;
|
||||
-ms-flex-align: baseline;
|
||||
-webkit-align-items: baseline;
|
||||
align-items: baseline;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #header-content.yt-live-chat-paid-message-renderer {
|
||||
display: flex;
|
||||
-ms-flex-direction: column;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
#header-content-primary-column.yt-live-chat-paid-message-renderer {
|
||||
display: flex;
|
||||
-ms-flex-direction: column;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
-ms-flex-pack: justify;
|
||||
-webkit-justify-content: space-between;
|
||||
justify-content: space-between;
|
||||
-ms-flex: 1 1 0.000000001px;
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
-webkit-flex-basis: 0.000000001px;
|
||||
flex-basis: 0.000000001px;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #header-content-primary-column.yt-live-chat-paid-message-renderer {
|
||||
margin-bottom: 4px;
|
||||
display: flex;
|
||||
-ms-flex-direction: row;
|
||||
-webkit-flex-direction: row;
|
||||
flex-direction: row;
|
||||
-ms-flex-align: baseline;
|
||||
-webkit-align-items: baseline;
|
||||
align-items: baseline;
|
||||
-ms-flex: none;
|
||||
-webkit-flex: none;
|
||||
flex: none;
|
||||
}
|
||||
|
||||
#author-name.yt-live-chat-paid-message-renderer {
|
||||
color: var(--yt-live-chat-paid-message-author-name-color, rgba(255, 255, 255, 0.7));
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #author-name.yt-live-chat-paid-message-renderer {
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #purchase-amount.yt-live-chat-paid-message-renderer {
|
||||
display: inline;
|
||||
height: 24px;
|
||||
min-width: 16px;
|
||||
border-radius: 12px;
|
||||
margin-right: 8px;
|
||||
padding: 0 12px;
|
||||
background-color: var(--yt-live-chat-paid-message-primary-color);
|
||||
color: var(--yt-live-chat-paid-message-color);
|
||||
display: inline-flex;
|
||||
-ms-flex-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-ms-flex-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
font-size: 1.2rem;
|
||||
font-weight: 500;
|
||||
line-height: 1.2rem;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #author-name.yt-live-chat-paid-message-renderer {
|
||||
display: block;
|
||||
color: var(--yt-live-chat-secondary-text-color);
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #author-name.yt-live-chat-paid-message-renderer[is-deleted] {
|
||||
margin: 4px 0 0;
|
||||
order: 1;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #author-name.yt-live-chat-paid-message-renderer[is-deleted].yt-live-chat-paid-message-renderer::before {
|
||||
content: '​';
|
||||
display: inline;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
#menu.yt-live-chat-paid-message-renderer {
|
||||
background: linear-gradient(to right, transparent, var(--yt-live-chat-paid-message-header-background-color, #125aac) 100%);
|
||||
border-radius: 0 4px 4px 0;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #menu.yt-live-chat-paid-message-renderer {
|
||||
margin-top: 8px;
|
||||
background: linear-gradient(to right, transparent, var(--yt-live-chat-background-color) 40%);
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[allow-animations] #content.yt-live-chat-paid-message-renderer, yt-live-chat-paid-message-renderer[allow-animations] #header.yt-live-chat-paid-message-renderer {
|
||||
transition-property: background-color, color;
|
||||
transition-duration: 0.2s;
|
||||
}
|
||||
|
||||
#content.yt-live-chat-paid-message-renderer {
|
||||
background-color: var(--yt-live-chat-paid-message-background-color, #1565c0);
|
||||
color: var(--yt-live-chat-paid-message-color, #fff);
|
||||
padding: 8px 16px;
|
||||
word-wrap: break-word;
|
||||
word-break: break-word;
|
||||
border-bottom-left-radius: 4px;
|
||||
border-bottom-right-radius: 4px;
|
||||
}
|
||||
|
||||
#content.yt-live-chat-paid-message-renderer img.yt-live-chat-paid-message-renderer {
|
||||
width: var(--yt-live-chat-emoji-size);
|
||||
height: var(--yt-live-chat-emoji-size);
|
||||
margin: -1px 2px 1px 2px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #content.yt-live-chat-paid-message-renderer {
|
||||
padding: 0;
|
||||
padding-left: 72px;
|
||||
color: var(--yt-live-chat-secondary-text-color);
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[show-only-header] #content.yt-live-chat-paid-message-renderer {
|
||||
visibility: hidden;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
a.yt-live-chat-paid-message-renderer {
|
||||
display: inline;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
#message.yt-live-chat-paid-message-renderer a.yt-live-chat-paid-message-renderer {
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #message.yt-live-chat-paid-message-renderer {
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
#message.yt-live-chat-paid-message-renderer a.yt-live-chat-paid-message-renderer .mention.yt-live-chat-paid-message-renderer {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
#message.yt-live-chat-paid-message-renderer:empty, #author-name.yt-live-chat-paid-message-renderer:empty:not([is-deleted]).yt-live-chat-paid-message-renderer, #deleted-state.yt-live-chat-paid-message-renderer:empty {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#deleted-state.yt-live-chat-paid-message-renderer {
|
||||
display: block;
|
||||
font-style: italic;
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #deleted-state.yt-live-chat-paid-message-renderer[is-deleted] {
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[dashboard-money-feed] #author-name.yt-live-chat-paid-message-renderer {
|
||||
-ms-flex: none;
|
||||
-webkit-flex: none;
|
||||
flex: none;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[show-footer-divider] #footer.yt-live-chat-paid-message-renderer::before {
|
||||
content: "";
|
||||
display: flex;
|
||||
border-top: 1px solid rgba(0, 0, 0, 0.12);
|
||||
margin: 8px 0;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-message-renderer[is-user-editable] #footer.yt-live-chat-paid-message-renderer:not(:empty) {
|
||||
padding-top: 8px;
|
||||
}
|
||||
</style>
|
||||
<style src="@/assets/css/youtube/yt-live-chat-paid-message-renderer.css"></style>
|
||||
|
||||
@ -94,304 +94,5 @@ yt-live-chat-text-message-renderer>#content>#message>.el-badge .el-badge__conten
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- yt-live-chat-text-message-renderer -->
|
||||
<style>
|
||||
canvas.yt-live-chat-text-message-renderer, caption.yt-live-chat-text-message-renderer, center.yt-live-chat-text-message-renderer, cite.yt-live-chat-text-message-renderer, code.yt-live-chat-text-message-renderer, dd.yt-live-chat-text-message-renderer, del.yt-live-chat-text-message-renderer, dfn.yt-live-chat-text-message-renderer, div.yt-live-chat-text-message-renderer, dl.yt-live-chat-text-message-renderer, dt.yt-live-chat-text-message-renderer, em.yt-live-chat-text-message-renderer, embed.yt-live-chat-text-message-renderer, fieldset.yt-live-chat-text-message-renderer, font.yt-live-chat-text-message-renderer, form.yt-live-chat-text-message-renderer, h1.yt-live-chat-text-message-renderer, h2.yt-live-chat-text-message-renderer, h3.yt-live-chat-text-message-renderer, h4.yt-live-chat-text-message-renderer, h5.yt-live-chat-text-message-renderer, h6.yt-live-chat-text-message-renderer, hr.yt-live-chat-text-message-renderer, i.yt-live-chat-text-message-renderer, iframe.yt-live-chat-text-message-renderer, img.yt-live-chat-text-message-renderer, ins.yt-live-chat-text-message-renderer, kbd.yt-live-chat-text-message-renderer, label.yt-live-chat-text-message-renderer, legend.yt-live-chat-text-message-renderer, li.yt-live-chat-text-message-renderer, menu.yt-live-chat-text-message-renderer, object.yt-live-chat-text-message-renderer, ol.yt-live-chat-text-message-renderer, p.yt-live-chat-text-message-renderer, pre.yt-live-chat-text-message-renderer, q.yt-live-chat-text-message-renderer, s.yt-live-chat-text-message-renderer, samp.yt-live-chat-text-message-renderer, small.yt-live-chat-text-message-renderer, span.yt-live-chat-text-message-renderer, strike.yt-live-chat-text-message-renderer, strong.yt-live-chat-text-message-renderer, sub.yt-live-chat-text-message-renderer, sup.yt-live-chat-text-message-renderer, table.yt-live-chat-text-message-renderer, tbody.yt-live-chat-text-message-renderer, td.yt-live-chat-text-message-renderer, tfoot.yt-live-chat-text-message-renderer, th.yt-live-chat-text-message-renderer, thead.yt-live-chat-text-message-renderer, tr.yt-live-chat-text-message-renderer, tt.yt-live-chat-text-message-renderer, u.yt-live-chat-text-message-renderer, ul.yt-live-chat-text-message-renderer, var.yt-live-chat-text-message-renderer {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.yt-live-chat-text-message-renderer[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
#timestamp.yt-live-chat-text-message-renderer {
|
||||
display: var(--yt-live-chat-item-timestamp-display, inline);
|
||||
margin: var(--yt-live-chat-item-timestamp-margin, 0 8px 0 0);
|
||||
color: var(--yt-live-chat-tertiary-text-color);
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
#author-photo.yt-live-chat-text-message-renderer {
|
||||
display: block;
|
||||
margin-right: 16px;
|
||||
overflow: hidden;
|
||||
border-radius: 50%;
|
||||
-ms-flex: none;
|
||||
-webkit-flex: none;
|
||||
flex: none;
|
||||
}
|
||||
|
||||
#menu-button.yt-live-chat-text-message-renderer {
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
padding: 8px;
|
||||
}
|
||||
|
||||
#menu.yt-live-chat-text-message-renderer {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
right: 0;
|
||||
transform: translateX(100px);
|
||||
}
|
||||
|
||||
yt-live-chat-text-message-renderer:hover #menu.yt-live-chat-text-message-renderer, yt-live-chat-text-message-renderer[menu-visible] #menu.yt-live-chat-text-message-renderer {
|
||||
transform: none;
|
||||
}
|
||||
|
||||
yt-live-chat-text-message-renderer:focus-within #menu.yt-live-chat-text-message-renderer {
|
||||
transform: none;
|
||||
}
|
||||
|
||||
#inline-action-button-container.yt-live-chat-text-message-renderer {
|
||||
position: absolute;
|
||||
top: -4px;
|
||||
right: 0;
|
||||
bottom: -4px;
|
||||
left: 0;
|
||||
background-color: var(--yt-live-chat-moderation-mode-hover-background-color);
|
||||
display: none;
|
||||
-ms-flex-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-ms-flex-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
yt-live-chat-text-message-renderer[has-inline-action-buttons]:hover #inline-action-button-container.yt-live-chat-text-message-renderer {
|
||||
display: flex;
|
||||
-ms-flex-direction: row;
|
||||
-webkit-flex-direction: row;
|
||||
flex-direction: row;
|
||||
display: var(--yt-live-chat-inline-action-button-container-display, none);
|
||||
}
|
||||
|
||||
yt-live-chat-text-message-renderer[has-inline-action-buttons][hide-inline-action-buttons]:hover #inline-action-button-container.yt-live-chat-text-message-renderer {
|
||||
display: none;
|
||||
}
|
||||
|
||||
yt-live-chat-text-message-renderer[has-inline-action-buttons]:hover #menu.yt-live-chat-text-message-renderer {
|
||||
display: var(--yt-live-chat-item-with-inline-actions-context-menu-display, block);
|
||||
}
|
||||
|
||||
#inline-action-buttons.yt-live-chat-text-message-renderer>*.yt-live-chat-text-message-renderer, #additional-inline-action-buttons.yt-live-chat-text-message-renderer>*.yt-live-chat-text-message-renderer {
|
||||
--yt-button-icon-size: 36px;
|
||||
--yt-button-icon-padding: 6px;
|
||||
color: hsl(0, 0%, 100%);
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
#inline-action-buttons.yt-live-chat-text-message-renderer>*.yt-live-chat-text-message-renderer {
|
||||
background: hsla(0, 0%, 6.7%, .8);
|
||||
}
|
||||
|
||||
#inline-action-buttons.yt-live-chat-text-message-renderer>.yt-live-chat-text-message-renderer:hover {
|
||||
background: hsl(0, 0%, 6.7%);
|
||||
}
|
||||
|
||||
#additional-inline-action-buttons.yt-live-chat-text-message-renderer>*.yt-live-chat-text-message-renderer {
|
||||
color: var(--yt-live-chat-additional-inline-action-button-color);
|
||||
background: var(--yt-live-chat-additional-inline-action-button-background-color);
|
||||
}
|
||||
|
||||
#additional-inline-action-buttons.yt-live-chat-text-message-renderer>.yt-live-chat-text-message-renderer:hover {
|
||||
background: var(--yt-live-chat-additional-inline-action-button-background-color-hover);
|
||||
}
|
||||
|
||||
#additional-inline-action-buttons.yt-live-chat-text-message-renderer:not(:empty) {
|
||||
margin-left: 32px;
|
||||
}
|
||||
|
||||
#inline-action-buttons.yt-live-chat-text-message-renderer>*.yt-live-chat-text-message-renderer:not(:first-child), #additional-inline-action-buttons.yt-live-chat-text-message-renderer>*.yt-live-chat-text-message-renderer:not(:first-child) {
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
yt-live-chat-text-message-renderer {
|
||||
position: relative;
|
||||
font-size: 13px;
|
||||
padding: 4px 24px;
|
||||
overflow: hidden;
|
||||
--yt-endpoint-color: var(--yt-live-chat-primary-text-color, hsl(0, 0%, 6.7%));
|
||||
--yt-endpoint-hover-color: var(--yt-live-chat-primary-text-color, var(--yt-endpoint-color));
|
||||
display: flex;
|
||||
-ms-flex-direction: row;
|
||||
-webkit-flex-direction: row;
|
||||
flex-direction: row;
|
||||
-ms-flex-align: start;
|
||||
-webkit-align-items: flex-start;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
yt-live-chat-text-message-renderer:hover {
|
||||
overflow: initial;
|
||||
}
|
||||
|
||||
yt-live-chat-text-message-renderer[author-is-owner] {
|
||||
background-color: var(--yt-live-chat-message-highlight-background-color);
|
||||
}
|
||||
|
||||
#content.yt-live-chat-text-message-renderer {
|
||||
-ms-align-self: center;
|
||||
-webkit-align-self: center;
|
||||
align-self: center;
|
||||
min-width: 0;
|
||||
}
|
||||
|
||||
yt-live-chat-author-chip.yt-live-chat-text-message-renderer {
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
#message.yt-live-chat-text-message-renderer {
|
||||
color: var(--yt-live-chat-primary-text-color, var(--yt-primary-text-color));
|
||||
line-height: 16px;
|
||||
overflow: hidden;
|
||||
overflow-wrap: break-word;
|
||||
word-wrap: break-word;
|
||||
word-break: break-word;
|
||||
font-style: var(--yt-live-chat-text-message-renderer-message-message-style_-_font-style);
|
||||
opacity: var(--yt-live-chat-text-message-renderer-message-message-style_-_opacity);
|
||||
}
|
||||
|
||||
#message.yt-live-chat-text-message-renderer .emoji.yt-live-chat-text-message-renderer {
|
||||
width: var(--yt-live-chat-emoji-size);
|
||||
height: var(--yt-live-chat-emoji-size);
|
||||
margin: -1px 2px 1px 2px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
a.yt-live-chat-text-message-renderer {
|
||||
display: inline;
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
#message.yt-live-chat-text-message-renderer a.yt-live-chat-text-message-renderer {
|
||||
display: inline;
|
||||
text-decoration: underline;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
#message.yt-live-chat-text-message-renderer a.yt-live-chat-text-message-renderer .mention.yt-live-chat-text-message-renderer {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
#show-original.yt-live-chat-text-message-renderer {
|
||||
margin-left: 2px;
|
||||
}
|
||||
|
||||
#message.yt-live-chat-text-message-renderer:empty, #deleted-state.yt-live-chat-text-message-renderer:empty, #show-original.yt-live-chat-text-message-renderer:empty, yt-live-chat-text-message-renderer[show-original] #deleted-state.yt-live-chat-text-message-renderer, yt-live-chat-text-message-renderer[show-original] #show-original.yt-live-chat-text-message-renderer, yt-live-chat-text-message-renderer[is-deleted]:not([show-original]) #message.yt-live-chat-text-message-renderer {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#menu.yt-live-chat-text-message-renderer {
|
||||
color: var(--yt-live-chat-secondary-text-color);
|
||||
background: linear-gradient(to right, transparent, var(--yt-live-chat-background-color, hsl(0, 0%, 100%)) 100%);
|
||||
}
|
||||
|
||||
.mention.yt-live-chat-text-message-renderer {
|
||||
background: var(--yt-live-chat-mention-background-color);
|
||||
color: var(--yt-live-chat-mention-text-color);
|
||||
padding: 2px 4px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
#deleted-state.yt-live-chat-text-message-renderer, #show-original.yt-live-chat-text-message-renderer, yt-live-chat-text-message-renderer[is-deleted] #message.yt-live-chat-text-message-renderer {
|
||||
font-style: italic;
|
||||
color: var(--yt-live-chat-deleted-message-color, rgba(0, 0, 0, 0.5));
|
||||
}
|
||||
|
||||
yt-live-chat-text-message-renderer[show-bar]::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
display: block;
|
||||
left: 8px;
|
||||
top: 4px;
|
||||
bottom: 4px;
|
||||
width: 4px;
|
||||
box-sizing: border-box;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
yt-live-chat-text-message-renderer[is-deleted]::before {
|
||||
background: var(--yt-live-chat-deleted-message-bar-color, rgba(0, 0, 0, 0.5));
|
||||
}
|
||||
|
||||
yt-live-chat-text-message-renderer[is-dimmed] #message.yt-live-chat-text-message-renderer {
|
||||
opacity: 0.25;
|
||||
}
|
||||
|
||||
yt-live-chat-text-message-renderer[is-dimmed]::before {
|
||||
background: var(--yt-live-chat-error-message-color, #f44336);
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- yt-live-chat-author-chip -->
|
||||
<style>
|
||||
canvas.yt-live-chat-author-chip, caption.yt-live-chat-author-chip, center.yt-live-chat-author-chip, cite.yt-live-chat-author-chip, code.yt-live-chat-author-chip, dd.yt-live-chat-author-chip, del.yt-live-chat-author-chip, dfn.yt-live-chat-author-chip, div.yt-live-chat-author-chip, dl.yt-live-chat-author-chip, dt.yt-live-chat-author-chip, em.yt-live-chat-author-chip, embed.yt-live-chat-author-chip, fieldset.yt-live-chat-author-chip, font.yt-live-chat-author-chip, form.yt-live-chat-author-chip, h1.yt-live-chat-author-chip, h2.yt-live-chat-author-chip, h3.yt-live-chat-author-chip, h4.yt-live-chat-author-chip, h5.yt-live-chat-author-chip, h6.yt-live-chat-author-chip, hr.yt-live-chat-author-chip, i.yt-live-chat-author-chip, iframe.yt-live-chat-author-chip, img.yt-live-chat-author-chip, ins.yt-live-chat-author-chip, kbd.yt-live-chat-author-chip, label.yt-live-chat-author-chip, legend.yt-live-chat-author-chip, li.yt-live-chat-author-chip, menu.yt-live-chat-author-chip, object.yt-live-chat-author-chip, ol.yt-live-chat-author-chip, p.yt-live-chat-author-chip, pre.yt-live-chat-author-chip, q.yt-live-chat-author-chip, s.yt-live-chat-author-chip, samp.yt-live-chat-author-chip, small.yt-live-chat-author-chip, span.yt-live-chat-author-chip, strike.yt-live-chat-author-chip, strong.yt-live-chat-author-chip, sub.yt-live-chat-author-chip, sup.yt-live-chat-author-chip, table.yt-live-chat-author-chip, tbody.yt-live-chat-author-chip, td.yt-live-chat-author-chip, tfoot.yt-live-chat-author-chip, th.yt-live-chat-author-chip, thead.yt-live-chat-author-chip, tr.yt-live-chat-author-chip, tt.yt-live-chat-author-chip, u.yt-live-chat-author-chip, ul.yt-live-chat-author-chip, var.yt-live-chat-author-chip {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.yt-live-chat-author-chip[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
yt-live-chat-author-chip {
|
||||
display: inline-flex;
|
||||
-ms-flex-align: baseline;
|
||||
-webkit-align-items: baseline;
|
||||
align-items: baseline;
|
||||
}
|
||||
|
||||
#author-name.yt-live-chat-author-chip {
|
||||
box-sizing: border-box;
|
||||
border-radius: 2px;
|
||||
color: var(--yt-live-chat-secondary-text-color);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
yt-live-chat-author-chip[is-highlighted] #author-name.yt-live-chat-author-chip {
|
||||
padding: 2px 4px;
|
||||
color: var(--yt-live-chat-author-chip-verified-text-color);
|
||||
background-color: var(--yt-live-chat-author-chip-verified-background-color);
|
||||
}
|
||||
|
||||
#author-name.yt-live-chat-author-chip[type='moderator'] {
|
||||
color: var(--yt-live-chat-moderator-color);
|
||||
}
|
||||
|
||||
yt-live-chat-author-chip[is-highlighted] #author-name.yt-live-chat-author-chip[type='owner'], #author-name.yt-live-chat-author-chip[type='owner'] {
|
||||
background-color: #ffd600;
|
||||
color: var(--yt-live-chat-author-chip-owner-text-color);
|
||||
}
|
||||
|
||||
#author-name.yt-live-chat-author-chip[type='member'] {
|
||||
color: var(--yt-live-chat-sponsor-color);
|
||||
}
|
||||
|
||||
#chip-badges.yt-live-chat-author-chip:empty {
|
||||
display: none;
|
||||
}
|
||||
|
||||
yt-live-chat-author-chip[is-highlighted] #chat-badges.yt-live-chat-author-chip:not(:empty) {
|
||||
margin-left: 1px;
|
||||
}
|
||||
|
||||
yt-live-chat-author-badge-renderer.yt-live-chat-author-chip {
|
||||
margin: 0 0 0 2px;
|
||||
vertical-align: sub;
|
||||
}
|
||||
|
||||
yt-live-chat-author-chip[is-highlighted] #chip-badges.yt-live-chat-author-chip yt-live-chat-author-badge-renderer.yt-live-chat-author-chip {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
#chip-badges.yt-live-chat-author-chip yt-live-chat-author-badge-renderer.yt-live-chat-author-chip:last-of-type {
|
||||
margin-right: -2px;
|
||||
}
|
||||
</style>
|
||||
<style src="@/assets/css/youtube/yt-live-chat-text-message-renderer.css"></style>
|
||||
<style src="@/assets/css/youtube/yt-live-chat-author-chip.css"></style>
|
||||
|
||||
@ -160,155 +160,5 @@ export default {
|
||||
}
|
||||
</script>
|
||||
|
||||
<!-- yt-live-chat-ticker-renderer -->
|
||||
<style>
|
||||
canvas.yt-live-chat-ticker-renderer, caption.yt-live-chat-ticker-renderer, center.yt-live-chat-ticker-renderer, cite.yt-live-chat-ticker-renderer, code.yt-live-chat-ticker-renderer, dd.yt-live-chat-ticker-renderer, del.yt-live-chat-ticker-renderer, dfn.yt-live-chat-ticker-renderer, div.yt-live-chat-ticker-renderer, dl.yt-live-chat-ticker-renderer, dt.yt-live-chat-ticker-renderer, em.yt-live-chat-ticker-renderer, embed.yt-live-chat-ticker-renderer, fieldset.yt-live-chat-ticker-renderer, font.yt-live-chat-ticker-renderer, form.yt-live-chat-ticker-renderer, h1.yt-live-chat-ticker-renderer, h2.yt-live-chat-ticker-renderer, h3.yt-live-chat-ticker-renderer, h4.yt-live-chat-ticker-renderer, h5.yt-live-chat-ticker-renderer, h6.yt-live-chat-ticker-renderer, hr.yt-live-chat-ticker-renderer, i.yt-live-chat-ticker-renderer, iframe.yt-live-chat-ticker-renderer, img.yt-live-chat-ticker-renderer, ins.yt-live-chat-ticker-renderer, kbd.yt-live-chat-ticker-renderer, label.yt-live-chat-ticker-renderer, legend.yt-live-chat-ticker-renderer, li.yt-live-chat-ticker-renderer, menu.yt-live-chat-ticker-renderer, object.yt-live-chat-ticker-renderer, ol.yt-live-chat-ticker-renderer, p.yt-live-chat-ticker-renderer, pre.yt-live-chat-ticker-renderer, q.yt-live-chat-ticker-renderer, s.yt-live-chat-ticker-renderer, samp.yt-live-chat-ticker-renderer, small.yt-live-chat-ticker-renderer, span.yt-live-chat-ticker-renderer, strike.yt-live-chat-ticker-renderer, strong.yt-live-chat-ticker-renderer, sub.yt-live-chat-ticker-renderer, sup.yt-live-chat-ticker-renderer, table.yt-live-chat-ticker-renderer, tbody.yt-live-chat-ticker-renderer, td.yt-live-chat-ticker-renderer, tfoot.yt-live-chat-ticker-renderer, th.yt-live-chat-ticker-renderer, thead.yt-live-chat-ticker-renderer, tr.yt-live-chat-ticker-renderer, tt.yt-live-chat-ticker-renderer, u.yt-live-chat-ticker-renderer, ul.yt-live-chat-ticker-renderer, var.yt-live-chat-ticker-renderer {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.yt-live-chat-ticker-renderer[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
yt-live-chat-ticker-renderer {
|
||||
display: block;
|
||||
background-color: var(--yt-live-chat-header-background-color);
|
||||
}
|
||||
|
||||
#container.yt-live-chat-ticker-renderer {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#items.yt-live-chat-ticker-renderer {
|
||||
height: 32px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
padding: 0 24px 8px 24px;
|
||||
}
|
||||
|
||||
#items.yt-live-chat-ticker-renderer>*.yt-live-chat-ticker-renderer {
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
#left-arrow-container.yt-live-chat-ticker-renderer {
|
||||
background: linear-gradient(to right, var(--yt-live-chat-ticker-arrow-background) 0, var(--yt-live-chat-ticker-arrow-background) 52px, transparent 60px);
|
||||
left: 0;
|
||||
padding: 0 16px 0 12px;
|
||||
}
|
||||
|
||||
#right-arrow-container.yt-live-chat-ticker-renderer {
|
||||
background: linear-gradient(to left, var(--yt-live-chat-ticker-arrow-background) 0, var(--yt-live-chat-ticker-arrow-background) 52px, transparent 60px);
|
||||
right: 0;
|
||||
padding: 0 12px 0 16px;
|
||||
}
|
||||
|
||||
#container.yt-live-chat-ticker-renderer:hover #left-arrow-container.yt-live-chat-ticker-renderer, #container.yt-live-chat-ticker-renderer:hover #right-arrow-container.yt-live-chat-ticker-renderer {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
#left-arrow-container.yt-live-chat-ticker-renderer, #right-arrow-container.yt-live-chat-ticker-renderer {
|
||||
height: 32px;
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
top: 0;
|
||||
transition: opacity 0.3s 0.1s;
|
||||
}
|
||||
|
||||
yt-icon.yt-live-chat-ticker-renderer {
|
||||
background-color: #2196f3;
|
||||
border-radius: 999px;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
height: 24px;
|
||||
padding: 4px;
|
||||
width: 24px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- yt-live-chat-ticker-paid-message-item-renderer -->
|
||||
<style>
|
||||
canvas.yt-live-chat-ticker-paid-message-item-renderer, caption.yt-live-chat-ticker-paid-message-item-renderer, center.yt-live-chat-ticker-paid-message-item-renderer, cite.yt-live-chat-ticker-paid-message-item-renderer, code.yt-live-chat-ticker-paid-message-item-renderer, dd.yt-live-chat-ticker-paid-message-item-renderer, del.yt-live-chat-ticker-paid-message-item-renderer, dfn.yt-live-chat-ticker-paid-message-item-renderer, div.yt-live-chat-ticker-paid-message-item-renderer, dl.yt-live-chat-ticker-paid-message-item-renderer, dt.yt-live-chat-ticker-paid-message-item-renderer, em.yt-live-chat-ticker-paid-message-item-renderer, embed.yt-live-chat-ticker-paid-message-item-renderer, fieldset.yt-live-chat-ticker-paid-message-item-renderer, font.yt-live-chat-ticker-paid-message-item-renderer, form.yt-live-chat-ticker-paid-message-item-renderer, h1.yt-live-chat-ticker-paid-message-item-renderer, h2.yt-live-chat-ticker-paid-message-item-renderer, h3.yt-live-chat-ticker-paid-message-item-renderer, h4.yt-live-chat-ticker-paid-message-item-renderer, h5.yt-live-chat-ticker-paid-message-item-renderer, h6.yt-live-chat-ticker-paid-message-item-renderer, hr.yt-live-chat-ticker-paid-message-item-renderer, i.yt-live-chat-ticker-paid-message-item-renderer, iframe.yt-live-chat-ticker-paid-message-item-renderer, img.yt-live-chat-ticker-paid-message-item-renderer, ins.yt-live-chat-ticker-paid-message-item-renderer, kbd.yt-live-chat-ticker-paid-message-item-renderer, label.yt-live-chat-ticker-paid-message-item-renderer, legend.yt-live-chat-ticker-paid-message-item-renderer, li.yt-live-chat-ticker-paid-message-item-renderer, menu.yt-live-chat-ticker-paid-message-item-renderer, object.yt-live-chat-ticker-paid-message-item-renderer, ol.yt-live-chat-ticker-paid-message-item-renderer, p.yt-live-chat-ticker-paid-message-item-renderer, pre.yt-live-chat-ticker-paid-message-item-renderer, q.yt-live-chat-ticker-paid-message-item-renderer, s.yt-live-chat-ticker-paid-message-item-renderer, samp.yt-live-chat-ticker-paid-message-item-renderer, small.yt-live-chat-ticker-paid-message-item-renderer, span.yt-live-chat-ticker-paid-message-item-renderer, strike.yt-live-chat-ticker-paid-message-item-renderer, strong.yt-live-chat-ticker-paid-message-item-renderer, sub.yt-live-chat-ticker-paid-message-item-renderer, sup.yt-live-chat-ticker-paid-message-item-renderer, table.yt-live-chat-ticker-paid-message-item-renderer, tbody.yt-live-chat-ticker-paid-message-item-renderer, td.yt-live-chat-ticker-paid-message-item-renderer, tfoot.yt-live-chat-ticker-paid-message-item-renderer, th.yt-live-chat-ticker-paid-message-item-renderer, thead.yt-live-chat-ticker-paid-message-item-renderer, tr.yt-live-chat-ticker-paid-message-item-renderer, tt.yt-live-chat-ticker-paid-message-item-renderer, u.yt-live-chat-ticker-paid-message-item-renderer, ul.yt-live-chat-ticker-paid-message-item-renderer, var.yt-live-chat-ticker-paid-message-item-renderer {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.yt-live-chat-ticker-paid-message-item-renderer[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
canvas.yt-live-chat-ticker-paid-message-item-renderer, caption.yt-live-chat-ticker-paid-message-item-renderer, center.yt-live-chat-ticker-paid-message-item-renderer, cite.yt-live-chat-ticker-paid-message-item-renderer, code.yt-live-chat-ticker-paid-message-item-renderer, dd.yt-live-chat-ticker-paid-message-item-renderer, del.yt-live-chat-ticker-paid-message-item-renderer, dfn.yt-live-chat-ticker-paid-message-item-renderer, div.yt-live-chat-ticker-paid-message-item-renderer, dl.yt-live-chat-ticker-paid-message-item-renderer, dt.yt-live-chat-ticker-paid-message-item-renderer, em.yt-live-chat-ticker-paid-message-item-renderer, embed.yt-live-chat-ticker-paid-message-item-renderer, fieldset.yt-live-chat-ticker-paid-message-item-renderer, font.yt-live-chat-ticker-paid-message-item-renderer, form.yt-live-chat-ticker-paid-message-item-renderer, h1.yt-live-chat-ticker-paid-message-item-renderer, h2.yt-live-chat-ticker-paid-message-item-renderer, h3.yt-live-chat-ticker-paid-message-item-renderer, h4.yt-live-chat-ticker-paid-message-item-renderer, h5.yt-live-chat-ticker-paid-message-item-renderer, h6.yt-live-chat-ticker-paid-message-item-renderer, hr.yt-live-chat-ticker-paid-message-item-renderer, i.yt-live-chat-ticker-paid-message-item-renderer, iframe.yt-live-chat-ticker-paid-message-item-renderer, img.yt-live-chat-ticker-paid-message-item-renderer, ins.yt-live-chat-ticker-paid-message-item-renderer, kbd.yt-live-chat-ticker-paid-message-item-renderer, label.yt-live-chat-ticker-paid-message-item-renderer, legend.yt-live-chat-ticker-paid-message-item-renderer, li.yt-live-chat-ticker-paid-message-item-renderer, menu.yt-live-chat-ticker-paid-message-item-renderer, object.yt-live-chat-ticker-paid-message-item-renderer, ol.yt-live-chat-ticker-paid-message-item-renderer, p.yt-live-chat-ticker-paid-message-item-renderer, pre.yt-live-chat-ticker-paid-message-item-renderer, q.yt-live-chat-ticker-paid-message-item-renderer, s.yt-live-chat-ticker-paid-message-item-renderer, samp.yt-live-chat-ticker-paid-message-item-renderer, small.yt-live-chat-ticker-paid-message-item-renderer, span.yt-live-chat-ticker-paid-message-item-renderer, strike.yt-live-chat-ticker-paid-message-item-renderer, strong.yt-live-chat-ticker-paid-message-item-renderer, sub.yt-live-chat-ticker-paid-message-item-renderer, sup.yt-live-chat-ticker-paid-message-item-renderer, table.yt-live-chat-ticker-paid-message-item-renderer, tbody.yt-live-chat-ticker-paid-message-item-renderer, td.yt-live-chat-ticker-paid-message-item-renderer, tfoot.yt-live-chat-ticker-paid-message-item-renderer, th.yt-live-chat-ticker-paid-message-item-renderer, thead.yt-live-chat-ticker-paid-message-item-renderer, tr.yt-live-chat-ticker-paid-message-item-renderer, tt.yt-live-chat-ticker-paid-message-item-renderer, u.yt-live-chat-ticker-paid-message-item-renderer, ul.yt-live-chat-ticker-paid-message-item-renderer, var.yt-live-chat-ticker-paid-message-item-renderer {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.yt-live-chat-ticker-paid-message-item-renderer[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
yt-live-chat-ticker-paid-message-item-renderer {
|
||||
display: inline-block;
|
||||
font-size: 14px;
|
||||
outline: none;
|
||||
transition: width 0.2s;
|
||||
vertical-align: top;
|
||||
cursor: pointer;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
#container.yt-live-chat-ticker-paid-message-item-renderer {
|
||||
border-radius: 999px;
|
||||
padding: 4px;
|
||||
}
|
||||
|
||||
yt-live-chat-ticker-paid-message-item-renderer.sliding-down #container.yt-live-chat-ticker-paid-message-item-renderer {
|
||||
opacity: 0.5;
|
||||
transform: translateY(44px);
|
||||
transition: opacity 0.2s, transform 0.2s cubic-bezier(0.4, 0.0, 1, 1);
|
||||
}
|
||||
|
||||
yt-live-chat-ticker-paid-message-item-renderer.collapsing {
|
||||
margin-right: 0;
|
||||
transition: margin-right 0.2s cubic-bezier(0.4, 0.0, 0.2, 1), width 0.2s cubic-bezier(0.4, 0.0, 0.2, 1);
|
||||
}
|
||||
|
||||
yt-live-chat-ticker-paid-message-item-renderer[dimmed] {
|
||||
opacity: 0.5;
|
||||
}
|
||||
|
||||
yt-img-shadow.yt-live-chat-ticker-paid-message-item-renderer {
|
||||
margin-right: -4px;
|
||||
overflow: hidden;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
#content.yt-live-chat-ticker-paid-message-item-renderer {
|
||||
height: 24px;
|
||||
display: flex;
|
||||
-ms-flex-direction: row;
|
||||
-webkit-flex-direction: row;
|
||||
flex-direction: row;
|
||||
-ms-flex-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
#text.yt-live-chat-ticker-paid-message-item-renderer {
|
||||
margin: 0 8px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
yt-live-chat-ticker-paid-message-item-renderer[is-deleted] #author-photo.yt-live-chat-ticker-paid-message-item-renderer {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
<style src="@/assets/css/youtube/yt-live-chat-ticker-renderer.css"></style>
|
||||
<style src="@/assets/css/youtube/yt-live-chat-ticker-paid-message-item-renderer.css"></style>
|
||||
|
||||
@ -536,820 +536,6 @@ export default {
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
yt-live-chat-renderer, yt-live-chat-item-list-renderer #item-scroller {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
yt-live-chat-renderer ::-webkit-scrollbar {
|
||||
content: '';
|
||||
}
|
||||
|
||||
yt-live-chat-renderer ::-webkit-scrollbar-thumb {
|
||||
background-color: hsla(0, 0%, 53.3%, .2);
|
||||
border: 2px solid #fcfcfc;
|
||||
min-height: 30px;
|
||||
}
|
||||
|
||||
yt-live-chat-renderer ::-webkit-scrollbar-track {
|
||||
background-color: #fcfcfc;
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- html -->
|
||||
<style>
|
||||
html:not(.style-scope) {
|
||||
--yt-live-chat-background-color: hsl(0, 0%, 100%);
|
||||
--yt-live-chat-action-panel-background-color: hsla(0, 0%, 93.3%, .4);
|
||||
--yt-live-chat-action-panel-background-color-transparent: hsla(0, 0%, 97%, .8);
|
||||
--yt-live-chat-mode-change-background-color: hsla(0, 0%, 93.3%, .4);
|
||||
--yt-live-chat-primary-text-color: hsl(0, 0%, 6.7%);
|
||||
--yt-live-chat-secondary-text-color: hsla(0, 0%, 6.7%, .6);
|
||||
--yt-live-chat-tertiary-text-color: hsla(0, 0%, 6.7%, .4);
|
||||
--yt-live-chat-text-input-field-inactive-underline-color: #b8b8b8;
|
||||
--yt-live-chat-text-input-field-placeholder-color: hsla(0, 0%, 6.7%, .6);
|
||||
--yt-live-chat-icon-button-color: hsla(0, 0%, 6.7%, .4);
|
||||
--yt-live-chat-enabled-send-button-color: #4285f4;
|
||||
--yt-live-chat-disabled-icon-button-color: hsla(0, 0%, 6.7%, .2);
|
||||
--yt-live-chat-picker-button-color: hsla(0, 0%, 6.7%, .4);
|
||||
--yt-live-chat-picker-button-active-color: hsla(0, 0%, 6.7%, .8);
|
||||
--yt-live-chat-picker-button-disabled-color: var(--yt-live-chat-disabled-icon-button-color);
|
||||
--yt-live-chat-picker-button-hover-color: hsla(0, 0%, 6.7%, .6);
|
||||
--yt-live-chat-mention-background-color: #ff5722;
|
||||
--yt-live-chat-mention-text-color: hsl(0, 0%, 100%);
|
||||
--yt-live-chat-deleted-message-color: rgba(0, 0, 0, .5);
|
||||
--yt-live-chat-deleted-message-bar-color: rgba(11, 11, 11, .2);
|
||||
--yt-live-chat-disabled-button-background-color: hsl(0, 0%, 93.3%);
|
||||
--yt-live-chat-disabled-button-text-color: hsla(0, 0%, 6.7%, .4);
|
||||
--yt-live-chat-sub-panel-background-color: hsl(0, 0%, 93.3%);
|
||||
--yt-live-chat-sub-panel-background-color-transparent: hsla(0, 0%, 93%, .7);
|
||||
--yt-live-chat-header-background-color: hsla(0, 0%, 93.3%, .4);
|
||||
--yt-live-chat-header-button-color: hsl(0, 0%, 6.7%);
|
||||
--yt-live-chat-error-message-color: hsl(10, 51%, 49%);
|
||||
--yt-live-chat-reconnect-message-color: hsla(0, 0%, 7%, 0.2);
|
||||
--yt-live-chat-moderator-color: hsl(225, 84%, 66%);
|
||||
--yt-live-chat-owner-color: hsl(40, 76%, 55%);
|
||||
--yt-live-chat-author-chip-owner-text-color: rgba(0,0,0,0.87);
|
||||
--yt-live-chat-author-chip-verified-background-color: #CCCCCC;
|
||||
--yt-live-chat-author-chip-verified-text-color: #606060;
|
||||
--yt-live-chat-message-highlight-background-color: #f8f8f8;
|
||||
--yt-live-chat-sponsor-color: #107516;
|
||||
--yt-live-chat-overlay-color: hsla(0, 0%, 0%, 0.6);
|
||||
--yt-live-chat-dialog-background-color: hsl(0, 0%, 100%);
|
||||
--yt-live-chat-dialog-text-color: hsla(0, 0%, 6.7%, .6);
|
||||
--yt-live-chat-poll-choice-text-color: var(--yt-spec-text-secondary);
|
||||
--yt-live-chat-poll-choice-border-color: var(--yt-spec-10-percent-layer);
|
||||
--yt-live-chat-poll-choice-vote-bar-background-color: hsla(0, 0%, 93.3%, .8);
|
||||
--yt-live-chat-poll-choice-vote-bar-background-color-selected: #F2F8FF;
|
||||
--yt-live-chat-poll-choice-color-selected: #065FD4;
|
||||
--yt-live-chat-moderation-mode-hover-background-color: hsla(0, 0%, 6.7%, .2);
|
||||
--yt-live-chat-additional-inline-action-button-color: hsl(0, 0%, 100%);
|
||||
--yt-live-chat-additional-inline-action-button-background-color: hsla(0, 0%, 26%, 0.8);
|
||||
--yt-live-chat-additional-inline-action-button-background-color-hover: hsla(0, 0%, 26%, 1.0);
|
||||
--yt-formatted-string-emoji-size: 24px;
|
||||
--yt-live-chat-emoji-size: 24px;
|
||||
--yt-live-chat-text-input-field-suggestion-background-color: hsl(0, 0%, 100%);
|
||||
--yt-live-chat-text-input-field-suggestion-background-color-hover: #eee;
|
||||
--yt-live-chat-text-input-field-suggestion-text-color: #666;
|
||||
--yt-live-chat-text-input-field-suggestion-text-color-hover: #333;
|
||||
--yt-live-chat-ticker-arrow-background: hsl(0, 0%, 97.3%);
|
||||
--yt-emoji-picker-category-background-color: var(--yt-live-chat-action-panel-background-color-transparent);
|
||||
--yt-emoji-picker-category-color: var(--yt-live-chat-secondary-text-color);
|
||||
--yt-emoji-picker-category-button-color: var(--yt-live-chat-picker-button-color);
|
||||
--yt-emoji-picker-search-background-color: hsla(0, 0%, 100%, .6);
|
||||
--yt-emoji-picker-search-color: hsla(0, 0%, 6.7%, .8);
|
||||
--yt-emoji-picker-search-placeholder-color: hsla(0, 0%, 6.7%, .6);
|
||||
--yt-live-chat-slider-active-color: #2196f3;
|
||||
--yt-live-chat-slider-container-color: #c8c8c8;
|
||||
--yt-live-chat-slider-markers-color: #505050;
|
||||
--yt-live-chat-toast-background-color: hsl(0, 0%, 20%);
|
||||
--yt-live-chat-toast-text-color: hsl(0, 0%, 100%);
|
||||
--yt-live-chat-automod-button-background-color: hsl(0, 0%, 93.3%);
|
||||
--yt-live-chat-automod-button-background-color-hover: hsla(0, 0%, 6.7%, .2);
|
||||
--yt-live-chat-countdown-opacity: 0.3;
|
||||
--yt-live-chat-shimmer-background-color: rgba(136, 136, 136, 0.2);
|
||||
--yt-live-chat-shimmer-linear-gradient: linear-gradient(0deg, rgba(255, 255, 255, 0) 40%, rgba(255, 255, 255, 0.5) 50%, rgba(255, 255, 255, 0) 65%);
|
||||
--yt-live-chat-vem-background-color: hsl(0, 0%, 93.3%);
|
||||
--yt-live-chat-upsell-dialog-renderer-button-padding: 10px 16px;
|
||||
--yt-live-chat-product-picker-icon-color: rgba(17, 17, 17, 0.6);
|
||||
--yt-live-chat-product-picker-hover-color: rgba(17, 17, 16, 0.1);
|
||||
--yt-live-chat-product-picker-disabled-icon-color: rgba(17, 17, 17, 0.4);
|
||||
--yt-pdg-paid-stickers-tab-selection-bar-color: #065FD4;
|
||||
--yt-pdg-paid-stickers-author-name-font-size: 13px;
|
||||
--yt-pdg-paid-stickers-margin-left: 38px;
|
||||
}
|
||||
|
||||
html:not(.style-scope) {
|
||||
--layout_-_display: flex;
|
||||
;
|
||||
|
||||
--layout-inline_-_display: inline-flex;
|
||||
;
|
||||
|
||||
--layout-horizontal_-_display: var(--layout_-_display);
|
||||
--layout-horizontal_-_-ms-flex-direction: row;
|
||||
--layout-horizontal_-_-webkit-flex-direction: row;
|
||||
--layout-horizontal_-_flex-direction: row;
|
||||
;
|
||||
|
||||
--layout-horizontal-reverse_-_display: var(--layout_-_display);
|
||||
--layout-horizontal-reverse_-_-ms-flex-direction: row-reverse;
|
||||
--layout-horizontal-reverse_-_-webkit-flex-direction: row-reverse;
|
||||
--layout-horizontal-reverse_-_flex-direction: row-reverse;
|
||||
;
|
||||
|
||||
--layout-vertical_-_display: var(--layout_-_display);
|
||||
--layout-vertical_-_-ms-flex-direction: column;
|
||||
--layout-vertical_-_-webkit-flex-direction: column;
|
||||
--layout-vertical_-_flex-direction: column;
|
||||
;
|
||||
|
||||
--layout-vertical-reverse_-_display: var(--layout_-_display);
|
||||
--layout-vertical-reverse_-_-ms-flex-direction: column-reverse;
|
||||
--layout-vertical-reverse_-_-webkit-flex-direction: column-reverse;
|
||||
--layout-vertical-reverse_-_flex-direction: column-reverse;
|
||||
;
|
||||
|
||||
--layout-wrap_-_-ms-flex-wrap: wrap;
|
||||
--layout-wrap_-_-webkit-flex-wrap: wrap;
|
||||
--layout-wrap_-_flex-wrap: wrap;
|
||||
;
|
||||
|
||||
--layout-wrap-reverse_-_-ms-flex-wrap: wrap-reverse;
|
||||
--layout-wrap-reverse_-_-webkit-flex-wrap: wrap-reverse;
|
||||
--layout-wrap-reverse_-_flex-wrap: wrap-reverse;
|
||||
;
|
||||
|
||||
--layout-flex-auto_-_-ms-flex: 1 1 auto;
|
||||
--layout-flex-auto_-_-webkit-flex: 1 1 auto;
|
||||
--layout-flex-auto_-_flex: 1 1 auto;
|
||||
;
|
||||
|
||||
--layout-flex-none_-_-ms-flex: none;
|
||||
--layout-flex-none_-_-webkit-flex: none;
|
||||
--layout-flex-none_-_flex: none;
|
||||
;
|
||||
|
||||
--layout-flex_-_-ms-flex: 1 1 0.000000001px;
|
||||
--layout-flex_-_-webkit-flex: 1;
|
||||
--layout-flex_-_flex: 1;
|
||||
--layout-flex_-_-webkit-flex-basis: 0.000000001px;
|
||||
--layout-flex_-_flex-basis: 0.000000001px;
|
||||
;
|
||||
|
||||
--layout-flex-2_-_-ms-flex: 2;
|
||||
--layout-flex-2_-_-webkit-flex: 2;
|
||||
--layout-flex-2_-_flex: 2;
|
||||
;
|
||||
|
||||
--layout-flex-3_-_-ms-flex: 3;
|
||||
--layout-flex-3_-_-webkit-flex: 3;
|
||||
--layout-flex-3_-_flex: 3;
|
||||
;
|
||||
|
||||
--layout-flex-4_-_-ms-flex: 4;
|
||||
--layout-flex-4_-_-webkit-flex: 4;
|
||||
--layout-flex-4_-_flex: 4;
|
||||
;
|
||||
|
||||
--layout-flex-5_-_-ms-flex: 5;
|
||||
--layout-flex-5_-_-webkit-flex: 5;
|
||||
--layout-flex-5_-_flex: 5;
|
||||
;
|
||||
|
||||
--layout-flex-6_-_-ms-flex: 6;
|
||||
--layout-flex-6_-_-webkit-flex: 6;
|
||||
--layout-flex-6_-_flex: 6;
|
||||
;
|
||||
|
||||
--layout-flex-7_-_-ms-flex: 7;
|
||||
--layout-flex-7_-_-webkit-flex: 7;
|
||||
--layout-flex-7_-_flex: 7;
|
||||
;
|
||||
|
||||
--layout-flex-8_-_-ms-flex: 8;
|
||||
--layout-flex-8_-_-webkit-flex: 8;
|
||||
--layout-flex-8_-_flex: 8;
|
||||
;
|
||||
|
||||
--layout-flex-9_-_-ms-flex: 9;
|
||||
--layout-flex-9_-_-webkit-flex: 9;
|
||||
--layout-flex-9_-_flex: 9;
|
||||
;
|
||||
|
||||
--layout-flex-10_-_-ms-flex: 10;
|
||||
--layout-flex-10_-_-webkit-flex: 10;
|
||||
--layout-flex-10_-_flex: 10;
|
||||
;
|
||||
|
||||
--layout-flex-11_-_-ms-flex: 11;
|
||||
--layout-flex-11_-_-webkit-flex: 11;
|
||||
--layout-flex-11_-_flex: 11;
|
||||
;
|
||||
|
||||
--layout-flex-12_-_-ms-flex: 12;
|
||||
--layout-flex-12_-_-webkit-flex: 12;
|
||||
--layout-flex-12_-_flex: 12;
|
||||
;
|
||||
|
||||
|
||||
|
||||
--layout-start_-_-ms-flex-align: start;
|
||||
--layout-start_-_-webkit-align-items: flex-start;
|
||||
--layout-start_-_align-items: flex-start;
|
||||
;
|
||||
|
||||
--layout-center_-_-ms-flex-align: center;
|
||||
--layout-center_-_-webkit-align-items: center;
|
||||
--layout-center_-_align-items: center;
|
||||
;
|
||||
|
||||
--layout-end_-_-ms-flex-align: end;
|
||||
--layout-end_-_-webkit-align-items: flex-end;
|
||||
--layout-end_-_align-items: flex-end;
|
||||
;
|
||||
|
||||
--layout-baseline_-_-ms-flex-align: baseline;
|
||||
--layout-baseline_-_-webkit-align-items: baseline;
|
||||
--layout-baseline_-_align-items: baseline;
|
||||
;
|
||||
|
||||
|
||||
|
||||
--layout-start-justified_-_-ms-flex-pack: start;
|
||||
--layout-start-justified_-_-webkit-justify-content: flex-start;
|
||||
--layout-start-justified_-_justify-content: flex-start;
|
||||
;
|
||||
|
||||
--layout-center-justified_-_-ms-flex-pack: center;
|
||||
--layout-center-justified_-_-webkit-justify-content: center;
|
||||
--layout-center-justified_-_justify-content: center;
|
||||
;
|
||||
|
||||
--layout-end-justified_-_-ms-flex-pack: end;
|
||||
--layout-end-justified_-_-webkit-justify-content: flex-end;
|
||||
--layout-end-justified_-_justify-content: flex-end;
|
||||
;
|
||||
|
||||
--layout-around-justified_-_-ms-flex-pack: distribute;
|
||||
--layout-around-justified_-_-webkit-justify-content: space-around;
|
||||
--layout-around-justified_-_justify-content: space-around;
|
||||
;
|
||||
|
||||
--layout-justified_-_-ms-flex-pack: justify;
|
||||
--layout-justified_-_-webkit-justify-content: space-between;
|
||||
--layout-justified_-_justify-content: space-between;
|
||||
;
|
||||
|
||||
--layout-center-center_-_-ms-flex-align: var(--layout-center_-_-ms-flex-align);
|
||||
--layout-center-center_-_-webkit-align-items: var(--layout-center_-_-webkit-align-items);
|
||||
--layout-center-center_-_align-items: var(--layout-center_-_align-items);
|
||||
--layout-center-center_-_-ms-flex-pack: var(--layout-center-justified_-_-ms-flex-pack);
|
||||
--layout-center-center_-_-webkit-justify-content: var(--layout-center-justified_-_-webkit-justify-content);
|
||||
--layout-center-center_-_justify-content: var(--layout-center-justified_-_justify-content);
|
||||
;
|
||||
|
||||
|
||||
|
||||
--layout-self-start_-_-ms-align-self: flex-start;
|
||||
--layout-self-start_-_-webkit-align-self: flex-start;
|
||||
--layout-self-start_-_align-self: flex-start;
|
||||
;
|
||||
|
||||
--layout-self-center_-_-ms-align-self: center;
|
||||
--layout-self-center_-_-webkit-align-self: center;
|
||||
--layout-self-center_-_align-self: center;
|
||||
;
|
||||
|
||||
--layout-self-end_-_-ms-align-self: flex-end;
|
||||
--layout-self-end_-_-webkit-align-self: flex-end;
|
||||
--layout-self-end_-_align-self: flex-end;
|
||||
;
|
||||
|
||||
--layout-self-stretch_-_-ms-align-self: stretch;
|
||||
--layout-self-stretch_-_-webkit-align-self: stretch;
|
||||
--layout-self-stretch_-_align-self: stretch;
|
||||
;
|
||||
|
||||
--layout-self-baseline_-_-ms-align-self: baseline;
|
||||
--layout-self-baseline_-_-webkit-align-self: baseline;
|
||||
--layout-self-baseline_-_align-self: baseline;
|
||||
;
|
||||
|
||||
|
||||
|
||||
--layout-start-aligned_-_-ms-flex-line-pack: start;
|
||||
--layout-start-aligned_-_-ms-align-content: flex-start;
|
||||
--layout-start-aligned_-_-webkit-align-content: flex-start;
|
||||
--layout-start-aligned_-_align-content: flex-start;
|
||||
;
|
||||
|
||||
--layout-end-aligned_-_-ms-flex-line-pack: end;
|
||||
--layout-end-aligned_-_-ms-align-content: flex-end;
|
||||
--layout-end-aligned_-_-webkit-align-content: flex-end;
|
||||
--layout-end-aligned_-_align-content: flex-end;
|
||||
;
|
||||
|
||||
--layout-center-aligned_-_-ms-flex-line-pack: center;
|
||||
--layout-center-aligned_-_-ms-align-content: center;
|
||||
--layout-center-aligned_-_-webkit-align-content: center;
|
||||
--layout-center-aligned_-_align-content: center;
|
||||
;
|
||||
|
||||
--layout-between-aligned_-_-ms-flex-line-pack: justify;
|
||||
--layout-between-aligned_-_-ms-align-content: space-between;
|
||||
--layout-between-aligned_-_-webkit-align-content: space-between;
|
||||
--layout-between-aligned_-_align-content: space-between;
|
||||
;
|
||||
|
||||
--layout-around-aligned_-_-ms-flex-line-pack: distribute;
|
||||
--layout-around-aligned_-_-ms-align-content: space-around;
|
||||
--layout-around-aligned_-_-webkit-align-content: space-around;
|
||||
--layout-around-aligned_-_align-content: space-around;
|
||||
;
|
||||
|
||||
|
||||
|
||||
--layout-block_-_display: block;
|
||||
;
|
||||
|
||||
--layout-invisible_-_visibility: hidden !important;
|
||||
;
|
||||
|
||||
--layout-relative_-_position: relative;
|
||||
;
|
||||
|
||||
--layout-fit_-_position: absolute;
|
||||
--layout-fit_-_top: 0;
|
||||
--layout-fit_-_right: 0;
|
||||
--layout-fit_-_bottom: 0;
|
||||
--layout-fit_-_left: 0;
|
||||
;
|
||||
|
||||
--layout-scroll_-_-webkit-overflow-scrolling: touch;
|
||||
--layout-scroll_-_overflow: auto;
|
||||
;
|
||||
|
||||
--layout-fullbleed_-_margin: 0;
|
||||
--layout-fullbleed_-_height: 100vh;
|
||||
;
|
||||
|
||||
|
||||
|
||||
--layout-fixed-top_-_position: fixed;
|
||||
--layout-fixed-top_-_top: 0;
|
||||
--layout-fixed-top_-_left: 0;
|
||||
--layout-fixed-top_-_right: 0;
|
||||
;
|
||||
|
||||
--layout-fixed-right_-_position: fixed;
|
||||
--layout-fixed-right_-_top: 0;
|
||||
--layout-fixed-right_-_right: 0;
|
||||
--layout-fixed-right_-_bottom: 0;
|
||||
;
|
||||
|
||||
--layout-fixed-bottom_-_position: fixed;
|
||||
--layout-fixed-bottom_-_right: 0;
|
||||
--layout-fixed-bottom_-_bottom: 0;
|
||||
--layout-fixed-bottom_-_left: 0;
|
||||
;
|
||||
|
||||
--layout-fixed-left_-_position: fixed;
|
||||
--layout-fixed-left_-_top: 0;
|
||||
--layout-fixed-left_-_bottom: 0;
|
||||
--layout-fixed-left_-_left: 0;
|
||||
;
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- yt-live-chat-app -->
|
||||
<style>
|
||||
canvas.yt-live-chat-app, caption.yt-live-chat-app, center.yt-live-chat-app, cite.yt-live-chat-app, code.yt-live-chat-app, dd.yt-live-chat-app, del.yt-live-chat-app, dfn.yt-live-chat-app, div.yt-live-chat-app, dl.yt-live-chat-app, dt.yt-live-chat-app, em.yt-live-chat-app, embed.yt-live-chat-app, fieldset.yt-live-chat-app, font.yt-live-chat-app, form.yt-live-chat-app, h1.yt-live-chat-app, h2.yt-live-chat-app, h3.yt-live-chat-app, h4.yt-live-chat-app, h5.yt-live-chat-app, h6.yt-live-chat-app, hr.yt-live-chat-app, i.yt-live-chat-app, iframe.yt-live-chat-app, img.yt-live-chat-app, ins.yt-live-chat-app, kbd.yt-live-chat-app, label.yt-live-chat-app, legend.yt-live-chat-app, li.yt-live-chat-app, menu.yt-live-chat-app, object.yt-live-chat-app, ol.yt-live-chat-app, p.yt-live-chat-app, pre.yt-live-chat-app, q.yt-live-chat-app, s.yt-live-chat-app, samp.yt-live-chat-app, small.yt-live-chat-app, span.yt-live-chat-app, strike.yt-live-chat-app, strong.yt-live-chat-app, sub.yt-live-chat-app, sup.yt-live-chat-app, table.yt-live-chat-app, tbody.yt-live-chat-app, td.yt-live-chat-app, tfoot.yt-live-chat-app, th.yt-live-chat-app, thead.yt-live-chat-app, tr.yt-live-chat-app, tt.yt-live-chat-app, u.yt-live-chat-app, ul.yt-live-chat-app, var.yt-live-chat-app {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.yt-live-chat-app[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
yt-live-chat-app {
|
||||
display: block;
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
--yt-report-form-modal-renderer-min-width: 0;
|
||||
display: flex;
|
||||
-ms-flex-direction: column;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
#contents.yt-live-chat-app {
|
||||
/* yt-live-chat-renderer.yt-live-chat-app { */
|
||||
display: flex;
|
||||
-ms-flex-direction: column;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
-ms-flex: 1 1 0.000000001px;
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
-webkit-flex-basis: 0.000000001px;
|
||||
flex-basis: 0.000000001px;
|
||||
}
|
||||
|
||||
#contents.yt-live-chat-app>*.yt-live-chat-app {
|
||||
/* yt-live-chat-renderer.yt-live-chat-app { */
|
||||
-ms-flex: 1 1 0.000000001px;
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
-webkit-flex-basis: 0.000000001px;
|
||||
flex-basis: 0.000000001px;
|
||||
}
|
||||
|
||||
yt-live-chat-app[dashboard-money-feed] #contents.yt-live-chat-app>yt-live-chat-message-renderer.yt-live-chat-app {
|
||||
font-size: 18px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- yt-live-chat-renderer -->
|
||||
<style>
|
||||
canvas.yt-live-chat-renderer, caption.yt-live-chat-renderer, center.yt-live-chat-renderer, cite.yt-live-chat-renderer, code.yt-live-chat-renderer, dd.yt-live-chat-renderer, del.yt-live-chat-renderer, dfn.yt-live-chat-renderer, div.yt-live-chat-renderer, dl.yt-live-chat-renderer, dt.yt-live-chat-renderer, em.yt-live-chat-renderer, embed.yt-live-chat-renderer, fieldset.yt-live-chat-renderer, font.yt-live-chat-renderer, form.yt-live-chat-renderer, h1.yt-live-chat-renderer, h2.yt-live-chat-renderer, h3.yt-live-chat-renderer, h4.yt-live-chat-renderer, h5.yt-live-chat-renderer, h6.yt-live-chat-renderer, hr.yt-live-chat-renderer, i.yt-live-chat-renderer, iframe.yt-live-chat-renderer, img.yt-live-chat-renderer, ins.yt-live-chat-renderer, kbd.yt-live-chat-renderer, label.yt-live-chat-renderer, legend.yt-live-chat-renderer, li.yt-live-chat-renderer, menu.yt-live-chat-renderer, object.yt-live-chat-renderer, ol.yt-live-chat-renderer, p.yt-live-chat-renderer, pre.yt-live-chat-renderer, q.yt-live-chat-renderer, s.yt-live-chat-renderer, samp.yt-live-chat-renderer, small.yt-live-chat-renderer, span.yt-live-chat-renderer, strike.yt-live-chat-renderer, strong.yt-live-chat-renderer, sub.yt-live-chat-renderer, sup.yt-live-chat-renderer, table.yt-live-chat-renderer, tbody.yt-live-chat-renderer, td.yt-live-chat-renderer, tfoot.yt-live-chat-renderer, th.yt-live-chat-renderer, thead.yt-live-chat-renderer, tr.yt-live-chat-renderer, tt.yt-live-chat-renderer, u.yt-live-chat-renderer, ul.yt-live-chat-renderer, var.yt-live-chat-renderer {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.yt-live-chat-renderer[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
yt-live-chat-renderer {
|
||||
font-size: 13px;
|
||||
--yt-emoji-picker-renderer-height: 180px;
|
||||
--yt-button-default-text-color: var(--yt-live-chat-button-default-text-color);
|
||||
--yt-button-default-background-color: var(--yt-live-chat-button-default-background-color);
|
||||
--yt-button-dark-text-color: var(--yt-live-chat-button-dark-text-color);
|
||||
--yt-button-dark-background-color: var(--yt-live-chat-button-dark-background-color);
|
||||
--yt-button-payment-background-color: var(--yt-live-chat-sponsor-color);
|
||||
}
|
||||
|
||||
yt-live-chat-renderer {
|
||||
position: relative;
|
||||
background: var(--yt-live-chat-background-color);
|
||||
color: var(--yt-live-chat-primary-text-color);
|
||||
overflow: hidden;
|
||||
z-index: 0;
|
||||
display: flex;
|
||||
-ms-flex-direction: column;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
yt-live-chat-renderer[hide-timestamps] {
|
||||
--yt-live-chat-item-timestamp-display: none;
|
||||
}
|
||||
|
||||
#separator.yt-live-chat-renderer {
|
||||
border-bottom: var(--yt-live-chat-header-bottom-border, none);
|
||||
}
|
||||
|
||||
#content-pages.yt-live-chat-renderer {
|
||||
display: flex;
|
||||
-ms-flex-direction: column;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
-ms-flex: 1 1 0.000000001px;
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
-webkit-flex-basis: 0.000000001px;
|
||||
flex-basis: 0.000000001px;
|
||||
}
|
||||
|
||||
#panel-pages.yt-live-chat-renderer {
|
||||
max-height: 100%;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
#contents.yt-live-chat-renderer {
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
#chat-messages.yt-live-chat-renderer, #contents.yt-live-chat-renderer, #item-list.yt-live-chat-renderer {
|
||||
display: flex;
|
||||
-ms-flex-direction: column;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
-ms-flex: 1 1 0.000000001px;
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
-webkit-flex-basis: 0.000000001px;
|
||||
flex-basis: 0.000000001px;
|
||||
}
|
||||
|
||||
#ticker.yt-live-chat-renderer {
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
#chat.yt-live-chat-renderer {
|
||||
position: relative;
|
||||
display: flex;
|
||||
-ms-flex-direction: column;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
-ms-flex: 1 1 0.000000001px;
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
-webkit-flex-basis: 0.000000001px;
|
||||
flex-basis: 0.000000001px;
|
||||
}
|
||||
|
||||
#chat.yt-live-chat-renderer::after {
|
||||
content: '';
|
||||
display: none;
|
||||
animation: gradient-slide 1.2s ease infinite;
|
||||
animation-name: gradient-slide;
|
||||
background-color: var(--yt-live-chat-shimmer-background-color);
|
||||
background-image: var(--yt-live-chat-shimmer-linear-gradient);
|
||||
background-size: 300% 300%;
|
||||
transform: rotateX(180deg);
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
yt-live-chat-renderer[loading] #chat.yt-live-chat-renderer::after {
|
||||
display: block;
|
||||
}
|
||||
|
||||
yt-live-chat-pinned-message-renderer.yt-live-chat-renderer {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
yt-live-chat-item-list-renderer.yt-live-chat-renderer, yt-live-chat-ninja-message-renderer.yt-live-chat-renderer {
|
||||
-ms-flex: 1 1 0.000000001px;
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
-webkit-flex-basis: 0.000000001px;
|
||||
flex-basis: 0.000000001px;
|
||||
}
|
||||
|
||||
#action-panel.yt-live-chat-renderer {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
yt-live-chat-renderer[has-action-panel-renderer] yt-live-chat-action-panel-renderer.yt-live-chat-renderer {
|
||||
animation: slideUp cubic-bezier(0.05, 0.00, 0.00, 1.00) forwards;
|
||||
animation-duration: 0.5s;
|
||||
}
|
||||
|
||||
#action-panel-backdrop.yt-live-chat-renderer {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
visibility: hidden;
|
||||
}
|
||||
|
||||
yt-live-chat-renderer[has-action-panel-renderer] #action-panel-backdrop.yt-live-chat-renderer {
|
||||
visibility: visible;
|
||||
animation: fadeIn cubic-bezier(0.05, 0.00, 0.00, 1.00) forwards;
|
||||
animation-duration: 0.5s;
|
||||
}
|
||||
|
||||
#input-panel.yt-live-chat-renderer {
|
||||
-ms-flex: none;
|
||||
-webkit-flex: none;
|
||||
flex: none;
|
||||
}
|
||||
|
||||
#input-panel.yt-live-chat-renderer:not(:empty) {
|
||||
border-top: var(--yt-live-chat-action-panel-top-border, none);
|
||||
}
|
||||
|
||||
.hide-on-collapse.yt-live-chat-renderer {
|
||||
transition: opacity 0.3s;
|
||||
}
|
||||
|
||||
yt-live-chat-renderer[collapsed] .hide-on-collapse.yt-live-chat-renderer {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
#loading.yt-live-chat-renderer {
|
||||
height: 387px;
|
||||
background-color: var(--yt-live-chat-action-panel-background-color);
|
||||
display: flex;
|
||||
-ms-flex-direction: column;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
-ms-flex-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
-ms-flex-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
#loading.yt-live-chat-renderer>paper-spinner-lite.yt-live-chat-renderer {
|
||||
--paper-spinner-color: var(--yt-live-chat-primary-text-color);
|
||||
}
|
||||
|
||||
#nitrate-promo.yt-live-chat-renderer>*.yt-live-chat-renderer {
|
||||
background: var(--yt-live-chat-overlay-color);
|
||||
z-index: 3;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
@keyframes gradient-slide {
|
||||
0% {
|
||||
background-position: 100% 100%;
|
||||
}
|
||||
to {
|
||||
background-position: 0% 0%;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes slideUp {
|
||||
0% {
|
||||
transform: translateY(15%);
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
transform: translateY(0);
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes fadeIn {
|
||||
0% {
|
||||
background-color: transparent;
|
||||
}
|
||||
100% {
|
||||
background-color: rgba(0, 0, 0, 0.60);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- yt-live-chat-item-list-renderer -->
|
||||
<style>
|
||||
canvas.yt-live-chat-item-list-renderer, caption.yt-live-chat-item-list-renderer, center.yt-live-chat-item-list-renderer, cite.yt-live-chat-item-list-renderer, code.yt-live-chat-item-list-renderer, dd.yt-live-chat-item-list-renderer, del.yt-live-chat-item-list-renderer, dfn.yt-live-chat-item-list-renderer, div.yt-live-chat-item-list-renderer, dl.yt-live-chat-item-list-renderer, dt.yt-live-chat-item-list-renderer, em.yt-live-chat-item-list-renderer, embed.yt-live-chat-item-list-renderer, fieldset.yt-live-chat-item-list-renderer, font.yt-live-chat-item-list-renderer, form.yt-live-chat-item-list-renderer, h1.yt-live-chat-item-list-renderer, h2.yt-live-chat-item-list-renderer, h3.yt-live-chat-item-list-renderer, h4.yt-live-chat-item-list-renderer, h5.yt-live-chat-item-list-renderer, h6.yt-live-chat-item-list-renderer, hr.yt-live-chat-item-list-renderer, i.yt-live-chat-item-list-renderer, iframe.yt-live-chat-item-list-renderer, img.yt-live-chat-item-list-renderer, ins.yt-live-chat-item-list-renderer, kbd.yt-live-chat-item-list-renderer, label.yt-live-chat-item-list-renderer, legend.yt-live-chat-item-list-renderer, li.yt-live-chat-item-list-renderer, menu.yt-live-chat-item-list-renderer, object.yt-live-chat-item-list-renderer, ol.yt-live-chat-item-list-renderer, p.yt-live-chat-item-list-renderer, pre.yt-live-chat-item-list-renderer, q.yt-live-chat-item-list-renderer, s.yt-live-chat-item-list-renderer, samp.yt-live-chat-item-list-renderer, small.yt-live-chat-item-list-renderer, span.yt-live-chat-item-list-renderer, strike.yt-live-chat-item-list-renderer, strong.yt-live-chat-item-list-renderer, sub.yt-live-chat-item-list-renderer, sup.yt-live-chat-item-list-renderer, table.yt-live-chat-item-list-renderer, tbody.yt-live-chat-item-list-renderer, td.yt-live-chat-item-list-renderer, tfoot.yt-live-chat-item-list-renderer, th.yt-live-chat-item-list-renderer, thead.yt-live-chat-item-list-renderer, tr.yt-live-chat-item-list-renderer, tt.yt-live-chat-item-list-renderer, u.yt-live-chat-item-list-renderer, ul.yt-live-chat-item-list-renderer, var.yt-live-chat-item-list-renderer {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.yt-live-chat-item-list-renderer[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
yt-live-chat-item-list-renderer {
|
||||
position: relative;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
yt-live-chat-item-list-renderer[moderation-mode-enabled] {
|
||||
--yt-live-chat-item-with-inline-actions-context-menu-display: none;
|
||||
--yt-live-chat-inline-action-button-container-display: flex;
|
||||
}
|
||||
|
||||
#contents.yt-live-chat-item-list-renderer {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
display: flex;
|
||||
-ms-flex-direction: column;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
#empty-state-message.yt-live-chat-item-list-renderer {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
display: flex;
|
||||
-ms-flex-direction: column;
|
||||
-webkit-flex-direction: column;
|
||||
flex-direction: column;
|
||||
-ms-flex-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
#empty-state-message.yt-live-chat-item-list-renderer>yt-live-chat-message-renderer.yt-live-chat-item-list-renderer {
|
||||
color: var(--yt-live-chat-tertiary-text-color);
|
||||
background: transparent;
|
||||
font-size: 18px;
|
||||
--yt-live-chat-message-renderer-text-align: center;
|
||||
}
|
||||
|
||||
yt-icon-button.yt-live-chat-item-list-renderer {
|
||||
background-color: #2196f3;
|
||||
border-radius: 999px;
|
||||
bottom: 0;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
margin: 0 calc(50% - 16px) 8px calc(50% - 16px);
|
||||
padding: 4px;
|
||||
position: absolute;
|
||||
transition-property: bottom;
|
||||
transition-timing-function: cubic-bezier(0.0, 0.0, 0.2, 1);
|
||||
transition-duration: 0.15s;
|
||||
box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 1px 5px 0 rgba(0, 0, 0, 0.12), 0 3px 1px -2px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
yt-icon-button.yt-live-chat-item-list-renderer[disabled] {
|
||||
bottom: -42px;
|
||||
color: #fff;
|
||||
transition-timing-function: cubic-bezier(0.4, 0.0, 1, 1);
|
||||
}
|
||||
|
||||
#item-scroller.yt-live-chat-item-list-renderer {
|
||||
-ms-flex: 1 1 0.000000001px;
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
-webkit-flex-basis: 0.000000001px;
|
||||
flex-basis: 0.000000001px;
|
||||
overflow-x: hidden;
|
||||
overflow-y: hidden;
|
||||
padding-right: var(--scrollbar-width);
|
||||
}
|
||||
|
||||
yt-live-chat-item-list-renderer[allow-scroll] #item-scroller.yt-live-chat-item-list-renderer {
|
||||
overflow-y: scroll;
|
||||
padding-right: 0;
|
||||
}
|
||||
|
||||
#item-offset.yt-live-chat-item-list-renderer {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
#item-scroller.animated.yt-live-chat-item-list-renderer #item-offset.yt-live-chat-item-list-renderer {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#items.yt-live-chat-item-list-renderer {
|
||||
-ms-flex: 1 1 0.000000001px;
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
-webkit-flex-basis: 0.000000001px;
|
||||
flex-basis: 0.000000001px;
|
||||
padding: var(--yt-live-chat-item-list-renderer-padding, 4px 0);
|
||||
}
|
||||
|
||||
#items.yt-live-chat-item-list-renderer>*.yt-live-chat-item-list-renderer:not(:first-child) {
|
||||
border-top: var(--yt-live-chat-item-list-item-border, none);
|
||||
}
|
||||
|
||||
#item-scroller.animated.yt-live-chat-item-list-renderer #items.yt-live-chat-item-list-renderer {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
#docked-messages.yt-live-chat-item-list-renderer {
|
||||
z-index: 1;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-sticker-renderer.yt-live-chat-item-list-renderer {
|
||||
padding: 4px 24px;
|
||||
}
|
||||
|
||||
yt-live-chat-paid-sticker-renderer.yt-live-chat-item-list-renderer[dashboard-money-feed] {
|
||||
padding: 8px 16px;
|
||||
}
|
||||
</style>
|
||||
<style src="@/assets/css/youtube/yt-html.css"></style>
|
||||
<style src="@/assets/css/youtube/yt-live-chat-renderer.css"></style>
|
||||
<style src="@/assets/css/youtube/yt-live-chat-item-list-renderer.css"></style>
|
||||
|
||||
@ -53,7 +53,7 @@ export default {
|
||||
|
||||
<style>
|
||||
html {
|
||||
font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
|
||||
font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "\5FAE\8F6F\96C5\9ED1", "微软雅黑", Arial, sans-serif;
|
||||
}
|
||||
|
||||
html, body, #app, .app-wrapper, .sidebar-container {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user