mirror of
https://github.com/squidfunk/mkdocs-material.git
synced 2024-06-14 11:52:32 +03:00
Switched annotation markers to + signs in non-print contexts
This commit is contained in:
parent
16939c16ae
commit
1ddf8723b0
File diff suppressed because one or more lines are too long
8
material/assets/javascripts/bundle.17f42bbf.min.js.map
Normal file
8
material/assets/javascripts/bundle.17f42bbf.min.js.map
Normal file
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
1
material/assets/stylesheets/main.2d264350.min.css.map
Normal file
1
material/assets/stylesheets/main.2d264350.min.css.map
Normal file
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -34,7 +34,7 @@
|
||||
{% endif %}
|
||||
{% endblock %}
|
||||
{% block styles %}
|
||||
<link rel="stylesheet" href="{{ 'assets/stylesheets/main.52c8dc4b.min.css' | url }}">
|
||||
<link rel="stylesheet" href="{{ 'assets/stylesheets/main.2d264350.min.css' | url }}">
|
||||
{% if config.theme.palette %}
|
||||
{% set palette = config.theme.palette %}
|
||||
<link rel="stylesheet" href="{{ 'assets/stylesheets/palette.9204c3b2.min.css' | url }}">
|
||||
@ -213,7 +213,7 @@
|
||||
</script>
|
||||
{% endblock %}
|
||||
{% block scripts %}
|
||||
<script src="{{ 'assets/javascripts/bundle.a5f8ea78.min.js' | url }}"></script>
|
||||
<script src="{{ 'assets/javascripts/bundle.17f42bbf.min.js' | url }}"></script>
|
||||
{% for path in config["extra_javascript"] %}
|
||||
<script src="{{ path | url }}"></script>
|
||||
{% endfor %}
|
||||
|
18
material/overrides/assets/javascripts/bundle.05395296.min.js
vendored
Normal file
18
material/overrides/assets/javascripts/bundle.05395296.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
@ -16,5 +16,5 @@
|
||||
{% endblock %}
|
||||
{% block scripts %}
|
||||
{{ super() }}
|
||||
<script src="{{ 'overrides/assets/javascripts/bundle.ab1cf86a.min.js' | url }}"></script>
|
||||
<script src="{{ 'overrides/assets/javascripts/bundle.05395296.min.js' | url }}"></script>
|
||||
{% endblock %}
|
||||
|
@ -22,6 +22,7 @@
|
||||
|
||||
import {
|
||||
Observable,
|
||||
debounceTime,
|
||||
distinctUntilChanged,
|
||||
fromEvent,
|
||||
map,
|
||||
@ -43,6 +44,9 @@ import { getActiveElement } from "../_"
|
||||
* within the elements itself. A better solutions are `focusin` and `focusout`
|
||||
* events, which bubble up the tree and allow for more fine-grained control.
|
||||
*
|
||||
* `debounceTime` is necessary, because when a focus change happens inside an
|
||||
* element, the observable would first emit `false` and then `true` again.
|
||||
*
|
||||
* @param el - Element
|
||||
*
|
||||
* @returns Element focus observable
|
||||
@ -55,6 +59,7 @@ export function watchElementFocus(
|
||||
fromEvent(document.body, "focusout")
|
||||
)
|
||||
.pipe(
|
||||
debounceTime(1),
|
||||
map(() => {
|
||||
const active = getActiveElement()
|
||||
return typeof active !== "undefined"
|
||||
|
@ -39,7 +39,9 @@ export function renderAnnotation(id: number): HTMLElement {
|
||||
<div class="md-annotation__inner md-tooltip">
|
||||
<div class="md-tooltip__inner md-typeset"></div>
|
||||
</div>
|
||||
<span class="md-annotation__index">{id}</span>
|
||||
<span class="md-annotation__index">
|
||||
<span data-md-annotation-id={id}></span>
|
||||
</span>
|
||||
</aside>
|
||||
)
|
||||
}
|
||||
|
@ -214,6 +214,24 @@
|
||||
}
|
||||
}
|
||||
|
||||
// Annotation marker content
|
||||
[data-md-annotation-id]::before {
|
||||
display: inline-block;
|
||||
transition: transform 400ms cubic-bezier(0.1, 0.7, 0.1, 1);
|
||||
content: attr(data-md-annotation-id);
|
||||
|
||||
// [not print]: if we're not in print mode, show a `+` sign instead of
|
||||
// the original numbers, as context is already given by the position.
|
||||
@media not print {
|
||||
content: "+";
|
||||
|
||||
// Annotation marker content on focus
|
||||
:focus-within > & {
|
||||
transform: rotate(45deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Annotation index on focus/hover
|
||||
:is(:focus-within, :hover) > & {
|
||||
color: var(--md-accent-bg-color);
|
||||
|
Loading…
Reference in New Issue
Block a user