Skip to content

Commit f6d38e1

Browse files
zzhenryquezzzzhenryquezz
committed
feat: new color palette
1 parent 123b8dd commit f6d38e1

File tree

12 files changed

+64
-53
lines changed

12 files changed

+64
-53
lines changed

‎packages/app/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
{
2-
"name": "@index-san/app",
2+
"name": "app",
33
"version": "1.0.0",
44
"private": true,
55
"scripts": {

‎packages/app/src/App.vue

Lines changed: 2 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,34 +1,12 @@
11
<script setup lang="ts">
22
// import NNotify from '@modules/notify/components/NNotify.vue'
33
// import DDialog from '@modules/dialog/components/DDialog.vue'
4-
import { useRoute } from 'vue-router';
54
import LayoutDefault from './layouts/LayoutDefault.vue'
6-
import LayoutEmpty from './layouts/LayoutEmpty.vue'
7-
8-
const route = useRoute()
9-
10-
const options: any = {
11-
default: LayoutDefault,
12-
empty: LayoutEmpty,
13-
}
14-
15-
function findLayout(key: string){
16-
const option = options[key as keyof typeof options]
17-
18-
if (!option) {
19-
return options.default
20-
}
21-
22-
return option
23-
24-
}
25-
26-
275
</script>
286
<template>
297
<is-app>
30-
<component :is="findLayout($route.meta.layout as string)">
8+
<layout-default>
319
<router-view />
32-
</component>
10+
</layout-default>
3311
</is-app>
3412
</template>

‎packages/app/src/components/IsApp.vue

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,6 @@
1-
<script setup lang="ts">
2-
const theme = useTheme()
3-
4-
</script>
51
<template>
6-
<div :class="[theme.dark ? 'dark' : '']">
7-
<div class="dark:bg-zinc-800 dark:text-zinc-100 font-roboto h-screen w-screen flex">
2+
<div>
3+
<div class="bg-body-900 text-body-50 font-roboto h-screen w-screen flex">
84
<slot />
95

106
</div>

‎packages/app/src/components/IsAppDrawerMini.vue

Lines changed: 1 addition & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,5 @@
1-
<script setup lang="ts">
2-
const drawer = ref()
3-
</script>
41
<template>
5-
<div class="w-14 h-full bg-zinc-900 border-r border-zinc-700 shadow">
2+
<div class="w-14 h-full bg-body-900 border-r border-body-500 shadow">
63
<div class="flex flex-col h-full">
74
<is-list-item justify="center" >
85
<is-logo class="w-5 h-5" />

‎packages/app/src/components/IsBlockEditorBlock.vue

Lines changed: 2 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -61,7 +61,7 @@ watch(focused, (value) => {
6161
6262
const icon = defineProp<string>('icon', {
6363
type: String,
64-
default: 'grip-vertical',
64+
default: 'fa-solid:grip-vertical',
6565
})
6666
</script>
6767
<template>
@@ -77,13 +77,7 @@ const icon = defineProp<string>('icon', {
7777

7878
<div class="w-[40px] flex justify-center self-start">
7979
<slot name="dragger">
80-
<IsBtn
81-
mode="text"
82-
size="none"
83-
color="b-primary"
84-
class="h-12 text-sm opacity-0 group-hover:opacity-100"
85-
:class="isSelectedInEditor ? 'opacity-100' : ''"
86-
>
80+
<IsBtn variant="text" size="none" class="h-12 px-2 group-hover:opacity-100" :class="isSelectedInEditor ? 'opacity-100' : 'opacity-0'">
8781
<IsIcon data-test-id="icon" :name="icon" />
8882
</IsBtn>
8983
</slot>

‎packages/app/src/components/IsListItem.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@ const color = defineProp<'zinc' | 'accent'>('color', {
4747
function setTextColor(){
4848
const options = {
4949
accent: 'text-teal-500 hover-and-clickable:bg-teal-500 hover-and-clickable:text-teal-500 [&.router-link-active]:bg-teal-500/5',
50-
zinc: 'text-zinc-500 hover-and-clickable:bg-zinc-300/5 hover-and-clickable:text-zinc-300 [&.router-link-active]:bg-zinc-300/5',
50+
zinc: 'text-body-50 hover-and-clickable:bg-body-300/5 hover-and-clickable:text-body-0 [&.router-link-active]:bg-zinc-300/5',
5151
}
5252
5353
const option = options[color.value]

‎packages/app/src/components/IsTooltip.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -61,7 +61,7 @@ function hide() {
6161
>
6262

6363
<div
64-
class="dark:bg-zinc-200 dark:text-zinc-900 text-xs py-1 px-2 rounded relative"
64+
class="bg-body-500 text-body-0 text-xs py-1 px-2 rounded relative"
6565
v-visible="model"
6666
>
6767
<slot />
@@ -76,7 +76,7 @@ function hide() {
7676
]"
7777
>
7878
<div
79-
class="w-2 h-2 bg-zinc-200 rotate-45"
79+
class="w-2 h-2 bg-body-500 rotate-45"
8080
:class="[
8181
placement === 'top' && 'translate-y-1/2',
8282
placement === 'bottom' && '-translate-y-1/2',

‎packages/app/src/layouts/LayoutDefault.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<div class="h-screen w-screen flex">
33
<is-app-drawer-mini />
44

5-
<div class="w-72 bg-zinc-900 border-r border-zinc-700" />
5+
<div class="w-72 bg-body-700 border-r border-body-500" />
66

77
<slot />
88
</div>

‎packages/app/src/layouts/LayoutEmpty.vue

Lines changed: 0 additions & 3 deletions
This file was deleted.

‎packages/app/src/monaco/themes/main.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -198,7 +198,7 @@ export default defineMonacoTheme({
198198
],
199199
colors: {
200200
'editor.foreground': '#f8f8f2',
201-
'editor.background': '#09090B',
201+
'editor.background': '#1E1B0D',
202202
'editor.selectionBackground': '#44475a',
203203
'editor.lineHighlightBackground': '#44475a',
204204
'editorCursor.foreground': '#f8f8f0',

‎packages/app/src/pages/FileExplorer/FileExplorer.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -76,7 +76,7 @@ function findIcon(entry: DriveEntry){
7676
7777
function findIconColor(entry: DriveEntry){
7878
if (entry.type === 'directory') {
79-
return 'text-blue-500'
79+
return 'text-primary-500'
8080
}
8181
8282
if (entry.path.endsWith('.ts')) {
@@ -90,7 +90,7 @@ function findIconColor(entry: DriveEntry){
9090
<template>
9191
<div class="w-full">
9292

93-
<div class="w-full bg-zinc-700">
93+
<div class="w-full bg-body-500">
9494
<input v-model="search" class="bg-transparent w-full h-12 px-4 outline-none" placeholder="Search..." />
9595
</div>
9696

‎packages/app/tailwind.config.js

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,55 @@ module.exports = {
1313
lato: ['Lato', 'sans-serif'],
1414
railway: ['Railway', 'sans-serif'],
1515
},
16+
extend: {
17+
colors: {
18+
primary:{
19+
50: 'rgba(255, 251, 234, <alpha-value>)',
20+
100: 'rgba(254, 242, 191, <alpha-value>)',
21+
200: 'rgba(254, 236, 160, <alpha-value>)',
22+
300: 'rgba(254, 228, 116, <alpha-value>)',
23+
400: 'rgba(253, 222, 89, <alpha-value>)',
24+
500: 'rgba(253, 214, 48, <alpha-value>)',
25+
600: 'rgba(230, 195, 44, <alpha-value>)',
26+
800: 'rgba(139, 118, 26, <alpha-value>)',
27+
900: 'rgba(106, 90, 20, <alpha-value>)',
28+
700: 'rgba(180, 152, 34, <alpha-value>)',
29+
},
30+
secondary:{
31+
50: 'rgba(245, 234, 255, <alpha-value>)',
32+
100: 'rgba(225, 191, 254, <alpha-value>)',
33+
200: 'rgba(210, 160, 254, <alpha-value>)',
34+
300: 'rgba(190, 116, 253, <alpha-value>)',
35+
400: 'rgba(177, 89, 253, <alpha-value>)',
36+
500: 'rgba(158, 48, 252, <alpha-value>)',
37+
600: 'rgba(144, 44, 229, <alpha-value>)',
38+
700: 'rgba(112, 34, 179, <alpha-value>)',
39+
800: 'rgba(87, 26, 139, <alpha-value>)',
40+
900: 'rgba(66, 20, 106, <alpha-value>)',
41+
},
42+
body:{
43+
0: 'rgba(255, 255, 255, <alpha-value>)',
44+
10: 'rgba(250, 250, 250, <alpha-value>)',
45+
20: 'rgba(246, 245, 245, <alpha-value>)',
46+
30: 'rgba(236, 236, 235, <alpha-value>)',
47+
40: 'rgba(224, 224, 222, <alpha-value>)',
48+
50: 'rgba(196, 195, 191, <alpha-value>)',
49+
60: 'rgba(182, 181, 176, <alpha-value>)',
50+
70: 'rgba(170, 169, 163, <alpha-value>)',
51+
80: 'rgba(155, 154, 148, <alpha-value>)',
52+
90: 'rgba(141, 140, 133, <alpha-value>)',
53+
100: 'rgba(127, 125, 117, <alpha-value>)',
54+
200: 'rgba(113, 111, 102, <alpha-value>)',
55+
300: 'rgba(99, 97, 87, <alpha-value>)',
56+
400: 'rgba(87, 85, 74, <alpha-value>)',
57+
500: 'rgba(73, 70, 59, <alpha-value>)',
58+
600: 'rgba(61, 58, 46, <alpha-value>)',
59+
700: 'rgba(44, 41, 28, <alpha-value>)',
60+
800: 'rgba(30, 27, 13, <alpha-value>)',
61+
900: 'rgba(18, 15, 0, <alpha-value>)',
62+
}
63+
}
64+
}
1665
},
1766
plugins: [
1867
plugin(function ({ addVariant }) {

0 commit comments

Comments
 (0)