From 6fa4bba623713c396432ba8b863846883d6a1906 Mon Sep 17 00:00:00 2001 From: wayne <wayne8692wayne8692@gmail.com> Date: 星期三, 26 一月 2022 10:52:23 +0800 Subject: [PATCH] Merge branch 'pollex-dev' into sit --- PAMapp/components/Ui/UiField.vue | 20 +++++++++++++------- 1 files changed, 13 insertions(+), 7 deletions(-) diff --git a/PAMapp/components/Ui/UiField.vue b/PAMapp/components/Ui/UiField.vue index b7d1192..dfa1512 100644 --- a/PAMapp/components/Ui/UiField.vue +++ b/PAMapp/components/Ui/UiField.vue @@ -3,7 +3,7 @@ v-if="fieldDisplayDevice === 'ALL' || fieldDisplayDevice === currentDevice"> <div class="pam-field__label"> - <div class="pam-field__title"><i :class="fieldIcon"></i>{{ fieldLabel }}</div> + <div class="pam-field__title" :style="{ 'font-size': fieldLabelSize }"><i :class="fieldIcon"></i>{{ fieldLabel }}</div> </div> <p class="pam-field__content"> <slot></slot> @@ -32,6 +32,9 @@ content!: string; @Prop() + labelSize?: number; + + @Prop() displayDevice!: 'MOBILE' | 'DESKTOP' | 'ALL'; currentDevice: 'MOBILE' | 'DESKTOP' = 'MOBILE'; @@ -58,28 +61,31 @@ return this.displayDevice || 'ALL'; } + get fieldLabelSize(): string { + return (this.labelSize || 16) + 'px'; + } + } </script> - <style lang="scss" scoped> .pam-field { - display: flex; + display : flex; flex-direction: column; .pam-field__label { - display: flex; align-items: center; + display : flex; .pam-icon { font-size: 12px; } .pam-field__title { - font-size: 16px; - font-weight: bold; - display: flex; align-items: center; + display : flex; + font-weight: bold; } } .pam-field__content { + display : flex; padding-top: 10px; } } -- Gitblit v1.8.0