hcengineering/platform
1
0
Fork 0
mirror of https://github.com/hcengineering/platform.git synced 2025-01-03 08:57:14 +03:00
Code Issues Actions 3 Packages Projects Releases Wiki Activity

UI fixes (#1109)

Browse Source 
Signed-off-by: Alexander Platov <sas_lord@mail.ru>
This commit is contained in:
Alexander Platov 2022-03-07 16:12:17 +07:00 committed by GitHub
parent 4457cb7fb7
commit 16bd4b983a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
23 changed files with 48 additions and 93 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
dev/prod/public/favicon.ico Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.1 KiB

5
dev/prod/public/favicon.svg Normal file
View File

@ -0,0 +1,5 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
<circle fill="#FFFFFF" cx="8" cy="8" r="8"/>
<path fill="#C8C8C8" d="M8,0C3.6,0,0,3.6,0,8s3.6,8,8,8s8-3.6,8-8S12.4,0,8,0z M8,15.5c-4.1,0-7.5-3.4-7.5-7.5S3.9,0.5,8,0.5 s7.5,3.4,7.5,7.5S12.1,15.5,8,15.5z"/>
<path d="M5,13.2V3.5h4.4c0.4,0,0.9,0.1,1.2,0.2c0.4,0.1,0.7,0.4,0.9,0.6s0.4,0.6,0.6,1c0.1,0.4,0.2,0.8,0.2,1.2 c0,0.5-0.1,0.9-0.2,1.2s-0.3,0.7-0.6,1s-0.6,0.5-0.9,0.6S9.8,9.5,9.4,9.5H6.8v3.7H5z M6.8,7.9h2.4c0.4,0,0.6-0.1,0.8-0.3 s0.3-0.5,0.3-0.8V6.2c0-0.4-0.1-0.6-0.3-0.8S9.5,5.1,9.2,5.1H6.8V7.9z"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 573 B

BIN
dev/prod/public/favicon_16.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 434 B

BIN
dev/prod/public/favicon_192.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.4 KiB

BIN
dev/prod/public/favicon_32.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 961 B

16
dev/prod/public/index.html
View File

@ -2,17 +2,21 @@
<html>
<head>
<meta charset='utf8'>
<meta name='viewport' content='width=device-width'>
<meta charset="utf8">
<meta name="viewport" content="width=device-width">
<title>Platform</title>
<title>Platform</title>
<link rel='icon' type='image/png' href='favicon.png'>
<link rel='stylesheet' href='/bundle.css'>
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
<link rel="icon" type="image/svg+xml" sizes="any" href="favicon.svg">
<link rel="icon" type="image/png" sizes="16x16" href="favicon_16.png">
<link rel="icon" type="image/png" sizes="32x32" href="favicon_32.png">
<link rel="icon" type="image/png" sizes="192x192" href="favicon_192.png">
<link rel="stylesheet" href="/bundle.css">
</head>
<body style="margin: 0; overflow: hidden;">
<script src='/bundle.js'></script>
<script src="/bundle.js"></script>
</body>
</html>

82
packages/presentation/src/components/SpaceCreateCard.svelte
View File

@ -28,88 +28,18 @@
const dispatch = createEventDispatcher()
</script>
<form class="card-container" on:submit|preventDefault={ () => {} }>
<div class="card-bg" />
<div class="flex-between header">
<div class="overflow-label label"><Label {label} /></div>
<form class="antiCard" on:submit|preventDefault={ () => {} }>
<div class="antiCard-header">
<div class="antiCard-header__title"><Label {label} /></div>
{#if $$slots.error}
<div class="flex-grow error">
<div class="antiCard-header__error">
<slot name="error" />
</div>
{/if}
</div>
<div class="content"><slot /></div>
<div class="footer">
<div class="antiCard-content"><slot /></div>
<div class="antiCard-footer">
<Button disabled={!canSave} label={presentation.string.Create} size={'small'} transparent primary on:click={() => { okAction(); dispatch('close') }} />
<Button label={presentation.string.Cancel} size={'small'} transparent on:click={() => { dispatch('close') }} />
</div>
</form>
<style lang="scss">
.card-container {
position: relative;
display: flex;
flex-direction: column;
width: 21.25rem;
min-width: 21.25rem;
max-width: 21.25rem;
border-radius: 1.25rem;
.header {
position: relative;
flex-shrink: 0;
padding: 1.75rem;
.label {
font-weight: 500;
font-size: 1rem;
color: var(--theme-caption-color);
}
.error {
position: absolute;
display: flex;
top: 3.25rem;
left: 1.75rem;
right: 1.75rem;
font-weight: 500;
font-size: .75rem;
color: var(--system-error-color);
&:empty { visibility: hidden; }
}
}
.content {
flex-shrink: 0;
flex-grow: 1;
margin: 0 1.75rem .75rem;
height: fit-content;
}
.footer {
flex-shrink: 0;
display: grid;
grid-auto-flow: column;
direction: rtl;
justify-content: start;
align-items: center;
column-gap: .75rem;
padding: 1rem 1.75rem 1.75rem;
height: 5.25rem;
overflow: hidden;
border-radius: 0 0 1.25rem 1.25rem;
}
.card-bg {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
background-color: var(--theme-card-bg);
border-radius: 1.25rem;
box-shadow: var(--theme-card-shadow);
z-index: -1;
}
}
</style>

6
packages/theme/styles/components.scss
View File

@ -393,7 +393,7 @@
&:last-child { border-bottom: none; }
&:hover .antiTable-cells__firstCell .antiTable-cells__firstCell-menuRow { visibility: visible; }
&:hover, &.checking {
background-color: var(--theme-table-bg-hover);
// background-color: var(--theme-table-bg-hover);
.antiTable-cells__checkCell { visibility: visible; }
.antiTable-cells__notifyCell .notify-table-kind {
width: 1rem;
@ -407,4 +407,8 @@
.antiTable-cells__firstCell-menuRow { visibility: visible; }
}
}
&.highlightRows .antiTable-body__row {
&:hover, &.checking { background-color: var(--theme-table-bg-hover); }
}
}

5
packages/ui/src/components/Button.svelte
View File

@ -63,7 +63,10 @@
border: 1px solid var(--theme-button-border-enabled);
border-radius: .75rem;
.icon { margin-right: .375rem; }
.icon {
margin-right: .375rem;
pointer-events: none;
}
&:hover {
background-color: var(--theme-button-bg-hovered);

8
packages/ui/src/components/Spinner.svelte
View File

@ -19,12 +19,12 @@
<div class="spinner spinner-{size}">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
<path d="M12 0v1c6.1 0 11 4.9 11 11s-4.9 11-11 11v1c6.6 0 12-5.4 12-12S18.6 0 12 0z" fill="#fff" />
<linearGradient id="a" gradientUnits="userSpaceOnUse" x1="0" y1="22" x2="0" y2="2">
<stop offset="0" stop-color={'var(--theme-caption-color)'} />
<stop offset="1" stop-color={'var(--theme-caption-color)'} stop-opacity="0" />
</linearGradient>
<path d="M12 23C5.9 23 1 18.1 1 12S5.9 1 12 1V0C5.4 0 0 5.4 0 12s5.4 12 12 12v-1z" fill="url(#a)" />
<path d="M12 0v1c6.1 0 11 4.9 11 11s-4.9 11-11 11v1c6.6 0 12-5.4 12-12S18.6 0 12 0z" fill="url(#a)" />
<path d="M12 23C5.9 23 1 18.1 1 12S5.9 1 12 1V0C5.4 0 0 5.4 0 12s5.4 12 12 12v-1z" fill="#fff" />
</svg>
</div>
@ -44,10 +44,10 @@
}
@-webkit-keyframes spinCircle {
from { -webkit-transform: rotate(0deg); }
to { -webkit-transform: rotate(-359deg); }
to { -webkit-transform: rotate(359deg); }
}
@keyframes spinCircle {
from { transform: rotate(0deg); }
to { transform: rotate(-359deg); }
to { transform: rotate(359deg); }
}
</style>

1
plugins/attachment-resources/src/components/Attachments.svelte
View File

@ -150,5 +150,6 @@
background: var(--theme-bg-accent-color);
border: 1px dashed var(--theme-zone-border-lite);
border-radius: 0.75rem;
&.solid { border-style: solid; }
}
</style>

