diff --git a/src/main/frontend/main.css b/src/main/frontend/main.css index 703df8c..9314554 100644 --- a/src/main/frontend/main.css +++ b/src/main/frontend/main.css @@ -47,6 +47,7 @@ @apply hover:bg-primary-80; @apply active:bg-primary-60; @apply focus:bg-primary-100 focus:outline focus:outline-6 focus:outline-primary-40; + @apply text-white font-medium; padding: 13px 28px; gap: 10px; } @@ -54,4 +55,18 @@ width: 20px; height: 20px; } + + + + .classroom-card { + @apply rounded-xl bg-dark-3 flex flex-col items-stretch gap-4 p-2; + } + + .classroom-card-name { + @apply font-medium text-white bg-dark-1 rounded-xl p-8; + } + + .classroom-card .btn-primary { + @apply rounded-2xl; + } } diff --git a/src/main/frontend/tailwind.config.js b/src/main/frontend/tailwind.config.js index 1b0b697..b20d647 100644 --- a/src/main/frontend/tailwind.config.js +++ b/src/main/frontend/tailwind.config.js @@ -19,7 +19,7 @@ module.exports = { 180: "#D9DFFC", }, "dark": { - 1: "#111928", + 1: "#14171C", 2: "#121B26", 3: "#1F2A37", 4: "#374151", @@ -57,6 +57,7 @@ module.exports = { } }, spacing: { + '0': '0px', '1': '4px', '2': '8px', '4': '16px', @@ -68,6 +69,7 @@ module.exports = { '16': '64px', '18': '72px', '20': '80px', + '32': '8rem', } }, plugins: [ diff --git a/src/main/resources/public/icons/book.svg b/src/main/resources/public/icons/book.svg new file mode 100644 index 0000000..9a1ca4e --- /dev/null +++ b/src/main/resources/public/icons/book.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/src/main/resources/public/icons/certificate-alt.svg b/src/main/resources/public/icons/certificate-alt.svg new file mode 100644 index 0000000..3e08b07 --- /dev/null +++ b/src/main/resources/public/icons/certificate-alt.svg @@ -0,0 +1,8 @@ + + + + + + + + diff --git a/src/main/resources/public/icons/classroom.svg b/src/main/resources/public/icons/classroom.svg new file mode 100644 index 0000000..27e78f6 --- /dev/null +++ b/src/main/resources/public/icons/classroom.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/src/main/resources/public/icons/gitlab-icon.svg b/src/main/resources/public/icons/gitlab-icon.svg new file mode 100644 index 0000000..9878188 --- /dev/null +++ b/src/main/resources/public/icons/gitlab-icon.svg @@ -0,0 +1,4 @@ + + + \ No newline at end of file diff --git a/src/main/resources/public/icons/gitlab-logo-200.svg b/src/main/resources/public/icons/gitlab-logo-200.svg new file mode 100644 index 0000000..27a881b --- /dev/null +++ b/src/main/resources/public/icons/gitlab-logo-200.svg @@ -0,0 +1,57 @@ + + + + + + + + diff --git a/src/main/resources/public/icons/group.svg b/src/main/resources/public/icons/group.svg new file mode 100644 index 0000000..a4903d2 --- /dev/null +++ b/src/main/resources/public/icons/group.svg @@ -0,0 +1,8 @@ + + + + + + + + diff --git a/src/main/resources/public/icons/home.svg b/src/main/resources/public/icons/home.svg new file mode 100644 index 0000000..4522d19 --- /dev/null +++ b/src/main/resources/public/icons/home.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/src/main/resources/public/icons/plus.svg b/src/main/resources/public/icons/plus.svg new file mode 100644 index 0000000..7ef5858 --- /dev/null +++ b/src/main/resources/public/icons/plus.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/src/main/resources/public/main.css b/src/main/resources/public/main.css index 2699c37..849968e 100644 --- a/src/main/resources/public/main.css +++ b/src/main/resources/public/main.css @@ -807,6 +807,9 @@ h6 { } .btn-primary { + font-weight: 500; + --tw-text-opacity: 1; + color: rgb(255 255 255 / var(--tw-text-opacity)); padding: 13px 28px; gap: 10px; } @@ -816,6 +819,31 @@ h6 { height: 20px; } +.classroom-card { + display: flex; + flex-direction: column; + align-items: stretch; + gap: 16px; + border-radius: 0.75rem; + --tw-bg-opacity: 1; + background-color: rgb(31 42 55 / var(--tw-bg-opacity)); + padding: 8px; +} + +.classroom-card-name { + border-radius: 0.75rem; + --tw-bg-opacity: 1; + background-color: rgb(20 23 28 / var(--tw-bg-opacity)); + padding: 32px; + font-weight: 500; + --tw-text-opacity: 1; + color: rgb(255 255 255 / var(--tw-text-opacity)); +} + +.classroom-card .btn-primary { + border-radius: 1rem; +} + .sr-only { position: absolute; width: 1px; @@ -844,6 +872,23 @@ h6 { inset: -4px; } +.inset-0 { + inset: 0px; +} + +.inset-y-0 { + top: 0px; + bottom: 0px; +} + +.left-0 { + left: 0px; +} + +.right-0 { + right: 0px; +} + .z-10 { z-index: 10; } @@ -871,6 +916,14 @@ h6 { margin-right: auto; } +.-ml-0 { + margin-left: -0px; +} + +.-mt-32 { + margin-top: -8rem; +} + .mb-4 { margin-bottom: 16px; } @@ -1003,6 +1056,10 @@ h6 { width: 80px; } +.w-32 { + width: 8rem; +} + .w-4 { width: 16px; } @@ -1015,10 +1072,19 @@ h6 { width: 32px; } +.w-fit { + width: -moz-fit-content; + width: fit-content; +} + .w-full { width: 100%; } +.min-w-0 { + min-width: 0px; +} + .min-w-full { min-width: 100%; } @@ -1035,6 +1101,10 @@ h6 { max-width: 80rem; } +.max-w-screen-2xl { + max-width: 1536px; +} + .max-w-xl { max-width: 36rem; } @@ -1075,6 +1145,10 @@ h6 { grid-template-columns: repeat(3, minmax(0, 1fr)); } +.flex-row { + flex-direction: row; +} + .flex-col { flex-direction: column; } @@ -1103,6 +1177,10 @@ h6 { justify-content: space-between; } +.gap-2 { + gap: 8px; +} + .gap-6 { gap: 24px; } @@ -1142,12 +1220,6 @@ h6 { margin-left: calc(24px * calc(1 - var(--tw-space-x-reverse))); } -.space-y-1 > :not([hidden]) ~ :not([hidden]) { - --tw-space-y-reverse: 0; - margin-top: calc(4px * calc(1 - var(--tw-space-y-reverse))); - margin-bottom: calc(4px * var(--tw-space-y-reverse)); -} - .space-y-12 > :not([hidden]) ~ :not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(48px * calc(1 - var(--tw-space-y-reverse))); @@ -1192,6 +1264,10 @@ h6 { border-radius: 0.25rem; } +.rounded-3xl { + border-radius: 1.5rem; +} + .rounded-full { border-radius: 9999px; } @@ -1226,7 +1302,7 @@ h6 { .bg-dark-1 { --tw-bg-opacity: 1; - background-color: rgb(17 25 40 / var(--tw-bg-opacity)); + background-color: rgb(20 23 28 / var(--tw-bg-opacity)); } .bg-dark-2 { @@ -1234,11 +1310,29 @@ h6 { background-color: rgb(18 27 38 / var(--tw-bg-opacity)); } +.bg-dark-3 { + --tw-bg-opacity: 1; + background-color: rgb(31 42 55 / var(--tw-bg-opacity)); +} + +.bg-primary-100 { + --tw-bg-opacity: 1; + background-color: rgb(67 97 238 / var(--tw-bg-opacity)); +} + .bg-white { --tw-bg-opacity: 1; background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } +.fill-primary-100 { + fill: #4361EE; +} + +.fill-white { + fill: #FFFFFF; +} + .object-cover { -o-object-fit: cover; object-fit: cover; @@ -1248,6 +1342,10 @@ h6 { padding: 4px; } +.p-10 { + padding: 40px; +} + .p-4 { padding: 16px; } @@ -1256,14 +1354,19 @@ h6 { padding: 24px; } +.px-10 { + padding-left: 40px; + padding-right: 40px; +} + .px-12 { padding-left: 48px; padding-right: 48px; } -.px-2 { - padding-left: 8px; - padding-right: 8px; +.px-20 { + padding-left: 80px; + padding-right: 80px; } .px-4 { @@ -1310,6 +1413,10 @@ h6 { padding-bottom: 48px; } +.pb-32 { + padding-bottom: 8rem; +} + .pb-6 { padding-bottom: 24px; } @@ -1322,6 +1429,10 @@ h6 { padding-left: 16px; } +.pl-6 { + padding-left: 24px; +} + .pr-10 { padding-right: 40px; } @@ -1375,6 +1486,10 @@ h6 { font-weight: 700; } +.font-extrabold { + font-weight: 800; +} + .font-medium { font-weight: 500; } @@ -1481,6 +1596,16 @@ h6 { color: rgb(255 255 255 / var(--tw-text-opacity)); } +.hover\:bg-dark-4:hover { + --tw-bg-opacity: 1; + background-color: rgb(55 65 81 / var(--tw-bg-opacity)); +} + +.hover\:bg-primary-80:hover { + --tw-bg-opacity: 1; + background-color: rgb(54 78 190 / var(--tw-bg-opacity)); +} + .hover\:text-white:hover { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)); @@ -1536,6 +1661,10 @@ h6 { margin-left: 16px; } + .sm\:mt-0 { + margin-top: 0px; + } + .sm\:block { display: block; } @@ -1596,11 +1725,25 @@ h6 { padding: 24px; } + .sm\:px-0 { + padding-left: 0px; + padding-right: 0px; + } + .sm\:px-6 { padding-left: 24px; padding-right: 24px; } + .sm\:py-32 { + padding-top: 8rem; + padding-bottom: 8rem; + } + + .sm\:pl-0 { + padding-left: 0px; + } + .sm\:text-3xl { font-size: 1.875rem; line-height: 2.25rem; @@ -1638,10 +1781,6 @@ h6 { display: block; } - .md\:hidden { - display: none; - } - .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } @@ -1661,6 +1800,10 @@ h6 { margin-left: 16px; } + .lg\:mt-0 { + margin-top: 0px; + } + .lg\:flex { display: flex; } diff --git a/src/main/resources/templates/classrooms/list.html b/src/main/resources/templates/classrooms/list.html index d76dc47..f386223 100644 --- a/src/main/resources/templates/classrooms/list.html +++ b/src/main/resources/templates/classrooms/list.html @@ -2,49 +2,34 @@ - - -
-
- - - -
+
+ + + New Classroom +
- diff --git a/src/main/resources/templates/layout.html b/src/main/resources/templates/layout.html index 36141a1..4dd86ca 100644 --- a/src/main/resources/templates/layout.html +++ b/src/main/resources/templates/layout.html @@ -8,7 +8,7 @@ - + GitLab Classroom @@ -17,126 +17,85 @@ -
-
- + +
+

Page Title

+
+ +
-- 2.54.0 From 79f282eae1e633555ffce231f6772ad658875048 Mon Sep 17 00:00:00 2001 From: Julien WITTOUCK Date: Tue, 30 Jan 2024 11:06:20 +0100 Subject: [PATCH 02/12] =?UTF-8?q?=F0=9F=92=84=20:=20add=20error=20alert=20?= =?UTF-8?q?on=20login=20page=20when=20login=20fails?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../security/WebSecurityConfiguration.java | 2 +- .../resources/public/icons/cross-circle.svg | 11 ++++ src/main/resources/public/main.css | 52 +++++++++++++++++++ src/main/resources/templates/login.html | 20 +++++-- 4 files changed, 81 insertions(+), 4 deletions(-) create mode 100644 src/main/resources/public/icons/cross-circle.svg diff --git a/src/main/java/fr/univ_lille/gitlab/classrooms/security/WebSecurityConfiguration.java b/src/main/java/fr/univ_lille/gitlab/classrooms/security/WebSecurityConfiguration.java index 1dd7c6a..a331583 100644 --- a/src/main/java/fr/univ_lille/gitlab/classrooms/security/WebSecurityConfiguration.java +++ b/src/main/java/fr/univ_lille/gitlab/classrooms/security/WebSecurityConfiguration.java @@ -44,7 +44,7 @@ public class WebSecurityConfiguration implements WebMvcConfigurer { return http .authorizeHttpRequests(it -> { it.requestMatchers(LOGIN_PAGE).permitAll(); - it.requestMatchers("images/**", "fonts/**", "*.css").permitAll(); + it.requestMatchers("images/**", "icons/**", "fonts/**", "*.css").permitAll(); // authorize actuator endpoints it.requestMatchers(EndpointRequest.toAnyEndpoint()).permitAll(); diff --git a/src/main/resources/public/icons/cross-circle.svg b/src/main/resources/public/icons/cross-circle.svg new file mode 100644 index 0000000..98a005a --- /dev/null +++ b/src/main/resources/public/icons/cross-circle.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/src/main/resources/public/main.css b/src/main/resources/public/main.css index 849968e..a3ed7d2 100644 --- a/src/main/resources/public/main.css +++ b/src/main/resources/public/main.css @@ -1113,6 +1113,18 @@ h6 { max-width: 20rem; } +.max-w-\[\] { + max-width: ; +} + +.max-w-\[50\%\] { + max-width: 50%; +} + +.max-w-\[150px\] { + max-width: 150px; +} + .flex-1 { flex: 1 1 0%; } @@ -1185,6 +1197,14 @@ h6 { gap: 24px; } +.gap-8 { + gap: 32px; +} + +.gap-4 { + gap: 16px; +} + .gap-x-4 { -moz-column-gap: 16px; column-gap: 16px; @@ -1284,6 +1304,11 @@ h6 { border-radius: 0.75rem; } +.rounded-l { + border-top-left-radius: 0.25rem; + border-bottom-left-radius: 0.25rem; +} + .border { border-width: 1px; } @@ -1300,6 +1325,11 @@ h6 { border-left-width: 4px; } +.border-l-red { + --tw-border-opacity: 1; + border-left-color: rgb(242 48 48 / var(--tw-border-opacity)); +} + .bg-dark-1 { --tw-bg-opacity: 1; background-color: rgb(20 23 28 / var(--tw-bg-opacity)); @@ -1325,6 +1355,11 @@ h6 { background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } +.bg-red { + --tw-bg-opacity: 1; + background-color: rgb(242 48 48 / var(--tw-bg-opacity)); +} + .fill-primary-100 { fill: #4361EE; } @@ -1354,6 +1389,14 @@ h6 { padding: 24px; } +.p-2 { + padding: 8px; +} + +.p-8 { + padding: 32px; +} + .px-10 { padding-left: 40px; padding-right: 40px; @@ -1453,6 +1496,10 @@ h6 { text-align: center; } +.align-baseline { + vertical-align: baseline; +} + .align-middle { vertical-align: middle; } @@ -1523,6 +1570,11 @@ h6 { color: rgb(255 255 255 / var(--tw-text-opacity)); } +.text-dark-7 { + --tw-text-opacity: 1; + color: rgb(156 163 175 / var(--tw-text-opacity)); +} + .opacity-0 { opacity: 0; } diff --git a/src/main/resources/templates/login.html b/src/main/resources/templates/login.html index 4a5b535..224c16e 100644 --- a/src/main/resources/templates/login.html +++ b/src/main/resources/templates/login.html @@ -11,15 +11,29 @@
-
+
+

GitLab Classrooms

-

Sign in to your account

+ +

Sign in to your account

+ +
+ + +
+

Login Error

+

+
+
- + Login with GitLab -- 2.54.0 From 8939cabb419c4ed2794ccac8661d0d4b4a1f4574 Mon Sep 17 00:00:00 2001 From: Julien WITTOUCK Date: Wed, 31 Jan 2024 16:54:09 +0100 Subject: [PATCH 03/12] =?UTF-8?q?=F0=9F=92=84=20:=20empty=20teacher=20dash?= =?UTF-8?q?board?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/main/resources/public/main.css | 49 +++++-------------- .../resources/templates/classrooms/empty.html | 24 +++++---- 2 files changed, 23 insertions(+), 50 deletions(-) diff --git a/src/main/resources/public/main.css b/src/main/resources/public/main.css index a3ed7d2..6c4ebc4 100644 --- a/src/main/resources/public/main.css +++ b/src/main/resources/public/main.css @@ -1113,18 +1113,6 @@ h6 { max-width: 20rem; } -.max-w-\[\] { - max-width: ; -} - -.max-w-\[50\%\] { - max-width: 50%; -} - -.max-w-\[150px\] { - max-width: 150px; -} - .flex-1 { flex: 1 1 0%; } @@ -1193,6 +1181,10 @@ h6 { gap: 8px; } +.gap-4 { + gap: 16px; +} + .gap-6 { gap: 24px; } @@ -1201,10 +1193,6 @@ h6 { gap: 32px; } -.gap-4 { - gap: 16px; -} - .gap-x-4 { -moz-column-gap: 16px; column-gap: 16px; @@ -1304,11 +1292,6 @@ h6 { border-radius: 0.75rem; } -.rounded-l { - border-top-left-radius: 0.25rem; - border-bottom-left-radius: 0.25rem; -} - .border { border-width: 1px; } @@ -1350,14 +1333,14 @@ h6 { background-color: rgb(67 97 238 / var(--tw-bg-opacity)); } -.bg-white { +.bg-red { --tw-bg-opacity: 1; - background-color: rgb(255 255 255 / var(--tw-bg-opacity)); + background-color: rgb(242 48 48 / var(--tw-bg-opacity)); } -.bg-red { +.bg-white { --tw-bg-opacity: 1; - background-color: rgb(242 48 48 / var(--tw-bg-opacity)); + background-color: rgb(255 255 255 / var(--tw-bg-opacity)); } .fill-primary-100 { @@ -1389,10 +1372,6 @@ h6 { padding: 24px; } -.p-2 { - padding: 8px; -} - .p-8 { padding: 32px; } @@ -1496,10 +1475,6 @@ h6 { text-align: center; } -.align-baseline { - vertical-align: baseline; -} - .align-middle { vertical-align: middle; } @@ -1565,14 +1540,14 @@ h6 { letter-spacing: -0.025em; } -.text-white { +.text-dark-7 { --tw-text-opacity: 1; - color: rgb(255 255 255 / var(--tw-text-opacity)); + color: rgb(156 163 175 / var(--tw-text-opacity)); } -.text-dark-7 { +.text-white { --tw-text-opacity: 1; - color: rgb(156 163 175 / var(--tw-text-opacity)); + color: rgb(255 255 255 / var(--tw-text-opacity)); } .opacity-0 { diff --git a/src/main/resources/templates/classrooms/empty.html b/src/main/resources/templates/classrooms/empty.html index b96614b..5f50c39 100644 --- a/src/main/resources/templates/classrooms/empty.html +++ b/src/main/resources/templates/classrooms/empty.html @@ -6,20 +6,18 @@ Created from template https://tailwindui.com/components/application-ui/feedback/empty-states#component-42930c785190e14c24b53ba822f4a92c --> -
- -

No Classrooms

-

Get started by creating a new Classroom.

+
+ + + +

No Classrooms

+ +

Get started by creating a new Classroom.

+
- - + + + New Classroom
-- 2.54.0 From 402f134d920d7a9d5bc30f1c58cc5079b785c132 Mon Sep 17 00:00:00 2001 From: Julien WITTOUCK Date: Wed, 31 Jan 2024 18:16:14 +0100 Subject: [PATCH 04/12] =?UTF-8?q?=F0=9F=92=84=20:=20add=20student-card=20c?= =?UTF-8?q?omponent?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/main/frontend/main.css | 25 +++- src/main/resources/public/icons/send.svg | 5 + src/main/resources/public/main.css | 116 +++++++++--------- .../templates/components/student-card.html | 29 +++++ 4 files changed, 114 insertions(+), 61 deletions(-) create mode 100644 src/main/resources/public/icons/send.svg create mode 100644 src/main/resources/templates/components/student-card.html diff --git a/src/main/frontend/main.css b/src/main/frontend/main.css index 9314554..3da5867 100644 --- a/src/main/frontend/main.css +++ b/src/main/frontend/main.css @@ -5,6 +5,7 @@ @layer base { html { font-family: "Noto Sans", system-ui, sans-serif; + @apply text-white; } h1 { /* 60px , 3.75em */ @@ -39,7 +40,6 @@ src: url("/fonts/NotoSans-VariableFont_wdth,wght.ttf"); } - @layer components { .btn-primary { @@ -56,8 +56,6 @@ height: 20px; } - - .classroom-card { @apply rounded-xl bg-dark-3 flex flex-col items-stretch gap-4 p-2; } @@ -69,4 +67,25 @@ .classroom-card .btn-primary { @apply rounded-2xl; } + + .student-card { + @apply bg-dark-3 rounded-3xl p-10 w-full; + @apply flex items-center justify-center gap-8; + + .avatar { + @apply h-20 w-20 flex-shrink-0 rounded-full; + } + .student-details { + @apply flex flex-col gap-1; + + a { + @apply text-lg font-medium; + } + + .email { + @apply text-sm text-dark-7 flex items-center; + } + } + } + } diff --git a/src/main/resources/public/icons/send.svg b/src/main/resources/public/icons/send.svg new file mode 100644 index 0000000..1bb3610 --- /dev/null +++ b/src/main/resources/public/icons/send.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/src/main/resources/public/main.css b/src/main/resources/public/main.css index 6c4ebc4..85bd9c8 100644 --- a/src/main/resources/public/main.css +++ b/src/main/resources/public/main.css @@ -641,6 +641,8 @@ select { html { font-family: "Noto Sans", system-ui, sans-serif; + --tw-text-opacity: 1; + color: rgb(255 255 255 / var(--tw-text-opacity)); } h1 { @@ -844,6 +846,62 @@ h6 { border-radius: 1rem; } +.student-card { + width: 100%; + border-radius: 1.5rem; + --tw-bg-opacity: 1; + background-color: rgb(31 42 55 / var(--tw-bg-opacity)); + padding: 40px; + display: flex; + align-items: center; + justify-content: center; + gap: 32px; + .avatar { + height: 80px; + } + .avatar { + width: 80px; + } + .avatar { + flex-shrink: 0; + } + .avatar { + border-radius: 9999px; + } + .student-details { + display: flex; + } + .student-details { + flex-direction: column; + } + .student-details { + gap: 4px; + } + .student-details { + a { + font-size: 1.125rem; + line-height: 1.75rem; + } + a { + font-weight: 500; + } + .email { + display: flex; + } + .email { + align-items: center; + } + .email { + font-size: 0.875rem; + line-height: 1.25rem; + } + .email { + --tw-text-opacity: 1; + color: rgb(156 163 175 / var(--tw-text-opacity)); + } + } +} + .sr-only { position: absolute; width: 1px; @@ -893,10 +951,6 @@ h6 { z-index: 10; } -.col-span-1 { - grid-column: span 1 / span 1; -} - .col-span-full { grid-column: 1 / -1; } @@ -1012,10 +1066,6 @@ h6 { display: none; } -.h-10 { - height: 40px; -} - .h-12 { height: 48px; } @@ -1044,10 +1094,6 @@ h6 { min-height: 100%; } -.w-10 { - width: 40px; -} - .w-12 { width: 48px; } @@ -1081,10 +1127,6 @@ h6 { width: 100%; } -.min-w-0 { - min-width: 0px; -} - .min-w-full { min-width: 100%; } @@ -1222,12 +1264,6 @@ h6 { margin-left: calc(16px * calc(1 - var(--tw-space-x-reverse))); } -.space-x-6 > :not([hidden]) ~ :not([hidden]) { - --tw-space-x-reverse: 0; - margin-right: calc(24px * var(--tw-space-x-reverse)); - margin-left: calc(24px * calc(1 - var(--tw-space-x-reverse))); -} - .space-y-12 > :not([hidden]) ~ :not([hidden]) { --tw-space-y-reverse: 0; margin-top: calc(48px * calc(1 - var(--tw-space-y-reverse))); @@ -1479,11 +1515,6 @@ h6 { vertical-align: middle; } -.text-2xl { - font-size: 1.5rem; - line-height: 2rem; -} - .text-3xl { font-size: 1.875rem; line-height: 2.25rem; @@ -1708,10 +1739,6 @@ h6 { flex: 1 1 auto; } - .sm\:grid-cols-2 { - grid-template-columns: repeat(2, minmax(0, 1fr)); - } - .sm\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } @@ -1742,12 +1769,6 @@ h6 { margin-left: calc(24px * calc(1 - var(--tw-space-x-reverse))); } - .sm\:truncate { - overflow: hidden; - text-overflow: ellipsis; - white-space: nowrap; - } - .sm\:p-6 { padding: 24px; } @@ -1771,11 +1792,6 @@ h6 { padding-left: 0px; } - .sm\:text-3xl { - font-size: 1.875rem; - line-height: 2.25rem; - } - .sm\:text-4xl { font-size: 2.25rem; line-height: 2.5rem; @@ -1789,10 +1805,6 @@ h6 { .sm\:leading-6 { line-height: 1.5rem; } - - .sm\:tracking-tight { - letter-spacing: -0.025em; - } } @media (min-width: 768px) { @@ -1831,22 +1843,10 @@ h6 { margin-top: 0px; } - .lg\:flex { - display: flex; - } - .lg\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } - .lg\:items-center { - align-items: center; - } - - .lg\:justify-between { - justify-content: space-between; - } - .lg\:px-8 { padding-left: 32px; padding-right: 32px; diff --git a/src/main/resources/templates/components/student-card.html b/src/main/resources/templates/components/student-card.html new file mode 100644 index 0000000..7b7f8db --- /dev/null +++ b/src/main/resources/templates/components/student-card.html @@ -0,0 +1,29 @@ + + +
+ Student avatar +
+ Jane Cooper + +
+
\ No newline at end of file -- 2.54.0 From c488120b67ca2e4617cf039207a6375e41107165 Mon Sep 17 00:00:00 2001 From: Julien WITTOUCK Date: Wed, 31 Jan 2024 18:17:23 +0100 Subject: [PATCH 05/12] =?UTF-8?q?=F0=9F=90=9B=20:=20correct=20icons=20urls?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/main/resources/templates/layout.html | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/main/resources/templates/layout.html b/src/main/resources/templates/layout.html index 4dd86ca..58d8703 100644 --- a/src/main/resources/templates/layout.html +++ b/src/main/resources/templates/layout.html @@ -35,7 +35,7 @@ th:classappend="${ activeMenu == 'Dashboard' ? 'bg-primary-100 ' : 'bg-dark-3' }" aria-current="page"> - + Dashboard @@ -44,7 +44,7 @@ th:classappend="${ activeMenu == 'Quiz' ? 'bg-primary-100 ' : 'bg-dark-3' }" aria-current="page"> - + Quiz @@ -52,7 +52,7 @@ target="_blank" class="flex justify-center align-middle text-white gap-2 py-4 px-10 bg-dark-3 hover:bg-dark-4"> - + Documentation -- 2.54.0 From 16392375850075c297ce171a1af12c6d131a26f5 Mon Sep 17 00:00:00 2001 From: Julien WITTOUCK Date: Wed, 31 Jan 2024 18:17:39 +0100 Subject: [PATCH 06/12] =?UTF-8?q?=F0=9F=9A=A7=20:=20classroom=20details=20?= =?UTF-8?q?view?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../resources/templates/classrooms/view.html | 32 +++++-------------- 1 file changed, 8 insertions(+), 24 deletions(-) diff --git a/src/main/resources/templates/classrooms/view.html b/src/main/resources/templates/classrooms/view.html index 93b1024..7622334 100644 --- a/src/main/resources/templates/classrooms/view.html +++ b/src/main/resources/templates/classrooms/view.html @@ -22,12 +22,11 @@ } -
-
-

+
+
+
Classroom name -
+

users icon @@ -60,7 +59,6 @@
-

Students

@@ -81,26 +79,12 @@
-
    +
    • -
      - -
      - -

      Jane - Cooper

      -       - - - Email - -
      -
      + th:insert="~{ components/student-card::div(${student}) }" + th:with="link=@{/classrooms/{classroomId}/students/{studentName}(classroomId=${classroom.id},studentName=${student.name})}" + >
    -- 2.54.0 From 7cf70f959d7c3b3aad5000d3f9769e5139ada91b Mon Sep 17 00:00:00 2001 From: Julien WITTOUCK Date: Fri, 2 Feb 2024 18:41:57 +0100 Subject: [PATCH 07/12] =?UTF-8?q?=F0=9F=92=84=20:=20implement=20assignment?= =?UTF-8?q?=20card?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/main/frontend/main.css | 21 +++++ src/main/resources/public/icons/cubes.svg | 14 ++++ .../resources/public/icons/link-alt-2.svg | 11 +++ src/main/resources/public/icons/users.svg | 13 +++ src/main/resources/public/main.css | 82 +++++++++++++++++++ .../resources/templates/classrooms/view.html | 49 +---------- .../templates/components/assignment-card.html | 35 ++++++++ 7 files changed, 180 insertions(+), 45 deletions(-) create mode 100644 src/main/resources/public/icons/cubes.svg create mode 100644 src/main/resources/public/icons/link-alt-2.svg create mode 100644 src/main/resources/public/icons/users.svg create mode 100644 src/main/resources/templates/components/assignment-card.html diff --git a/src/main/frontend/main.css b/src/main/frontend/main.css index 3da5867..0e9e706 100644 --- a/src/main/frontend/main.css +++ b/src/main/frontend/main.css @@ -88,4 +88,25 @@ } } + .assignment-card { + @apply bg-dark-3 rounded-3xl p-2 w-full; + @apply flex flex-col items-stretch justify-center gap-2; + + .icon { + @apply h-20 w-20 flex-shrink-0 rounded-full; + } + .assignment-header { + @apply bg-dark-1 flex-1 rounded-2xl p-8; + @apply flex flex-row items-center gap-6; + + div { + @apply w-20 h-20 bg-dark-3 rounded-full flex items-center justify-center; + + img { + @apply w-6 h-6; + } + } + } + } + } diff --git a/src/main/resources/public/icons/cubes.svg b/src/main/resources/public/icons/cubes.svg new file mode 100644 index 0000000..4db8ea7 --- /dev/null +++ b/src/main/resources/public/icons/cubes.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + diff --git a/src/main/resources/public/icons/link-alt-2.svg b/src/main/resources/public/icons/link-alt-2.svg new file mode 100644 index 0000000..9f93137 --- /dev/null +++ b/src/main/resources/public/icons/link-alt-2.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/src/main/resources/public/icons/users.svg b/src/main/resources/public/icons/users.svg new file mode 100644 index 0000000..544b93a --- /dev/null +++ b/src/main/resources/public/icons/users.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + + + diff --git a/src/main/resources/public/main.css b/src/main/resources/public/main.css index 85bd9c8..49d2ad1 100644 --- a/src/main/resources/public/main.css +++ b/src/main/resources/public/main.css @@ -902,6 +902,88 @@ h6 { } } +.assignment-card { + width: 100%; + border-radius: 1.5rem; + --tw-bg-opacity: 1; + background-color: rgb(31 42 55 / var(--tw-bg-opacity)); + padding: 8px; + display: flex; + flex-direction: column; + align-items: stretch; + justify-content: center; + gap: 8px; + .icon { + height: 80px; + } + .icon { + width: 80px; + } + .icon { + flex-shrink: 0; + } + .icon { + border-radius: 9999px; + } + .assignment-header { + flex: 1 1 0%; + } + .assignment-header { + border-radius: 1rem; + } + .assignment-header { + --tw-bg-opacity: 1; + background-color: rgb(20 23 28 / var(--tw-bg-opacity)); + } + .assignment-header { + padding: 32px; + } + .assignment-header { + display: flex; + } + .assignment-header { + flex-direction: row; + } + .assignment-header { + align-items: center; + } + .assignment-header { + gap: 24px; + } + .assignment-header { + div { + display: flex; + } + div { + height: 80px; + } + div { + width: 80px; + } + div { + align-items: center; + } + div { + justify-content: center; + } + div { + border-radius: 9999px; + } + div { + --tw-bg-opacity: 1; + background-color: rgb(31 42 55 / var(--tw-bg-opacity)); + } + div { + img { + height: 24px; + } + img { + width: 24px; + } + } + } +} + .sr-only { position: absolute; width: 1px; diff --git a/src/main/resources/templates/classrooms/view.html b/src/main/resources/templates/classrooms/view.html index 7622334..054a2f5 100644 --- a/src/main/resources/templates/classrooms/view.html +++ b/src/main/resources/templates/classrooms/view.html @@ -102,52 +102,11 @@
-
    -
  • +
  • -
    - - - - - - - - - - - - - Assignment Name - -
    -
    -
    -
    - - - - 2 / 10 Students accepted -
    -
    -
    -
    - -
    -
    -
diff --git a/src/main/resources/templates/components/assignment-card.html b/src/main/resources/templates/components/assignment-card.html new file mode 100644 index 0000000..7d351ed --- /dev/null +++ b/src/main/resources/templates/components/assignment-card.html @@ -0,0 +1,35 @@ + + +
+ +
+ +
+ Exercise 1 + +
+ + 2 +
+ +
-- 2.54.0 From 45bdea8782803217667e8bde082906e3d5a71d82 Mon Sep 17 00:00:00 2001 From: Julien WITTOUCK Date: Fri, 23 Feb 2024 08:25:36 +0100 Subject: [PATCH 08/12] =?UTF-8?q?=E2=AC=86=EF=B8=8F=20:=20bump=20spring-bo?= =?UTF-8?q?ot-starter-parent=20to=203.2.3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- pom.xml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/pom.xml b/pom.xml index bd5dad0..8774d3d 100644 --- a/pom.xml +++ b/pom.xml @@ -6,7 +6,7 @@ org.springframework.boot spring-boot-starter-parent - 3.2.2 + 3.2.3 -- 2.54.0 From dab1ea4c73236c7b72fc243d506d220c4b14ca02 Mon Sep 17 00:00:00 2001 From: Julien WITTOUCK Date: Fri, 23 Feb 2024 16:09:13 +0100 Subject: [PATCH 09/12] =?UTF-8?q?=F0=9F=92=84=20:=20add=20intermediate=20s?= =?UTF-8?q?izes?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/main/frontend/main.css | 2 +- src/main/frontend/tailwind.config.js | 2 ++ src/main/resources/public/main.css | 1 + 3 files changed, 4 insertions(+), 1 deletion(-) diff --git a/src/main/frontend/main.css b/src/main/frontend/main.css index 0e9e706..2dbfa76 100644 --- a/src/main/frontend/main.css +++ b/src/main/frontend/main.css @@ -27,7 +27,7 @@ } h5 { /* 24px, 1.5em */ - @apply text-2xl; + @apply text-2xl font-bold; } h6 { /* 20px, 1.25em */ diff --git a/src/main/frontend/tailwind.config.js b/src/main/frontend/tailwind.config.js index b20d647..5e30931 100644 --- a/src/main/frontend/tailwind.config.js +++ b/src/main/frontend/tailwind.config.js @@ -60,7 +60,9 @@ module.exports = { '0': '0px', '1': '4px', '2': '8px', + '3': '12px', '4': '16px', + '5': '20px', '6': '24px', '8': '32px', '10': '40px', diff --git a/src/main/resources/public/main.css b/src/main/resources/public/main.css index 49d2ad1..62c6de5 100644 --- a/src/main/resources/public/main.css +++ b/src/main/resources/public/main.css @@ -673,6 +673,7 @@ h5 { /* 24px, 1.5em */ font-size: 1.5rem; line-height: 2rem; + font-weight: 700; } h6 { -- 2.54.0 From 39f90c618229cb82dd722f6323883a502825f4a8 Mon Sep 17 00:00:00 2001 From: Julien WITTOUCK Date: Fri, 23 Feb 2024 16:09:44 +0100 Subject: [PATCH 10/12] =?UTF-8?q?=F0=9F=92=84=20:=20use=20different=20icon?= =?UTF-8?q?s=20for=20assignment=20types?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/main/resources/public/icons/brackets.svg | 11 +++++++++++ src/main/resources/public/icons/pencil-alt.svg | 10 ++++++++++ .../templates/components/assignment-card.html | 5 +++-- 3 files changed, 24 insertions(+), 2 deletions(-) create mode 100644 src/main/resources/public/icons/brackets.svg create mode 100644 src/main/resources/public/icons/pencil-alt.svg diff --git a/src/main/resources/public/icons/brackets.svg b/src/main/resources/public/icons/brackets.svg new file mode 100644 index 0000000..3af4150 --- /dev/null +++ b/src/main/resources/public/icons/brackets.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/src/main/resources/public/icons/pencil-alt.svg b/src/main/resources/public/icons/pencil-alt.svg new file mode 100644 index 0000000..d3b28f7 --- /dev/null +++ b/src/main/resources/public/icons/pencil-alt.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/src/main/resources/templates/components/assignment-card.html b/src/main/resources/templates/components/assignment-card.html index 7d351ed..8ffa0eb 100644 --- a/src/main/resources/templates/components/assignment-card.html +++ b/src/main/resources/templates/components/assignment-card.html @@ -20,11 +20,12 @@
- + +
Exercise 1 -
+
2
-- 2.54.0 From 877e541911440a6079f5fb2afefaf27cb8a429c5 Mon Sep 17 00:00:00 2001 From: Julien WITTOUCK Date: Fri, 23 Feb 2024 16:10:15 +0100 Subject: [PATCH 11/12] =?UTF-8?q?=F0=9F=92=84=20:=20finish=20classroom=20v?= =?UTF-8?q?iew?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../resources/templates/classrooms/view.html | 86 +++++++++---------- 1 file changed, 41 insertions(+), 45 deletions(-) diff --git a/src/main/resources/templates/classrooms/view.html b/src/main/resources/templates/classrooms/view.html index 054a2f5..c120ebc 100644 --- a/src/main/resources/templates/classrooms/view.html +++ b/src/main/resources/templates/classrooms/view.html @@ -23,63 +23,60 @@
-
+
Classroom name
-
-
- users icon - 12 Students -
-
+ + gitlab icon + Open in GitLab + +
- - +
-
-
-

Students

-

Students who already joined the Classroom.

+
+
+

Students

+

+ users icon + 12 Students. +

-
-
-
- users icon + + +
+
+
+
-
    +
    -
    +
    -

    Assignments

    -

    Assignments of the current classroom.

    -
    -
    - - New Assignment - +

    Assignments

    +

    Assignments of the current classroom.

    + + + New Assignment +
      -- 2.54.0 From 2d103340683690d4e263980d8b721040ac304ac0 Mon Sep 17 00:00:00 2001 From: Julien WITTOUCK Date: Fri, 23 Feb 2024 16:11:07 +0100 Subject: [PATCH 12/12] =?UTF-8?q?=F0=9F=92=84=20:=20re-generate=20styleshe?= =?UTF-8?q?et?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/main/resources/public/main.css | 168 ++++++++++++++++++++++++----- 1 file changed, 144 insertions(+), 24 deletions(-) diff --git a/src/main/resources/public/main.css b/src/main/resources/public/main.css index 62c6de5..8b95c8e 100644 --- a/src/main/resources/public/main.css +++ b/src/main/resources/public/main.css @@ -1048,6 +1048,11 @@ h6 { margin-bottom: -8px; } +.-my-3 { + margin-top: -12px; + margin-bottom: -12px; +} + .mx-auto { margin-left: auto; margin-right: auto; @@ -1061,6 +1066,10 @@ h6 { margin-top: -8rem; } +.mb-2 { + margin-bottom: 8px; +} + .mb-4 { margin-bottom: 16px; } @@ -1081,6 +1090,10 @@ h6 { margin-left: 8px; } +.ml-3 { + margin-left: 12px; +} + .ml-4 { margin-left: 16px; } @@ -1109,6 +1122,14 @@ h6 { margin-top: 8px; } +.mt-3 { + margin-top: 12px; +} + +.mt-5 { + margin-top: 20px; +} + .mt-6 { margin-top: 24px; } @@ -1161,6 +1182,10 @@ h6 { height: 16px; } +.h-5 { + height: 20px; +} + .h-6 { height: 24px; } @@ -1193,6 +1218,10 @@ h6 { width: 16px; } +.w-5 { + width: 20px; +} + .w-6 { width: 24px; } @@ -1306,10 +1335,18 @@ h6 { gap: 8px; } +.gap-3 { + gap: 12px; +} + .gap-4 { gap: 16px; } +.gap-5 { + gap: 20px; +} + .gap-6 { gap: 24px; } @@ -1318,6 +1355,11 @@ h6 { gap: 32px; } +.gap-x-3 { + -moz-column-gap: 12px; + column-gap: 12px; +} + .gap-x-4 { -moz-column-gap: 16px; column-gap: 16px; @@ -1391,6 +1433,10 @@ h6 { border-radius: 0.25rem; } +.rounded-2xl { + border-radius: 1rem; +} + .rounded-3xl { border-radius: 1.5rem; } @@ -1427,6 +1473,11 @@ h6 { border-left-width: 4px; } +.border-b-dark-4 { + --tw-border-opacity: 1; + border-bottom-color: rgb(55 65 81 / var(--tw-border-opacity)); +} + .border-l-red { --tw-border-opacity: 1; border-left-color: rgb(242 48 48 / var(--tw-border-opacity)); @@ -1447,6 +1498,11 @@ h6 { background-color: rgb(31 42 55 / var(--tw-bg-opacity)); } +.bg-dark-4 { + --tw-bg-opacity: 1; + background-color: rgb(55 65 81 / var(--tw-bg-opacity)); +} + .bg-primary-100 { --tw-bg-opacity: 1; background-color: rgb(67 97 238 / var(--tw-bg-opacity)); @@ -1510,11 +1566,21 @@ h6 { padding-right: 80px; } +.px-3 { + padding-left: 12px; + padding-right: 12px; +} + .px-4 { padding-left: 16px; padding-right: 16px; } +.px-5 { + padding-left: 20px; + padding-right: 20px; +} + .px-6 { padding-left: 24px; padding-right: 24px; @@ -1540,16 +1606,31 @@ h6 { padding-bottom: 8px; } +.py-3 { + padding-top: 12px; + padding-bottom: 12px; +} + .py-4 { padding-top: 16px; padding-bottom: 16px; } +.py-5 { + padding-top: 20px; + padding-bottom: 20px; +} + .py-6 { padding-top: 24px; padding-bottom: 24px; } +.py-8 { + padding-top: 32px; + padding-bottom: 32px; +} + .pb-12 { padding-bottom: 48px; } @@ -1558,6 +1639,10 @@ h6 { padding-bottom: 8rem; } +.pb-5 { + padding-bottom: 20px; +} + .pb-6 { padding-bottom: 24px; } @@ -1566,6 +1651,14 @@ h6 { padding-left: 40px; } +.pl-12 { + padding-left: 48px; +} + +.pl-3 { + padding-left: 12px; +} + .pl-4 { padding-left: 16px; } @@ -1574,6 +1667,10 @@ h6 { padding-left: 24px; } +.pl-8 { + padding-left: 32px; +} + .pr-10 { padding-right: 40px; } @@ -1582,6 +1679,10 @@ h6 { padding-right: 48px; } +.pr-3 { + padding-right: 12px; +} + .pt-12 { padding-top: 48px; } @@ -1714,6 +1815,11 @@ h6 { --tw-ring-inset: inset; } +.ring-dark-9 { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(229 231 235 / var(--tw-ring-opacity)); +} + .ring-opacity-5 { --tw-ring-opacity: 0.05; } @@ -1732,6 +1838,16 @@ h6 { src: url("/fonts/NotoSans-VariableFont_wdth,wght.ttf"); } +.placeholder\:text-dark-6::-moz-placeholder { + --tw-text-opacity: 1; + color: rgb(107 114 128 / var(--tw-text-opacity)); +} + +.placeholder\:text-dark-6::placeholder { + --tw-text-opacity: 1; + color: rgb(107 114 128 / var(--tw-text-opacity)); +} + .checked\:text-white:checked { --tw-text-opacity: 1; color: rgb(255 255 255 / var(--tw-text-opacity)); @@ -1752,6 +1868,21 @@ h6 { color: rgb(255 255 255 / var(--tw-text-opacity)); } +.hover\:ring-2:hover { + --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); + --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color); + box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); +} + +.hover\:ring-inset:hover { + --tw-ring-inset: inset; +} + +.hover\:ring-primary-100:hover { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(67 97 238 / var(--tw-ring-opacity)); +} + .focus\:outline-none:focus { outline: 2px solid transparent; outline-offset: 2px; @@ -1763,10 +1894,21 @@ h6 { box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); } +.focus\:ring-4:focus { + --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); + --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color); + box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); +} + .focus\:ring-inset:focus { --tw-ring-inset: inset; } +.focus\:ring-primary-160:focus { + --tw-ring-opacity: 1; + --tw-ring-color: rgb(180 192 248 / var(--tw-ring-opacity)); +} + .focus\:ring-white:focus { --tw-ring-opacity: 1; --tw-ring-color: rgb(255 255 255 / var(--tw-ring-opacity)); @@ -1798,16 +1940,8 @@ h6 { margin-right: -24px; } - .sm\:ml-4 { - margin-left: 16px; - } - - .sm\:mt-0 { - margin-top: 0px; - } - - .sm\:block { - display: block; + .sm\:ml-3 { + margin-left: 12px; } .sm\:flex { @@ -1830,14 +1964,6 @@ h6 { grid-template-columns: repeat(6, minmax(0, 1fr)); } - .sm\:flex-row { - flex-direction: row; - } - - .sm\:flex-wrap { - flex-wrap: wrap; - } - .sm\:items-center { align-items: center; } @@ -1846,12 +1972,6 @@ h6 { justify-content: space-between; } - .sm\:space-x-6 > :not([hidden]) ~ :not([hidden]) { - --tw-space-x-reverse: 0; - margin-right: calc(24px * var(--tw-space-x-reverse)); - margin-left: calc(24px * calc(1 - var(--tw-space-x-reverse))); - } - .sm\:p-6 { padding: 24px; }