mirror of
https://github.com/crater-invoice/crater.git
synced 2025-10-30 21:21:09 -04:00
Compare commits
3 Commits
dark-base-
...
test-uffiz
| Author | SHA1 | Date | |
|---|---|---|---|
| 5a8e30d748 | |||
| e0e9aff6d1 | |||
| abc66dd768 |
9
.github/workflows/uffizzi-build.yml
vendored
9
.github/workflows/uffizzi-build.yml
vendored
@ -14,8 +14,6 @@ jobs:
|
||||
steps:
|
||||
- name: Checkout git repo
|
||||
uses: actions/checkout@v3
|
||||
- name: Set up Docker Buildx
|
||||
uses: docker/setup-buildx-action@v2
|
||||
- name: Generate UUID image name
|
||||
id: uuid
|
||||
run: echo "UUID_TAG_APP=$(uuidgen)" >> $GITHUB_ENV
|
||||
@ -33,11 +31,10 @@ jobs:
|
||||
tags: ${{ steps.meta.outputs.tags }}
|
||||
labels: ${{ steps.meta.outputs.labels }}
|
||||
file: ./uffizzi/Dockerfile
|
||||
cache-from: type=gha
|
||||
cache-to: type=gha,mode=max
|
||||
|
||||
|
||||
build-nginx:
|
||||
needs:
|
||||
- build-application
|
||||
name: Build and Push `nginx`
|
||||
runs-on: ubuntu-latest
|
||||
if: ${{ github.event_name != 'pull_request' || github.event.action != 'closed' }}
|
||||
@ -65,6 +62,8 @@ jobs:
|
||||
tags: ${{ steps.meta.outputs.tags }}
|
||||
labels: ${{ steps.meta.outputs.labels }}
|
||||
file: ./uffizzi/nginx/Dockerfile
|
||||
build-args: |
|
||||
BASE_IMAGE=${{ needs.build-application.outputs.tags }}
|
||||
cache-from: type=gha
|
||||
cache-to: type=gha,mode=max
|
||||
|
||||
|
||||
@ -12,6 +12,8 @@
|
||||
class="h-screen h-screen-ios overflow-y-auto md:pl-56 xl:pl-64 min-h-0"
|
||||
>
|
||||
<div class="pt-16 pb-16">
|
||||
<h1>Testing</h1>
|
||||
|
||||
<router-view />
|
||||
</div>
|
||||
</main>
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
<template>
|
||||
<div class="h-screen overflow-y-auto text-base">
|
||||
<h1>Testing</h1>
|
||||
<NotificationRoot />
|
||||
|
||||
<div class="container mx-auto px-4">
|
||||
|
||||
@ -93,6 +93,9 @@
|
||||
>
|
||||
{{ pageHeading }}
|
||||
</h1>
|
||||
|
||||
<h1>Testing</h1>
|
||||
|
||||
<p
|
||||
class="
|
||||
hidden
|
||||
|
||||
@ -15,13 +15,6 @@
|
||||
bg-gradient-to-r
|
||||
from-primary-500
|
||||
to-primary-400
|
||||
dark:from-gray-700/70 dark:to-gray-800/70
|
||||
bg-primary-500
|
||||
dark:bg-transparent
|
||||
dark:backdrop-blur-xl
|
||||
dark:shadow-glass
|
||||
dark:border
|
||||
dark:border-white/10
|
||||
"
|
||||
>
|
||||
<router-link
|
||||
@ -60,7 +53,6 @@
|
||||
cursor-pointer
|
||||
md:hidden md:ml-0
|
||||
hover:bg-gray-100
|
||||
dark:bg-gray-800 dark:border-gray-500 dark:border
|
||||
"
|
||||
@click.prevent="onToggle"
|
||||
>
|
||||
|
||||
@ -15,9 +15,7 @@
|
||||
leave-from="opacity-100"
|
||||
leave-to="opacity-0"
|
||||
>
|
||||
<DialogOverlay
|
||||
class="fixed inset-0 bg-gray-600 bg-opacity-75 dark:bg-gray-900/90"
|
||||
/>
|
||||
<DialogOverlay class="fixed inset-0 bg-gray-600 bg-opacity-75" />
|
||||
</TransitionChild>
|
||||
|
||||
<TransitionChild
|
||||
@ -29,9 +27,7 @@
|
||||
leave-from="translate-x-0"
|
||||
leave-to="-translate-x-full"
|
||||
>
|
||||
<div
|
||||
class="relative flex flex-col flex-1 w-full max-w-xs bg-white dark:bg-gray-800"
|
||||
>
|
||||
<div class="relative flex flex-col flex-1 w-full max-w-xs bg-white">
|
||||
<TransitionChild
|
||||
as="template"
|
||||
enter="ease-in-out duration-300"
|
||||
@ -54,7 +50,8 @@
|
||||
focus:outline-none
|
||||
focus:ring-2
|
||||
focus:ring-inset
|
||||
focus:ring-white"
|
||||
focus:ring-white
|
||||
"
|
||||
@click="globalStore.setSidebarVisibility(false)"
|
||||
>
|
||||
<span class="sr-only">Close sidebar</span>
|
||||
@ -85,8 +82,8 @@
|
||||
:to="item.link"
|
||||
:class="[
|
||||
hasActiveUrl(item.link)
|
||||
? 'text-primary-500 border-primary-500 bg-gray-100 dark:shadow-glass dark:backdrop-blur-xl dark:hover:bg-gray-700 dark:bg-gray-700/50 dark:text-primary-400 dark:font-medium'
|
||||
: 'text-black dark:text-gray-300',
|
||||
? 'text-primary-500 border-primary-500 bg-gray-100 '
|
||||
: 'text-black',
|
||||
'cursor-pointer px-0 pl-4 py-3 border-transparent flex items-center border-l-4 border-solid text-sm not-italic font-medium',
|
||||
]"
|
||||
@click="globalStore.setSidebarVisibility(false)"
|
||||
@ -103,10 +100,6 @@
|
||||
/>
|
||||
{{ $t(item.title) }}
|
||||
</router-link>
|
||||
<LightDarkSwitch
|
||||
:show-label="false"
|
||||
class="absolute right-6 top-6 !w-auto"
|
||||
/>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
@ -123,13 +116,14 @@
|
||||
hidden
|
||||
w-56
|
||||
h-screen
|
||||
pb-32
|
||||
overflow-y-auto
|
||||
bg-white
|
||||
border-r border-gray-200 border-solid
|
||||
xl:w-64
|
||||
md:fixed md:flex md:flex-col md:inset-y-0
|
||||
pt-16
|
||||
dark:border-gray-800
|
||||
dark:bg-gray-800/80"
|
||||
"
|
||||
>
|
||||
<div
|
||||
v-for="menu in globalStore.menuGroups"
|
||||
@ -142,8 +136,8 @@
|
||||
:to="item.link"
|
||||
:class="[
|
||||
hasActiveUrl(item.link)
|
||||
? 'text-primary-500 border-primary-500 bg-gray-100 dark:border-primary-400 dark:shadow-glass dark:backdrop-blur-xl dark:hover:bg-gray-700 dark:bg-gray-700/50 dark:text-primary-400 dark:font-medium'
|
||||
: 'text-black dark:hover:bg-transparent dark:hover:text-white dark:text-gray-300',
|
||||
? 'text-primary-500 border-primary-500 bg-gray-100 '
|
||||
: 'text-black',
|
||||
'cursor-pointer px-0 pl-6 hover:bg-gray-50 py-3 group flex items-center border-l-4 border-solid border-transparent text-sm not-italic font-medium',
|
||||
]"
|
||||
>
|
||||
@ -151,8 +145,8 @@
|
||||
:name="item.icon"
|
||||
:class="[
|
||||
hasActiveUrl(item.link)
|
||||
? 'text-primary-500 group-hover:text-primary-500 dark:text-primary-400 dark:group-hover:text-primary-500 '
|
||||
: 'text-gray-400 group-hover:text-black dark:text-gray-400 dark:group-hover:text-white',
|
||||
? 'text-primary-500 group-hover:text-primary-500 '
|
||||
: 'text-gray-400 group-hover:text-black',
|
||||
'mr-4 shrink-0 h-5 w-5 ',
|
||||
]"
|
||||
/>
|
||||
@ -160,9 +154,6 @@
|
||||
{{ $t(item.title) }}
|
||||
</router-link>
|
||||
</div>
|
||||
<LightDarkSwitch
|
||||
class="absolute bottom-0 py-4 border-t border-gray-200 dark:border-gray-700"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@ -178,7 +169,6 @@ import {
|
||||
|
||||
import { useRoute } from 'vue-router'
|
||||
import { useGlobalStore } from '@/scripts/admin/stores/global'
|
||||
import LightDarkSwitch from '@/scripts/components/LightDarkSwitcher.vue'
|
||||
|
||||
const route = useRoute()
|
||||
const globalStore = useGlobalStore()
|
||||
|
||||
@ -34,7 +34,6 @@ export const useGlobalStore = (useWindow = false) => {
|
||||
isAppLoaded: false,
|
||||
isSidebarOpen: false,
|
||||
areCurrenciesLoading: false,
|
||||
isDarkModeOn: false,
|
||||
|
||||
downloadReport: null,
|
||||
}),
|
||||
|
||||
@ -1,101 +0,0 @@
|
||||
<!-- This example requires Tailwind CSS v2.0+ -->
|
||||
<script lang="ts" setup>
|
||||
import { Switch, SwitchGroup, SwitchLabel } from '@headlessui/vue'
|
||||
import { useGlobalStore } from '@/scripts/admin/stores/global'
|
||||
import { computed, ref } from 'vue'
|
||||
defineProps({
|
||||
showLabel: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
vertical: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
})
|
||||
|
||||
const globalStore = useGlobalStore()
|
||||
|
||||
const enabled = ref(
|
||||
localStorage.getItem('theme') === 'dark' ||
|
||||
document.documentElement.classList.contains('dark')
|
||||
)
|
||||
|
||||
globalStore.isDarkModeOn = enabled
|
||||
|
||||
function onChange(val) {
|
||||
if (val) {
|
||||
localStorage.theme = 'dark'
|
||||
document.documentElement.classList.add('dark')
|
||||
document.documentElement.style.setProperty('color-scheme', 'dark')
|
||||
globalStore.isDarkModeOn = true
|
||||
} else {
|
||||
localStorage.theme = 'light'
|
||||
document.documentElement.classList.remove('dark')
|
||||
document.documentElement.style.setProperty('color-scheme', 'light')
|
||||
globalStore.isDarkModeOn = false
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="w-full flex justify-center">
|
||||
<SwitchGroup
|
||||
as="div"
|
||||
class="flex items-center"
|
||||
:class="vertical ? 'flex-col justify-center' : 'flex-row'"
|
||||
>
|
||||
<Switch
|
||||
v-model="enabled"
|
||||
class="relative inline-flex flex-shrink-0 h-6 w-11 border-2 border-transparent rounded-full cursor-pointer transition-colors ease-in-out duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary-500 dark:ring-offset-gray-700"
|
||||
:class="[enabled ? 'bg-primary-600' : 'bg-gray-200']"
|
||||
@update:modelValue="onChange"
|
||||
>
|
||||
<span class="sr-only">Use setting</span>
|
||||
<span
|
||||
class="pointer-events-none relative inline-block h-5 w-5 rounded-full bg-white shadow transform ring-0 transition ease-in-out duration-200"
|
||||
:class="[enabled ? 'translate-x-5' : 'translate-x-0']"
|
||||
>
|
||||
<span
|
||||
class="absolute inset-0 h-full w-full flex items-center justify-center transition-opacity"
|
||||
:class="[
|
||||
enabled
|
||||
? 'opacity-0 ease-out duration-100'
|
||||
: 'opacity-100 ease-in duration-200',
|
||||
]"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<BaseIcon class="h-3 w-3 text-yellow-500" name="SunIcon" />
|
||||
</span>
|
||||
<span
|
||||
class="absolute inset-0 h-full w-full flex items-center justify-center transition-opacity"
|
||||
:class="[
|
||||
enabled
|
||||
? 'opacity-100 ease-in duration-200'
|
||||
: 'opacity-0 ease-out duration-100',
|
||||
]"
|
||||
aria-hidden="true"
|
||||
>
|
||||
<BaseIcon class="h-3 w-3 text-primary-500" name="MoonIcon" />
|
||||
</span>
|
||||
</span>
|
||||
</Switch>
|
||||
<SwitchLabel
|
||||
v-if="showLabel"
|
||||
as="span"
|
||||
class="cursor-pointer"
|
||||
:class="vertical ? 'px-1 text-center mt-2' : 'ml-3'"
|
||||
>
|
||||
<span
|
||||
v-if="enabled"
|
||||
class="text-sm font-medium text-gray-500 dark:text-gray-400"
|
||||
>
|
||||
Dark Mode
|
||||
</span>
|
||||
<span v-else class="text-sm font-medium text-gray-500">
|
||||
Light Mode
|
||||
</span>
|
||||
</SwitchLabel>
|
||||
</SwitchGroup>
|
||||
</div>
|
||||
</template>
|
||||
@ -437,22 +437,21 @@ export default {
|
||||
required: false,
|
||||
default: () => ({
|
||||
container:
|
||||
'p-0 relative mx-auto w-full flex items-center justify-end box-border cursor-pointer border border-gray-200 dark:border-gray-600 rounded-md bg-white dark:bg-gray-700 text-sm leading-snug outline-none max-h-10',
|
||||
'p-0 relative mx-auto w-full flex items-center justify-end box-border cursor-pointer border border-gray-200 rounded-md bg-white text-sm leading-snug outline-none max-h-10',
|
||||
containerDisabled:
|
||||
'bg-gray-200 bg-opacity-50 !text-gray-400 dark:!text-gray-800 !dark:text-gray-500 !cursor-default dark:opacity-25',
|
||||
'cursor-default bg-gray-200 bg-opacity-50 !text-gray-400',
|
||||
containerOpen: '',
|
||||
containerOpenTop: '',
|
||||
containerActive: 'ring-1 ring-primary-400 border-primary-400',
|
||||
containerInvalid:
|
||||
'border-red-500 ring-red-500 focus:ring-red-500 focus:border-red-500 dark:border-red-500 dark:ring-red-500 dark:focus:ring-red-500 dark:focus:border-red-500',
|
||||
containerInvalidActive:
|
||||
'ring-1 border-red-500 ring-red-500 dark:ring-1 dark:border-red-500 dark:ring-red-500',
|
||||
'border-red-400 ring-red-400 focus:ring-red-400 focus:border-red-400',
|
||||
containerInvalidActive: 'ring-1 border-red-400 ring-red-400',
|
||||
singleLabel:
|
||||
'flex items-center h-full absolute left-0 top-0 pointer-events-none bg-transparent leading-snug pl-3.5 dark:text-white',
|
||||
'flex items-center h-full absolute left-0 top-0 pointer-events-none bg-transparent leading-snug pl-3.5',
|
||||
multipleLabel:
|
||||
'flex items-center h-full absolute left-0 top-0 pointer-events-none bg-transparent leading-snug pl-3.5 dark:text-white',
|
||||
'flex items-center h-full absolute left-0 top-0 pointer-events-none bg-transparent leading-snug pl-3.5',
|
||||
search:
|
||||
'w-full absolute inset-0 outline-none appearance-none box-border border-0 text-sm font-sans bg-white rounded-md pl-3.5 border-transparent focus:border-transparent focus:ring-0 dark:bg-gray-700 dark:text-white',
|
||||
'w-full absolute inset-0 outline-none appearance-none box-border border-0 text-sm font-sans bg-white rounded-md pl-3.5',
|
||||
tags: 'grow shrink flex flex-wrap mt-1 pl-2',
|
||||
tag: 'bg-primary-500 text-white text-sm font-semibold py-0.5 pl-2 rounded mr-1 mb-1 flex items-center whitespace-nowrap',
|
||||
tagDisabled: 'pr-2 !bg-gray-400 text-white',
|
||||
@ -462,12 +461,12 @@ export default {
|
||||
'bg-multiselect-remove text-white bg-center bg-no-repeat opacity-30 inline-block w-3 h-3 group-hover:opacity-60',
|
||||
tagsSearchWrapper: 'inline-block relative mx-1 mb-1 grow shrink h-full',
|
||||
tagsSearch:
|
||||
'absolute inset-0 border-0 focus:outline-none !shadow-none !focus:shadow-none appearance-none p-0 sm:text-sm font-sans box-border w-full dark:bg-gray-700',
|
||||
'absolute inset-0 border-0 focus:outline-none !shadow-none !focus:shadow-none appearance-none p-0 text-sm font-sans box-border w-full',
|
||||
tagsSearchCopy: 'invisible whitespace-pre-wrap inline-block h-px',
|
||||
placeholder:
|
||||
'flex items-center h-full absolute left-0 top-0 pointer-events-none bg-transparent leading-snug pl-3.5 text-gray-400 sm:text-sm dark:text-gray-500',
|
||||
'flex items-center h-full absolute left-0 top-0 pointer-events-none bg-transparent leading-snug pl-3.5 text-gray-400 text-sm',
|
||||
caret:
|
||||
'bg-multiselect-caret-black dark:bg-multiselect-caret-white bg-center bg-no-repeat w-5 h-5 py-px box-content z-5 relative mr-1 opacity-40 shrink-0 grow-0 transition-transform dark:text-white',
|
||||
'bg-multiselect-caret bg-center bg-no-repeat w-5 h-5 py-px box-content z-5 relative mr-1 opacity-40 shrink-0 grow-0 transition-transform',
|
||||
caretOpen: 'rotate-180 pointer-events-auto',
|
||||
clear:
|
||||
'pr-3.5 relative z-10 opacity-40 transition duration-300 shrink-0 grow-0 flex hover:opacity-80',
|
||||
@ -476,7 +475,7 @@ export default {
|
||||
spinner:
|
||||
'bg-multiselect-spinner bg-center bg-no-repeat w-4 h-4 z-10 mr-3.5 animate-spin shrink-0 grow-0',
|
||||
dropdown:
|
||||
'max-h-60 shadow-lg absolute -left-px -right-px -bottom-1 translate-y-full border border-gray-300 mt-1 overflow-y-auto z-50 bg-white dark:border-gray-600 flex flex-col rounded-md dark:bg-gray-800 dark:shadow-glass',
|
||||
'max-h-60 shadow-lg absolute -left-px -right-px -bottom-1 translate-y-full border border-gray-300 mt-1 overflow-y-auto z-50 bg-white flex flex-col rounded-md',
|
||||
dropdownTop:
|
||||
'-translate-y-full -top-2 bottom-auto flex-col-reverse rounded-md',
|
||||
dropdownHidden: 'hidden',
|
||||
@ -484,7 +483,7 @@ export default {
|
||||
optionsTop: 'flex-col-reverse',
|
||||
group: 'p-0 m-0',
|
||||
groupLabel:
|
||||
'flex text-sm box-border items-center justify-start text-left py-1 px-3 font-semibold bg-gray-200 dark:bg-gray-700 dark:text-gray-400 cursor-default leading-normal',
|
||||
'flex text-sm box-border items-center justify-start text-left py-1 px-3 font-semibold bg-gray-200 cursor-default leading-normal',
|
||||
groupLabelPointable: 'cursor-pointer',
|
||||
groupLabelPointed: 'bg-gray-300 text-gray-700',
|
||||
groupLabelSelected: 'bg-primary-600 text-white',
|
||||
@ -494,18 +493,15 @@ export default {
|
||||
'text-primary-100 bg-primary-600 bg-opacity-50 cursor-not-allowed',
|
||||
groupOptions: 'p-0 m-0',
|
||||
option:
|
||||
'flex items-center justify-start box-border text-left cursor-pointer text-sm leading-snug py-2 px-3 dark:text-gray-200',
|
||||
optionPointed:
|
||||
'text-gray-800 bg-gray-100 dark:text-white dark:bg-gray-700/30',
|
||||
'flex items-center justify-start box-border text-left cursor-pointer text-sm leading-snug py-2 px-3',
|
||||
optionPointed: 'text-gray-800 bg-gray-100',
|
||||
optionSelected: 'text-white bg-primary-500',
|
||||
optionDisabled: 'text-gray-300 cursor-not-allowed dark:text-gray-400',
|
||||
optionDisabled: 'text-gray-300 cursor-not-allowed',
|
||||
optionSelectedPointed: 'text-white bg-primary-500 opacity-90',
|
||||
optionSelectedDisabled:
|
||||
'text-primary-100 bg-primary-500 bg-opacity-50 cursor-not-allowed',
|
||||
noOptions:
|
||||
'py-2 px-3 text-gray-600 bg-white dark:bg-gray-700 dark:text-gray-200',
|
||||
noResults:
|
||||
'py-2 px-3 text-gray-600 bg-white dark:bg-gray-700 dark:text-gray-200',
|
||||
noOptions: 'py-2 px-3 text-gray-600 bg-white',
|
||||
noResults: 'py-2 px-3 text-gray-600 bg-white',
|
||||
fakeInput:
|
||||
'bg-transparent absolute left-0 right-0 -bottom-px w-full h-px border-0 p-0 appearance-none outline-none text-transparent',
|
||||
spacer: 'h-9 py-px box-content',
|
||||
|
||||
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<nav>
|
||||
<ol class="flex flex-wrap py-4 text-gray-900 rounded list-reset dark:text-gray-400">
|
||||
<ol class="flex flex-wrap py-4 text-gray-900 rounded list-reset">
|
||||
<slot />
|
||||
</ol>
|
||||
</nav>
|
||||
|
||||
@ -8,9 +8,7 @@
|
||||
font-medium
|
||||
leading-5
|
||||
text-gray-900
|
||||
dark:text-gray-400
|
||||
outline-none
|
||||
dark:focus:ring-offset-gray-900
|
||||
focus:ring-2 focus:ring-offset-2 focus:ring-primary-400
|
||||
"
|
||||
:to="to"
|
||||
|
||||
@ -1,7 +1,6 @@
|
||||
<script setup>
|
||||
import { computed, ref } from 'vue'
|
||||
import SpinnerIcon from '@/scripts/components/icons/SpinnerIcon.vue'
|
||||
|
||||
const props = defineProps({
|
||||
contentLoading: {
|
||||
type: Boolean,
|
||||
@ -10,7 +9,7 @@ const props = defineProps({
|
||||
defaultClass: {
|
||||
type: String,
|
||||
default:
|
||||
'inline-flex whitespace-nowrap items-center border font-medium focus:outline-none focus:ring-2 focus:ring-offset-2 dark:focus:ring-offset-gray-800',
|
||||
'inline-flex whitespace-nowrap items-center border font-medium focus:outline-none focus:ring-2 focus:ring-offset-2',
|
||||
},
|
||||
tag: {
|
||||
type: String,
|
||||
@ -28,10 +27,6 @@ const props = defineProps({
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
loadingRight: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
size: {
|
||||
type: String,
|
||||
default: 'md',
|
||||
@ -86,17 +81,17 @@ const placeHolderSize = computed(() => {
|
||||
|
||||
const variantClass = computed(() => {
|
||||
return {
|
||||
'border-transparent shadow-sm text-white bg-primary-600 hover:bg-primary-700 focus:ring-primary-500 dark:bg-primary-500 dark:hover:bg-primary-600':
|
||||
'border-transparent shadow-sm text-white bg-primary-600 hover:bg-primary-700 focus:ring-primary-500':
|
||||
props.variant === 'primary',
|
||||
'border-transparent text-primary-700 bg-primary-100 hover:bg-primary-200 focus:ring-primary-500':
|
||||
props.variant === 'secondary',
|
||||
'border-transparent border-solid border-primary-500 font-normal transition ease-in-out duration-150 text-primary-500 hover:bg-primary-100 shadow-inner focus:ring-primary-500 dark:text-primary-400 dark:border-primary-400 dark:hover:bg-transparent dark:hover:text-primary-500 dark:hover:border-primary-500':
|
||||
'border-transparent border-solid border-primary-500 font-normal transition ease-in-out duration-150 text-primary-500 hover:bg-primary-200 shadow-inner focus:ring-primary-500':
|
||||
props.variant == 'primary-outline',
|
||||
'border-gray-200 text-gray-700 bg-white hover:bg-gray-50 focus:ring-primary-500 focus:ring-offset-0 dark:bg-gray-800 dark:border-gray-600 dark:text-gray-300 dark:hover:bg-gray-900':
|
||||
'border-gray-200 text-gray-700 bg-white hover:bg-gray-50 focus:ring-primary-500 focus:ring-offset-0':
|
||||
props.variant == 'white',
|
||||
'border-transparent shadow-sm text-white bg-red-600 hover:bg-red-700 focus:ring-red-500':
|
||||
props.variant === 'danger',
|
||||
'border-transparent bg-gray-200 border hover:bg-opacity-60 focus:ring-gray-500 focus:ring-offset-0 dark:bg-gray-600 dark:text-white dark:hover:bg-opacity-60':
|
||||
'border-transparent bg-gray-200 border hover:bg-opacity-60 focus:ring-gray-500 focus:ring-offset-0':
|
||||
props.variant === 'gray',
|
||||
}
|
||||
})
|
||||
@ -129,13 +124,6 @@ const iconRightClass = computed(() => {
|
||||
'ml-3 -mr-1 h-5 w-5': props.size === 'lg' || props.size === 'xl',
|
||||
}
|
||||
})
|
||||
|
||||
const buttonDisabledClass = computed(() => {
|
||||
if (props.disabled || props.loading)
|
||||
return 'cursor-not-allowed bg-opacity-70 dark:!bg-opacity-40 hover:!bg-opacity-70 pointer-event-none'
|
||||
|
||||
return ''
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
@ -153,17 +141,15 @@ const buttonDisabledClass = computed(() => {
|
||||
<BaseCustomTag
|
||||
v-else
|
||||
:tag="tag"
|
||||
:disabled="disabled || loading"
|
||||
:class="[defaultClass, sizeClass, variantClass, roundedClass, buttonDisabledClass]"
|
||||
:disabled="disabled"
|
||||
:class="[defaultClass, sizeClass, variantClass, roundedClass]"
|
||||
>
|
||||
<SpinnerIcon v-if="loading && !loadingRight" :class="[iconLeftClass, iconVariantClass]" />
|
||||
<SpinnerIcon v-if="loading" :class="[iconLeftClass, iconVariantClass]" />
|
||||
|
||||
<slot v-else name="left" :class="iconLeftClass" />
|
||||
<slot v-else name="left" :class="iconLeftClass"></slot>
|
||||
|
||||
<slot />
|
||||
|
||||
<SpinnerIcon v-if="loading && loadingRight" :class="[iconRightClass, iconVariantClass]" />
|
||||
|
||||
<slot v-else name="right" :class="[iconRightClass, iconVariantClass]" />
|
||||
<slot name="right" :class="[iconRightClass, iconVariantClass]"></slot>
|
||||
</BaseCustomTag>
|
||||
</template>
|
||||
|
||||
@ -1,9 +1,5 @@
|
||||
<template>
|
||||
<div
|
||||
class="bg-white rounded-lg shadow dark:bg-gray-800 dark:text-white dark:shadow-glass dark:border dark:border-white/10 dark:bg-gray-800/70 relative"
|
||||
>
|
||||
<BaseDarkHighlight class="z-[-1] mt-10" />
|
||||
|
||||
<div class="bg-white rounded-lg shadow">
|
||||
<div
|
||||
v-if="hasHeaderSlot"
|
||||
class="px-5 py-4 text-black border-b border-gray-100 border-solid"
|
||||
|
||||
@ -1,21 +0,0 @@
|
||||
<template>
|
||||
<div
|
||||
class="
|
||||
hidden
|
||||
top-0
|
||||
w-full
|
||||
absolute
|
||||
ml-auto
|
||||
mr-auto
|
||||
left-0
|
||||
right-0
|
||||
text-center
|
||||
h-full
|
||||
rounded-full
|
||||
bg-highlight/[.10]
|
||||
blur-2xl
|
||||
dark:block
|
||||
z-[-1]
|
||||
"
|
||||
/>
|
||||
</template>
|
||||
@ -18,17 +18,17 @@ const props = defineProps({
|
||||
const badgeColorClasses = computed(() => {
|
||||
switch (props.status) {
|
||||
case 'DRAFT':
|
||||
return 'bg-yellow-300 bg-opacity-25 px-2 py-1 text-sm text-yellow-800 uppercase font-normal text-center dark:bg-transparent dark:border dark:border-yellow-500 dark:text-yellow-500'
|
||||
return 'bg-yellow-300 bg-opacity-25 px-2 py-1 text-sm text-yellow-800 uppercase font-normal text-center '
|
||||
case 'SENT':
|
||||
return ' bg-yellow-500 bg-opacity-25 px-2 py-1 text-sm text-yellow-900 uppercase font-normal text-center dark:bg-transparent dark:border dark:border-yellow-200 dark:text-yellow-200'
|
||||
return ' bg-yellow-500 bg-opacity-25 px-2 py-1 text-sm text-yellow-900 uppercase font-normal text-center '
|
||||
case 'VIEWED':
|
||||
return 'bg-blue-400 bg-opacity-25 px-2 py-1 text-sm text-blue-900 uppercase font-normal text-center dark:bg-transparent dark:border dark:border-blue-300 dark:text-blue-300'
|
||||
return 'bg-blue-400 bg-opacity-25 px-2 py-1 text-sm text-blue-900 uppercase font-normal text-center'
|
||||
case 'EXPIRED':
|
||||
return 'bg-red-300 bg-opacity-25 px-2 py-1 text-sm text-red-800 uppercase font-normal text-center dark:bg-transparent dark:border dark:border-red-500 dark:text-red-500'
|
||||
return 'bg-red-300 bg-opacity-25 px-2 py-1 text-sm text-red-800 uppercase font-normal text-center'
|
||||
case 'ACCEPTED':
|
||||
return 'bg-green-400 bg-opacity-25 px-2 py-1 text-sm text-green-800 uppercase font-normal text-center dark:bg-transparent dark:border dark:border-green-400 dark:text-green-400'
|
||||
return 'bg-green-400 bg-opacity-25 px-2 py-1 text-sm text-green-800 uppercase font-normal text-center'
|
||||
case 'REJECTED':
|
||||
return 'bg-purple-300 bg-opacity-25 px-2 py-1 text-sm text-purple-800 uppercase font-normal text-center dark:bg-transparent dark:border dark:border-purple-400 dark:text-purple-400'
|
||||
return 'bg-purple-300 bg-opacity-25 px-2 py-1 text-sm text-purple-800 uppercase font-normal text-center'
|
||||
default:
|
||||
return 'bg-gray-500 bg-opacity-25 px-2 py-1 text-sm text-gray-900 uppercase font-normal text-center'
|
||||
}
|
||||
|
||||
@ -20,25 +20,25 @@ export default {
|
||||
const badgeColorClasses = computed(() => {
|
||||
switch (props.status) {
|
||||
case 'DRAFT':
|
||||
return 'bg-yellow-300 bg-opacity-25 px-2 py-1 text-sm text-yellow-800 uppercase font-normal text-center dark:bg-transparent dark:border dark:border-yellow-500 dark:text-yellow-500'
|
||||
return 'bg-yellow-300 bg-opacity-25 px-2 py-1 text-sm text-yellow-800 uppercase font-normal text-center'
|
||||
case 'SENT':
|
||||
return ' bg-yellow-500 bg-opacity-25 px-2 py-1 text-sm text-yellow-900 uppercase font-normal text-center dark:bg-transparent dark:border dark:border-lime-200 dark:text-yellow-200'
|
||||
return ' bg-yellow-500 bg-opacity-25 px-2 py-1 text-sm text-yellow-900 uppercase font-normal text-center '
|
||||
case 'VIEWED':
|
||||
return 'bg-blue-400 bg-opacity-25 px-2 py-1 text-sm text-blue-900 uppercase font-normal text-center dark:bg-transparent dark:border dark:border-blue-300 dark:text-blue-300'
|
||||
return 'bg-blue-400 bg-opacity-25 px-2 py-1 text-sm text-blue-900 uppercase font-normal text-center'
|
||||
case 'COMPLETED':
|
||||
return 'bg-green-500 bg-opacity-25 px-2 py-1 text-sm text-green-900 uppercase font-normal text-center dark:bg-transparent dark:border dark:border-green-400 dark:text-green-400'
|
||||
return 'bg-green-500 bg-opacity-25 px-2 py-1 text-sm text-green-900 uppercase font-normal text-center'
|
||||
case 'DUE':
|
||||
return 'bg-yellow-500 bg-opacity-25 px-2 py-1 text-sm text-yellow-900 uppercase font-normal text-center dark:bg-transparent dark:border dark:border-yellow-500 dark:text-yellow-500'
|
||||
return 'bg-yellow-500 bg-opacity-25 px-2 py-1 text-sm text-yellow-900 uppercase font-normal text-center'
|
||||
case 'OVERDUE':
|
||||
return 'bg-red-300 bg-opacity-50 px-2 py-1 text-sm text-red-900 uppercase font-normal text-center dark:bg-transparent dark:border dark:border-red-500 dark:text-red-500'
|
||||
return 'bg-red-300 bg-opacity-50 px-2 py-1 text-sm text-red-900 uppercase font-normal text-center'
|
||||
case 'UNPAID':
|
||||
return 'bg-yellow-500 bg-opacity-25 px-2 py-1 text-sm text-yellow-900 uppercase font-normal text-center dark:bg-transparent dark:border dark:border-yellow-500 dark:text-yellow-500'
|
||||
return 'bg-yellow-500 bg-opacity-25 px-2 py-1 text-sm text-yellow-900 uppercase font-normal text-center'
|
||||
case 'PARTIALLY_PAID':
|
||||
return 'bg-blue-400 bg-opacity-25 px-2 py-1 text-sm text-blue-900 uppercase font-normal text-center dark:bg-transparent dark:border dark:border-green-400 dark:text-green-400'
|
||||
return 'bg-blue-400 bg-opacity-25 px-2 py-1 text-sm text-blue-900 uppercase font-normal text-center'
|
||||
case 'PAID':
|
||||
return 'bg-green-500 bg-opacity-25 px-2 py-1 text-sm text-green-900 uppercase font-normal text-center text-center dark:bg-transparent dark:border dark:border-green-400 dark:text-green-400'
|
||||
return 'bg-green-500 bg-opacity-25 px-2 py-1 text-sm text-green-900 uppercase font-normal text-center'
|
||||
default:
|
||||
return 'bg-gray-500 bg-opacity-25 px-2 py-1 text-sm text-gray-900 uppercase font-normal text-center dark:bg-transparent dark:border dark:border-gray-502 dark:text-gray-200'
|
||||
return 'bg-gray-500 bg-opacity-25 px-2 py-1 text-sm text-gray-900 uppercase font-normal text-center'
|
||||
}
|
||||
})
|
||||
return { badgeColorClasses }
|
||||
|
||||
@ -1,7 +1,7 @@
|
||||
<template>
|
||||
<div class="flex flex-wrap justify-between">
|
||||
<div>
|
||||
<h3 class="text-2xl font-bold text-left text-black dark:text-white">
|
||||
<h3 class="text-2xl font-bold text-left text-black">
|
||||
{{ title }}
|
||||
</h3>
|
||||
<slot />
|
||||
|
||||
@ -24,15 +24,15 @@ export default {
|
||||
const badgeColorClasses = computed(() => {
|
||||
switch (props.status) {
|
||||
case 'PAID':
|
||||
return 'bg-primary-300 bg-opacity-25 text-primary-800 uppercase font-normal text-center dark:bg-transparent dark:border dark:border-indigo-400 dark:text-indigo-400'
|
||||
return 'bg-primary-300 bg-opacity-25 text-primary-800 uppercase font-normal text-center'
|
||||
case 'UNPAID':
|
||||
return ' bg-yellow-500 bg-opacity-25 text-yellow-900 uppercase font-normal text-center dark:bg-transparent dark:border dark:border-orange-300 dark:text-orange-300'
|
||||
return ' bg-yellow-500 bg-opacity-25 text-yellow-900 uppercase font-normal text-center '
|
||||
case 'PARTIALLY_PAID':
|
||||
return 'bg-blue-400 bg-opacity-25 text-blue-900 uppercase font-normal text-center dark:bg-transparent dark:border dark:border-blue-300 dark:text-blue-300'
|
||||
return 'bg-blue-400 bg-opacity-25 text-blue-900 uppercase font-normal text-center'
|
||||
case 'OVERDUE':
|
||||
return 'bg-red-300 bg-opacity-50 px-2 py-1 text-sm text-red-900 uppercase font-normal text-center'
|
||||
default:
|
||||
return 'bg-gray-500 bg-opacity-25 text-gray-900 uppercase font-normal text-center dark:bg-transparent dark:border dark:border-gray-300 dark:text-gray-300'
|
||||
return 'bg-gray-500 bg-opacity-25 text-gray-900 uppercase font-normal text-center'
|
||||
}
|
||||
})
|
||||
return { badgeColorClasses }
|
||||
|
||||
@ -20,13 +20,13 @@ export default {
|
||||
const badgeColorClasses = computed(() => {
|
||||
switch (props.status) {
|
||||
case 'COMPLETED':
|
||||
return 'bg-green-500 bg-opacity-25 px-2 py-1 text-sm text-green-900 uppercase font-normal text-center dark:bg-transparent dark:border dark:border-green-500 dark:text-green-500'
|
||||
return 'bg-green-500 bg-opacity-25 px-2 py-1 text-sm text-green-900 uppercase font-normal text-center'
|
||||
case 'ON_HOLD':
|
||||
return 'bg-yellow-500 bg-opacity-25 px-2 py-1 text-sm text-yellow-900 uppercase font-normal text-center dark:bg-transparent dark:border dark:border-yellow-500 dark:text-yellow-500'
|
||||
return 'bg-yellow-500 bg-opacity-25 px-2 py-1 text-sm text-yellow-900 uppercase font-normal text-center'
|
||||
case 'ACTIVE':
|
||||
return 'bg-blue-400 bg-opacity-25 px-2 py-1 text-sm text-blue-900 uppercase font-normal text-center dark:bg-transparent dark:border dark:border-blue-400 dark:text-blue-400'
|
||||
return 'bg-blue-400 bg-opacity-25 px-2 py-1 text-sm text-blue-900 uppercase font-normal text-center'
|
||||
default:
|
||||
return 'bg-gray-500 bg-opacity-25 px-2 py-1 text-sm text-gray-900 uppercase font-normal text-center dark:bg-transparent dark:border dark:border-gray-500 dark:text-gray-500'
|
||||
return 'bg-gray-500 bg-opacity-25 px-2 py-1 text-sm text-gray-900 uppercase font-normal text-center'
|
||||
}
|
||||
})
|
||||
return { badgeColorClasses }
|
||||
|
||||
@ -25,7 +25,7 @@
|
||||
</head>
|
||||
|
||||
<body
|
||||
class="h-full overflow-hidden bg-gray-100 dark:bg-gray-900 dark:text-white font-base
|
||||
class="h-full overflow-hidden bg-gray-100 font-base
|
||||
@if(isset($current_theme)) theme-{{ $current_theme }} @else theme-{{get_app_setting('admin_portal_theme') ?? 'crater'}} @endif ">
|
||||
|
||||
<!-- Module Scripts -->
|
||||
@ -38,14 +38,6 @@
|
||||
@endforeach
|
||||
|
||||
<script type="module">
|
||||
if (localStorage.theme === 'dark' || (!('theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
|
||||
document.documentElement.classList.add('dark')
|
||||
document.documentElement.style.setProperty('color-scheme', 'dark');
|
||||
} else {
|
||||
document.documentElement.classList.remove('dark')
|
||||
document.documentElement.style.setProperty('color-scheme', 'light')
|
||||
}
|
||||
|
||||
@if(isset($customer_logo))
|
||||
|
||||
window.customer_logo = "/storage/{{$customer_logo}}"
|
||||
|
||||
@ -19,7 +19,6 @@ module.exports = {
|
||||
'./resources/scripts/**/*.js',
|
||||
'./resources/scripts/**/*.vue',
|
||||
],
|
||||
darkMode: 'class',
|
||||
theme: {
|
||||
extend: {
|
||||
colors: {
|
||||
@ -36,7 +35,6 @@ module.exports = {
|
||||
900: withOpacityValue('--color-primary-900'),
|
||||
},
|
||||
black: '#040405',
|
||||
highlight: 'rgb(56, 189, 248)',
|
||||
red: colors.red,
|
||||
teal: colors.teal,
|
||||
gray: colors.slate,
|
||||
@ -45,15 +43,10 @@ module.exports = {
|
||||
88: '22rem',
|
||||
},
|
||||
backgroundImage: (theme) => ({
|
||||
'multiselect-caret-black': `url("${svgToDataUri(
|
||||
`<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="black">
|
||||
'multiselect-caret': `url("${svgToDataUri(
|
||||
`<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="currentColor">
|
||||
<path fill-rule="evenodd" d="M10 3a1 1 0 01.707.293l3 3a1 1 0 01-1.414 1.414L10 5.414 7.707 7.707a1 1 0 01-1.414-1.414l3-3A1 1 0 0110 3zm-3.707 9.293a1 1 0 011.414 0L10 14.586l2.293-2.293a1 1 0 011.414 1.414l-3 3a1 1 0 01-1.414 0l-3-3a1 1 0 010-1.414z" clip-rule="evenodd" />
|
||||
</svg>`,
|
||||
)}")`,
|
||||
'multiselect-caret-white': `url("${svgToDataUri(
|
||||
`<svg xmlns="http://www.w3.org/2000/svg" class="h-5 w-5" viewBox="0 0 20 20" fill="white">
|
||||
<path fill-rule="evenodd" d="M10 3a1 1 0 01.707.293l3 3a1 1 0 01-1.414 1.414L10 5.414 7.707 7.707a1 1 0 01-1.414-1.414l3-3A1 1 0 0110 3zm-3.707 9.293a1 1 0 011.414 0L10 14.586l2.293-2.293a1 1 0 011.414 1.414l-3 3a1 1 0 01-1.414 0l-3-3a1 1 0 010-1.414z" clip-rule="evenodd" />
|
||||
</svg>`,
|
||||
</svg>`
|
||||
)}")`,
|
||||
'multiselect-spinner': `url("${svgToDataUri(
|
||||
`<svg viewBox="0 0 512 512" fill="${theme(
|
||||
|
||||
@ -11,7 +11,8 @@ RUN apt-get update && apt-get install -y \
|
||||
unzip \
|
||||
libzip-dev \
|
||||
libmagickwand-dev \
|
||||
mariadb-client
|
||||
mariadb-client \
|
||||
npm
|
||||
|
||||
# Clear cache
|
||||
RUN apt-get clean && rm -rf /var/lib/apt/lists/*
|
||||
@ -45,4 +46,19 @@ RUN chmod -R 775 composer.json composer.lock \
|
||||
RUN chown -R $(whoami):$(whoami) /var/log/
|
||||
RUN chmod -R 775 /var/log
|
||||
|
||||
# Cleanup manually generated build files
|
||||
RUN rm -rf /var/www/public/build
|
||||
RUN npm config set user 0
|
||||
RUN npm config set unsafe-perm true
|
||||
# Frontend bulding
|
||||
RUN sed -i 's/DB_CONNECTION=mysql/DB_CONNECTION=sqlite/g' /var/www/.env
|
||||
RUN sed -i 's/DB_DATABASE=crater/DB_DATABASE=\/tmp\/crater.sqlite/g' /var/www/.env
|
||||
RUN touch /tmp/crater.sqlite
|
||||
RUN composer install --no-interaction --prefer-dist
|
||||
RUN npm i -f
|
||||
RUN npm install --save-dev sass
|
||||
RUN export NODE_OPTIONS="--max-old-space-size=4096" && /usr/bin/npx vite build --target=es2020
|
||||
RUN sed -i 's/DB_CONNECTION=sqlite/DB_CONNECTION=mysql/g' /var/www/.env
|
||||
RUN sed -i 's/DB_DATABASE=\/tmp\/crater.sqlite/DB_DATABASE=crater/g' /var/www/.env
|
||||
|
||||
USER crater-user
|
||||
|
||||
@ -1,7 +1,9 @@
|
||||
ARG BASE_IMAGE
|
||||
|
||||
FROM $BASE_IMAGE as build
|
||||
FROM nginx:1.17-alpine
|
||||
|
||||
RUN rm /etc/nginx/conf.d/default.conf
|
||||
|
||||
COPY ./ /var/www
|
||||
COPY --from=build /var/www /var/www
|
||||
COPY ./uffizzi/nginx/nginx /etc/nginx/conf.d/
|
||||
|
||||
|
||||
Reference in New Issue
Block a user