diff --git a/plugins/techdocs/src/reader/transformers/styles/rules/layout.ts b/plugins/techdocs/src/reader/transformers/styles/rules/layout.ts
index 78b73cb52a..35dac279ca 100644
--- a/plugins/techdocs/src/reader/transformers/styles/rules/layout.ts
+++ b/plugins/techdocs/src/reader/transformers/styles/rules/layout.ts
@@ -34,11 +34,14 @@ export default ({ theme, sidebar }: RuleOptions) => `
.md-nav {
font-size: calc(var(--md-typeset-font-size) * 0.9);
}
-.md-nav__link {
+.md-nav__link:not(:has(svg)) {
display: flex;
align-items: center;
justify-content: space-between;
}
+.md-nav__link:has(svg) > .md-ellipsis {
+ flex-grow: 1;
+}
.md-nav__icon {
height: 20px !important;
width: 20px !important;
@@ -53,11 +56,21 @@ export default ({ theme, sidebar }: RuleOptions) => `
width: 20px !important;
height: 20px !important;
}
+.md-status--updated::after {
+ -webkit-mask-image: var(--md-status--updated);
+ mask-image: var(--md-status--updated);
+}
.md-nav__item--active > .md-nav__link, a.md-nav__link--active {
text-decoration: underline;
color: var(--md-typeset-a-color);
}
+.md-nav__link--active > .md-status:after {
+ background-color: var(--md-typeset-a-color);
+}
+.md-nav__link[href]:hover > .md-status:after {
+ background-color: var(--md-accent-fg-color);
+}
.md-main__inner {
margin-top: 0;
diff --git a/plugins/techdocs/src/reader/transformers/styles/rules/variables.ts b/plugins/techdocs/src/reader/transformers/styles/rules/variables.ts
index 7ffe76c5fb..e7e47c6fc7 100644
--- a/plugins/techdocs/src/reader/transformers/styles/rules/variables.ts
+++ b/plugins/techdocs/src/reader/transformers/styles/rules/variables.ts
@@ -97,6 +97,12 @@ export default ({ theme }: RuleOptions) => `
--md-source-stars-icon: url('data:image/svg+xml;charset=utf-8,');
--md-source-version-icon: url('data:image/svg+xml;charset=utf-8,');
--md-version-icon: url('data:image/svg+xml;charset=utf-8,');
+
+ --md-status--updated: url('data:image/svg+xml;charset=utf-8,');
+ --md-status: url('data:image/svg+xml;charset=utf-8,');
+ --md-status--new: url('data:image/svg+xml;charset=utf-8,');
+ --md-status--deprecated: url('data:image/svg+xml;charset=utf-8,');
+ --md-status--encrypted: url('data:image/svg+xml;charset=utf-8,');
}
:host > * {