mirror of
https://github.com/InvoiceShelf/InvoiceShelf.git
synced 2026-04-15 17:24:10 +00:00
774b2614f0
customers, items, invoices, estimates, shared document form 77 files, 14451 lines. Typed layouts (CompanyLayout, AuthLayout, header, sidebar, company switcher), auth views (login, register, forgot/reset password), admin feature (dashboard, companies, users, settings with typed store), company features (dashboard with chart/ stats, customers CRUD, items CRUD, invoices CRUD with full store, estimates CRUD with full store), and shared document form components (items table, item row, totals, notes, tax popup, template select, exchange rate converter, calculation composable). Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
135 lines
3.7 KiB
Vue
135 lines
3.7 KiB
Vue
<template>
|
|
<div class="grid h-screen grid-cols-12 overflow-y-hidden bg-surface-tertiary">
|
|
<NotificationRoot />
|
|
|
|
<div
|
|
class="
|
|
flex items-center justify-center w-full max-w-sm col-span-12
|
|
p-4 mx-auto text-heading md:p-8 md:col-span-6 lg:col-span-4
|
|
flex-2 md:pb-48 md:pt-40
|
|
"
|
|
>
|
|
<div class="w-full">
|
|
<MainLogo
|
|
v-if="!loginPageLogo"
|
|
class="block w-48 h-auto max-w-full mb-32 text-primary-500"
|
|
/>
|
|
|
|
<img
|
|
v-else
|
|
:src="loginPageLogo"
|
|
class="block w-48 h-auto max-w-full mb-32 text-primary-500"
|
|
/>
|
|
|
|
<router-view />
|
|
|
|
<div
|
|
class="
|
|
pt-24 mt-0 text-sm not-italic font-medium leading-relaxed
|
|
text-left text-subtle md:pt-40
|
|
"
|
|
>
|
|
<p v-if="copyrightText" class="mb-3">
|
|
{{ copyrightText }}
|
|
</p>
|
|
<p v-else class="mb-3">
|
|
Powered by
|
|
<a
|
|
href="https://invoiceshelf.com/"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
class="text-primary-500 hover:underline"
|
|
>InvoiceShelf</a>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div
|
|
class="
|
|
relative flex-col items-center justify-center hidden w-full h-full
|
|
pl-10 bg-no-repeat bg-cover md:col-span-6 lg:col-span-8
|
|
md:flex content-box overflow-hidden
|
|
"
|
|
>
|
|
<LoginBackground class="absolute h-full w-full" />
|
|
|
|
<LoginPlanetCrater
|
|
class="absolute z-10 top-0 right-0 h-[300px] w-[420px]"
|
|
/>
|
|
|
|
<LoginBackgroundOverlay class="absolute h-full w-full right-[7.5%]" />
|
|
|
|
<div class="md:pl-10 xl:pl-0 relative z-50 w-7/12 xl:w-5/12">
|
|
<h1
|
|
class="
|
|
hidden mb-3 text-3xl leading-normal text-left text-white
|
|
xl:text-5xl xl:leading-tight md:none lg:block
|
|
"
|
|
>
|
|
{{ pageHeading }}
|
|
</h1>
|
|
<p
|
|
class="
|
|
hidden text-sm not-italic font-normal leading-normal text-left
|
|
text-gray-100 xl:text-base xl:leading-6 md:none lg:block
|
|
"
|
|
>
|
|
{{ pageDescription }}
|
|
</p>
|
|
</div>
|
|
|
|
<LoginBottomVector
|
|
class="
|
|
absolute z-50 w-full bg-no-repeat content-bottom
|
|
h-[15vw] lg:h-[22vw] right-[32%] bottom-0
|
|
"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { computed } from 'vue'
|
|
import NotificationRoot from '../../components/notifications/NotificationRoot.vue'
|
|
import MainLogo from '../../components/icons/MainLogo.vue'
|
|
import LoginBackground from '../../components/icons/LoginBackground.vue'
|
|
import LoginPlanetCrater from '../../components/icons/LoginPlanetCrater.vue'
|
|
import LoginBottomVector from '../../components/icons/LoginBottomVector.vue'
|
|
import LoginBackgroundOverlay from '../../components/icons/LoginBackgroundOverlay.vue'
|
|
|
|
declare global {
|
|
interface Window {
|
|
login_page_heading?: string
|
|
login_page_description?: string
|
|
copyright_text?: string
|
|
login_page_logo?: string
|
|
}
|
|
}
|
|
|
|
const pageHeading = computed<string>(() => {
|
|
if (window.login_page_heading) {
|
|
return window.login_page_heading
|
|
}
|
|
return 'Simple Invoicing for Individuals Small Businesses'
|
|
})
|
|
|
|
const pageDescription = computed<string>(() => {
|
|
if (window.login_page_description) {
|
|
return window.login_page_description
|
|
}
|
|
return 'InvoiceShelf helps you track expenses, record payments & generate beautiful invoices & estimates.'
|
|
})
|
|
|
|
const copyrightText = computed<string | null>(() => {
|
|
return window.copyright_text ?? null
|
|
})
|
|
|
|
const loginPageLogo = computed<string | false>(() => {
|
|
if (window.login_page_logo) {
|
|
return window.login_page_logo
|
|
}
|
|
return false
|
|
})
|
|
</script>
|