studio-variable/designtopack
3
0
Fork 0
Code Issues 7 Pull requests Projects Releases Packages Wiki Activity Actions

#144

Browse source
This commit is contained in:
isUnknown 2025-04-04 14:58:49 +02:00
parent 806bc993da
commit c29906f306
5 changed files with 77 additions and 54 deletions
Download patch file Download diff file Expand all files Collapse all files

1
public/site/blueprints/pages/project.yml
View file

@ -51,6 +51,7 @@ tabs:
label: Étapes
type: pages
sortBy: stepIndex asc
create: false
templates:
- client-brief
- proposal

2
public/site/plugins/helpers/index.php
View file

@ -48,7 +48,7 @@ function getGlobalEvaluation($numberedGrade) {
[2, 4, "D", $DTLGrades->findBy("letter", "D")->mention()->value(), $DTLGrades->findBy("letter", "D")->comment()->value()],
[4, 6, "C", $DTLGrades->findBy("letter", "C")->mention()->value(), $DTLGrades->findBy("letter", "C")->comment()->value()],
[6, 8, "B", $DTLGrades->findBy("letter", "B")->mention()->value(), $DTLGrades->findBy("letter", "B")->comment()->value()],
[8, 10, "A", $DTLGrades->findBy("letter", "A")->mention()->value(), $DTLGrades->findBy("letter", "A")->comment()->value()],
[8, 11, "A", $DTLGrades->findBy("letter", "A")->mention()->value(), $DTLGrades->findBy("letter", "A")->comment()->value()],
];
foreach ($gradeMapping as [$min, $max, $letter, $mention, $comment]) {

63
src/assets/css/src/2.blocks.dialog.css
View file

@ -26,7 +26,8 @@
}
/* Header */
.dialog [data-pc-section="header"] {
.dialog [data-pc-section='header'] {
height: var(--dialog-header-h);
padding: 1rem;
color: var(--color-white);
@ -34,7 +35,14 @@
display: flex;
gap: var(--space-16);
}
.dialog:not(#physical-sample) [data-pc-section="header"] h2 {
@media screen and (max-width: 96rem) {
.dialog#virtual-sample.with-dtl [data-pc-section='header'] h2 {
text-align: left;
left: 27.5rem;
right: 9.5rem;
}
}
.dialog:not(#physical-sample) [data-pc-section='header'] h2 {
font-family: var(--font-serif);
position: absolute;
left: 15rem;
@ -47,7 +55,7 @@
text-overflow: ellipsis;
margin: 0 auto;
}
.dialog [data-pc-name="pcclosebutton"] {
.dialog [data-pc-name='pcclosebutton'] {
color: var(--color-white);
}
.dialog__tabs {
@ -66,7 +74,7 @@
.dialog__tabs .btn:hover {
--btn-background: var(--color-white-10);
}
.dialog__tabs .btn[aria-pressed="true"] {
.dialog__tabs .btn[aria-pressed='true'] {
--btn-background: var(--color-white);
--btn-color: var(--color-text);
--btn-border-color: var(--color-white);
@ -100,17 +108,21 @@
overflow-x: auto;
padding: var(--space-8) 1.5rem var(--space-8) var(--space-8);
margin: calc(-1 * var(--space-8));
-webkit-mask-image: linear-gradient(to left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 3rem);
mask-image: linear-gradient(to left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 3rem);
-webkit-mask-image: linear-gradient(
to left,
rgba(0, 0, 0, 0),
rgba(0, 0, 0, 1) 3rem
);
mask-image: linear-gradient(to left, rgba(0, 0, 0, 0), rgba(0, 0, 0, 1) 3rem);
}
/* Windows fix */
[data-browser*="Windows"] .dialog__inner .tracks {
[data-browser*='Windows'] .dialog__inner .tracks {
transform: translateY(0.46875rem); /* 7.5px */
}
.dialog__inner .tracks > *:last-child {
margin-right: 1rem;
}
.dialog [data-pc-section="content"] [role="tablist"] {
.dialog [data-pc-section='content'] [role='tablist'] {
height: 3.5rem;
width: 100%;
display: flex;
@ -120,7 +132,7 @@
border-bottom: 1px solid var(--color-grey-700);
padding-top: 7px;
}
.dialog [data-pc-section="content"] [role="tab"] {
.dialog [data-pc-section='content'] [role='tab'] {
--tab-h: 3rem;
--tab-min-w: none;
--tab-py: var(--space-8);
@ -144,14 +156,14 @@
height: var(--tab-h);
border-bottom: var(--tab-border-w) solid var(--tab-border-color);
}
.dialog [data-pc-section="content"] [role="tab"][aria-selected="true"] {
.dialog [data-pc-section='content'] [role='tab'][aria-selected='true'] {
--tab-border-color: var(--color-white);
--tab-color: var(--color-white);
}
.dialog [data-pc-section="content"] [role="tab"]:focus-visible {
.dialog [data-pc-section='content'] [role='tab']:focus-visible {
z-index: 20;
}
.dialog [data-pc-section="content"] [role="tab"] .label {
.dialog [data-pc-section='content'] [role='tab'] .label {
flex-grow: 1;
font-weight: 500;
letter-spacing: 0.01em;
@ -159,7 +171,7 @@
}
/* Footer */
.dialog [data-pc-section="footer"] {
.dialog [data-pc-section='footer'] {
display: flex;
gap: var(--space-16);
height: var(--dialog-footer-h);
@ -172,7 +184,7 @@
.dialog#virtual-sample {
--dialog-inner-background: #f7f7f7;
}
.dialog#virtual-sample [data-pc-section="header"] h2 {
.dialog#virtual-sample [data-pc-section='header'] h2 {
left: 22.5rem;
right: 22.5rem;
}
@ -185,14 +197,13 @@
.dialog#virtual-sample.static #comments-container {
top: 8rem;
}
.dialog#virtual-sample.static [data-pc-section="footer"] {
.dialog#virtual-sample.static [data-pc-section='footer'] {
display: none;
}
.dialog#virtual-sample.static .dialog__inner {
height: calc(100% - 3.5rem) !important;
}
/* Physical Sample */
.dialog#physical-sample {
--dialog-header-h: 15rem;
@ -200,7 +211,7 @@
padding: var(--space-32) var(--space-32) 0;
overflow-y: auto;
}
.dialog#physical-sample [data-pc-section="header"] {
.dialog#physical-sample [data-pc-section='header'] {
display: flex;
flex-direction: column;
text-align: center;
@ -220,7 +231,7 @@
background-size: cover;
border-radius: var(--rounded-xl);
}
.dialog#physical-sample [data-pc-name="pcclosebutton"] {
.dialog#physical-sample [data-pc-name='pcclosebutton'] {
top: var(--space-40);
right: var(--space-40);
}
@ -251,7 +262,7 @@
--dialog-max-h: 676px;
--dialog-header-h: 8rem;
}
#optimization-request-dialog [data-pc-section="header"] {
#optimization-request-dialog [data-pc-section='header'] {
flex-direction: column;
align-items: center;
gap: 0;
@ -262,8 +273,8 @@
color: var(--color-black);
margin-block: var(--space-16) !important;
}
#project-request-dialog [data-pc-name="pcclosebutton"],
#optimization-request-dialog [data-pc-name="pcclosebutton"] {
#project-request-dialog [data-pc-name='pcclosebutton'],
#optimization-request-dialog [data-pc-name='pcclosebutton'] {
display: none;
}
#project-request-dialog #project-dtl {
@ -274,7 +285,7 @@
border-color: var(--color-primary-20);
background-color: var(--color-primary-10);
}
#project-request-dialog #project-dtl input[type="checkbox"] {
#project-request-dialog #project-dtl input[type='checkbox'] {
width: 1.75rem;
height: 1.75rem;
border-radius: var(--rounded-md);
@ -286,8 +297,8 @@
background-position: center right 1rem;
background-repeat: no-repeat;
}
#project-request-dialog [data-icon="leaf"],
#optimization-request-dialog [data-icon="leaf"] {
#project-request-dialog [data-icon='leaf'],
#optimization-request-dialog [data-icon='leaf'] {
--column-gap: var(--space-4);
padding: 0.25rem var(--space-8) 0.375rem;
background: var(--color-dtl-15);
@ -296,7 +307,7 @@
line-height: 1;
font-weight: 500;
}
#project-request-dialog [data-icon="leaf"]::before,
#optimization-request-dialog [data-icon="leaf"]::before {
#project-request-dialog [data-icon='leaf']::before,
#optimization-request-dialog [data-icon='leaf']::before {
transform: translateY(0.125rem);
}

