Skip to content

Navigation Menu

Sign in

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Appearance settings

Commit 2cbb323

Browse filesBrowse files
sfxcodesfxcode
committed
feat(unocss): ues wind4 preset
1 parent 27f1243 commit 2cbb323
Copy full SHA for 2cbb323

26 files changed

+2027
-1918
lines changed

‎app/App.scss

Copy file name to clipboard
+3-6
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,3 @@
1-
@use "assets/sass/sidebar";
2-
@use "assets/sass/form";
3-
@use "assets/sass/main";
4-
5-
6-
1+
@use 'assets/sass/sidebar';
2+
@use 'assets/sass/form';
3+
@use 'assets/sass/main';

‎app/assets/sass/form.scss

Copy file name to clipboardExpand all lines: app/assets/sass/form.scss
+2-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
.p-formkit-data-view {
22
.formkit-form {
33
.formkit-outer {
4-
padding-bottom: 0.8rem;
4+
padding-bottom: 0.8rem;
55
}
66

77
&.form-horizontal {
@@ -12,4 +12,4 @@
1212
margin: 0;
1313
}
1414
}
15-
}
15+
}

‎app/assets/sass/main.scss

Copy file name to clipboardExpand all lines: app/assets/sass/main.scss
+44-4
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,45 @@ html {
88
font-size: 16px;
99
}
1010

