mirror of
https://github.com/hcengineering/platform.git
synced 2025-04-13 03:40:48 +00:00
Remove extra files (#1217)
Signed-off-by: Denis Bykhov <80476319+BykhovDenis@users.noreply.github.com>
This commit is contained in:
Denis Bykhov
GitHub
parent
a9d11bc0dd
commit
80185a2e4e
Binary file not shown.
|
Before Width: | Height: | Size: 1.4 MiB |
@ -1,189 +0,0 @@
|
||||
<!--
|
||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
||||
//
|
||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
||||
// you may not use this file except in compliance with the License. You may
|
||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
||||
//
|
||||
// Unless required by applicable law or agreed to in writing, software
|
||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
//
|
||||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
-->
|
||||
<script lang="ts">
|
||||
import type { Platform } from '@anticrm/platform'
|
||||
import { Severity, Status } from '@anticrm/platform'
|
||||
import { getContext } from 'svelte'
|
||||
import login from '..'
|
||||
import { CheckBox } from '@anticrm/ui'
|
||||
import type { ApplicationRoute, ApplicationRouter } from '@anticrm/platform-ui'
|
||||
import twofactor from 'node-2fa'
|
||||
import type { Options } from 'node-2fa/dist/interfaces'
|
||||
|
||||
export let router: ApplicationRouter<ApplicationRoute>
|
||||
const object = { oldPassword: '', newPassword: '', newPasswordConfirm: '', clientSecret: '', secondFactorCode: '' }
|
||||
let changePassword = false
|
||||
let status = new Status(Severity.OK, 0, '')
|
||||
|
||||
const platform = getContext('platform') as Platform
|
||||
const loginService = platform.getPlugin(login.id)
|
||||
|
||||
let secondFactorInitEnabled = false
|
||||
let secondFactorEnabled = false
|
||||
let secondFactorCurrentEnabled = false
|
||||
let newSecret:
|
||||
| {
|
||||
secret: string
|
||||
uri: string
|
||||
qr: string
|
||||
}
|
||||
| false
|
||||
let src: string
|
||||
|
||||
$: secondFactorCurrentEnabled = secondFactorEnabled && !secondFactorInitEnabled
|
||||
$: newSecret = secondFactorCurrentEnabled && twofactor.generateSecret({ name: 'Anticrm' } as Options)
|
||||
$: src = newSecret.qr
|
||||
$: object.clientSecret = newSecret.secret
|
||||
|
||||
const secondFactorCheck = loginService.then((ls) => {
|
||||
ls.getLoginInfo().then((li) => {
|
||||
secondFactorInitEnabled = !!li?.secondFactorEnabled
|
||||
secondFactorEnabled = secondFactorInitEnabled
|
||||
})
|
||||
})
|
||||
|
||||
function navigateLoginForm (): Promise<void> {
|
||||
return Promise.resolve(router.navigate({ route: '' }))
|
||||
}
|
||||
|
||||
let description: string
|
||||
$: description = status.message
|
||||
|
||||
async function saveSetting (): Promise<void> {
|
||||
if (!object.oldPassword) {
|
||||
status = new Status(Severity.INFO, 0, 'Поле пароль обязательно к заполнению.')
|
||||
return
|
||||
}
|
||||
|
||||
if (changePassword && object.newPassword !== object.newPasswordConfirm) {
|
||||
status = new Status(Severity.INFO, 0, 'Пароль и подтверждения пароля не совпадают')
|
||||
return
|
||||
}
|
||||
|
||||
if (secondFactorCurrentEnabled) {
|
||||
if (object.clientSecret && !object.secondFactorCode) {
|
||||
status = new Status(Severity.INFO, 0, 'Поле код подтверждения обязательно для заполнения')
|
||||
return
|
||||
}
|
||||
|
||||
if (!object.clientSecret && object.secondFactorCode) {
|
||||
status = new Status(Severity.INFO, 0, 'Поле секретный код обязательно для заполнения')
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
status = new Status(Severity.INFO, 0, 'Соединяюсь с сервером...')
|
||||
|
||||
status = await (await loginService).saveSetting(
|
||||
object.oldPassword,
|
||||
changePassword ? object.newPassword : '',
|
||||
secondFactorEnabled,
|
||||
secondFactorCurrentEnabled ? object.clientSecret : '',
|
||||
secondFactorCurrentEnabled ? object.secondFactorCode : ''
|
||||
)
|
||||
if (status.severity === Severity.OK) {
|
||||
await navigateLoginForm()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<form class="form">
|
||||
<div class="status">{description}</div>
|
||||
<div class="field">
|
||||
<input class="editbox" name="oldPassword" placeholder="Пароль" type="password" bind:value={object.oldPassword} />
|
||||
</div>
|
||||
<div class="field">
|
||||
<CheckBox bind:checked={changePassword}>Изменить пароль</CheckBox>
|
||||
</div>
|
||||
{#if changePassword}
|
||||
<div class="field">
|
||||
<input
|
||||
class="editbox"
|
||||
name="newPassword"
|
||||
placeholder="Новый пароль"
|
||||
type="password"
|
||||
bind:value={object.newPassword} />
|
||||
</div>
|
||||
<div class="field">
|
||||
<input
|
||||
class="editbox"
|
||||
name="newPasswordConfirm"
|
||||
placeholder="Подтверждение пароля"
|
||||
type="password"
|
||||
bind:value={object.newPasswordConfirm} />
|
||||
</div>
|
||||
{/if}
|
||||
{#await secondFactorCheck then value}
|
||||
<div class="field">
|
||||
<CheckBox bind:checked={secondFactorEnabled}>Включить двухфакторную авторизацию</CheckBox>
|
||||
</div>
|
||||
{#if secondFactorCurrentEnabled}
|
||||
<div class="field">
|
||||
<input
|
||||
class="editbox"
|
||||
name="clientSecret"
|
||||
placeholder="Секретный код"
|
||||
type="text"
|
||||
bind:value={object.clientSecret} />
|
||||
</div>
|
||||
{#if src}
|
||||
<div>
|
||||
<img {src} alt="qr code" />
|
||||
</div>
|
||||
{/if}
|
||||
<div class="field">
|
||||
<input
|
||||
class="editbox"
|
||||
name="secondFactorCode"
|
||||
placeholder="Код подтверждения"
|
||||
type="text"
|
||||
bind:value={object.secondFactorCode} />
|
||||
</div>
|
||||
{/if}
|
||||
{/await}
|
||||
<div class="buttons">
|
||||
<button class="button" on:click|preventDefault={navigateLoginForm}> Отменить</button>
|
||||
<button class="button" on:click|preventDefault={saveSetting}> Сохранить</button>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<style lang="scss">
|
||||
img {
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
width: 50%;
|
||||
border: 1px;
|
||||
border-style: solid;
|
||||
}
|
||||
|
||||
form {
|
||||
margin: auto;
|
||||
margin-top: 3vh;
|
||||
width: 30em;
|
||||
padding: 1em;
|
||||
border-radius: 1em;
|
||||
border: 1px solid var(--theme-bg-accent-color);
|
||||
.status {
|
||||
margin-top: 0.5em;
|
||||
}
|
||||
.field {
|
||||
.editbox {
|
||||
width: 100%;
|
||||
}
|
||||
margin: 1em 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,79 +0,0 @@
|
||||
<!--
|
||||
// Copyright © 2020 Anticrm Platform Contributors.
|
||||
//
|
||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
||||
// you may not use this file except in compliance with the License. You may
|
||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
||||
//
|
||||
// Unless required by applicable law or agreed to in writing, software
|
||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
//
|
||||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
-->
|
||||
|
||||
<script lang="ts">
|
||||
import { ScrollBox, IconAdd } from '@anticrm/ui'
|
||||
|
||||
import type { Doc, Ref, Space } from '@anticrm/core'
|
||||
import { createQuery } from '@anticrm/presentation'
|
||||
import type { Attachment } from '@anticrm/chunter'
|
||||
|
||||
import chunter from '@anticrm/chunter'
|
||||
|
||||
export let object: Doc
|
||||
export let space: Ref<Space>
|
||||
|
||||
let files: Attachment[] = []
|
||||
|
||||
console.log('query space', space)
|
||||
|
||||
const query = createQuery()
|
||||
$: query.query(chunter.class.Attachment, { space }, result => { files = result})
|
||||
|
||||
</script>
|
||||
|
||||
<ScrollBox vertical>
|
||||
{#each files as file}
|
||||
<div class="item flex-row-center">
|
||||
<div class="flex-center file-icon">pdf</div>
|
||||
<div class="flex-col flex-grow">
|
||||
<div class="overflow-label caption-color">{file.name}</div>
|
||||
<div class="overflow-label file-desc">{file.type}</div>
|
||||
</div>
|
||||
</div>
|
||||
{/each}
|
||||
<div class="item add-file">
|
||||
<button class="add-btn focused-button"><IconAdd size={'small'} /></button>
|
||||
<div class="caption-color">Add attachment</div>
|
||||
</div>
|
||||
</ScrollBox>
|
||||
|
||||
<style lang="scss">
|
||||
.item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: .75rem 1rem;
|
||||
}
|
||||
.file-icon, .add-btn {
|
||||
margin-right: 1.25rem;
|
||||
width: 2rem;
|
||||
height: 2rem;
|
||||
border-radius: .5rem;
|
||||
}
|
||||
.file-icon {
|
||||
font-weight: 500;
|
||||
font-size: 0.625rem;
|
||||
line-height: 150%;
|
||||
text-transform: uppercase;
|
||||
color: #fff;
|
||||
background-color: #7C6FCD;
|
||||
border: 1px solid rgba(0, 0, 0, .1);
|
||||
}
|
||||
.file-desc {
|
||||
font-size: 0.75rem;
|
||||
color: var(--theme-content-dark-color);
|
||||
}
|
||||
.item + .add-file, .item + .item { border-top: 1px solid var(--theme-bg-accent-hover); }
|
||||
</style>
|
||||
@ -1,51 +0,0 @@
|
||||
<!--
|
||||
// Copyright © 2020 Anticrm Platform Contributors.
|
||||
//
|
||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
||||
// you may not use this file except in compliance with the License. You may
|
||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
||||
//
|
||||
// Unless required by applicable law or agreed to in writing, software
|
||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
//
|
||||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
-->
|
||||
|
||||
<script lang="ts">
|
||||
import type { Asset, IntlString } from '@anticrm/platform'
|
||||
import type { AnySvelteComponent } from '@anticrm/ui'
|
||||
import { CircleButton, Label } from '@anticrm/ui'
|
||||
|
||||
export let icon: Asset | AnySvelteComponent | undefined = undefined
|
||||
export let label: IntlString
|
||||
export let component: AnySvelteComponent
|
||||
export let props: any
|
||||
export let minimize: boolean = false
|
||||
</script>
|
||||
|
||||
{#if icon}
|
||||
<div class="flex-row-center">
|
||||
<CircleButton icon={icon} size={'large'} />
|
||||
{#if !minimize}
|
||||
<div class="flex-col with-icon">
|
||||
<Label {label} />
|
||||
<div class="value"><svelte:component this={component} {...props} /></div>
|
||||
</div>
|
||||
{/if}
|
||||
</div>
|
||||
{:else}
|
||||
<div class="flex-col">
|
||||
<Label {label} />
|
||||
<div class="value"><svelte:component this={component} {...props} /></div>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<style lang="scss">
|
||||
.with-icon { margin-left: .5rem; }
|
||||
.value {
|
||||
font-weight: 500;
|
||||
color: var(--theme-caption-color);
|
||||
}
|
||||
</style>
|
||||
@ -1,111 +0,0 @@
|
||||
<!--
|
||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
||||
// Copyright © 2021 Hardcore Engineering Inc.
|
||||
//
|
||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
||||
// you may not use this file except in compliance with the License. You may
|
||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
||||
//
|
||||
// Unless required by applicable law or agreed to in writing, software
|
||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
//
|
||||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
-->
|
||||
|
||||
<script lang="ts">
|
||||
import type { IntlString } from '@anticrm/platform'
|
||||
import presentation from '@anticrm/presentation'
|
||||
import { Button,Grid,IconClose,Label } from '@anticrm/ui'
|
||||
import { createEventDispatcher } from 'svelte'
|
||||
import Avatar from '../../img/avatar.png'
|
||||
import recruit from '../plugin'
|
||||
export let label: IntlString
|
||||
|
||||
const dispatch = createEventDispatcher()
|
||||
</script>
|
||||
|
||||
<div class="dialog-container">
|
||||
<div class="abs-lt-content label">
|
||||
<Label {label} />
|
||||
</div>
|
||||
<div class="abs-rt-content tool" on:click={() => { dispatch('close') }}>
|
||||
<IconClose size={'small'} />
|
||||
</div>
|
||||
|
||||
<div class="avatar">
|
||||
<img src={Avatar} alt={'Avatar'} />
|
||||
</div>
|
||||
|
||||
<div class="abs-lb-content actions">
|
||||
<Grid columnGap={.5}>
|
||||
<Button label={recruit.string.Edit} />
|
||||
<Button label={recruit.string.Delete} />
|
||||
</Grid>
|
||||
</div>
|
||||
<div class="abs-rb-content">
|
||||
<Button label={presentation.string.Save} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style lang="scss">
|
||||
.dialog-container {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 40rem;
|
||||
height: 23.75rem;
|
||||
background-color: var(--theme-bg-color);
|
||||
border-radius: 1.25rem;
|
||||
filter: drop-shadow(0 0 4rem rgba(0, 0, 0, .35));
|
||||
|
||||
.label {
|
||||
font-weight: 500;
|
||||
font-size: 1rem;
|
||||
color: var(--theme-caption-color);
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
position: relative;
|
||||
width: 13.75rem;
|
||||
height: 13.75rem;
|
||||
background-color: #fff;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
|
||||
&::after, &::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
}
|
||||
&::after {
|
||||
top: .65rem;
|
||||
left: .65rem;
|
||||
bottom: .65rem;
|
||||
right: .65rem;
|
||||
border: 1px solid rgba(255, 255, 255, .6);
|
||||
border-radius: 50%;
|
||||
}
|
||||
&::before {
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
width: 13.75rem;
|
||||
height: 13.75rem;
|
||||
background-color: rgba(255, 255, 255, .2);
|
||||
clip-path: path('M110,0C49.2,0,0,49.2,0,110c0,60.8,49.2,110,110,110s110-49.2,110-110C220,49.2,170.8,0,110,0z M110,212 C53.7,212,8,166.3,8,110C8,53.7,53.7,8,110,8s102,45.7,102,102C212,166.3,166.3,212,110,212z');
|
||||
filter: blur(3px);
|
||||
}
|
||||
}
|
||||
|
||||
.tool {
|
||||
opacity: .4;
|
||||
cursor: pointer;
|
||||
&:hover { opacity: 1; }
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,47 +0,0 @@
|
||||
<!--
|
||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
||||
// Copyright © 2021 Hardcore Engineering Inc.
|
||||
//
|
||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
||||
// you may not use this file except in compliance with the License. You may
|
||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
||||
//
|
||||
// Unless required by applicable law or agreed to in writing, software
|
||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
//
|
||||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
-->
|
||||
|
||||
<script lang="ts">
|
||||
|
||||
import { TextArea, EditBox, Dialog, Tabs, Section, Grid, IconFile } from '@anticrm/ui'
|
||||
import { AttributeEditor, getClient } from '@anticrm/presentation'
|
||||
import type { Candidate } from '@anticrm/recruit'
|
||||
|
||||
import Address from './icons/Address.svelte'
|
||||
|
||||
import contact from '@anticrm/contact'
|
||||
|
||||
export let object: Candidate
|
||||
export let newValue: Candidate
|
||||
|
||||
</script>
|
||||
|
||||
<Section icon={IconFile} label={'Personal Information'}>
|
||||
<Grid>
|
||||
<AttributeEditor _class={contact.class.Person} key={'firstName'} {newValue} oldValue={object} focus/>
|
||||
<AttributeEditor _class={contact.class.Person} key={'lastName'} {newValue} oldValue={object}/>
|
||||
<AttributeEditor _class={contact.class.Person} key={'email'} {newValue} oldValue={object}/>
|
||||
<AttributeEditor _class={contact.class.Person} key={'phone'} {newValue} oldValue={object}/>
|
||||
</Grid>
|
||||
</Section>
|
||||
<Section icon={Address} label={'Address'}>
|
||||
<Grid>
|
||||
<EditBox label={'Street'} placeholder={'Broderick st'} />
|
||||
<EditBox label={'City *'} placeholder={'Los Angeles'} bind:value={newValue.city}/>
|
||||
<EditBox label={'ZIP / Postal code'} placeholder={'26892'} />
|
||||
<EditBox label={'Country'} placeholder={'United States'} />
|
||||
</Grid>
|
||||
</Section>
|
||||
@ -1,83 +0,0 @@
|
||||
<!--
|
||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
||||
//
|
||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
||||
// you may not use this file except in compliance with the License. You may
|
||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
||||
//
|
||||
// Unless required by applicable law or agreed to in writing, software
|
||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
//
|
||||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
-->
|
||||
|
||||
<script lang="ts">
|
||||
import { Avatar } from '@anticrm/presentation'
|
||||
import { IconFile } from '@anticrm/ui'
|
||||
import LabelStatus from './LabelStatus.svelte'
|
||||
import Tag from './Tag.svelte'
|
||||
|
||||
interface Person {
|
||||
firstName: string
|
||||
lastName: string
|
||||
email: string
|
||||
description: string
|
||||
city: string
|
||||
state: string
|
||||
}
|
||||
|
||||
export let user: Person
|
||||
|
||||
</script>
|
||||
|
||||
<div class="container">
|
||||
<div class="status"><LabelStatus label={user.state} color={'var(--primary-button-enabled)'} /></div>
|
||||
<div class="avatar"><Avatar size={'large'} /></div>
|
||||
<div class="name">{user.lastName} {user.firstName}</div>
|
||||
<div class="description">{user.description}</div>
|
||||
<div class="city">{user.city}</div>
|
||||
<Tag icon={IconFile} label={'Application'} />
|
||||
</div>
|
||||
|
||||
<style lang="scss">
|
||||
.container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 1.25rem 1.5rem;
|
||||
background-color: var(--theme-button-bg-enabled);
|
||||
border: 1px solid var(--theme-bg-accent-color);
|
||||
border-radius: .75rem;
|
||||
|
||||
.status {
|
||||
display: flex;
|
||||
flex-direction: row-reverse;
|
||||
width: 100%;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
.avatar {
|
||||
height: 5rem;
|
||||
}
|
||||
.name {
|
||||
margin: 1rem 0 .25rem;
|
||||
font-weight: 500;
|
||||
font-size: 1rem;
|
||||
line-height: 150%;
|
||||
color: var(--theme-caption-color);
|
||||
}
|
||||
.description, .city {
|
||||
font-size: .75rem;
|
||||
color: var(--theme-content-dark-color);
|
||||
}
|
||||
.city {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: var(--theme-bg-accent-hover);
|
||||
box-shadow: 0px .75rem 2.5rem rgba(0, 0, 0, .15);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,73 +0,0 @@
|
||||
<!--
|
||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
||||
//
|
||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
||||
// you may not use this file except in compliance with the License. You may
|
||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
||||
//
|
||||
// Unless required by applicable law or agreed to in writing, software
|
||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
//
|
||||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
-->
|
||||
|
||||
<script lang="ts">
|
||||
import type { IntlString } from '@anticrm/platform'
|
||||
import { Label, IconAdd } from '@anticrm/ui'
|
||||
|
||||
export let label: IntlString
|
||||
</script>
|
||||
|
||||
<div class="card-container">
|
||||
<div class="circle">
|
||||
<div class="icon">
|
||||
<IconAdd size={'large'} />
|
||||
</div>
|
||||
</div>
|
||||
<Label {label} />
|
||||
</div>
|
||||
|
||||
<style lang="scss">
|
||||
.card-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 20px 24px;
|
||||
font-size: 14px;
|
||||
line-height: 18px;
|
||||
color: var(--theme-caption-color);
|
||||
background-color: var(--theme-button-bg-enabled);
|
||||
border: 1px solid var(--theme-bg-accent-color);
|
||||
border-radius: .75rem;
|
||||
cursor: pointer;
|
||||
|
||||
.circle {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
background-color: var(--theme-bg-accent-color);
|
||||
border-radius: 50%;
|
||||
|
||||
.icon {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
opacity: .6;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: var(--theme-bg-accent-hover);
|
||||
box-shadow: 0px 12px 40px rgba(0, 0, 0, .15);
|
||||
|
||||
.circle .icon {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,60 +0,0 @@
|
||||
<!--
|
||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
||||
//
|
||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
||||
// you may not use this file except in compliance with the License. You may
|
||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
||||
//
|
||||
// Unless required by applicable law or agreed to in writing, software
|
||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
//
|
||||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
-->
|
||||
|
||||
<script lang="ts">
|
||||
import { ScrollBox } from '@anticrm/ui'
|
||||
import Card from './Card.svelte.txt'
|
||||
import CardEmpty from './CardEmpty.svelte'
|
||||
|
||||
interface Person {
|
||||
firstName: string
|
||||
lastName: string
|
||||
email: string
|
||||
description: string
|
||||
city: string
|
||||
state: string
|
||||
}
|
||||
|
||||
const cards: Array<Person> = [
|
||||
{ firstName: 'Chen', lastName: 'Rosamund', email: 'rosamund@gmail.com', description: 'Software Engineer', city: 'San Francisco', state: 'Offered' },
|
||||
{ firstName: 'Chen', lastName: 'Rosamund', email: 'rosamund@gmail.com', description: 'Software Engineer', city: 'San Francisco', state: 'Hired' },
|
||||
{ firstName: 'Chen', lastName: 'Rosamund', email: 'rosamund@gmail.com', description: 'Software Engineer', city: 'San Francisco', state: 'Interview' },
|
||||
{ firstName: 'Chen', lastName: 'Rosamund', email: 'rosamund@gmail.com', description: 'Software Engineer', city: 'San Francisco', state: 'Submission' },
|
||||
{ firstName: 'Chen', lastName: 'Rosamund', email: 'rosamund@gmail.com', description: 'Software Engineer', city: 'San Francisco', state: 'Offered' },
|
||||
{ firstName: 'Chen', lastName: 'Rosamund', email: 'rosamund@gmail.com', description: 'Software Engineer', city: 'San Francisco', state: 'Hired' },
|
||||
{ firstName: 'Chen', lastName: 'Rosamund', email: 'rosamund@gmail.com', description: 'Software Engineer', city: 'San Francisco', state: 'Interview' },
|
||||
{ firstName: 'Chen', lastName: 'Rosamund', email: 'rosamund@gmail.com', description: 'Software Engineer', city: 'San Francisco', state: 'Submission' },
|
||||
{ firstName: 'Chen', lastName: 'Rosamund', email: 'rosamund@gmail.com', description: 'Software Engineer', city: 'San Francisco', state: 'Offered' }
|
||||
]
|
||||
|
||||
</script>
|
||||
|
||||
<ScrollBox vertical>
|
||||
<div class="cards-container">
|
||||
<CardEmpty label={'Create new task'} />
|
||||
{#each cards as card}
|
||||
<Card user={card} />
|
||||
{/each}
|
||||
</div>
|
||||
</ScrollBox>
|
||||
|
||||
<style lang="scss">
|
||||
.cards-container {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(220px, auto));
|
||||
grid-auto-rows: minmax(280px, auto);
|
||||
grid-gap: 24px;
|
||||
}
|
||||
</style>
|
||||
@ -1,46 +0,0 @@
|
||||
<!--
|
||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
||||
// Copyright © 2021 Hardcore Engineering Inc.
|
||||
//
|
||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
||||
// you may not use this file except in compliance with the License. You may
|
||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
||||
//
|
||||
// Unless required by applicable law or agreed to in writing, software
|
||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
//
|
||||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
-->
|
||||
|
||||
<script lang="ts">
|
||||
|
||||
import type { Doc } from '@anticrm/core'
|
||||
import { Label, showPopup } from '@anticrm/ui'
|
||||
import CreateApplication from './CreateApplication.svelte'
|
||||
|
||||
export let value: Doc
|
||||
|
||||
let button: HTMLElement
|
||||
|
||||
</script>
|
||||
|
||||
<div class="flex-center presenter-container" bind:this={button}
|
||||
on:click={() => { showPopup(CreateApplication, { candidate: value._id, preserveCandidate: true }, button) }}
|
||||
>
|
||||
<Label label="Create Application" />
|
||||
</div>
|
||||
|
||||
<style lang="scss">
|
||||
.presenter-container {
|
||||
padding: .25rem .75rem;
|
||||
width: max-content;
|
||||
font-size: .75rem;
|
||||
color: var(--theme-caption-color);
|
||||
background-color: var(--theme-bg-accent-color);
|
||||
border: 1px solid var(--theme-bg-accent-color);
|
||||
border-radius: .5rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
</style>
|
||||
@ -1,210 +0,0 @@
|
||||
<!--
|
||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
||||
// Copyright © 2021 Hardcore Engineering Inc.
|
||||
//
|
||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
||||
// you may not use this file except in compliance with the License. You may
|
||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
||||
//
|
||||
// Unless required by applicable law or agreed to in writing, software
|
||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
//
|
||||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
-->
|
||||
|
||||
<script lang="ts">
|
||||
import { createEventDispatcher } from 'svelte'
|
||||
|
||||
import type { Ref, Space, Doc } from '@anticrm/core'
|
||||
import { generateId } from '@anticrm/core'
|
||||
import { EditBox, Button, CircleButton, Grid, Label, Link, showPopup, Component, IconFile as FileIcon } from '@anticrm/ui'
|
||||
import type { AnyComponent } from '@anticrm/ui'
|
||||
import { getClient, PDFViewer } from '@anticrm/presentation'
|
||||
import type { Attachment } from '@anticrm/chunter'
|
||||
|
||||
import AvatarEditor from './AvatarEditor.svelte'
|
||||
import FileUpload from './icons/FileUpload.svelte'
|
||||
import Edit from './icons/Edit.svelte'
|
||||
import Twitter from './icons/Twitter.svelte'
|
||||
import User from './icons/User.svelte'
|
||||
import SocialEditor from './SocialEditor.svelte'
|
||||
|
||||
import { uploadFile } from '../utils'
|
||||
import { Candidate } from '@anticrm/recruit'
|
||||
|
||||
import chunter from '@anticrm/chunter'
|
||||
import contact from '@anticrm/contact'
|
||||
|
||||
import equals from 'deep-equal'
|
||||
|
||||
const dispatch = createEventDispatcher()
|
||||
|
||||
export let space: Ref<Space>
|
||||
export let object: Candidate
|
||||
export let newValue: Candidate
|
||||
export let create = false
|
||||
|
||||
export let resume: {
|
||||
id: Ref<Doc> | undefined
|
||||
name: string
|
||||
uuid: string
|
||||
size: number
|
||||
type: string
|
||||
}
|
||||
|
||||
const client = getClient()
|
||||
|
||||
if (newValue.resume !== undefined) {
|
||||
client.findOne(chunter.class.Attachment, { _id: newValue.resume }).then(result => {
|
||||
if (result !== undefined) {
|
||||
resume = {
|
||||
id: result._id,
|
||||
name: result.name,
|
||||
uuid: result.file,
|
||||
size: result.size,
|
||||
type: result.type,
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
let dragover = false
|
||||
let loading = false
|
||||
let changed = false
|
||||
|
||||
function isChanged(): void {
|
||||
for (const key in newValue) {
|
||||
if (!equals((newValue as any)[key], (object as any)[key])) {
|
||||
changed = true
|
||||
return
|
||||
}
|
||||
}
|
||||
changed = false
|
||||
}
|
||||
|
||||
async function createAttachment(file: File) {
|
||||
loading = true
|
||||
try {
|
||||
const id = generateId<Attachment>()
|
||||
resume.uuid = await uploadFile(id, space, file)
|
||||
resume.id = id
|
||||
resume.name = file.name
|
||||
resume.size = file.size
|
||||
resume.type = file.type
|
||||
|
||||
newValue.resume = id
|
||||
isChanged()
|
||||
|
||||
console.log('uploaded file uuid', resume.uuid)
|
||||
|
||||
} finally {
|
||||
loading = false
|
||||
}
|
||||
}
|
||||
|
||||
function drop(event: DragEvent) {
|
||||
dragover = false
|
||||
const droppedFile = event.dataTransfer?.files[0]
|
||||
if (droppedFile !== undefined) { createAttachment(droppedFile) }
|
||||
}
|
||||
|
||||
let inputFile: HTMLInputElement
|
||||
|
||||
function fileSelected() {
|
||||
console.log(inputFile.files)
|
||||
const file = inputFile.files?.[0]
|
||||
if (file !== undefined) { createAttachment(file) }
|
||||
}
|
||||
</script>
|
||||
|
||||
<form on:submit|preventDefault={()=>{}}>
|
||||
<div class="header" class:dragover={dragover}
|
||||
on:dragenter={ () => { dragover = true } }
|
||||
on:dragover|preventDefault={ ()=>{} }
|
||||
on:dragleave={ () => { dragover = false } }
|
||||
on:drop|preventDefault|stopPropagation={drop}>
|
||||
<div class="flex-row-center main-content">
|
||||
<div class="avatar" on:click|stopPropagation={() => showPopup(AvatarEditor, { label: 'Profile photo' })}><User /></div>
|
||||
<div class="flex-col">
|
||||
<div class="name">
|
||||
<EditBox placeholder="John" bind:value={newValue.firstName} on:input={isChanged} focus={create}/>
|
||||
<EditBox placeholder="Appleseed" bind:value={newValue.lastName} on:input={isChanged}/>
|
||||
</div>
|
||||
<div class="title"><EditBox placeholder="Location" bind:value={newValue.city} on:input={isChanged}/></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="abs-lb-content flex-row-center">
|
||||
{#if resume.id}
|
||||
<Link label={resume.name} href={'#'} icon={FileIcon} on:click={ () => { showPopup(PDFViewer, { file: resume.uuid }, 'right') } }/>
|
||||
{:else}
|
||||
<Button label={'Upload resume'} {loading} icon={FileUpload} size={'small'} transparent primary on:click={() => { inputFile.click() }}/>
|
||||
<input bind:this={inputFile} type="file" name="file" id="file" style="display: none" on:change={fileSelected}/>
|
||||
{/if}
|
||||
</div>
|
||||
<div class="abs-rb-content">
|
||||
{#if changed}
|
||||
<Button label={ create ? 'Create' : 'Save' } size={'small'} transparent on:click={ () => { dispatch('save') } }/>
|
||||
{/if}
|
||||
</div>
|
||||
<div class="abs-rt-content flex-row-center">
|
||||
<div style="margin-right: .25rem"><Component is='contact:component:ChannelsPresenter' props={ { value: newValue.channels } }/></div>
|
||||
<CircleButton icon={Edit} label={'Edit'} on:click={(ev) => showPopup(SocialEditor, { values: newValue.channels ?? [] }, ev.target, (result) => { newValue.channels = result; isChanged() })} />
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
<style lang="scss">
|
||||
.header {
|
||||
position: relative;
|
||||
padding: 1.5rem 1.5rem 0;
|
||||
width: 45rem;
|
||||
min-height: 12.5rem;
|
||||
height: 12.5rem;
|
||||
background-image: url(../../img/bg-pink-mixed.jpg);
|
||||
background-repeat: no-repeat;
|
||||
background-clip: border-box;
|
||||
background-size: cover;
|
||||
border-radius: 1.25rem;
|
||||
|
||||
&.dragover {
|
||||
border: 1px solid red;
|
||||
}
|
||||
|
||||
.main-content {
|
||||
.avatar {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-right: 1.25rem;
|
||||
width: 6rem;
|
||||
height: 6rem;
|
||||
border-radius: 50%;
|
||||
background-color: rgba(255, 255, 255, .2);
|
||||
backdrop-filter: blur(3px);
|
||||
box-shadow: 0 1.5rem 3rem rgba(0, 0, 0, .3);
|
||||
cursor: pointer;
|
||||
}
|
||||
.name {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-size: 1.25rem;
|
||||
font-weight: 500;
|
||||
color: #fff;
|
||||
input {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: none;
|
||||
&::placeholder { color: var(--theme-content-dark-color); }
|
||||
}
|
||||
}
|
||||
.title {
|
||||
margin-top: .5rem;
|
||||
font-size: .75rem;
|
||||
font-weight: 500;
|
||||
color: rgba(255, 255, 255, .6);
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,51 +0,0 @@
|
||||
<!--
|
||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
||||
//
|
||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
||||
// you may not use this file except in compliance with the License. You may
|
||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
||||
//
|
||||
// Unless required by applicable law or agreed to in writing, software
|
||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
//
|
||||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
-->
|
||||
|
||||
<script lang="ts">
|
||||
import type { IntlString, Asset } from '@anticrm/platform'
|
||||
import type { AnySvelteComponent } from '@anticrm/ui'
|
||||
import { Icon, Label } from '@anticrm/ui'
|
||||
|
||||
export let icon: Asset | AnySvelteComponent
|
||||
export let label: IntlString
|
||||
|
||||
</script>
|
||||
|
||||
<div class="label-container">
|
||||
<div class="icon">
|
||||
{#if typeof (icon) === 'string'}
|
||||
<Icon {icon} size={'large'}/>
|
||||
{:else}
|
||||
<svelte:component this={icon} size={'large'} />
|
||||
{/if}
|
||||
</div>
|
||||
<Label {label} />
|
||||
</div>
|
||||
|
||||
<style lang="scss">
|
||||
.label-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-weight: 500;
|
||||
font-size: 16px;
|
||||
color: var(--theme-caption-color);
|
||||
|
||||
.icon {
|
||||
margin-right: .5em;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,56 +0,0 @@
|
||||
<!--
|
||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
||||
// Copyright © 2021 Hardcore Engineering Inc.
|
||||
//
|
||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
||||
// you may not use this file except in compliance with the License. You may
|
||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
||||
//
|
||||
// Unless required by applicable law or agreed to in writing, software
|
||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
//
|
||||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
-->
|
||||
|
||||
<script lang="ts">
|
||||
import type { IntlString, Asset } from '@anticrm/platform'
|
||||
import type { AnySvelteComponent } from '@anticrm/ui'
|
||||
import { Label, Icon } from '@anticrm/ui'
|
||||
|
||||
export let label: IntlString
|
||||
export let icon: Asset | AnySvelteComponent
|
||||
</script>
|
||||
|
||||
<div class="flex-row-center container">
|
||||
<Icon {icon} size='small'/>
|
||||
<span><Label {label} /></span>
|
||||
</div>
|
||||
|
||||
<style lang="scss">
|
||||
.container {
|
||||
padding: .5rem .75rem;
|
||||
color: #fff;
|
||||
background-color: rgba(255, 255, 255, .17);
|
||||
border: 1px solid rgba(255, 255, 255, .14);
|
||||
border-radius: .5rem;
|
||||
backdrop-filter: blur(3px);
|
||||
cursor: pointer;
|
||||
|
||||
span {
|
||||
margin-left: 0.376rem;
|
||||
font-weight: 500;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: rgba(255, 255, 255, .22);
|
||||
border-color: rgba(255, 255, 255, .19);
|
||||
box-shadow: 0 0 1rem rgba(0, 0, 0, .3);
|
||||
}
|
||||
&:active {
|
||||
box-shadow: 0 0 1rem rgba(0, 0, 0, .1);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,169 +0,0 @@
|
||||
<!--
|
||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
||||
//
|
||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
||||
// you may not use this file except in compliance with the License. You may
|
||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
||||
//
|
||||
// Unless required by applicable law or agreed to in writing, software
|
||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
//
|
||||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
-->
|
||||
|
||||
<script lang="ts">
|
||||
import { UserInfo, Avatar } from '@anticrm/presentation'
|
||||
import { showPopup, Label, IconThread, IconAttachment } from '@anticrm/ui'
|
||||
import type { WithLookup } from '@anticrm/core'
|
||||
import type { Applicant } from '@anticrm/recruit'
|
||||
|
||||
import EditCandidate from './EditCandidate.svelte'
|
||||
import EditApplication from './EditApplication.svelte'
|
||||
|
||||
import { AttachmentsPresenter } from '@anticrm/chunter-resources'
|
||||
import { formatName } from '@anticrm/contact'
|
||||
|
||||
export let object: WithLookup<Applicant>
|
||||
export let draggable: boolean
|
||||
|
||||
function showCandidate() {
|
||||
showPopup(EditCandidate, { _id: object.candidate }, 'full')
|
||||
}
|
||||
|
||||
function showApplication() {
|
||||
showPopup(EditApplication, { _id: object._id }, 'full')
|
||||
}
|
||||
</script>
|
||||
|
||||
<div class="card-container" {draggable} class:draggable on:dragstart on:dragend>
|
||||
<div class="card-bg" />
|
||||
<div class="content">
|
||||
<div class="flex-center">
|
||||
<div class="avatar">
|
||||
<Avatar size={'large'} />
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex-col">
|
||||
<div class="name" on:click={showCandidate}>{formatName(object.$lookup?.candidate?.name)}</div>
|
||||
<div class="city">{object.$lookup?.candidate?.city ?? ''}</div>
|
||||
<div class="tags">
|
||||
<div class="tag" on:click={showApplication}><Label label={'Application'} /></div>
|
||||
<!-- <div class="tag"><Label label={'Resume'} /></div> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer">
|
||||
<Avatar size={'small'} />
|
||||
<div class="flex-row-center">
|
||||
<div class="flex-row-center caption-color tool">
|
||||
<!-- <span class="icon"><IconAttachment size={'small'} /></span>
|
||||
4 -->
|
||||
<AttachmentsPresenter value={object} />
|
||||
</div>
|
||||
<div class="flex-row-center caption-color tool">
|
||||
<span class="icon"><IconThread size={'small'} /></span>
|
||||
5
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style lang="scss">
|
||||
@import '../node_modules/@anticrm/theme/styles/mixins.scss';
|
||||
|
||||
.card-container {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: stretch;
|
||||
border-radius: .75rem;
|
||||
overflow: hidden;
|
||||
user-select: none;
|
||||
backdrop-filter: blur(30px);
|
||||
|
||||
.content {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 1.25rem;
|
||||
|
||||
.avatar {
|
||||
position: relative;
|
||||
margin-right: 1rem;
|
||||
width: 5rem;
|
||||
height: 5rem;
|
||||
border-radius: 50%;
|
||||
|
||||
&::after {
|
||||
content: '';
|
||||
@include bg-layer(transparent, .1);
|
||||
border: 2px solid #fff;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
.name {
|
||||
margin: .25rem 0;
|
||||
font-weight: 500;
|
||||
font-size: 1rem;
|
||||
color: var(--theme-caption-color);
|
||||
cursor: pointer;
|
||||
&:hover { text-decoration: underline; }
|
||||
}
|
||||
.city {
|
||||
font-weight: 500;
|
||||
font-size: .75rem;
|
||||
}
|
||||
.tags {
|
||||
display: flex;
|
||||
margin-top: .5rem;
|
||||
|
||||
.tag {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: .375rem .5rem;
|
||||
font-weight: 500;
|
||||
font-size: .625rem;
|
||||
text-align: center;
|
||||
color: var(--theme-caption-color);
|
||||
cursor: pointer;
|
||||
|
||||
&::after {
|
||||
content: '';
|
||||
@include bg-layer(#fff, .04);
|
||||
border-radius: .5rem;
|
||||
}
|
||||
}
|
||||
.tag + .tag { margin-left: .5rem; }
|
||||
}
|
||||
}
|
||||
.footer {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: .75rem 1.25rem;
|
||||
width: 100%;
|
||||
min-height: 3rem;
|
||||
&::after {
|
||||
content: '';
|
||||
@include bg-layer(#fff, .04);
|
||||
z-index: -1;
|
||||
}
|
||||
.tool .icon {
|
||||
margin-right: .25rem;
|
||||
opacity: .4;
|
||||
}
|
||||
.tool + .tool { margin-left: .75rem; }
|
||||
}
|
||||
.card-bg {
|
||||
@include bg-layer(var(--theme-card-bg), .06);
|
||||
z-index: -1;
|
||||
}
|
||||
&.draggable { cursor: grab; }
|
||||
}
|
||||
|
||||
:global(.card-container + .card-container) { margin-top: .75rem; }
|
||||
</style>
|
||||
@ -1,47 +0,0 @@
|
||||
<!--
|
||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
||||
//
|
||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
||||
// you may not use this file except in compliance with the License. You may
|
||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
||||
//
|
||||
// Unless required by applicable law or agreed to in writing, software
|
||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
//
|
||||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
-->
|
||||
|
||||
<script lang="ts">
|
||||
import type { IntlString } from '@anticrm/platform'
|
||||
import { Label } from '@anticrm/ui'
|
||||
|
||||
enum StatusColors {
|
||||
TURQUOISE = '#79C4CE',
|
||||
PURPLE = '#9D92C4',
|
||||
STINKYBLUE = '#72A6CC',
|
||||
GREEN = '#69B46D',
|
||||
ORANGE = '#C97661'
|
||||
}
|
||||
|
||||
export let label: IntlString
|
||||
export let color: string = StatusColors.TURQUOISE
|
||||
|
||||
</script>
|
||||
|
||||
<div class="label-container" style="background-color: {color}">
|
||||
<Label {label} />
|
||||
</div>
|
||||
|
||||
<style lang="scss">
|
||||
.label-container {
|
||||
padding: 4px 8px;
|
||||
font-weight: 500;
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
border: 1px solid var(--theme-bg-accent-hover);
|
||||
border-radius: .5rem;
|
||||
}
|
||||
</style>
|
||||
@ -1,54 +0,0 @@
|
||||
<!--
|
||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
||||
//
|
||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
||||
// you may not use this file except in compliance with the License. You may
|
||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
||||
//
|
||||
// Unless required by applicable law or agreed to in writing, software
|
||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
//
|
||||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
-->
|
||||
|
||||
<script lang="ts">
|
||||
import type { IntlString, Asset } from '@anticrm/platform'
|
||||
import type { AnySvelteComponent } from '@anticrm/ui'
|
||||
import { Icon, Label } from '@anticrm/ui'
|
||||
|
||||
export let icon: Asset | AnySvelteComponent
|
||||
export let label: IntlString
|
||||
|
||||
</script>
|
||||
|
||||
<div class="tag-container">
|
||||
<div class="icon">
|
||||
{#if typeof (icon) === 'string'}
|
||||
<Icon {icon} size={'small'}/>
|
||||
{:else}
|
||||
<svelte:component this={icon} size={'small'} />
|
||||
{/if}
|
||||
</div>
|
||||
<Label {label} />
|
||||
</div>
|
||||
|
||||
<style lang="scss">
|
||||
.tag-container {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 6px 10px;
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
background-color: var(--theme-bg-accent-color);
|
||||
color: var(--theme-caption-color);
|
||||
border-radius: .5rem;
|
||||
|
||||
.icon {
|
||||
margin-right: .3em;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -1,66 +0,0 @@
|
||||
<!--
|
||||
// Copyright © 2020, 2021 Anticrm Platform Contributors.
|
||||
//
|
||||
// Licensed under the Eclipse Public License, Version 2.0 (the "License");
|
||||
// you may not use this file except in compliance with the License. You may
|
||||
// obtain a copy of the License at https://www.eclipse.org/legal/epl-2.0
|
||||
//
|
||||
// Unless required by applicable law or agreed to in writing, software
|
||||
// distributed under the License is distributed on an "AS IS" BASIS,
|
||||
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
//
|
||||
// See the License for the specific language governing permissions and
|
||||
// limitations under the License.
|
||||
-->
|
||||
|
||||
<script lang="ts">
|
||||
import type { IntlString } from '@anticrm/platform'
|
||||
import { Label } from '@anticrm/ui'
|
||||
import { IconAdd } from '@anticrm/ui'
|
||||
|
||||
export let label: IntlString
|
||||
</script>
|
||||
|
||||
<div class="panel-container step-lr75">
|
||||
<div class="circle">
|
||||
<div class="icon">
|
||||
<IconAdd size={'large'} />
|
||||
</div>
|
||||
</div>
|
||||
<Label {label} />
|
||||
</div>
|
||||
|
||||
<style lang="scss">
|
||||
.panel-container {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 20rem;
|
||||
height: 100%;
|
||||
padding: .75rem;
|
||||
color: var(--theme-caption-color);
|
||||
background-color: var(--theme-bg-color);
|
||||
border: 1px dotted var(--theme-bg-accent-color);
|
||||
border-radius: .75rem;
|
||||
cursor: pointer;
|
||||
|
||||
.circle {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-bottom: 1.25rem;
|
||||
width: 5rem;
|
||||
height: 5rem;
|
||||
background-color: var(--theme-bg-accent-color);
|
||||
border-radius: 50%;
|
||||
|
||||
.icon { opacity: .6; }
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: var(--theme-bg-accent-color);
|
||||
.circle .icon { opacity: 1; }
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue
Block a user