diff --git a/CONTRIBUTORS b/CONTRIBUTORS index 5546ac893..350e8fd36 100644 --- a/CONTRIBUTORS +++ b/CONTRIBUTORS @@ -78,6 +78,7 @@ Maksim Abramchuk Benjamin Kulnik Shaun Ren Ryan Greenblatt +Matthias Metelka ******************** diff --git a/ts/editor/legacy.scss b/ts/editor/legacy.scss index 4fcbdb3f1..57627914d 100644 --- a/ts/editor/legacy.scss +++ b/ts/editor/legacy.scss @@ -2,13 +2,36 @@ .linkb { display: inline-block; - @include button.btn-border-radius; background-color: white; border: 1px solid var(--medium-border); + + /* !important cannot be used with @include */ + border-top-left-radius: var(--border-left-radius) !important; + border-bottom-left-radius: var(--border-left-radius) !important; + border-top-right-radius: var(--border-right-radius) !important; + border-bottom-right-radius: var(--border-right-radius) !important; + + min-width: 28px; + margin-left: -1px; + padding: 3.5px !important; } -.night-mode .linkb { - background-color: #666; +.linkb:hover, +.linkb:active:hover { + background-color: #ebebeb; +} + +.linkb:active, +.linkb:active:hover { + background-color: white; + box-shadow: inset 0 + calc(var(--toolbar-size) / 15) + calc(var(--toolbar-size) / 5) + rgba(0, 0, 0, 0.25); +} + +.linkb:active:hover .topbut { + filter: invert(1) grayscale(1) brightness(100); } .topbut { @@ -17,3 +40,28 @@ width: calc(var(--toolbar-size) - 12px); height: calc(var(--toolbar-size) - 12px); } + +.nightMode { + .linkb { + margin-left: 1px; + } + + .linkb:hover { + background-color: #7a7a7a; + border-color: #7a7a7a; + } + + .linkb:active, + .linkb:active:hover { + box-shadow: inset 0 + calc(var(--toolbar-size) / 15) + calc(var(--toolbar-size) / 5) + rgba(0, 0, 0, 0.35); + border-color: #525252; + } + + img.topbut, + .linkb:active:hover img.topbut { + filter: invert(1); + } +}