Files
netslim-blog/assets/scss/components/_upload.scss
2026-03-20 22:16:20 +01:00

80 lines
1.6 KiB
SCSS

@use "../core/variables" as *;
@use "../core/mixins" as *;
// =============================================================
// Bloc upload — aperçu et actions sur les médias uploadés
// =============================================================
.upload {
display: flex;
flex-direction: column;
gap: $spacing-sm;
}
.upload__thumb-link {
display: inline-block;
text-decoration: none;
@include interactive-transition;
&:focus-visible {
@include focus-ring;
border-radius: $radius-sm;
}
}
.upload__thumb {
display: block;
width: 96px;
height: 72px;
object-fit: cover;
border-radius: $radius-sm;
border: 1px solid $color-border;
background: $color-bg-light;
}
.upload__actions {
display: flex;
flex-wrap: wrap;
gap: $spacing-xs;
align-items: center;
}
.upload__url {
display: block;
font-size: $font-size-sm;
color: $color-text-muted;
margin-bottom: $spacing-xs;
word-break: break-all;
white-space: normal;
background: transparent;
padding: 0;
}
.upload__thumb-link--compact {
line-height: 0;
}
.upload__thumb--compact {
width: 64px;
height: 64px;
}
// Variante bouton — utile en mode picker si on veut rendre la vignette cliquable
.upload__thumb-button {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 0;
border: 0;
background: transparent;
cursor: pointer;
@include interactive-transition;
&:focus-visible {
@include focus-ring;
border-radius: $radius-sm;
}
}