mirror of
https://codeberg.org/ashley/poke.git
synced 2024-12-01 04:57:18 +01:00
add hover effects!!
This commit is contained in:
parent
c8890f3af1
commit
0e5f716184
1 changed files with 47 additions and 40 deletions
|
@ -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;
|
||||||
|
}
|
||||||
|
|
Loading…
Reference in a new issue