jschaufuss/DiceCloud
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fixed docs siblings display on small screens

Browse Source
This commit is contained in:
ThaumRystra
2023-11-12 15:05:46 +02:00
parent d50ad58526
commit aaec54f36a
1 changed files with 45 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

65
app/imports/client/ui/docs/DocViewer.vue
View File

@@ -1,27 +1,32 @@
<template> <template>
<v-row justify="center"> <v-row
justify="center"
class="doc-viewer"
>
<v-col <v-col
cols="12" cols="12"
lg="8" lg="8"
class="pt-0"
> >
<v-card <div class="sibling-list-parent">
style="float: right; z-index: 4;" <v-card
class="ma-4" class="sibling-list"
> >
<v-fade-transition mode="out-in"> <v-fade-transition mode="out-in">
<v-list <v-list
v-if="siblingDocs.length > 1" v-if="siblingDocs.length > 1"
:dense="siblingDocs.length > 5" :dense="siblingDocs.length > 5"
> >
<doc-list-item <doc-list-item
v-for="sibling in siblingDocs" v-for="sibling in siblingDocs"
:key="sibling._id" :key="sibling._id"
:doc="sibling" :doc="sibling"
:icon="siblingHasIcon" :icon="siblingHasIcon"
/> />
</v-list> </v-list>
</v-fade-transition> </v-fade-transition>
</v-card> </v-card>
</div>
<v-fade-transition mode="out-in"> <v-fade-transition mode="out-in">
<div <div
:key="doc && doc.name || 'Documentation Home'" :key="doc && doc.name || 'Documentation Home'"
@@ -133,4 +138,24 @@ export default {
}, },
} }
} }
</script> </script>
<style lang="css" scoped>
@media (min-width: 500px) {
.sibling-list-parent {
float: right;
z-index: 4;
}
.sibling-list {
display: block !important;
}
}
.sibling-list-parent {
text-align: right;
margin: 0 16px 8px;
}
.sibling-list {
text-align: left;
display: inline-block;
}
</style>