-
+ |
<:label>
{{t
@@ -85,47 +85,47 @@
+
-
+
- {{#if this.showStickyBar}}
-
+ {{#if this.showStickyBar}}
+
-
+
-
-
- {{t "common.actions.cancel"}}
-
-
- Inscrire
-
-
+
+
+ {{t "common.actions.cancel"}}
+
+
+ Inscrire
+
- {{/if}}
-
+
+ {{/if}}
{{/if}}
\ No newline at end of file
diff --git a/certif/app/components/layout/banners.gjs b/certif/app/components/layout/banners.gjs
index f683d32d27b..9a5f55a4941 100644
--- a/certif/app/components/layout/banners.gjs
+++ b/certif/app/components/layout/banners.gjs
@@ -42,6 +42,7 @@ export default class Banners extends Component {
@actionLabel={{t 'pages.sco.banner.url-label'}}
@actionUrl={{ACTION_URL_FOR_INFORMATION_BANNER}}
@canCloseBanner='true'
+ class='banners'
>
{{t 'pages.sco.banner.information'}}
@@ -52,6 +53,7 @@ export default class Banners extends Component {
@type='information'
@canCloseBanner='true'
@onCloseBannerTriggerAction={{this.closeLocaleNotSupportedBanner}}
+ class='banners'
>
{{t 'banners.language-availability.message'}}
diff --git a/certif/app/components/members-list.hbs b/certif/app/components/members-list.hbs
index 1ee484c67e3..ff7e4a36b3f 100644
--- a/certif/app/components/members-list.hbs
+++ b/certif/app/components/members-list.hbs
@@ -1,6 +1,6 @@
-
+
diff --git a/certif/app/components/sessions/session-details/enrolled-candidates/index.gjs b/certif/app/components/sessions/session-details/enrolled-candidates/index.gjs
index 33a55d7425e..287a6d36935 100644
--- a/certif/app/components/sessions/session-details/enrolled-candidates/index.gjs
+++ b/certif/app/components/sessions/session-details/enrolled-candidates/index.gjs
@@ -347,7 +347,7 @@ export default class EnrolledCandidates extends Component {
{{/if}}
-
+
{{#if (or @certificationCandidates this.candidatesInStaging)}}
diff --git a/certif/app/components/sessions/session-list.gjs b/certif/app/components/sessions/session-list.gjs
index 210be8e4aa8..0688f1e83b4 100644
--- a/certif/app/components/sessions/session-list.gjs
+++ b/certif/app/components/sessions/session-list.gjs
@@ -1,3 +1,4 @@
+import PixBlock from '@1024pix/pix-ui/components/pix-block';
import PixPagination from '@1024pix/pix-ui/components/pix-pagination';
import { action } from '@ember/object';
import { service } from '@ember/service';
@@ -78,65 +79,63 @@ export default class SessionList extends Component {
}
-
-
-
-
-
-
-
- {{t 'common.forms.session-labels.session-number'}}
- |
-
- {{t 'common.forms.session-labels.center-name'}}
- |
-
- {{t 'common.forms.session-labels.room'}}
- |
-
- {{t 'common.forms.session-labels.date'}}
- |
-
- {{t 'common.forms.session-labels.time'}}
- |
-
- {{t 'common.forms.session-labels.invigilator'}}
- |
-
- {{t 'pages.sessions.list.table.header.enrolled-candidates'}}
- |
-
- {{t 'pages.sessions.list.table.header.effective-candidates'}}
- |
-
- {{t 'common.forms.session-labels.status'}}
- |
-
-
- {{t 'pages.sessions.list.table.header.actions'}}
-
- |
-
-
+
+
+
+
+
+
+ {{t 'common.forms.session-labels.session-number'}}
+ |
+
+ {{t 'common.forms.session-labels.center-name'}}
+ |
+
+ {{t 'common.forms.session-labels.room'}}
+ |
+
+ {{t 'common.forms.session-labels.date'}}
+ |
+
+ {{t 'common.forms.session-labels.time'}}
+ |
+
+ {{t 'common.forms.session-labels.invigilator'}}
+ |
+
+ {{t 'pages.sessions.list.table.header.enrolled-candidates'}}
+ |
+
+ {{t 'pages.sessions.list.table.header.effective-candidates'}}
+ |
+
+ {{t 'common.forms.session-labels.status'}}
+ |
+
+
+ {{t 'pages.sessions.list.table.header.actions'}}
+
+ |
+
+
-
- {{#each @sessionSummaries as |sessionSummary|}}
-
- {{/each}}
-
-
- {{#if (eq @sessionSummaries.length 0)}}
-
- {{t 'pages.sessions.list.table.empty'}}
-
- {{/if}}
-
+
+ {{#each @sessionSummaries as |sessionSummary|}}
+
+ {{/each}}
+
+
+ {{#if (eq @sessionSummaries.length 0)}}
+
+ {{t 'pages.sessions.list.table.empty'}}
+
+ {{/if}}
-
+
diff --git a/certif/app/components/team/invitations-list.hbs b/certif/app/components/team/invitations-list.hbs
index 95b1c8306cc..630209ba37b 100644
--- a/certif/app/components/team/invitations-list.hbs
+++ b/certif/app/components/team/invitations-list.hbs
@@ -1,4 +1,4 @@
-
+
diff --git a/certif/app/styles/app.scss b/certif/app/styles/app.scss
index 40ee95b62cb..25b98aebb35 100644
--- a/certif/app/styles/app.scss
+++ b/certif/app/styles/app.scss
@@ -36,6 +36,7 @@ $navbar-height: 60px;
@import 'components/issue-report-modal';
@import 'components/layout/footer';
@import 'components/layout/sidebar';
+@import 'components/layout/banners';
@import 'components/login-form';
@import 'components/login-or-register';
@import 'components/finalize';
@@ -84,3 +85,9 @@ input:invalid {
* {
box-sizing: border-box;
}
+
+@include device-is('mobile') {
+ .hide-on-mobile {
+ display: none;
+ }
+}
diff --git a/certif/app/styles/components/add-student-list.scss b/certif/app/styles/components/add-student-list.scss
index 575728b1284..03f8b0414ee 100644
--- a/certif/app/styles/components/add-student-list.scss
+++ b/certif/app/styles/components/add-student-list.scss
@@ -1,40 +1,21 @@
.add-student-list {
- position: relative;
- font-size: 0.875rem;
- box-shadow: 0 1px 1px 0 rgb(12 22 58 / 10%), 0 2px 5px 0 rgb(0 0 0 / 10%);
+ margin-top: var(--pix-spacing-6x);
+
+ @extend %pix-body-s;
&__filters {
- padding: 18px 24px;
- color: var(--pix-neutral-500);
+ display: flex;
+ gap: var(--pix-spacing-2x);
+ align-items: center;
+ padding: var(--pix-spacing-4x) var(--pix-spacing-6x);
background-color: var(--pix-neutral-0);
-
- label {
- margin-right: 16px;
- }
-
- .pix-multi-select {
- width: auto;
- min-width: 200px;
-
- &__list-button {
- display: flex;
- color: var(--pix-neutral-500);
- }
- }
}
thead tr {
- background: var(--pix-neutral-20);
- border-bottom: 4px solid var(--pix-neutral-20);
- border-radius: 4px;
- outline: 4px solid var(--pix-neutral-0);
- outline-offset: -4px;
+ background: var(--pix-certif-50);
}
tr.add-student-list__row--disabled {
- border-top-color: var(--pix-neutral-20);
- border-bottom: 2px solid var(--pix-neutral-20);
-
&:hover {
background: var(--pix-neutral-20);
cursor: default;
@@ -42,28 +23,13 @@
}
&__row {
- color: var(--pix-neutral-500);
- background-color: var(--pix-neutral-0);
-
&:hover {
cursor: pointer;
}
&--disabled {
+ color: var(--pix-neutral-500);
background: var(--pix-neutral-20);
- border-top: 1px solid var(--pix-neutral-20);
- border-bottom: 1px solid var(--pix-neutral-20);
-
- .add-student-list__column-checkbox .checkbox {
- background-color: var(--pix-neutral-500);
- border-color: var(--pix-neutral-500);
- pointer-events: none;
-
- &:hover {
- box-shadow: none;
- cursor: initial;
- }
- }
}
}
@@ -73,7 +39,6 @@
text-align: left;
}
- &__column-checkbox { width: 30px; }
&__column-birthdate { width: 60%; }
&__checker {
@@ -84,19 +49,19 @@
position: fixed;
bottom: 0;
left: 0;
+ z-index: 1;
display: flex;
align-items: center;
justify-content: space-between;
width: 100vw;
- height: 68px;
- color: var(--pix-neutral-500);
+ padding: var(--pix-spacing-4x) var(--pix-spacing-6x);
background-color: var(--pix-neutral-0);
box-shadow: -2px 2px 9px 0 rgb(0 0 0 / 22%);
- .bottom-action-bar__informations {
+ .bottom-action-bar__information {
display: flex;
align-items: baseline;
- margin-left: calc(250px + 35px);
+ margin-left: calc(250px + 15px);
&--candidates-selected {
font-size: 1.125rem;
@@ -106,7 +71,7 @@
font-size: 0.875rem;
}
- .bottom-action-bar__seperator {
+ .bottom-action-bar__separator {
align-self: center;
width: 1px;
height: 30px;
@@ -117,15 +82,7 @@
.bottom-action-bar__actions {
display: flex;
- padding: 0 24px;
-
- .pix-button {
- margin: 0 8px;
- }
+ gap: var(--pix-spacing-4x);
}
}
-
- footer {
- padding: 18px 24px;
- }
}
diff --git a/certif/app/styles/components/layout/banners.scss b/certif/app/styles/components/layout/banners.scss
new file mode 100644
index 00000000000..6c9026dda11
--- /dev/null
+++ b/certif/app/styles/components/layout/banners.scss
@@ -0,0 +1,3 @@
+.banners {
+ margin-bottom: var(--pix-spacing-6x);
+}
diff --git a/certif/app/styles/components/layout/footer.scss b/certif/app/styles/components/layout/footer.scss
index 5459187cc2f..57e37e14b44 100644
--- a/certif/app/styles/components/layout/footer.scss
+++ b/certif/app/styles/components/layout/footer.scss
@@ -1,13 +1,14 @@
.footer {
display: flex;
- flex-direction: column;
+ flex-direction: row;
align-items: center;
justify-content: space-between;
flex-shrink: 0;
margin: 0 var(--pix-spacing-1x);
- @include device-is('desktop') {
- flex-direction: row;
+ @include device-is('mobile') {
+ flex-direction: column;
+ margin-top: var(--pix-spacing-6x);
}
&__navigation {
@@ -21,8 +22,13 @@
&-list {
list-style: none;
display: flex;
+ flex-direction: column;
padding: 0;
+ @include device-is('tablet') {
+ flex-direction: row;
+ }
+
li {
align-self: center;
display: inline;
diff --git a/certif/app/styles/globals/tables.scss b/certif/app/styles/globals/tables.scss
index 550626d9cda..38af613d7ba 100644
--- a/certif/app/styles/globals/tables.scss
+++ b/certif/app/styles/globals/tables.scss
@@ -1,36 +1,18 @@
.table {
+ width: 100%;
+ padding: var(--pix-spacing-2x);
+ overflow: auto;
- table {
- box-sizing: border-box;
- width: 100%;
- table-layout: fixed;
- border-collapse: collapse;
- border-spacing: 0;
- }
-
- thead {
- color: var(--pix-neutral-800);
- }
+ @extend %pix-body-s;
- tr {
- height: 60px;
- border-top: 2px solid var(--pix-neutral-20);
+ @include device-is('tablet') {
+ overflow: initial;
}
- td,
- th {
- padding-right: 5px;
- padding-left: 5px;
- text-align: left;
- word-wrap: break-word;
-
- &:last-child {
- padding-right: 30px;
- }
-
- &:first-child {
- padding-left: 30px;
- }
+ &--with-row-clickable tbody tr:hover,
+ &--with-row-clickable tbody tr:focus,
+ &--with-row-clickable tbody tr:active {
+ cursor: pointer;
}
&__column {
@@ -38,37 +20,63 @@
&--small {
width: 10%;
+
+ th {
+ text-align: start;
+ }
}
&--medium {
width: 12%;
+
+ td, th {
+ padding: var(--pix-spacing-2x);
+ }
}
&--wide {
width: 25%;
+
+ td, th {
+ padding: var(--pix-spacing-4x) var(--pix-spacing-2x);
+ }
+ }
+
+ &--checkbox {
+ width: 5%;
}
}
- tbody {
- color: var(--pix-neutral-500);
+ table {
+ min-width: 100%;
+ border-collapse: collapse;
- tr:hover,
- tr:focus,
- tr:focus-within,
- tr:active {
- color: var(--pix-neutral-800);
- background-color: var(--pix-neutral-20);
- transition: 0.25s ease;
+ th, td {
+ padding: var(--pix-spacing-4x) var(--pix-spacing-2x);
+ text-align: start;
}
- tr:hover .checkbox--unchecked {
- border-color: var(--pix-neutral-500);
+ tr > td:first-child, tr > th:first-child {
+ padding-left: var(--pix-spacing-4x);
}
- }
- &--with-row-clickable tbody tr:hover,
- &--with-row-clickable tbody tr:focus,
- &--with-row-clickable tbody tr:active {
- cursor: pointer;
+ tbody {
+ tr:hover,
+ tr:focus,
+ tr:focus-within,
+ tr:active {
+ background-color: var(--pix-neutral-20);
+ }
+
+ tr:first-child {
+ border-top: 2px solid var(--pix-neutral-20);
+ }
+
+ tr:not(:last-child) {
+ border-bottom: 2px solid var(--pix-neutral-20);
+ }
+ }
}
}
+
+
diff --git a/certif/app/styles/globals/texts.scss b/certif/app/styles/globals/texts.scss
index a7a4c1dbafb..48d95afdfc3 100644
--- a/certif/app/styles/globals/texts.scss
+++ b/certif/app/styles/globals/texts.scss
@@ -55,6 +55,6 @@
.previous-button {
width: fit-content;
- color: var(--pix-neutral-500);
- font-size: 0.875rem;
+
+ @extend %pix-body-s;
}
diff --git a/certif/app/styles/pages/authenticated.scss b/certif/app/styles/pages/authenticated.scss
index f35012f9468..4d5ec40fb80 100644
--- a/certif/app/styles/pages/authenticated.scss
+++ b/certif/app/styles/pages/authenticated.scss
@@ -3,3 +3,7 @@
flex-direction: column;
justify-content: space-between;
}
+
+.authenticated-layout {
+ min-height: 100vh;
+}
diff --git a/certif/app/styles/pages/authenticated/sessions/add-student.scss b/certif/app/styles/pages/authenticated/sessions/add-student.scss
index 3e7336c3e07..8b7e7a22b24 100644
--- a/certif/app/styles/pages/authenticated/sessions/add-student.scss
+++ b/certif/app/styles/pages/authenticated/sessions/add-student.scss
@@ -1,8 +1,5 @@
.add-student {
- margin-bottom: 68px;
-
- &__info-message {
- align-items: center;
- display: flex;
+ footer {
+ padding: var(--pix-spacing-4x) var(--pix-spacing-6x);
}
}
diff --git a/certif/app/styles/pages/authenticated/sessions/list-items.scss b/certif/app/styles/pages/authenticated/sessions/list-items.scss
index f994155707d..51de603ba95 100644
--- a/certif/app/styles/pages/authenticated/sessions/list-items.scss
+++ b/certif/app/styles/pages/authenticated/sessions/list-items.scss
@@ -4,29 +4,31 @@
width: 100%;
footer {
- padding: 18px 24px;
+ padding: var(--pix-spacing-4x) var(--pix-spacing-6x);
}
}
.session-list {
-
&__header {
display: flex;
+ flex-direction: column;
justify-content: space-between;
- align-items: center;
- }
+ margin-bottom: var(--pix-spacing-3x);
- &-content__update-button {
- padding: 6px;
+ @include device-is('tablet') {
+ align-items: center;
+ flex-direction: row;
+ margin-bottom: 0;
+ }
}
}
.session-list-header__actions {
display: flex;
+ flex-direction: column;
gap: var(--pix-spacing-2x);
-}
-.new-session-icon {
- font-weight: 900;
- margin-left: 4px;
+ @include device-is('tablet') {
+ flex-direction: row;
+ }
}
diff --git a/certif/app/templates/authenticated.hbs b/certif/app/templates/authenticated.hbs
index d7b505f0613..a7291be4548 100644
--- a/certif/app/templates/authenticated.hbs
+++ b/certif/app/templates/authenticated.hbs
@@ -1,10 +1,10 @@
-
-
-
+
+
+
{{outlet}}
diff --git a/certif/app/templates/authenticated/sessions/import.hbs b/certif/app/templates/authenticated/sessions/import.hbs
index c401884ff88..552f3241511 100644
--- a/certif/app/templates/authenticated/sessions/import.hbs
+++ b/certif/app/templates/authenticated/sessions/import.hbs
@@ -1,7 +1,7 @@
{{! template-lint-disable link-href-attributes }}
{{page-title (t "pages.sessions.import.title")}}
-
+
{{t "pages.sessions.actions.return"}}
{{t "pages.sessions.import.title"}}
|