Changed scroll component button design. Removed unnecessary z-index from tooltip arrow.
This commit is contained in:
parent
b4f6373605
commit
679e09f27e
|
@ -163,74 +163,12 @@ export default {
|
|||
display: none;
|
||||
}
|
||||
|
||||
.scroll-light {
|
||||
background: var(--background-dim);
|
||||
|
||||
.scroll-button {
|
||||
.icon {
|
||||
fill: var(--darken);
|
||||
}
|
||||
|
||||
&.scroll-start .icon,
|
||||
&.scroll-end .icon {
|
||||
fill: var(--darken-weak);
|
||||
}
|
||||
|
||||
&:hover:not(.scroll-start):not(.scroll-end) .icon {
|
||||
fill: var(--text-dark);
|
||||
}
|
||||
}
|
||||
|
||||
.scroll-left {
|
||||
background: linear-gradient(to right, var(--background-dim) 50%, transparent);
|
||||
}
|
||||
|
||||
.scroll-right {
|
||||
background: linear-gradient(to left, var(--background-dim) 50%, transparent);
|
||||
}
|
||||
|
||||
.expand-dark {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.expand-light {
|
||||
display: block;
|
||||
}
|
||||
.expand-dark {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.scroll-dark {
|
||||
background: var(--profile);
|
||||
|
||||
.scroll-button {
|
||||
.icon {
|
||||
fill: var(--lighten);
|
||||
}
|
||||
|
||||
&.scroll-start .icon,
|
||||
&.scroll-end .icon {
|
||||
fill: var(--darken-weak);
|
||||
}
|
||||
|
||||
&:hover:not(.scroll-start):not(.scroll-end) .icon {
|
||||
fill: var(--text-light);
|
||||
}
|
||||
}
|
||||
|
||||
.scroll-left {
|
||||
background: linear-gradient(to right, var(--profile) 50%, transparent);
|
||||
}
|
||||
|
||||
.scroll-right {
|
||||
background: linear-gradient(to left, var(--profile) 50%, transparent);
|
||||
}
|
||||
|
||||
.expand-light {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.expand-dark {
|
||||
display: block;
|
||||
}
|
||||
.expand-light {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.scroll-button {
|
||||
|
@ -257,6 +195,21 @@ export default {
|
|||
right: 0;
|
||||
}
|
||||
|
||||
.icon {
|
||||
width: 1.5rem;
|
||||
height: 1.5rem;
|
||||
fill: var(--lighten);
|
||||
}
|
||||
|
||||
&.scroll-start .icon,
|
||||
&.scroll-end .icon {
|
||||
fill: var(--lighten-weak);
|
||||
}
|
||||
|
||||
&:hover:not(.scroll-start):not(.scroll-end) .icon {
|
||||
fill: var(--lighten-strong);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
display: flex;
|
||||
cursor: pointer;
|
||||
|
|
|
@ -133,7 +133,6 @@ export default {
|
|||
width: 0;
|
||||
height: 0;
|
||||
position: absolute;
|
||||
z-index : 11;
|
||||
top: -.5rem;
|
||||
left: calc(50% - .5rem);
|
||||
border-left: .5rem solid transparent;
|
||||
|
|
Loading…
Reference in New Issue