Unpinned Stylelint and plugins
This commit is contained in:
		
							parent
							
								
									3b12816f69
								
							
						
					
					
						commit
						f88c43695f
					
				
							
								
								
									
										29
									
								
								.stylelintrc
								
								
								
								
							
							
						
						
									
										29
									
								
								.stylelintrc
								
								
								
								
							|  | @ -1,11 +1,12 @@ | |||
| { | ||||
|   "extends": [ | ||||
|     "@stylistic/stylelint-config", | ||||
|     "stylelint-config-recess-order", | ||||
|     "stylelint-config-recommended", | ||||
|     "stylelint-config-standard-scss", | ||||
|     "stylelint-stylistic/config" | ||||
|     "stylelint-config-standard-scss" | ||||
|   ], | ||||
|   "plugins": [ | ||||
|     "@stylistic/stylelint-plugin", | ||||
|     "stylelint-scss" | ||||
|   ], | ||||
|   "rules": { | ||||
|  | @ -46,7 +47,6 @@ | |||
|     ], | ||||
|     "custom-property-empty-line-before": null, | ||||
|     "custom-property-pattern": null, | ||||
|     "declaration-colon-space-after": null, | ||||
|     "declaration-no-important": true, | ||||
|     "declaration-block-single-line-max-declarations": 0, | ||||
|     "font-family-name-quotes": "always-where-recommended", | ||||
|  | @ -78,8 +78,6 @@ | |||
|       } | ||||
|     ], | ||||
|     "selector-class-pattern": null, | ||||
|     "selector-combinator-space-before": null, | ||||
|     "selector-descendant-combinator-no-non-space": null, | ||||
|     "selector-id-pattern": null, | ||||
|     "selector-max-id": 0, | ||||
|     "selector-no-qualifying-type": null, | ||||
|  | @ -106,7 +104,6 @@ | |||
|         ] | ||||
|       } | ||||
|     ], | ||||
|     "value-list-comma-newline-after": null, | ||||
|     "value-no-vendor-prefix": [ | ||||
|       true, | ||||
|       { | ||||
|  | @ -121,7 +118,6 @@ | |||
|     "scss/at-function-pattern": "^[a-z][a-z0-9]*(-[a-z0-9]+)*$", | ||||
|     "scss/at-if-closing-brace-newline-after": "always-last-in-chain", | ||||
|     "scss/at-if-no-null": true, | ||||
|     "scss/at-import-partial-extension": "never", | ||||
|     "scss/at-mixin-argumentless-call-parentheses": "always", | ||||
|     "scss/at-mixin-parentheses-space-before": "never", | ||||
|     "scss/at-mixin-pattern": "^[a-z][a-z0-9]*(-[a-z0-9]+)*$", | ||||
|  | @ -139,6 +135,7 @@ | |||
|     "scss/double-slash-comment-empty-line-before": null, | ||||
|     "scss/double-slash-comment-whitespace-inside": "always", | ||||
|     "scss/at-extend-no-missing-placeholder": null, | ||||
|     "scss/load-partial-extension": "never", | ||||
|     "scss/no-duplicate-mixins": true, | ||||
|     "scss/no-global-function-names": null, | ||||
|     "scss/operator-no-newline-after": null, | ||||
|  | @ -146,7 +143,7 @@ | |||
|     "scss/partial-no-import": true, | ||||
|     "scss/percent-placeholder-pattern": "^[a-z][a-z0-9]*(-[a-z0-9]+)*$", | ||||
|     "scss/selector-no-redundant-nesting-selector": true, | ||||
|     "stylistic/block-closing-brace-newline-after": [ | ||||
|     "@stylistic/block-closing-brace-newline-after": [ | ||||
|       "always", | ||||
|       { | ||||
|         "ignoreAtRules": [ | ||||
|  | @ -156,12 +153,14 @@ | |||
|         ] | ||||
|       } | ||||
|     ], | ||||
|     "stylistic/declaration-colon-space-after": null, | ||||
|     "stylistic/no-empty-first-line": true, | ||||
|     "stylistic/linebreaks": "unix", | ||||
|     "stylistic/selector-max-empty-lines": 0, | ||||
|     "stylistic/string-quotes": "double", | ||||
|     "stylistic/unicode-bom": "never", | ||||
|     "stylistic/value-list-comma-newline-after": null | ||||
|     "@stylistic/declaration-colon-space-after": null, | ||||
|     "@stylistic/no-empty-first-line": true, | ||||
|     "@stylistic/linebreaks": "unix", | ||||
|     "@stylistic/selector-combinator-space-before": null, | ||||
|     "@stylistic/selector-descendant-combinator-no-non-space": null, | ||||
|     "@stylistic/selector-max-empty-lines": 0, | ||||
|     "@stylistic/string-quotes": "double", | ||||
|     "@stylistic/unicode-bom": "never", | ||||
|     "@stylistic/value-list-comma-newline-after": null | ||||
|   } | ||||
| } | ||||
|  |  | |||
										
											
												File diff suppressed because it is too large
												Load Diff
											
										
									
								
							
							
								
								
									
										13
									
								
								package.json
								
								
								
								
							
							
						
						
									
										13
									
								
								package.json
								
								
								
								
							|  | @ -55,6 +55,8 @@ | |||
|     "@mdi/svg": "^7.4.47", | ||||
|     "@primer/octicons": "^19.11.0", | ||||
|     "@stylistic/eslint-plugin-ts": "^2.6.4", | ||||
|     "@stylistic/stylelint-config": "^2.0.0", | ||||
|     "@stylistic/stylelint-plugin": "^3.0.1", | ||||
|     "@types/css-modules": "^1.0.5", | ||||
|     "@types/escape-html": "^1.0.4", | ||||
|     "@types/fuzzaldrin-plus": "^0.6.5", | ||||
|  | @ -91,12 +93,11 @@ | |||
|     "rimraf": "^6.0.1", | ||||
|     "sass": "^1.77.8", | ||||
|     "simple-icons": "^13.6.0", | ||||
|     "stylelint": "15.11.0", | ||||
|     "stylelint-config-recess-order": "4.2.0", | ||||
|     "stylelint-config-recommended": "13.0.0", | ||||
|     "stylelint-config-standard-scss": "11.1.0", | ||||
|     "stylelint-scss": "5.3.2", | ||||
|     "stylelint-stylistic": "0.4.3", | ||||
|     "stylelint": "^16.8.2", | ||||
|     "stylelint-config-recess-order": "^5.1.0", | ||||
|     "stylelint-config-recommended": "^14.0.1", | ||||
|     "stylelint-config-standard-scss": "^13.1.0", | ||||
|     "stylelint-scss": "^6.5.0", | ||||
|     "svgo": "^3.3.2", | ||||
|     "tiny-glob": "^0.2.9", | ||||
|     "ts-node": "^10.9.2", | ||||
|  |  | |||
|  | @ -59,8 +59,8 @@ | |||
|     // Hack: promote to own layer to reduce jitter | ||||
|     backface-visibility: hidden; | ||||
|     touch-action: pan-y; | ||||
|     scrollbar-width: thin; | ||||
|     scrollbar-color: var(--md-default-fg-color--lighter) transparent; | ||||
|     scrollbar-width: thin; | ||||
| 
 | ||||
|     // Icon search result inside tooltip | ||||
|     .md-tooltip & { | ||||
|  |  | |||
|  | @ -233,11 +233,11 @@ kbd { | |||
|       overflow: auto; | ||||
|       word-break: normal; | ||||
|       touch-action: auto; | ||||
|       scrollbar-color: var(--md-default-fg-color--lighter) transparent; | ||||
|       scrollbar-width: thin; | ||||
|       outline-color: var(--md-accent-fg-color); | ||||
|       box-shadow: none; | ||||
|       box-decoration-break: slice; | ||||
|       scrollbar-width: thin; | ||||
|       scrollbar-color: var(--md-default-fg-color--lighter) transparent; | ||||
| 
 | ||||
|       // Code block on hover | ||||
|       &:hover { | ||||
|  | @ -515,10 +515,10 @@ kbd { | |||
|       margin-inline-start: 0.5em; | ||||
|       vertical-align: text-bottom; | ||||
|       content: ""; | ||||
|       transition: background-color 125ms; | ||||
|       mask-image: var(--md-typeset-table-sort-icon); | ||||
|       mask-repeat: no-repeat; | ||||
|       mask-size: contain; | ||||
|       transition: background-color 125ms; | ||||
|     } | ||||
| 
 | ||||
|     // Show sort icon on hover | ||||
|  |  | |||
|  | @ -77,8 +77,8 @@ | |||
|     content: ""; | ||||
|     background-color: currentcolor; | ||||
|     mask-image: var(--md-clipboard-icon); | ||||
|     mask-position: center; | ||||
|     mask-repeat: no-repeat; | ||||
|     mask-position: center; | ||||
|     mask-size: contain; | ||||
|   } | ||||
| 
 | ||||
|  |  | |||
|  | @ -63,8 +63,8 @@ | |||
|     width: 100%; | ||||
|     height: 100%; | ||||
|     background-color: hsla(0, 0%, 0%, 0.54); | ||||
|     opacity: 1; | ||||
|     backdrop-filter: blur(px2rem(2px)); | ||||
|     opacity: 1; | ||||
|     animation: overlay 250ms both; | ||||
|   } | ||||
| 
 | ||||
|  |  | |||
|  | @ -27,6 +27,7 @@ | |||
| // Dialog | ||||
| .md-dialog { | ||||
|   position: fixed; | ||||
|   inset-inline-end: px2rem(16px); | ||||
|   bottom: px2rem(16px); | ||||
|   z-index: 4; | ||||
|   min-width: px2rem(222px); | ||||
|  | @ -40,7 +41,6 @@ | |||
|     transform 0ms   400ms, | ||||
|     opacity   400ms; | ||||
|   transform: translateY(100%); | ||||
|   inset-inline-end: px2rem(16px); | ||||
| 
 | ||||
|   // [print]: Hide dialog | ||||
|   @media print { | ||||
|  |  | |||
|  | @ -86,8 +86,8 @@ | |||
|     gap: px2rem(8px); | ||||
|     align-items: flex-start; | ||||
|     margin-top: 0.625em; | ||||
|     transition: color 125ms; | ||||
|     scroll-snap-align: start; | ||||
|     transition: color 125ms; | ||||
| 
 | ||||
|     // Navigation link that was passed | ||||
|     &--passed { | ||||
|  | @ -148,8 +148,8 @@ | |||
|         display: block; | ||||
|         width: 100%; | ||||
|         height: 100%; | ||||
|         mask-image: var(--md-toc-icon); | ||||
|         background-color: currentcolor; | ||||
|         mask-image: var(--md-toc-icon); | ||||
|       } | ||||
| 
 | ||||
|       // Hide table of contents | ||||
|  | @ -221,8 +221,8 @@ | |||
|         // Navigation icon | ||||
|         .md-nav__icon { | ||||
|           position: absolute; | ||||
|           top: px2rem(8px); | ||||
|           inset-inline-start: px2rem(8px); | ||||
|           top: px2rem(8px); | ||||
|           display: block; | ||||
|           width: px2rem(24px); | ||||
|           height: px2rem(24px); | ||||
|  | @ -236,8 +236,8 @@ | |||
|             content: ""; | ||||
|             background-color: currentcolor; | ||||
|             mask-image: var(--md-nav-icon--prev); | ||||
|             mask-position: center; | ||||
|             mask-repeat: no-repeat; | ||||
|             mask-position: center; | ||||
|             mask-size: contain; | ||||
|           } | ||||
|         } | ||||
|  | @ -246,10 +246,10 @@ | |||
|         ~ .md-nav__list { | ||||
|           overflow-y: auto; | ||||
|           touch-action: pan-y; | ||||
|           scroll-snap-type: y mandatory; | ||||
|           background-color: var(--md-default-bg-color); | ||||
|           box-shadow: | ||||
|             0 px2rem(1px) 0 var(--md-default-fg-color--lightest) inset; | ||||
|           scroll-snap-type: y mandatory; | ||||
| 
 | ||||
|           // Omit border on first child | ||||
|           > :first-child { | ||||
|  | @ -325,8 +325,8 @@ | |||
|             content: ""; | ||||
|             background-color: currentcolor; | ||||
|             mask-image: var(--md-nav-icon--next); | ||||
|             mask-position: center; | ||||
|             mask-repeat: no-repeat; | ||||
|             mask-position: center; | ||||
|             mask-size: contain; | ||||
|           } | ||||
|         } | ||||
|  | @ -656,11 +656,11 @@ | |||
|         content: ""; | ||||
|         background-color: currentcolor; | ||||
|         border-radius: 100%; | ||||
|         transition: transform 250ms; | ||||
|         mask-image: var(--md-nav-icon--next); | ||||
|         mask-position: center; | ||||
|         mask-repeat: no-repeat; | ||||
|         mask-position: center; | ||||
|         mask-size: contain; | ||||
|         transition: transform 250ms; | ||||
| 
 | ||||
|         // Adjust for right-to-left languages | ||||
|         [dir="rtl"] & { | ||||
|  |  | |||
|  | @ -53,6 +53,7 @@ | |||
|     // [tablet portrait -]: Search modal | ||||
|     @include break-to-device(tablet portrait) { | ||||
|       position: absolute; | ||||
|       inset-inline-start: px2rem(-44px); | ||||
|       top: px2rem(-20px); | ||||
|       width: px2rem(40px); | ||||
|       height: px2rem(40px); | ||||
|  | @ -64,7 +65,6 @@ | |||
|         transform 300ms 100ms, | ||||
|         opacity   200ms 200ms; | ||||
|       transform-origin: center; | ||||
|       inset-inline-start: px2rem(-44px); | ||||
| 
 | ||||
|       // Show overlay when search is active | ||||
|       [data-md-toggle="search"]:checked ~ .md-header & { | ||||
|  | @ -78,6 +78,7 @@ | |||
|     // [tablet landscape +]: Header-embedded search | ||||
|     @include break-from-device(tablet landscape) { | ||||
|       position: fixed; | ||||
|       inset-inline-start: 0; | ||||
|       top: 0; | ||||
|       width: 0; | ||||
|       height: 0; | ||||
|  | @ -87,7 +88,6 @@ | |||
|         width     0ms 250ms, | ||||
|         height    0ms 250ms, | ||||
|         opacity 250ms; | ||||
|       inset-inline-start: 0; | ||||
| 
 | ||||
|       // Show overlay when search is active | ||||
|       [data-md-toggle="search"]:checked ~ .md-header & { | ||||
|  | @ -133,6 +133,7 @@ | |||
|     // [tablet portrait -]: Search modal | ||||
|     @include break-to-device(tablet portrait) { | ||||
|       position: fixed; | ||||
|       inset-inline-start: 0; | ||||
|       top: 0; | ||||
|       z-index: 2; | ||||
|       width: 0; | ||||
|  | @ -145,7 +146,6 @@ | |||
|         transform 150ms 150ms cubic-bezier(0.4, 0, 0.2, 1), | ||||
|         opacity   150ms 150ms; | ||||
|       transform: translateX(5%); | ||||
|       inset-inline-start: 0; | ||||
| 
 | ||||
|       // Adjust for right-to-left languages | ||||
|       [dir="rtl"] & { | ||||
|  | @ -307,8 +307,8 @@ | |||
|     // Search focus button | ||||
|     &[for="__search"] { | ||||
|       position: absolute; | ||||
|       top: px2rem(6px); | ||||
|       inset-inline-start: px2rem(10px); | ||||
|       top: px2rem(6px); | ||||
|       z-index: 2; | ||||
| 
 | ||||
|       // Adjust for right-to-left languages | ||||
|  | @ -318,8 +318,8 @@ | |||
| 
 | ||||
|       // [tablet portrait -]: Search modal | ||||
|       @include break-to-device(tablet portrait) { | ||||
|         top: px2rem(12px); | ||||
|         inset-inline-start: px2rem(16px); | ||||
|         top: px2rem(12px); | ||||
| 
 | ||||
|         // Hide the magnifying glass | ||||
|         svg:first-child { | ||||
|  | @ -342,15 +342,15 @@ | |||
|   // Search options | ||||
|   &__options { | ||||
|     position: absolute; | ||||
|     top: px2rem(6px); | ||||
|     inset-inline-end: px2rem(10px); | ||||
|     top: px2rem(6px); | ||||
|     z-index: 2; | ||||
|     pointer-events: none; | ||||
| 
 | ||||
|     // [tablet portrait -]: Search modal | ||||
|     @include break-to-device(tablet portrait) { | ||||
|       top: px2rem(12px); | ||||
|       inset-inline-end: px2rem(16px); | ||||
|       top: px2rem(12px); | ||||
|     } | ||||
| 
 | ||||
|     // Search option buttons | ||||
|  | @ -471,8 +471,8 @@ | |||
|     // [tablet landscape +]: Limit height to viewport | ||||
|     @include break-from-device(tablet landscape) { | ||||
|       max-height: 0; | ||||
|       scrollbar-width: thin; | ||||
|       scrollbar-color: var(--md-default-fg-color--lighter) transparent; | ||||
|       scrollbar-width: thin; | ||||
| 
 | ||||
|       // Show scroll wrapper when search is active | ||||
|       [data-md-toggle="search"]:checked ~ .md-header & { | ||||
|  | @ -514,8 +514,8 @@ | |||
|     font-size: px2rem(12.8px); | ||||
|     line-height: px2rem(36px); | ||||
|     color: var(--md-default-fg-color--light); | ||||
|     background-color: var(--md-default-fg-color--lightest); | ||||
|     scroll-snap-align: start; | ||||
|     background-color: var(--md-default-fg-color--lightest); | ||||
| 
 | ||||
|     // [tablet landscape +]: Adjust spacing | ||||
|     @include break-from-device(tablet landscape) { | ||||
|  | @ -545,9 +545,9 @@ | |||
|   // Search result link | ||||
|   &__link { | ||||
|     display: block; | ||||
|     scroll-snap-align: start; | ||||
|     outline: none; | ||||
|     transition: background-color 250ms; | ||||
|     scroll-snap-align: start; | ||||
| 
 | ||||
|     // Search result link on focus/hover | ||||
|     &:is(:focus, :hover) { | ||||
|  | @ -567,8 +567,8 @@ | |||
|     z-index: 1; | ||||
|     display: block; | ||||
|     cursor: pointer; | ||||
|     outline: none; | ||||
|     scroll-snap-align: start; | ||||
|     outline: none; | ||||
| 
 | ||||
|     // Hide native details marker | ||||
|     &::marker { | ||||
|  | @ -643,8 +643,8 @@ | |||
|       content: ""; | ||||
|       background-color: currentcolor; | ||||
|       mask-image: var(--md-search-result-icon); | ||||
|       mask-position: center; | ||||
|       mask-repeat: no-repeat; | ||||
|       mask-position: center; | ||||
|       mask-size: contain; | ||||
| 
 | ||||
|       // Adjust for right-to-left languages | ||||
|  |  | |||
|  | @ -96,11 +96,11 @@ | |||
|     width: 100%; | ||||
|     padding-inline: px2rem(12px) px2rem(24px); | ||||
|     cursor: pointer; | ||||
|     scroll-snap-align: start; | ||||
|     outline: none; | ||||
|     transition: | ||||
|       background-color 250ms, | ||||
|       color            250ms; | ||||
|     scroll-snap-align: start; | ||||
| 
 | ||||
|     // Link on focus/hover | ||||
|     &:is(:focus, :hover) { | ||||
|  |  | |||
|  | @ -44,6 +44,7 @@ | |||
|     // [tablet -]: Show navigation as drawer | ||||
|     @include break-to-device(tablet) { | ||||
|       position: fixed; | ||||
|       inset-inline-start: px2rem(-242px); | ||||
|       top: 0; | ||||
|       z-index: 5; | ||||
|       display: block; | ||||
|  | @ -54,7 +55,6 @@ | |||
|         transform  250ms cubic-bezier(0.4, 0, 0.2, 1), | ||||
|         box-shadow 250ms; | ||||
|       transform: translateX(0); | ||||
|       inset-inline-start: px2rem(-242px); | ||||
| 
 | ||||
|       // Show sidebar when drawer is active | ||||
|       [data-md-toggle="drawer"]:checked ~ .md-container & { | ||||
|  | @ -72,8 +72,8 @@ | |||
|         position: absolute; | ||||
|         inset: 0; | ||||
|         margin: 0; | ||||
|         scroll-snap-type: none; | ||||
|         overflow: hidden; | ||||
|         scroll-snap-type: none; | ||||
|       } | ||||
|     } | ||||
|   } | ||||
|  | @ -123,15 +123,15 @@ | |||
|   &__scrollwrap { | ||||
|     margin: 0 px2rem(4px); | ||||
|     overflow-y: auto; | ||||
|     // Hack: promote to own layer to reduce jitter | ||||
|     backface-visibility: hidden; | ||||
|     scrollbar-color: var(--md-default-fg-color--lighter) transparent; | ||||
|     scrollbar-gutter: stable; | ||||
|     // Hack: Chrome 81+ exhibits a strange bug, where it scrolls the container | ||||
|     // to the bottom if `scroll-snap-type` is set on the initial render. For | ||||
|     // this reason, we disable scroll snapping until this is resolved (#1667). | ||||
|     // scroll-snap-type: y mandatory; | ||||
|     scrollbar-width: thin; | ||||
|     scrollbar-gutter: stable; | ||||
|     scrollbar-color: var(--md-default-fg-color--lighter) transparent; | ||||
|     // Hack: promote to own layer to reduce jitter | ||||
|     backface-visibility: hidden; | ||||
| 
 | ||||
|     // Webkit scrollbar | ||||
|     &::-webkit-scrollbar { | ||||
|  |  | |||
|  | @ -149,8 +149,8 @@ | |||
|       vertical-align: text-top; | ||||
|       content: ""; | ||||
|       background-color: currentcolor; | ||||
|       mask-position: center; | ||||
|       mask-repeat: no-repeat; | ||||
|       mask-position: center; | ||||
|       mask-size: contain; | ||||
|     } | ||||
| 
 | ||||
|  |  | |||
|  | @ -46,8 +46,8 @@ | |||
|     content: ""; | ||||
|     background-color: var(--md-default-fg-color--light); | ||||
|     mask-image: var(--md-status); | ||||
|     mask-position: center; | ||||
|     mask-repeat: no-repeat; | ||||
|     mask-position: center; | ||||
|     mask-size: contain; | ||||
|   } | ||||
| 
 | ||||
|  |  | |||
|  | @ -90,11 +90,11 @@ | |||
|       vertical-align: text-bottom; | ||||
|       content: ""; | ||||
|       background-color: var(--md-default-fg-color--lighter); | ||||
|       transition: background-color 125ms; | ||||
|       mask-image: var(--md-tag-icon); | ||||
|       mask-position: center; | ||||
|       mask-repeat: no-repeat; | ||||
|       mask-position: center; | ||||
|       mask-size: contain; | ||||
|       transition: background-color 125ms; | ||||
|     } | ||||
| 
 | ||||
|     // Linked tag on focus/hover | ||||
|  |  | |||
|  | @ -211,8 +211,8 @@ | |||
|         content: ""; | ||||
|         background: var(--md-default-bg-color); | ||||
|         mask-image: var(--md-annotation-bg-icon); | ||||
|         mask-position: center; | ||||
|         mask-repeat: no-repeat; | ||||
|         mask-position: center; | ||||
|         mask-size: contain; | ||||
|       } | ||||
| 
 | ||||
|  | @ -228,15 +228,15 @@ | |||
|         height: 2.2ch; | ||||
|         content: ""; | ||||
|         background-color: var(--md-default-fg-color--lighter); | ||||
|         mask-image: var(--md-annotation-icon); | ||||
|         mask-repeat: no-repeat; | ||||
|         mask-position: center; | ||||
|         mask-size: contain; | ||||
|         transition: | ||||
|           background-color 250ms, | ||||
|           transform        250ms; | ||||
|         // Hack: promote to own layer to reduce jitter | ||||
|         transform: scale(1.0001); | ||||
|         mask-image: var(--md-annotation-icon); | ||||
|         mask-position: center; | ||||
|         mask-repeat: no-repeat; | ||||
|         mask-size: contain; | ||||
| 
 | ||||
|         // Annotation marker for active tooltip | ||||
|         .md-tooltip--active + & { | ||||
|  | @ -296,8 +296,8 @@ | |||
|       // Annotation list marker | ||||
|       &::before { | ||||
|         position: absolute; | ||||
|         top: px2em(4px); | ||||
|         inset-inline-start: px2em(-34px); | ||||
|         top: px2em(4px); | ||||
|         min-width: 2ch; | ||||
|         height: 2ch; | ||||
|         padding: 0 0.6ch; | ||||
|  |  | |||
|  | @ -42,10 +42,10 @@ | |||
|       var(--md-tooltip-host-y) + | ||||
|       var(--md-tooltip-y) | ||||
|     ); | ||||
|   inline-size: 100%; | ||||
|   // Hack: set an explicit `z-index` so we can transition it to ensure that any | ||||
|   // following elements are not overlaying the tooltip during the transition. | ||||
|   z-index: 0; | ||||
|   inline-size: 100%; | ||||
|   font-family: var(--md-text-font-family); | ||||
|   color: var(--md-default-fg-color); | ||||
|   pointer-events: none; | ||||
|  | @ -140,11 +140,11 @@ | |||
|       ); | ||||
|     max-width: calc(100vw - 2 * #{px2rem(16px)}); | ||||
|     max-height: 40vh; | ||||
|     scrollbar-gutter: stable; | ||||
|     scrollbar-width: thin; | ||||
|     background-color: var(--md-default-bg-color); | ||||
|     border-radius: px2rem(2px); | ||||
|     box-shadow: var(--md-shadow-z2); | ||||
|     scrollbar-width: thin; | ||||
|     scrollbar-gutter: stable; | ||||
| 
 | ||||
|     // Webkit scrollbar | ||||
|     &::-webkit-scrollbar { | ||||
|  |  | |||
|  | @ -70,8 +70,8 @@ | |||
|       content: ""; | ||||
|       background-color: currentcolor; | ||||
|       mask-image: var(--md-version-icon); | ||||
|       mask-position: center; | ||||
|       mask-repeat: no-repeat; | ||||
|       mask-position: center; | ||||
|       mask-size: contain; | ||||
|     } | ||||
|   } | ||||
|  | @ -93,6 +93,7 @@ | |||
|     overflow: auto; | ||||
|     color: var(--md-default-fg-color); | ||||
|     list-style-type: none; | ||||
|     scroll-snap-type: y mandatory; | ||||
|     background-color: var(--md-default-bg-color); | ||||
|     border-radius: px2rem(2px); | ||||
|     box-shadow: var(--md-shadow-z2); | ||||
|  | @ -100,7 +101,6 @@ | |||
|     transition: | ||||
|       max-height 0ms 500ms, | ||||
|       opacity  250ms 250ms; | ||||
|     scroll-snap-type: y mandatory; | ||||
| 
 | ||||
|     // Version selection list on parent focus/hover | ||||
|     .md-version:is(:focus-within, :hover) & { | ||||
|  | @ -137,11 +137,11 @@ | |||
|     padding-inline: px2rem(12px) px2rem(24px); | ||||
|     white-space: nowrap; | ||||
|     cursor: pointer; | ||||
|     scroll-snap-align: start; | ||||
|     outline: none; | ||||
|     transition: | ||||
|       color            250ms, | ||||
|       background-color 250ms; | ||||
|     scroll-snap-align: start; | ||||
| 
 | ||||
|     // Link on focus/hover | ||||
|     &:is(:focus, :hover) { | ||||
|  |  | |||
|  | @ -140,15 +140,15 @@ $admonitions: ( | |||
|     // Admonition icon | ||||
|     &::before { | ||||
|       position: absolute; | ||||
|       inset-inline-start: px2rem(12px); | ||||
|       top: px2em(10px); | ||||
|       width: px2rem(20px); | ||||
|       height: px2rem(20px); | ||||
|       content: ""; | ||||
|       background-color: $clr-blue-a200; | ||||
|       inset-inline-start: px2rem(12px); | ||||
|       mask-image: var(--md-admonition-icon--note); | ||||
|       mask-position: center; | ||||
|       mask-repeat: no-repeat; | ||||
|       mask-position: center; | ||||
|       mask-size: contain; | ||||
|     } | ||||
| 
 | ||||
|  |  | |||
|  | @ -129,8 +129,8 @@ | |||
|       content: ""; | ||||
|       background-color: currentcolor; | ||||
|       mask-image: var(--md-footnotes-icon); | ||||
|       mask-position: center; | ||||
|       mask-repeat: no-repeat; | ||||
|       mask-position: center; | ||||
|       mask-size: contain; | ||||
| 
 | ||||
|       // Adjust for right-to-left languages | ||||
|  |  | |||
|  | @ -91,18 +91,18 @@ | |||
|     // Details marker | ||||
|     &::after { | ||||
|       position: absolute; | ||||
|       inset-inline-end: px2rem(8px); | ||||
|       top: px2em(10px); | ||||
|       width: px2rem(20px); | ||||
|       height: px2rem(20px); | ||||
|       content: ""; | ||||
|       background-color: currentcolor; | ||||
|       mask-image: var(--md-details-icon); | ||||
|       mask-repeat: no-repeat; | ||||
|       mask-position: center; | ||||
|       mask-size: contain; | ||||
|       transition: transform 250ms; | ||||
|       transform: rotate(0deg); | ||||
|       inset-inline-end: px2rem(8px); | ||||
|       mask-image: var(--md-details-icon); | ||||
|       mask-position: center; | ||||
|       mask-repeat: no-repeat; | ||||
|       mask-size: contain; | ||||
| 
 | ||||
|       // Adjust for right-to-left languages | ||||
|       [dir="rtl"] & { | ||||
|  |  | |||
|  | @ -95,9 +95,9 @@ | |||
|     display: flex; | ||||
|     max-width: 100%; | ||||
|     overflow: auto; | ||||
|     scrollbar-width: none;             // Firefox | ||||
|     box-shadow: 0 px2rem(-1px) var(--md-default-fg-color--lightest) inset; | ||||
|     -ms-overflow-style: none;          // IE, Edge | ||||
|     scrollbar-width: none;             // Firefox | ||||
| 
 | ||||
|     // [print]: Move one layer up for ordering | ||||
|     @media print { | ||||
|  | @ -146,12 +146,12 @@ | |||
|       color: var(--md-default-fg-color--light); | ||||
|       white-space: nowrap; | ||||
|       cursor: pointer; | ||||
|       scroll-margin-inline-start: px2rem(20px); | ||||
|       border-bottom: px2rem(2px) solid transparent; | ||||
|       border-radius: px2rem(2px) px2rem(2px) 0 0; | ||||
|       transition: | ||||
|         background-color 250ms, | ||||
|         color            250ms; | ||||
|       scroll-margin-inline-start: px2rem(20px); | ||||
| 
 | ||||
|       // [print]: Intersperse labels with containers | ||||
|       @media print { | ||||
|  | @ -296,13 +296,13 @@ | |||
|       height: 100%; | ||||
|       content: ""; | ||||
|       background-color: currentcolor; | ||||
|       mask-image: var(--md-tabbed-icon--prev); | ||||
|       mask-repeat: no-repeat; | ||||
|       mask-position: center; | ||||
|       mask-size: contain; | ||||
|       transition: | ||||
|         background-color 250ms, | ||||
|         transform        250ms; | ||||
|       mask-image: var(--md-tabbed-icon--prev); | ||||
|       mask-position: center; | ||||
|       mask-repeat: no-repeat; | ||||
|       mask-size: contain; | ||||
|     } | ||||
|   } | ||||
| 
 | ||||
|  |  | |||
|  | @ -44,8 +44,8 @@ | |||
|     // everything in ems for correct layout at smaller font sizes | ||||
|     [type="checkbox"] { | ||||
|       position: absolute; | ||||
|       top: 0.45em; | ||||
|       inset-inline-start: -2em; | ||||
|       top: 0.45em; | ||||
|     } | ||||
|   } | ||||
| 
 | ||||
|  | @ -58,15 +58,15 @@ | |||
|   // Tasklist indicator in unchecked state | ||||
|   .task-list-indicator::before { | ||||
|     position: absolute; | ||||
|     inset-inline-start: px2em(-24px); | ||||
|     top: 0.15em; | ||||
|     width: px2em(20px); | ||||
|     height: px2em(20px); | ||||
|     content: ""; | ||||
|     background-color: var(--md-default-fg-color--lightest); | ||||
|     inset-inline-start: px2em(-24px); | ||||
|     mask-image: var(--md-tasklist-icon); | ||||
|     mask-position: center; | ||||
|     mask-repeat: no-repeat; | ||||
|     mask-position: center; | ||||
|     mask-size: contain; | ||||
|   } | ||||
| 
 | ||||
|  |  | |||
		Loading…
	
		Reference in New Issue