@energie360/ui-library 0.1.12 → 0.1.13
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/components/index.js
CHANGED
|
@@ -48,3 +48,4 @@ export { default as UContextMenuLink } from './context-menu-link/u-context-menu-
|
|
|
48
48
|
export { default as UContextMenuDivider } from './context-menu-divider/u-context-menu-divider.vue'
|
|
49
49
|
export { default as UCircularProgress } from './circular-progress/u-circular-progress.vue'
|
|
50
50
|
export { default as UProgressAvatar } from './progress-avatar/u-progress-avatar.vue'
|
|
51
|
+
export { default as UWelcome } from './welcome/u-welcome.vue'
|
|
@@ -7,17 +7,20 @@ interface LanguageSwitch {
|
|
|
7
7
|
}
|
|
8
8
|
|
|
9
9
|
interface Props {
|
|
10
|
-
links
|
|
10
|
+
links?: LanguageSwitch[]
|
|
11
11
|
}
|
|
12
12
|
|
|
13
|
-
defineProps<Props>()
|
|
13
|
+
const { links = [] } = defineProps<Props>()
|
|
14
14
|
</script>
|
|
15
15
|
|
|
16
16
|
<template>
|
|
17
17
|
<nav class="language-nav">
|
|
18
|
-
<
|
|
19
|
-
|
|
20
|
-
<
|
|
18
|
+
<slot v-if="links.length === 0" />
|
|
19
|
+
<template v-else>
|
|
20
|
+
<template v-for="(link, key) in links" :key>
|
|
21
|
+
<p v-if="link.isActive">{{ link.label }}</p>
|
|
22
|
+
<a v-else :href="link.href" :hreflang="link.hreflang">{{ link.label }}</a>
|
|
23
|
+
</template>
|
|
21
24
|
</template>
|
|
22
25
|
</nav>
|
|
23
26
|
</template>
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
<script setup lang="ts">
|
|
2
|
+
// import { Image } from '../../elements/types'
|
|
3
|
+
|
|
4
|
+
interface Props {
|
|
5
|
+
text?: string
|
|
6
|
+
// image: Image
|
|
7
|
+
}
|
|
8
|
+
defineProps<Props>()
|
|
9
|
+
</script>
|
|
10
|
+
|
|
11
|
+
<template>
|
|
12
|
+
<div class="welcome-container">
|
|
13
|
+
<div class="welcome-content">
|
|
14
|
+
<slot>
|
|
15
|
+
<h2 v-if="text">{{ text }}</h2>
|
|
16
|
+
</slot>
|
|
17
|
+
</div>
|
|
18
|
+
<!-- TODO: Add image whenever is ready -->
|
|
19
|
+
<!-- <div class="welcome-image">
|
|
20
|
+
<img src="path/to/image.jpg" alt="Welcome Image" />
|
|
21
|
+
</div> -->
|
|
22
|
+
</div>
|
|
23
|
+
</template>
|
|
24
|
+
|
|
25
|
+
<style scoped lang="scss" src="./welcome.scss"></style>
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
@use '../../base/abstracts/' as a;
|
|
2
|
+
|
|
3
|
+
.welcome-container {
|
|
4
|
+
@include a.type(500, strong);
|
|
5
|
+
background-color: var(--e-c-primary-01-100);
|
|
6
|
+
border-radius: var(--e-brd-radius-2);
|
|
7
|
+
color: var(--e-c-primary-01-950);
|
|
8
|
+
display: flex;
|
|
9
|
+
justify-content: space-between;
|
|
10
|
+
padding: var(--e-space-8) var(--e-space-6);
|
|
11
|
+
|
|
12
|
+
@include a.bp(m) {
|
|
13
|
+
padding: var(--e-space-3) var(--e-space-4);
|
|
14
|
+
}
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
// .welcome-content {
|
|
18
|
+
|
|
19
|
+
// }
|
|
20
|
+
|
|
21
|
+
// TODO: Add styles for the welcome image whenever is ready
|
|
22
|
+
// .welcome-image {
|
|
23
|
+
|
|
24
|
+
// }
|