mirror of
https://github.com/ankitects/anki.git
synced 2025-09-20 15:02:21 -04:00
Fix toolbar styles
This commit is contained in:
parent
212a4ca2e1
commit
003d3a39c7
2 changed files with 29 additions and 16 deletions
|
@ -61,39 +61,45 @@ body {
|
|||
transform: translateY(-100vh);
|
||||
}
|
||||
transition: transform var(--transition) ease-in-out;
|
||||
|
||||
|
||||
.header {
|
||||
height: 41px;
|
||||
}
|
||||
.toolbar {
|
||||
height: 31px;
|
||||
|
||||
overflow: hidden;
|
||||
border-bottom-left-radius: prop(border-radius-medium);
|
||||
border-bottom-right-radius: prop(border-radius-medium);
|
||||
@include elevation(1, $opacity-boost: -0.1);
|
||||
|
||||
// elevated state (deck browser, overview)
|
||||
body:not(.flat) & {
|
||||
background: var(--canvas-elevated);
|
||||
@include elevation(1);
|
||||
&:hover {
|
||||
@include elevation(2);
|
||||
}
|
||||
}
|
||||
// glass effect
|
||||
background: var(--canvas-glass);
|
||||
backdrop-filter: blur(var(--blur));
|
||||
}
|
||||
|
||||
.hitem {
|
||||
// elevated state (deck browser, overview)
|
||||
&:not(.flat) .toolbar {
|
||||
background: var(--canvas-elevated);
|
||||
@include elevation(1);
|
||||
&:hover {
|
||||
background: var(--canvas-inset);
|
||||
text-decoration: none;
|
||||
@include elevation(2);
|
||||
}
|
||||
}
|
||||
|
||||
&:not(.flat) .hitem {
|
||||
@include button.base($border: false, $with-hover: false);
|
||||
background: var(--canvas-glass);
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
.hitem {
|
||||
text-decoration: none;
|
||||
border: 1px solid transparent;
|
||||
|
||||
&:hover {
|
||||
border: 1px solid var(--border-subtle);
|
||||
}
|
||||
&:active {
|
||||
@include button.base($border: false);
|
||||
background: var(--canvas-elevated);
|
||||
background: var(--canvas-inset);
|
||||
}
|
||||
&:first-child {
|
||||
padding-left: 18px;
|
||||
|
|
|
@ -55,6 +55,13 @@ class ToolbarWebView(AnkiWebView):
|
|||
def on_body_classes_need_update(self) -> None:
|
||||
super().on_body_classes_need_update()
|
||||
super().adjustHeightToFit()
|
||||
|
||||
if self.mw.state == "review":
|
||||
if self.mw.pm.collapse_toolbar():
|
||||
self.eval("""document.body.classList.remove("flat"); """)
|
||||
else:
|
||||
self.flatten()
|
||||
|
||||
self.expand()
|
||||
|
||||
def _onHeight(self, qvar: Optional[int]) -> None:
|
||||
|
@ -70,7 +77,7 @@ class ToolbarWebView(AnkiWebView):
|
|||
self.eval("""document.body.classList.remove("collapsed"); """)
|
||||
|
||||
def flatten(self) -> None:
|
||||
self.eval("document.body.classList.add('flat'); ")
|
||||
self.eval("""document.body.classList.add("flat"); """)
|
||||
|
||||
def elevate(self) -> None:
|
||||
self.eval(
|
||||
|
|
Loading…
Reference in a new issue