Move lightbox thumbnail to own object

1 files changed, 0 insertions, 88 deletions

diff --git a/src/objects/_lightbox.scss b/src/objects/_lightbox.scss
index 0ce62ff..4964b81 100644
--- a/src/objects/_lightbox.scss
+++ b/src/objects/_lightbox.scss
@@ -45,69 +45,6 @@
             overflow:           auto;
         }
 
-        @include bem.elem('thumbnail') {
-            position:       relative;
-            flex:           0 0 auto;
-            inline-size:    props.get(vars.$thumbnail--size);
-            block-size:     props.get(vars.$thumbnail--size);
-            overflow:       hidden;
-            border-radius:  props.get(vars.$thumbnail--rounding);
-            outline:        props.get(vars.$thumbnail--border-color) solid props.get(vars.$thumbnail--border-width);
-            outline-offset: calc(-1 * props.get(vars.$thumbnail--border-width));
-            opacity:       .75;
-
-            &:hover,
-            &:active,
-            &:focus-visible {
-                outline-color: props.get(vars.$thumbnail--hover--border-color);
-                opacity:       1;
-            }
-
-            @include bem.is('selected') {
-                $focus-border-offset: calc(-1 * props.get(vars.$thumbnail--selected--border-width));
-
-                margin:        $focus-border-offset;
-                border:        props.get(vars.$thumbnail--selected--border-width) solid props.get(vars.$thumbnail--selected--border-color);
-                border-radius: calc(props.get(vars.$thumbnail--rounding) - $focus-border-offset);
-                outline:       none;
-                opacity:       1;
-            }
-
-            &:focus-visible {
-                $focus-border-offset: calc(-1 * props.get(vars.$thumbnail--key-focus--border-offset));
-
-                margin:         $focus-border-offset;
-                border:         props.get(vars.$thumbnail--key-focus--border-offset) solid transparent;
-                border-radius:  calc(props.get(vars.$thumbnail--rounding) - $focus-border-offset);
-                outline:        props.get(vars.$thumbnail--key-focus--border-color) solid props.get(vars.$thumbnail--key-focus--border-width);
-                outline-offset: 0;
-                box-shadow:
-                    0
-                    0
-                    0
-                    calc(props.get(vars.$thumbnail--key-focus--outline-width) + props.get(vars.$thumbnail--key-focus--border-width))
-                    props.get(vars.$thumbnail--key-focus--outline-color);
-            }
-        }
-
-        @include bem.elem('thumbnail-img') {
-            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('thumbnail-icon') {
-            position:           absolute;
-            inset-block-start:  50%;
-            inset-inline-start: 50%;
-            transform:          translate(-50%, -50%);
-        }
-
         @include bem.elem('close-btn') {
             display:            none;
             flex:               0 0 auto;
@@ -187,31 +124,6 @@
         @each $theme in map.keys(props.get(vars.$static-themes)) {
             @include bem.modifier(string.slice($theme, 3)) {
                 color: props.get(vars.$static-themes, $theme, --text);
-
-                @include bem.elem('thumbnail') {
-                    outline-color: props.get(vars.$static-themes, $theme, --thumbnail, --border);
-
-                    &:hover,
-                    &:active,
-                    &:focus-visible {
-                        outline-color: props.get(vars.$static-themes, $theme, --thumbnail, --hover, --border);
-                    }
-        
-                    @include bem.is('selected') {
-                        border-color: props.get(vars.$static-themes, $theme, --thumbnail, --selected, --border);
-                    }
-
-                    &:focus-visible {
-                        border-color:  transparent;
-                        outline-color: props.get(vars.$static-themes, $theme, --thumbnail, --key-focus, --border);
-                        box-shadow: 
-                            0
-                            0
-                            0
-                            calc(props.get(vars.$thumbnail--key-focus--outline-width) + props.get(vars.$thumbnail--key-focus--border-width))
-                            props.get(vars.$static-themes, $theme, --thumbnail, --key-focus, --outline);
-                    }
-                }
             }
         }
     }