-
Notifications
You must be signed in to change notification settings - Fork 53
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #285 from significa/sign-571-components-sections-s…
…cope feat: add Scope, Team, Estimates sections and "footer"components [SIGN-571, SIGN-572, SIGN-573, SIGN-575, SIGN-576, SIGN-577, SIGN-578]]
- Loading branch information
Showing
23 changed files
with
1,098 additions
and
85 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,41 @@ | ||
<script lang="ts"> | ||
import { Button } from '@significa/svelte-ui'; | ||
import { getImageAttributes } from '$lib/utils/cms'; | ||
import type { AssetStoryblok } from '$types/bloks'; | ||
export let linkHref: string | undefined; | ||
export let image: AssetStoryblok | undefined; | ||
export let label: string | undefined; | ||
export let name: string | undefined; | ||
export let project: string | undefined; | ||
export let linkText: string | undefined; | ||
</script> | ||
|
||
<div class="flex w-full flex-col-reverse items-center lg:flex-row"> | ||
<div class="mb-4 flex w-full items-center lg:mb-0"> | ||
{#if image?.filename} | ||
{@const { alt, src, width, height } = getImageAttributes(image, { | ||
size: [120, 0] | ||
})} | ||
<img class="mr-2 h-auto w-14 rounded-xs bg-background-offset" {src} {alt} {width} {height} /> | ||
{/if} | ||
<div class="ml-4 flex-col"> | ||
<p class="text-base font-semibold text-foreground-secondary"> | ||
{label} | ||
</p> | ||
<p class="text-base font-semibold">{name}</p> | ||
</div> | ||
</div> | ||
<div class="mb-4 w-full lg:mb-0"> | ||
<p class="text-3xl font-semibold">{project}</p> | ||
</div> | ||
</div> | ||
<div class="w-1/3"> | ||
{#if linkHref} | ||
<div class="flex-1 justify-end text-foreground-tertiary xl:flex"> | ||
<Button variant="secondary" arrow> | ||
{linkText} | ||
</Button> | ||
</div> | ||
{/if} | ||
</div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,21 @@ | ||
<script lang="ts"> | ||
import type { ClientLogoStoryblok } from '$types/bloks'; | ||
import { theme } from '$lib/stores/theme'; | ||
import { getImageAttributes } from '$lib/utils/cms'; | ||
export let clients: ClientLogoStoryblok[]; | ||
</script> | ||
|
||
<div class="flex flex-wrap justify-center gap-12 p-6"> | ||
{#each clients as client} | ||
{#if client.light_mode?.filename && $theme === 'light'} | ||
{@const { src, alt, width, height } = getImageAttributes(client.light_mode)} | ||
<img {src} {alt} {width} {height} class="h-auto max-h-9 w-auto object-contain" /> | ||
{/if} | ||
|
||
{#if client.dark_mode?.filename && $theme === 'dark'} | ||
{@const { src, alt, width, height } = getImageAttributes(client.dark_mode)} | ||
<img {src} {alt} {width} {height} class="h-auto max-h-9 w-auto object-contain" /> | ||
{/if} | ||
{/each} | ||
</div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,4 @@ | ||
export const formatter = new Intl.NumberFormat('pt-PT', { | ||
style: 'currency', | ||
currency: 'EUR' | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,44 @@ | ||
export function getColumnsWidthClassName( | ||
col: 'first' | 'central' | 'last' | 'sticky' | 'last-empty' | ||
) { | ||
switch (col) { | ||
case 'first': | ||
return 'lg:w-[calc(var(--container-margin)+var(--section-title-width)+theme(padding.container)+3rem)]'; | ||
case 'central': | ||
return 'lg:w-[--central-cols-width]'; | ||
case 'last': | ||
return 'lg:w-[calc(var(--container-margin)+var(--last-col-content-width)+theme(padding.container))]'; | ||
case 'sticky': | ||
return 'w-[--sticky-col-content-width]'; | ||
case 'last-empty': | ||
return 'lg:w-[calc(var(--container-margin)+theme(padding.container))]'; | ||
default: | ||
break; | ||
} | ||
} | ||
|
||
export function getContainersPaddingClassName(side: 'left' | 'right') { | ||
switch (side) { | ||
case 'left': | ||
return 'pl-[calc(theme(padding.container)+var(--container-margin))]'; | ||
case 'right': | ||
return 'pr-[calc(theme(padding.container)+var(--container-margin))]'; | ||
default: | ||
break; | ||
} | ||
} | ||
|
||
export function getHeaderCellTextClassName(side: 'left' | 'right') { | ||
switch (side) { | ||
case 'left': | ||
return 'text-xs uppercase tracking-wider text-foreground-secondary text-left'; | ||
case 'right': | ||
return 'text-xs uppercase tracking-wider text-foreground-secondary text-right'; | ||
default: | ||
break; | ||
} | ||
} | ||
|
||
export function getStickyColClassName() { | ||
return 'right-0 sticky md:relative bg-background md:bg-transparent drop-shadow-md md:drop-shadow-none'; | ||
} |
Oops, something went wrong.