1
plugins/contact-resources/src/components/Contacts.svelte
View File

@ -61,6 +61,7 @@
options={descr.options}
query={ resultQuery }
showNotification
highlightRows
/>
{/if}
{/await}

2
plugins/contact-resources/src/components/CreateOrganization.svelte
View File

@ -69,7 +69,7 @@
</div>
<div class="flex-col">
<div class="fs-title">
<EditBox placeholder={contact.string.OrganizationNamePlaceholder} maxWidth="11rem" bind:value={object.name} />
<EditBox placeholder={contact.string.OrganizationNamePlaceholder} maxWidth="11rem" bind:value={object.name} focus />
</div>
</div>
</div>

2
plugins/contact-resources/src/components/CreatePerson.svelte
View File

@ -105,7 +105,7 @@
</div>
<div class="flex-col">
<div class="fs-title">
<EditBox placeholder={contact.string.PersonFirstNamePlaceholder} maxWidth="12rem" bind:value={firstName} />
<EditBox placeholder={contact.string.PersonFirstNamePlaceholder} maxWidth="12rem" bind:value={firstName} focus />
</div>
<div class="fs-title mb-1">
<EditBox placeholder={contact.string.PersonLastNamePlaceholder} maxWidth="12rem" bind:value={lastName} />

1
plugins/inventory-resources/src/components/Products.svelte
View File

