add hover effects!!

This commit is contained in:
Ashley 2023-01-01 18:14:35 +00:00
parent b147c4a727
commit a632695366

View file

@ -61,6 +61,7 @@
#623aa2 100%, #623aa2 100%,
#8e6f7e 100% #8e6f7e 100%
); );
--chip-background-hover: #3f3f3f;
--ptd-watch-min-player-height: 360px; --ptd-watch-min-player-height: 360px;
--ptd-watch-width-ratio: 16; --ptd-watch-width-ratio: 16;
@ -126,14 +127,13 @@ a {
color: var(--text-link); color: var(--text-link);
} }
.video > .info > .title { .video > .info > .title {
font-family: var(--text-font-primary); font-family: var(--text-font-primary);
width: 10em; width: 10em;
} }
.dropdown__menu > a { .dropdown__menu > a {
text-decoration: none; text-decoration: none;
} }
.video-info-panel > .video-title > a { .video-info-panel > .video-title > a {
@ -148,8 +148,7 @@ a {
word-break: break-all; word-break: break-all;
font-family: var(--text-font-primary) !important; font-family: var(--text-font-primary) !important;
font-stretch: extra-expanded; font-stretch: extra-expanded;
font-weight: 900 !important; font-weight: 900 !important;
} }
.video-sub-info.description { .video-sub-info.description {
@ -294,7 +293,6 @@ a {
font-stretch: expanded; font-stretch: expanded;
} }
.comments-author { .comments-author {
margin: 7px; margin: 7px;
font-family: var(--text-font-primary); font-family: var(--text-font-primary);
@ -439,62 +437,71 @@ a {
border-style: solid; border-style: solid;
} }
.dropdown { .dropdown {
position: relative; position: relative;
display: flex; display: flex;
} }
.dropdown > input[type="checkbox"] { .dropdown > input[type="checkbox"] {
display: none; display: none;
} }
.dropdown > label { .dropdown > label {
width: 100%; width: 100%;
height: 100%; height: 100%;
margin: -8px; margin: -8px;
padding: 8px; padding: 8px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
.dropdown__menu { .dropdown__menu {
position: absolute; position: absolute;
z-index: 999; z-index: 999;
display: none; display: none;
margin-right: 4em; margin-right: 4em;
top: 40px; top: 40px;
padding: 6px 0; padding: 6px 0;
margin: 0; margin: 0;
width: 300px; width: 300px;
border-radius: 8px; border-radius: 8px;
box-shadow: var(--border-color) 0 0 5px; box-shadow: var(--border-color) 0 0 5px;
background-color: var(--context-menu-background) background-color: var(--context-menu-background);
} }
.dropdown__item { .dropdown__item {
display: flex; display: flex;
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
padding: 0 16px; padding: 0 16px;
height: 40px; height: 40px;
column-gap: 16px; column-gap: 16px;
color: var(--text-primary); color: var(--text-primary);
text-decoration: none; text-decoration: none;
} }
.dropdown__item:hover { .dropdown__item:hover {
background-color: var(--chip-background-hover); background-color: var(--chip-background-hover);
} }
.dropdown__item:active { .dropdown__item:active {
background-color: var(--chip-background-active); background-color: var(--chip-background-active);
} }
.dropdown > input[type="checkbox"]:checked ~ div, .dropdown > input[type="checkbox"]:checked ~ div,
.dropdown__menu:target { .dropdown__menu:target {
display: block; display: block;
} }
.new-button.engagement:hover {
background-color: #0009;
}
div.new-button:hover {
background-color: #0008;
}
a.new-button:hover {
background-color: #0008;
}