8
src/components/design-to-light/DTLPanel.vue
View file

@ -1,5 +1,6 @@
<template>
<aside
v-if="activeProposal"
id="dtl-panel"
class="text-sm bg-black rounded-2xl"
:class="{ 'with-dialog': isDialogOpen }"
@ -195,7 +196,7 @@ const { proposals } = defineProps({
});
const { page } = storeToRefs(usePageStore());
const { openedFile } = storeToRefs(useDialogStore());
const { openedFile, activeTracks } = storeToRefs(useDialogStore());
const isDialogOpen = computed(() => {
if (openedFile.value) {
@ -211,9 +212,8 @@ dayjs.locale('fr');
const emits = defineEmits(['close']);
proposals[0].isActive = true;
const activeProposal = ref(proposals[0]);
const activeProposal =
proposals.length === 1 ? computed(() => proposals[0]) : ref(proposals[0]);
window.addEventListener('keyup', closeOnEscape);
window.addEventListener('click', close);

57
src/components/project/virtual-sample/VirtualSample.vue
View file

@ -87,7 +87,7 @@
</Dialog>
<DTLPanel
v-if="correspondingDTLProposal"
:proposals="[correspondingDTLProposal]"
:proposals="correspondingDTLProposal"
/>
</template>
@ -147,30 +147,41 @@ const downloadText = computed(() => {
});
const correspondingDTLProposal = computed(() => {
const hasDTLProposal = page.value?.designToLight;
if (!hasDTLProposal || !isOpen.value || !openedFile.value) return false;
const correspondingDTLProposal = page.value.designToLight.find((proposal) => {
if (activeTab.value === 'dynamic') {
return (
proposal.location.type === 'dynamic' &&
activeTracks?.value?.some(
(activeTrack) => activeTrack.slug === proposal.location.trackSlug
)
);
} else {
return (
proposal.location.type === 'static' &&
openedFile.value?.source === proposal.location.source
);
}
});
if (!correspondingDTLProposal) return false;
return correspondingDTLProposal;
if (activeTracks.value?.length === 1) {
const matchingProposal = page.value.designToLight.find(
(proposal) => proposal.location.trackSlug === activeTracks.value[0].slug
);
return matchingProposal ? [matchingProposal] : false;
} else {
return false;
}
});
// const correspondingDTLProposal = computed(() => {
// const hasDTLProposal = page.value?.designToLight;
// if (!hasDTLProposal || !isOpen.value || !openedFile.value) return false;
// const correspondingDTLProposal = page.value.designToLight.find((proposal) => {
// if (activeTab.value === 'dynamic') {
// return (
// proposal.location.type === 'dynamic' &&
// activeTracks?.value?.some(
// (activeTrack) => activeTrack.slug === proposal.location.trackSlug
// )
// );
// } else {
// return (
// proposal.location.type === 'static' &&
// openedFile.value?.source === proposal.location.source
// );
// }
// });
// if (!correspondingDTLProposal) return false;
// return correspondingDTLProposal;
// });
// Functions
function downloadFiles() {
isDownloadTriggered.value = true;