TheCloud/PronounsPage
1
0
Fork 0
mirror of https://gitlab.com/PronounsPage/PronounsPage.git synced 2025-08-04 03:27:05 -04:00
Code Issues Packages Projects Releases Wiki Activity

(style)(nouns) prevent overflowing in dictionary (especially present on mobile)

Browse Source
This commit is contained in:
Valentyne Stigloher 2025-07-21 15:23:11 +02:00
parent b19ec1b2ac
commit 4bb743342b
2 changed files with 6 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
assets/nouns.scss
View File

@ -2,7 +2,7 @@
.nouns-table { .nouns-table {
.row-header { .row-header {
grid-template-columns: 1fr 1fr 1fr 3em; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) 3em;
} }
.row-content { .row-content {
@ -13,21 +13,21 @@
"nbLabel nb nbPl" "nbLabel nb nbPl"
"sources sources sources" "sources sources sources"
"buttons buttons buttons" "buttons buttons buttons"
/ auto 1fr 1fr; / auto minmax(0, 1fr) minmax(0, 1fr);
@include media-breakpoint-up('md', $grid-breakpoints) { @include media-breakpoint-up('md', $grid-breakpoints) {
grid: grid:
"masc fem neutr buttons" "masc fem neutr buttons"
"mascPl femPl neutrPl buttons" "mascPl femPl neutrPl buttons"
"sources sources sources buttons" "sources sources sources buttons"
/ 1fr 1fr 1fr 3em; / minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) 3em;
} }
} }
} }
.nouns-table-nonbinary { .nouns-table-nonbinary {
.row-header { .row-header {
grid-template-columns: 1fr 1fr 1fr 1fr 3em; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) 3em;
} }
.row-content { .row-content {
@ -36,7 +36,7 @@
"masc fem neutr nb buttons" "masc fem neutr nb buttons"
"mascPl femPl neutrPl nbPl buttons" "mascPl femPl neutrPl nbPl buttons"
"sources sources sources sources buttons" "sources sources sources sources buttons"
/ 1fr 1fr 1fr 1fr 3em; / minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) 3em;
} }
} }
} }

2
components/nouns/NounsItem.vue
View File

@ -41,7 +41,7 @@ const visibleWords = computed(() => {
</script> </script>
<template> <template>
<ul :class="[`list-${numerus}`, 'mb-0 ps-0']"> <ul class="mb-0 ps-0 overflow-auto h-100" :class="`list-${numerus}`">
<li v-for="(word, i) of visibleWords" :key="i"> <li v-for="(word, i) of visibleWords" :key="i">
<NounsWordDisplay :word :numerus /> <NounsWordDisplay :word :numerus />
</li> </li>