From 41b0d0497988274057fc2512c822a6bc9d2d3ebd Mon Sep 17 00:00:00 2001 From: Volpeon Date: Wed, 6 Aug 2025 16:40:56 +0200 Subject: Switch to tab indentation --- src/objects/_thumbnail.scss | 160 ++++++++++++++++++++++---------------------- 1 file changed, 80 insertions(+), 80 deletions(-) (limited to 'src/objects/_thumbnail.scss') diff --git a/src/objects/_thumbnail.scss b/src/objects/_thumbnail.scss index 73a8cb0..60a98af 100644 --- a/src/objects/_thumbnail.scss +++ b/src/objects/_thumbnail.scss @@ -9,96 +9,96 @@ @use 'thumbnail.vars' as vars; @mixin styles { - @include materialize-at-root(meta.module-variables('vars')); + @include materialize-at-root(meta.module-variables('vars')); - @include bem.object('thumbnail') { - position: relative; - display: block; - flex: 0 0 auto; - inline-size: props.get(vars.$size); - block-size: props.get(vars.$size); - overflow: hidden; - border-radius: props.get(vars.$rounding); - outline: props.get(vars.$border-color) solid props.get(vars.$border-width); - outline-offset: calc(-1 * props.get(vars.$border-width)); - opacity: .75; + @include bem.object('thumbnail') { + position: relative; + display: block; + flex: 0 0 auto; + inline-size: props.get(vars.$size); + block-size: props.get(vars.$size); + overflow: hidden; + outline: props.get(vars.$border-color) solid props.get(vars.$border-width); + outline-offset: calc(-1 * props.get(vars.$border-width)); + border-radius: props.get(vars.$rounding); + opacity: .75; - &:hover, - &:active, - &:focus-visible { - outline-color: props.get(vars.$hover--border-color); - opacity: 1; - } + &:hover, + &:active, + &:focus-visible { + outline-color: props.get(vars.$hover--border-color); + opacity: 1; + } - @include bem.is('selected') { - $focus-border-offset: calc(-1 * props.get(vars.$selected--border-width)); + @include bem.is('selected') { + $focus-border-offset: calc(-1 * props.get(vars.$selected--border-width)); - margin: $focus-border-offset; - border: props.get(vars.$selected--border-width) solid props.get(vars.$selected--border-color); - border-radius: calc(props.get(vars.$rounding) - $focus-border-offset); - outline: none; - opacity: 1; - } + margin: $focus-border-offset; + outline: none; + border: props.get(vars.$selected--border-width) solid props.get(vars.$selected--border-color); + border-radius: calc(props.get(vars.$rounding) - $focus-border-offset); + opacity: 1; + } - @include bem.elem('image') { - position: absolute; - inset-block-start: 0; - inset-inline-start: 0; - display: block; - inline-size: 100%; - block-size: 100%; - object-fit: cover; - object-position: center center; - } + @include bem.elem('image') { + position: absolute; + inset-block-start: 0; + inset-inline-start: 0; + display: block; + inline-size: 100%; + block-size: 100%; + object-fit: cover; + object-position: center center; + } - @include bem.elem('icon') { - position: absolute; - inset-block-start: 50%; - inset-inline-start: 50%; - transform: translate(-50%, -50%); - } + @include bem.elem('icon') { + position: absolute; + inset-block-start: 50%; + inset-inline-start: 50%; + transform: translate(-50%, -50%); + } - &:focus-visible { - $focus-border-offset: calc(-1 * props.get(vars.$key-focus--border-offset)); + &:focus-visible { + $focus-border-offset: calc(-1 * props.get(vars.$key-focus--border-offset)); - margin: $focus-border-offset; - border: props.get(vars.$key-focus--border-offset) solid transparent; - border-radius: calc(props.get(vars.$rounding) - $focus-border-offset); - outline: props.get(vars.$key-focus--border-color) solid props.get(vars.$key-focus--border-width); - outline-offset: 0; - box-shadow: - 0 - 0 - 0 - calc(props.get(vars.$key-focus--outline-width) + props.get(vars.$key-focus--border-width)) - props.get(vars.$key-focus--outline-color); - } + margin: $focus-border-offset; + outline: props.get(vars.$key-focus--border-color) solid props.get(vars.$key-focus--border-width); + outline-offset: 0; + border: props.get(vars.$key-focus--border-offset) solid transparent; + border-radius: calc(props.get(vars.$rounding) - $focus-border-offset); + box-shadow: + 0 + 0 + 0 + calc(props.get(vars.$key-focus--outline-width) + props.get(vars.$key-focus--border-width)) + props.get(vars.$key-focus--outline-color); + } - @each $theme in map.keys(props.get(vars.$static-themes)) { - @include bem.modifier(string.slice($theme, 3)) { - outline-color: props.get(vars.$static-themes, $theme, --border); + @each $theme in map.keys(props.get(vars.$static-themes)) { + @include bem.modifier(string.slice($theme, 3)) { + outline-color: props.get(vars.$static-themes, $theme, --border); - &:hover, - &:active, - &:focus-visible { - outline-color: props.get(vars.$static-themes, $theme, --hover, --border); - } + &:hover, + &:active, + &:focus-visible { + outline-color: props.get(vars.$static-themes, $theme, --hover, --border); + } - @include bem.is('selected') { - border-color: props.get(vars.$static-themes, $theme, --selected, --border); - } + @include bem.is('selected') { + border-color: props.get(vars.$static-themes, $theme, --selected, --border); + } - &:focus-visible { - border-color: transparent; - outline-color: props.get(vars.$static-themes, $theme, --key-focus, --border); - box-shadow: - 0 - 0 - 0 - calc(props.get(vars.$key-focus--outline-width) + props.get(vars.$key-focus--border-width)) - props.get(vars.$static-themes, $theme, --key-focus, --outline); - } - } - } - } + &:focus-visible { + outline-color: props.get(vars.$static-themes, $theme, --key-focus, --border); + border-color: transparent; + box-shadow: + 0 + 0 + 0 + calc(props.get(vars.$key-focus--outline-width) + props.get(vars.$key-focus--border-width)) + props.get(vars.$static-themes, $theme, --key-focus, --outline); + } + } + } + } } -- cgit v1.2.3-70-g09d2