diff --git a/src/components/DlRow.vue b/src/components/DlRow.vue
index c904f29..ec33187 100644
--- a/src/components/DlRow.vue
+++ b/src/components/DlRow.vue
@@ -23,6 +23,9 @@ const props = defineProps({ row: Object })
a {
@include h6;
}
+ a {
+ text-decoration: underline;
+ }
}
}
diff --git a/src/components/MosaicModal.vue b/src/components/MosaicModal.vue
index f0086b2..1d45149 100644
--- a/src/components/MosaicModal.vue
+++ b/src/components/MosaicModal.vue
@@ -3,15 +3,28 @@
class="mosaic-modal theme-dark layout-grid-inner"
@click="emit('close')"
>
-
-
+
{{ item.title }}
-
+
@@ -21,6 +34,7 @@
@@ -32,29 +46,42 @@ const emit = defineEmits(['close'])
align-items: flex-start;
padding-top: desktop-vw(27px);
+ .meta {
+ grid-column: 4 / span 2;
+ }
+
.window {
background: var(--theme-bg);
color: var(--theme-fg);
+ border-radius: desktop-vw(10px);
&.dl {
padding: desktop-vw(12px) desktop-vw(10px);
- border-radius: desktop-vw(10px);
display: flex;
flex-direction: column;
gap: desktop-vw(8px);
- grid-column: 4 / span 2;
.dl-row:first-child {
border-top: none;
padding-top: 0;
}
}
+ &.gif {
+ margin-top: var(--layout-margin);
+ padding: 1rem;
+ text-align: center;
+
+ a {
+ text-decoration: underline;
+ display: block;
+ margin-top: 1em;
+ }
+ }
&.content {
- border-radius: desktop-vw(10px);
grid-column: 6 / span 7;
.lenis {
- max-height: desktop-vh(900px);
+ max-height: desktop-vh(950px);
overflow: auto;
padding: desktop-vw(34px) desktop-vw(24px);
}
@@ -62,17 +89,15 @@ const emit = defineEmits(['close'])
text-align: center;
margin-bottom: 1em;
}
+ .strapi-media {
+ border-radius: desktop-vw(4px);
+ overflow: hidden;
+ }
}
&.close {
padding: desktop-vw(9px);
border-radius: desktop-vw(16px);
cursor: pointer;
- /* position: absolute;
- right: calc(
- (var(--layout-column-width) * 3) +
- (var(--layout-column-gap) * 3) + var(--layout-margin)
- );
- top: desktop-vw(40px); */
margin-right: auto;
@include label;
}
diff --git a/src/components/MosaicScroll.vue b/src/components/MosaicScroll.vue
index 0475d25..0009013 100644
--- a/src/components/MosaicScroll.vue
+++ b/src/components/MosaicScroll.vue
@@ -13,6 +13,7 @@
@@ -26,6 +30,6 @@ const props = defineProps({
.strapi-map {
display: flex;
flex-direction: column;
- gap: desktop-vw(40px);
+ gap: desktop-vw(30px);
}
diff --git a/src/components/strapi/Media.vue b/src/components/strapi/Media.vue
index 5992a64..f704307 100644
--- a/src/components/strapi/Media.vue
+++ b/src/components/strapi/Media.vue
@@ -6,7 +6,7 @@
>
![]()
`${import.meta.env.VITE_STRAPI_URL}${path}`
-
const formats = computed(() => props.image?.formats || {})
const ratio = computed(() => {
if (!props.image) return 1
@@ -77,7 +75,7 @@ const aspect = computed(() => {
const styles = computed(() => ({ '--aspect': aspect.value + '%' }))
const srcset = computed(() =>
Object.values(formats.value)
- .map((f) => `${addURLBase(f.url)} ${f.width}w`)
+ .map((f) => `${f.url} ${f.width}w`)
.join(', '),
)
const sizes = computed(