versia-pub/frontend
2
0
Fork 0
mirror of https://github.com/versia-pub/frontend.git synced 2026-03-13 03:29:16 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: ✨ Create new user profile view, refine components, add dropdown to notes

Browse source
This commit is contained in:
Jesse Wierzbinski 2024-04-24 20:56:01 -10:00
parent a0d0737683
commit a17df9fff8
No known key found for this signature in database
21 changed files with 470 additions and 133 deletions
Download patch file Download diff file Expand all files Collapse all files

39
components/skeleton/Skeleton.vue
View file

@ -12,29 +12,38 @@
</template>
<script lang="ts" setup>
const props = withDefaults(defineProps<{
enabled: boolean;
shape?: "circle" | "rect";
type?: "text" | "content";
minWidth?: number;
maxWidth?: number;
widthUnit?: "px" | "%";
class?: string;
}>(), {
shape: "rect",
type: "text",
widthUnit: "px",
});
const props = withDefaults(
defineProps<{
enabled: boolean;
shape?: "circle" | "rect";
type?: "text" | "content";
minWidth?: number;
maxWidth?: number;
widthUnit?: "px" | "%";
class?: string;
}>(),
{
shape: "rect",
type: "text",
widthUnit: "px",
},
);
const isContent = computed(() => props.type === "content");
const isText = computed(() => props.type === "text");
const isWidthSpecified = computed(() => props.minWidth && props.maxWidth);
const calculatedWidth = computed(() => Math.random() * ((props.maxWidth ?? 0) - (props.minWidth ?? 0)) + (props.minWidth ?? 0));
const calculatedWidth = computed(
() =>
Math.random() * ((props.maxWidth ?? 0) - (props.minWidth ?? 0)) +
(props.minWidth ?? 0),
);
const getWidth = (index: number, lines: number) => {
if (isWidthSpecified.value) {
if (isContent.value)
return index === lines ? `${calculatedWidth.value}${props.widthUnit}` : '100%';
return index === lines
? `${calculatedWidth.value}${props.widthUnit}`
: "100%";
return `${calculatedWidth.value}${props.widthUnit}`;
}
return undefined;