Warnings and error from Stylish editor not understood.
I wrote a style to change the font on YouTube to Times New Roman. But the editor used by Stylish is giving me warnings and an error that I don't understand. They just don't make sense. In order to be more specific, I have to use the same rules used by YouTube's server. The style I wrote is below. The warnings and errors are below that. If someone could explain what's going on, I'd appreciate it.
body, #search-input.ytd-searchbox-spt input, paper-item, .entity-type.ytcp-navigation-drawer, .entity-name.ytcp-navigation-drawer, paper-item.ytcp-navigation-drawer, paper-icon-item.ytcp-navigation-drawer, input.ytcp-omnisearch, ytcp-app[enable-page-title] .page-title.ytcp-app, .tab-content.paper-tab, .chip-and-bar.ytcp-chip-bar .ytcp-chip-bar, ytcp-button, ytcp-table-header, .icon-text-edit-triangle-wrap.ytcp-video-row .label-span.ytcp-video-row, .restrictions-list.ytcp-video-row, .tablecell-date.cell-body.ytcp-video-row, #row-container.ytcp-video-row, .tablecell-date.cell-body.ytcp-video-row .cell-description.ytcp-video-row, .tablecell-comments.cell-body.ytcp-video-row a.ytcp-video-row, .tablecell-comments.cell-body.ytcp-video-row span.ytcp-video-row, .likes-container.ytcp-video-row .primary-label.ytcp-video-row, .likes-container.ytcp-video-row .percent-label.ytcp-video-row, #video-title.ytcp-video-list-cell-video, .description.ytcp-video-list-cell-video, .ghp-header-title, .ghp-header-searchBox, .ghp-card-title, .ghp-iconTextComponent-label, .ghp-button, ytcp-app
{
font-family: Times New Roman!important
}
ytcp-popup-container
{
--yt-sort-menu-item-style_-_font-family: Times New Roman!important;
--ytd-code-snippet_-_font-family: Times New Roman!important;
--ytd-caption_-_font-family: Times New Roman!important;
}
The error
- "Expected rbrace"—Seems the parser doesn't understand CSS variables. YouTube uses a lot of them.
The warnings
- "Don't use adjoining classes"—Again, I need to match the selector used by Google. They used adjoining classes. This warning appears many times.
- "Don't use IDs in selectors"—So where do you use the ID syntax in CSS?
- "Element (input.ytcp-omnisearch) is overqualified, just use .ytcp-omnisearch without element name."—Well, tell that to Google.
- "Use of !important"—It's rather needed in order for the style to override the stock stylesheet.
- "Empty rule"—Cascade from the error above.