diff options
| author | Maksim Sukharev <antreesy.web@gmail.com> | 2023-06-06 21:24:15 +0200 |
|---|---|---|
| committer | backportbot-nextcloud[bot] <backportbot-nextcloud[bot]@users.noreply.github.com> | 2023-06-06 21:06:53 +0000 |
| commit | 7c235a1f0490e3d2a68394899c016c464bbc3d25 (patch) | |
| tree | b935ea09e01fd7bb3aa581408c553c5173aab5aa /src | |
| parent | 0571a84a9ffed6027de63c160ebdfb3788674dbf (diff) | |
adjust styles for flex containers
Signed-off-by: Maksim Sukharev <antreesy.web@gmail.com>
Diffstat (limited to 'src')
| -rw-r--r-- | src/components/ConversationSettings/ConversationAvatarEditor.vue | 18 |
1 files changed, 10 insertions, 8 deletions
diff --git a/src/components/ConversationSettings/ConversationAvatarEditor.vue b/src/components/ConversationSettings/ConversationAvatarEditor.vue index dbeea9666..652da41b9 100644 --- a/src/components/ConversationSettings/ConversationAvatarEditor.vue +++ b/src/components/ConversationSettings/ConversationAvatarEditor.vue @@ -23,7 +23,7 @@ <template> <section id="vue-avatar-section"> - <div class="avatar__container avatar__container--horizontal"> + <div class="avatar__container"> <div v-if="!showCropper" class="avatar__preview"> <div v-if="emojiAvatar" class="avatar__preview-emoji" @@ -40,7 +40,7 @@ ref="cropper" class="avatar__cropper" v-bind="cropperOptions" /> - <div v-if="editable" class="avatar__container"> + <div v-if="editable" class="avatar__controls"> <div class="avatar__buttons"> <!-- Set emoji as avatar --> <template v-if="!showCropper"> @@ -368,16 +368,18 @@ section { .avatar { &__container { - margin: 0 auto; + display: flex; + flex-flow: row wrap; + justify-content: center; + align-items: flex-start; + gap: 16px; + } + + &__controls { display: flex; flex-direction: column; align-items: center; gap: 16px; - - &--horizontal { - flex-direction: row; - align-items: flex-start; - } } &__warning { |