@ -67,6 +67,7 @@
options={descr.options}
query={resultQuery}
showNotification
highlightRows
/>
{/if}
{/await}

1
plugins/lead-resources/src/components/Customers.svelte
View File

@ -53,6 +53,7 @@
options={descr.options}
query={ resultQuery }
showNotification
highlightRows
/>
{/if}
{/await}

1
plugins/recruit-resources/src/components/Candidates.svelte
View File

@ -83,6 +83,7 @@
options={descr.options}
query={ resultQuery }
showNotification
highlightRows
/>
{/if}
{/await}

2
plugins/recruit-resources/src/components/CreateCandidate.svelte
View File

@ -411,7 +411,7 @@
</div>
<div class="flex-col">
<div class="fs-title">
<EditBox placeholder={recruit.string.PersonFirstNamePlaceholder} maxWidth="10rem" bind:value={firstName} />
<EditBox placeholder={recruit.string.PersonFirstNamePlaceholder} maxWidth="10rem" bind:value={firstName} focus />
</div>
<div class="fs-title mb-1">
<EditBox placeholder={recruit.string.PersonLastNamePlaceholder} maxWidth="10rem" bind:value={lastName} />

1
plugins/recruit-resources/src/components/Vacancies.svelte
View File

@ -131,5 +131,6 @@
archived: false
}}
showNotification
highlightRows
/>
</Scroller>

1
plugins/tags-resources/src/components/TagsView.svelte
View File

@ -102,5 +102,6 @@
options={opt}
query={resultQuery}
showNotification
highlightRows
/>
</Scroller>

1
plugins/task-resources/src/components/state/StatesBar.svelte
View File

@ -33,6 +33,7 @@
let maskLeft: boolean = false
let maskRight: boolean = false
let mask: 'left' | 'right' | 'both' | 'none' = 'none'
let stepStyle: string
$: stepStyle = (gap === 'small') ? 'gap-1' : 'gap-2'
const dispatch = createEventDispatcher()

3
plugins/view-resources/src/components/Table.svelte
View File

@ -28,6 +28,7 @@
export let query: DocumentQuery<Doc>
export let enableChecking: boolean = false
export let showNotification: boolean = false
export let highlightRows: boolean = false
export let options: FindOptions<Doc> | undefined = undefined
export let baseMenuClass: Ref<Class<Doc>> | undefined = undefined
export let config: (BuildModelKey | string)[]
@ -125,7 +126,7 @@
<Loading />
{/if}
{:then model}
<table class="antiTable" class:metaColumn={enableChecking || showNotification}>
<table class="antiTable" class:metaColumn={enableChecking || showNotification} class:highlightRows>
<thead class="scroller-thead">
<tr class="scroller-thead__tr">
{#if enableChecking || showNotification}

2
plugins/view-resources/src/components/TableView.svelte
View File

@ -30,5 +30,5 @@
</script>
<Scroller>
<Table {_class} {config} {options} query={resultQuery} {baseMenuClass} showNotification />
<Table {_class} {config} {options} query={resultQuery} {baseMenuClass} showNotification highlightRows />
</Scroller>