improve e-avatar

wd-4000 · Sep 14, 2023 · 811ba65 · 811ba65
1 parent 571af79
commit 811ba65
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 20 deletions.
diff --git a/src/module.ts b/src/module.ts
@@ -23,7 +23,7 @@ export interface ModuleOptions {
   };
   borderRadius: string;
   corePaddingX: string;
-  font: string;
+  font: {family: string, weight?: number};
 }
 
 const defaults: ModuleOptions = {
@@ -42,7 +42,7 @@ const defaults: ModuleOptions = {
   },
   borderRadius: "8px",
   corePaddingX: "1rem",
-  font: "Roboto, sans-serif",
+  font: {family: "Roboto, sans-serif", weight: 400},
 };
 
 export default defineNuxtModule<ModuleOptions>({
@@ -77,7 +77,9 @@ export default defineNuxtModule<ModuleOptions>({
       SCSSvariables += `$e-${key}-screen-breakpoint: ${value}; `;
     }
 
-    CSSvariables += `--e-font-family: ${options.font}; `;
+    CSSvariables += `--e-font-family: ${options.font.family}; `;
+    CSSvariables += `--e-font-weight: ${options.font.weight}; `;
+
     CSSvariables += `--e-rounded-border-radius: ${options.borderRadius}; `;
     CSSvariables += `--e-core-padding-x: ${options.corePaddingX}; `;
 

diff --git a/src/runtime/components/e/avatar.vue b/src/runtime/components/e/avatar.vue
@@ -1,31 +1,20 @@
 <template>
   <div class="flex-center a-container">
     <slot />
-    <e-image-lazy-view
-      v-if="src"
-      class="avatar"
-      :width="size"
-      :height="size"
-      :contain="true"
-      :immediate-render="true"
-      :src="src"
-      border-radius="100%"
-    />
+    <e-image-lazy-view v-if="src" class="avatar" :width="props.size" :height="props.size" :contain="true"
+      :immediate-render="true" :src="src" border-radius="100%" />
     <div v-else>
-      <e-icon
-        :size="size"
-        :icon="mdiAccountCircle"
-      />
+      <e-icon :size="props.size" :icon="mdiAccountCircle" />
     </div>
   </div>
 </template>
 <script setup lang="ts">
 import { mdiAccountCircle } from "@mdi/js";
-const size = 120;
 
-defineProps<{
+const props = withDefaults(defineProps<{
   src?: string;
-}>();
+  size?: number;
+}>(), { size: 120 });
 </script>
 <style lang="scss" scoped>
 .avatar {

diff --git a/src/runtime/css/util.scss b/src/runtime/css/util.scss
@@ -133,6 +133,8 @@ body {
   background-color: var(--e-color-light);
   color: var(--e-color-dark);
   font-family: var(--e-font-family);
+  font-weight: var(--e-font-weight);
+
 }
 
 .fullheight {