11+
body {
12+
margin: 1rem;
13+
}
14+
15+
// Header
16+
h1,
17+
h2,
18+
h3,
19+
h4,
20+
h5,
21+
h6 {
22+
font-weight: 500;
23+
margin: 1.5rem 0 1rem 0;
24+
line-height: 1.2;
25+
&:first-child {
26+
margin-top: 0;
27+
}
28+
}
29+
h1 {
30+
font-size: 1.5rem;
31+
margin-bottom: 0;
32+
line-height: 1;
33+
}
34+
h2 {
35+
font-size: 1.25rem;
36+
}
37+
h3 {
38+
font-size: 1.25rem;
39+
}
40+
h4 {
41+
font-size: 1.125rem;
42+
}
43+
h5 {
44+
font-size: 1rem;
45+
}
46+
h6 {
47+
font-size: 0.875rem;
48+
}
49+
1150
#workspace {
1251
padding-left: 200px;
1352
a {
@@ -40,16 +79,17 @@ html {
4079
color: var(--p-text-color);
4180
margin-bottom: 1rem;
4281
border-radius: $borderRadius;
43-
box-shadow: 0 3px 5px rgba(0,0,0,.02), 0 0 2px rgba(0,0,0,.05), 0 1px 4px rgba(0,0,0,.08) !important;
82+
box-shadow:
83+
0 3px 5px rgba(0, 0, 0, 0.02),
84+
0 0 2px rgba(0, 0, 0, 0.05),
85+
0 1px 4px rgba(0, 0, 0, 0.08) !important;
4486

4587
h2 {
4688
color: var(--p-primary-color);
4789
}
48-
4990
}
5091

51-
52-
.p-tiptap {
92+
.p-tiptap {
5393
strong {
5494
color: var(--p-primary-color);
5595
}

‎app/assets/sass/sidebar.scss

Copy file name to clipboard
+14-46
Original file line numberDiff line numberDiff line change
@@ -1,51 +1,19 @@
1-
$primary-color: var(--p-primary-color) ;
2-
$base-bg: #2a2a2e ;
3-
4-
$item-color: #fff ;
5-
6-
$item-active-color: null ;
7-
$item-active-bg: null ;
8-
$item-active-line-color: $primary-color ;
9-
10-
$item-open-color: #fff ;
11-
$item-open-bg: $primary-color ;
12-
13-
$item-hover-color: null ;
14-
$item-hover-bg: rgba(darken($base-bg, 5%), 0.5) ;
15-
16-
$icon-color: null ;
17-
$icon-bg: darken($base-bg, 2%) ;
18-
19-
$icon-active-color: null ;
20-
$icon-active-bg: null ;
21-
22-
$icon-open-color: null ;
23-
$icon-open-bg: $item-open-bg ;
24-
25-
$mobile-item-color: #fff ;
26-
$mobile-item-bg: $primary-color ;
27-
$mobile-icon-color: $mobile-item-color ;
28-
$mobile-icon-bg: $mobile-item-bg ;
29-
30-
$dropdown-color: null ;
31-
$dropdown-bg: lighten($base-bg, 5%) ;
32-
33-
$header-item-color: rgba($item-color, 0.7) ;
34-
35-
$toggle-btn-color: $primary-color ;
36-
$toggle-btn-bg: darken($base-bg, 5%) ;
37-
38-
$item-font-size: 14px ;
39-
$item-line-height: 18px ;
40-
$item-padding: 8px 14px ;
41-
$icon-height: 32px ;
42-
$icon-width: 32px ;
43-
44-
@use "vue-sidebar-menu/src/scss/vue-sidebar-menu.scss";
1+
@use 'sass:color';
2+
@use 'vue-sidebar-menu/src/scss/vue-sidebar-menu.scss' with (
3+
$primary-color: var(--p-primary-color),
4+
$base-bg: #2a2a2e,
5+
$item-color: #fff,
6+
$item-active-color: var(--p-primary-color),
7+
$item-font-size: 14px,
8+
$item-line-height: 18px,
9+
$item-padding: 8px 14px,
10+
$icon-height: 32px,
11+
$icon-width: 32px,
12+
);
4513

4614
.v-sidebar-menu hr {
4715
margin-bottom: 8px;
48-
background-color: $item-hover-bg;
16+
background-color: rgba(color.adjust(#2a2a2e, $lightness: -5%), 0.5);
4917
border: 0 none;
5018
height: 0.1rem;
51-
}
19+
}

‎app/components/AdvertiseBox.vue

Copy file name to clipboardExpand all lines: app/components/AdvertiseBox.vue
+1-1
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ defineProps({
1717

1818
<template>
1919
<div class="mb-4 px-5">
20-
<span class="p-3 shadow-2 mb-1 inline-block" style="border-radius: 10px">
20+
<span class="shadow-2 mb-1 inline-block p-3" style="border-radius: 10px">
2121
<span :class="`text-2xl text-${color} i-${icon}`" />
2222
</span>
2323
<div :class="`mb-3 text-2xl text-${color}`">

‎app/components/BaseButton.vue

Copy file name to clipboardExpand all lines: app/components/BaseButton.vue
+16-16
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ defineProps({
2020
<template>
2121
<button
2222
:disabled="disabled"
23-
class="btn text-red-500"
23+
class="text-red-500 btn"
2424
:class="{
2525
[`btn-color-${color}`]: color,
2626
[`btn-size-${size}`]: size,
@@ -32,44 +32,44 @@ defineProps({
3232

3333
<style lang="pcss" scoped>
3434
.btn {
35-
border-radius: 4px;
36-
padding: 4px 8px;
37-
background: #e4e4e4;
38-
cursor: pointer;
35+
border-radius: 4px;
36+
padding: 4px 8px;
37+
background: #e4e4e4;
38+
cursor: pointer;
3939
}
4040
4141
.btn:hover {
42-
background: #f1f1f1;
42+
background: #f1f1f1;
4343
}
4444
4545
.btn[disabled] {
46-
opacity: 0.5;
47-
pointer-events: none;
46+
opacity: 0.5;
47+
pointer-events: none;
4848
}
4949
5050
.btn-color-green {
51-
background: #94ffc9;
51+
background: #94ffc9;
5252
}
5353
5454
.btn-color-green:hover {
55-
background: #acffd6;
55+
background: #acffd6;
5656
}
5757
5858
.btn-color-red {
59-
background: #ff9494;
59+
background: #ff9494;
6060
}
6161
6262
.btn-color-red:hover {
63-
background: #ffa8a8;
63+
background: #ffa8a8;
6464
}
6565
6666
.btn-size-big {
67-
font-size: 16px;
68-
padding: 8px 16px;
67+
font-size: 16px;
68+
padding: 8px 16px;
6969
}
7070
7171
.btn-size-small {
72-
font-size: 12px;
73-
padding: 2px 4px;
72+
font-size: 12px;
73+
padding: 2px 4px;
7474
}
7575
</style>

‎app/components/PageView.vue

Copy file name to clipboardExpand all lines: app/components/PageView.vue
+2-2
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,8 @@ const pageview = data.value?.pageview
55
</script>
66

77
<template>
8-
<div class="text-gray:80 text-2xl">
9-
<span font-500 text-gray>{{ pageview }}</span>
8+
<div class="text-2xl text-gray:80">
9+
<span text-gray font-500>{{ pageview }}</span>
1010
page views since
1111
<span text-gray>{{ time }}</span>
1212
</div>

‎app/components/ToDo.vue

Copy file name to clipboardExpand all lines: app/components/ToDo.vue
+1-1
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ defineProps({
1515
{{ text }}
1616
</div>
1717
</div>
18-
<div class="pt-4 pl-1">
18+
<div class="pl-1 pt-4">
1919
<slot />
2020
</div>
2121
</div>

‎app/components/app/AppColorMode.vue

Copy file name to clipboardExpand all lines: app/components/app/AppColorMode.vue
+2-2
Original file line numberDiff line numberDiff line change
@@ -32,9 +32,9 @@ watchEffect(() => mode.value = state.value)
3232

3333
<style>
3434
html.cafe {
35-
filter: sepia(0.9) hue-rotate(315deg) brightness(0.9);
35+
filter: sepia(0.9) hue-rotate(315deg) brightness(0.9);
3636
}
3737
html.contrast {
38-
filter: contrast(2);
38+
filter: contrast(2);
3939
}
4040
</style>

‎app/components/app/AppFooter.vue

Copy file name to clipboardExpand all lines: app/components/app/AppFooter.vue
+2-2
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,8 @@ const config = useRuntimeConfig()
33
</script>
44

55
<template>
6-
<div class="mt-4 layout-footer">
7-
<span class="font-medium ml-2">{{ config.public.APP_NAME }} - {{ config.public.APP_VERSION }}</span>
6+
<div class="layout-footer mt-4">
7+
<span class="ml-2 font-medium">{{ config.public.APP_NAME }} - {{ config.public.APP_VERSION }}</span>
88
</div>
99
</template>
1010

‎app/components/content/HeroCard.vue

Copy file name to clipboardExpand all lines: app/components/content/HeroCard.vue
+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<template>
22
<section>
3-
<h1 class="text-4xl ">
3+
<h1 class="text-4xl">
44
<slot />
55
</h1>
66
<span class="text-gray-300">

‎app/components/tiptap/TipTap.vue

Copy file name to clipboardExpand all lines: app/components/tiptap/TipTap.vue
+4-4
Original file line numberDiff line numberDiff line change
@@ -208,7 +208,7 @@ onBeforeUnmount(() => {
208208
/>
209209
</template>
210210
</Toolbar>
211-
<EditorContent :editor="editor" class="p-tiptap p-inputtext" />
211+
<EditorContent :editor="editor" class="p-inputtext p-tiptap" />
212212
</div>
213213
</template>
214214
@@ -234,8 +234,8 @@ onBeforeUnmount(() => {
234234
}
235235
236236
.p-tiptap :focus {
237-
outline-offset:2px;
238-
outline:2px solid transparent;
237+
outline-offset: 2px;
238+
outline: 2px solid transparent;
239239
}
240240
#bold {
241241
font-weight: 900;
@@ -246,6 +246,6 @@ onBeforeUnmount(() => {
246246
}
247247
248248
#strike {
249-
text-decoration:line-through;
249+
text-decoration: line-through;
250250
}
251251
</style>

‎app/pages/404.vue

Copy file name to clipboardExpand all lines: app/pages/404.vue
+2-2
Original file line numberDiff line numberDiff line change
@@ -7,15 +7,15 @@ const router = useRouter()
77
<div class="col-12 mt-10 text-center">
88
<img src="/nuxt-logo.svg" alt="Nuxt logo" class="mb-5" style="width:81px; height:60px;">
99
</div>
10-
<main class="px-4 py-10 text-center text-teal-700 text-8xl">
10+
<main class="px-4 py-10 text-center text-8xl text-teal-700">
1111
<div>
1212
<p class="text-8xl text-red-600">
1313
<span class="i-codicon-error inline-block" />
1414
</p>
1515
</div>
1616
</main>
1717
<div style="alignment: center">
18-
<h1 class="font-bold text-5xl text-2xl text-center">
18+
<h1 class="text-center text-2xl text-5xl font-bold">
1919
Page not found ...
2020
</h1>
2121
<div class="col-12 mt-5 text-center">

‎app/pages/data/server.vue

Copy file name to clipboardExpand all lines: app/pages/data/server.vue
+1-1
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ const count = useCounter()
1010
<PageView />
1111
<h2>Counter (useState)</h2>
1212

13-
<div class="grid grid-cols-3 w-80 mt-8">
13+
<div class="grid grid-cols-3 mt-8 w-80">
1414
<Button icon="pi pi-plus" class="p-button-rounded p-button-info" @click="count.inc()" />
1515
<span class="text-4xl">{{ count.count }}</span>
1616
<Button icon="pi pi-minus" class="p-button-rounded p-button-success" @click="count.dec()" />

‎app/pages/data/stores.vue

Copy file name to clipboardExpand all lines: app/pages/data/stores.vue
+6-6
Original file line numberDiff line numberDiff line change
@@ -11,26 +11,26 @@ onMounted(async () => {
1111
<template>
1212
<div class="card">
1313
<h2>Store Settings</h2>
14-
<h5 class="font-bold text-2xl mb-4">
14+
<h5>
1515
Primevue Theme Store
1616
</h5>
17-
<div class="grid grid-cols-2 gap-4">
17+
<div class="gap-4 grid grid-cols-2">
1818
<div>Theme Name</div>
1919
<div>{{ themeStore.themeName }}</div>
2020
<div>Theme Color</div>
2121
<div>{{ themeStore.themeColor }}</div>
2222
</div>
2323

24-
<h5 class="font-bold text-2xl mb-4">
24+
<h5>
2525
Data Store (Option Store)
2626
</h5>
2727
<span class="text-xs">Example of a Data Store</span>
28-
<div class="grid grid-cols-2 mt-6 gap-4">
28+
<div class="mt-6 gap-4 grid grid-cols-2">
2929
<div>Products</div>
3030
<div>{{ dataStore.products.length }}</div>
3131
</div>
3232

33-
<h5 class="font-bold text-2xl mb-4">
33+
<h5>
3434
Counter Store (Setup Store)
3535
</h5>
3636
<span class="text-xs">Example of a Data Store</span>
@@ -50,6 +50,6 @@ onMounted(async () => {
5050

5151
<style lang='scss' scoped>
5252
h5 {
53-
color: var(--p-primary-color)
53+
color: var(--p-primary-color);
5454
}
5555
</style>

‎app/pages/form/index.vue

Copy file name to clipboardExpand all lines: app/pages/form/index.vue
+2-2
Original file line numberDiff line numberDiff line change
@@ -138,9 +138,9 @@ async function submitHandler() {
138138
<div class="basis-1/2 md:basis-1/3">
139139
<h2>Formkit-PrimeVue</h2>
140140
<div class="text-xl mt-12">
141-
<h4>GitHub</h4>
141+
<h3>GitHub</h3>
142142
<a href="https://github.com/sfxcode/formkit-primevue">formkit-primevue</a>
143-
<h4>More examples</h4>
143+
<h3>More examples</h3>
144144
<a href="https://formkit-primevue.netlify.app/">Formkit PrimeVue Demo</a>
145145
</div>
146146
</div>

0 commit comments

Comments
0 (0)
Morty Proxy This is a proxified and sanitized view of the page, visit original site.