From 3fa316f57f9d9122316e91f887abfc7b4435483b Mon Sep 17 00:00:00 2001 From: grecok Date: Fri, 12 Apr 2024 11:16:58 +0100 Subject: [PATCH 1/3] task/contact-form + frontend styling --- .../FormDefinitions/contactForm.form.yaml | 13 ++-- .../Scss/Abstracts/Varibles/_colors.scss | 3 +- .../Private/Scss/Elements/_form.scss | 48 +++++++++++++++ .../Private/Scss/Elements/_import.scss | 1 + .../football/Resources/Public/Css/index.css | 61 +++++++++++++++++-- 5 files changed, 111 insertions(+), 15 deletions(-) create mode 100644 local_packages/football/Resources/Private/Scss/Elements/_form.scss diff --git a/local_packages/football/Configuration/Form/FormDefinitions/contactForm.form.yaml b/local_packages/football/Configuration/Form/FormDefinitions/contactForm.form.yaml index 9fc0388..17743a2 100644 --- a/local_packages/football/Configuration/Form/FormDefinitions/contactForm.form.yaml +++ b/local_packages/football/Configuration/Form/FormDefinitions/contactForm.form.yaml @@ -34,10 +34,9 @@ renderables: label: 'Lorem ipsum dolor sit' renderables: - - defaultValue: '' + defaultValue: 'Name *' type: Text identifier: text-1 - label: Name properties: fluidAdditionalAttributes: minlength: '3' @@ -52,10 +51,9 @@ renderables: - identifier: NotEmpty - - defaultValue: '' + defaultValue: 'E-Mail address *' type: Email identifier: email-1 - label: 'Email address' properties: fluidAdditionalAttributes: required: required @@ -65,10 +63,9 @@ renderables: - identifier: NotEmpty - - defaultValue: '' - type: Text + defaultValue: 'Subject *' + type: Textarea identifier: text-3 - label: Subject properties: fluidAdditionalAttributes: minlength: '2' @@ -78,7 +75,7 @@ renderables: - options: minimum: '2' - maximum: '60' + maximum: '600' identifier: StringLength - identifier: NotEmpty diff --git a/local_packages/football/Resources/Private/Scss/Abstracts/Varibles/_colors.scss b/local_packages/football/Resources/Private/Scss/Abstracts/Varibles/_colors.scss index b3962c9..c61159e 100644 --- a/local_packages/football/Resources/Private/Scss/Abstracts/Varibles/_colors.scss +++ b/local_packages/football/Resources/Private/Scss/Abstracts/Varibles/_colors.scss @@ -4,7 +4,8 @@ $color__white: #ffffff; //PRIMARY COLORS $color__primary--dark-blue: #002345; $color__light-gray: #ECECE7; -$color__primary: #FF4D08; +$color__primary: #2D479A; +$color__primary-red: #FF3232; //TEXT COLORS $color__text__default: $color__primary--dark-blue; diff --git a/local_packages/football/Resources/Private/Scss/Elements/_form.scss b/local_packages/football/Resources/Private/Scss/Elements/_form.scss new file mode 100644 index 0000000..3ef9d0c --- /dev/null +++ b/local_packages/football/Resources/Private/Scss/Elements/_form.scss @@ -0,0 +1,48 @@ +.pt-navbar { + form { + margin: auto; + padding-top: toRem(60); + + @include media-breakpoint-up(md){ + max-width: 75%; + } + } +} + +.form-check { + padding-left: 0; + margin: toRem(15) 0; +} + +.form-check-label, .form-label { + font-family: $font-primary; + color: $color__primary--dark-blue; +} + +.form-check-label { + font-size: toRem(12); + font-weight: 300; + span { + padding-left: toRem(12); + } +} + +.form-control { + border-radius: 0; + font-size: toRem(15); + font-weight: 300; +} + +.required { + display: none; +} + +input[type=text] { + min-height: toRem(48); +} + +textarea { + &.form-control{ + min-height: toRem(142); + } +} \ No newline at end of file diff --git a/local_packages/football/Resources/Private/Scss/Elements/_import.scss b/local_packages/football/Resources/Private/Scss/Elements/_import.scss index 4e17ed3..8391258 100644 --- a/local_packages/football/Resources/Private/Scss/Elements/_import.scss +++ b/local_packages/football/Resources/Private/Scss/Elements/_import.scss @@ -1,2 +1,3 @@ @import "cta"; @import "footer-menu"; +@import "form"; diff --git a/local_packages/football/Resources/Public/Css/index.css b/local_packages/football/Resources/Public/Css/index.css index e90a564..d70008c 100644 --- a/local_packages/football/Resources/Public/Css/index.css +++ b/local_packages/football/Resources/Public/Css/index.css @@ -10666,15 +10666,15 @@ h6, .btn-primary { padding: 0.5rem 1.875rem; - background-color: #FF4D08; - border-color: #FF4D08; + background-color: #2D479A; + border-color: #2D479A; transition: all 0.3s ease-in-out; } .btn-primary:hover { background-color: #ffffff; - color: #FF4D08; - border-color: #FF4D08; + color: #2D479A; + border-color: #2D479A; } .footer { @@ -10709,7 +10709,7 @@ h6, .footer--icons a { margin-left: 0.5rem; padding: 0.5rem; - color: #FF4D08; + color: #2D479A; background-color: #ECECE7; border-radius: 1.25rem; text-decoration: none; @@ -10806,10 +10806,59 @@ a { } .footer-menu--link:hover { - color: #FF4D08; + color: #2D479A; } .footer-menu--secondary { display: flex; flex-direction: column; +} + +.pt-navbar form { + margin: auto; + padding-top: 3.75rem; +} + +@media (min-width: 768px) { + .pt-navbar form { + max-width: 75%; + } +} + +.form-check { + padding-left: 0; + margin: 0.9375rem 0; +} + +.form-check-label, +.form-label { + font-family: "Lato", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; + color: #002345; +} + +.form-check-label { + font-size: 0.75rem; + font-weight: 300; +} + +.form-check-label span { + padding-left: 0.75rem; +} + +.form-control { + border-radius: 0; + font-size: 0.9375rem; + font-weight: 300; +} + +.required { + display: none; +} + +input[type=text] { + min-height: 3rem; +} + +textarea.form-control { + min-height: 8.875rem; } \ No newline at end of file From 19721683d5a8a81c9a2c38ad17dfc39c47a51ff6 Mon Sep 17 00:00:00 2001 From: grecok Date: Fri, 12 Apr 2024 11:19:28 +0100 Subject: [PATCH 2/3] task/contact-form + frontend styling --- .../football/Resources/Private/Scss/Elements/_form.scss | 6 ++++-- local_packages/football/Resources/Public/Css/index.css | 3 ++- 2 files changed, 6 insertions(+), 3 deletions(-) diff --git a/local_packages/football/Resources/Private/Scss/Elements/_form.scss b/local_packages/football/Resources/Private/Scss/Elements/_form.scss index 3ef9d0c..d861fe1 100644 --- a/local_packages/football/Resources/Private/Scss/Elements/_form.scss +++ b/local_packages/football/Resources/Private/Scss/Elements/_form.scss @@ -37,8 +37,10 @@ display: none; } -input[type=text] { - min-height: toRem(48); +.form-group{ + input[type=text], input[type=email] { + min-height: toRem(48); + } } textarea { diff --git a/local_packages/football/Resources/Public/Css/index.css b/local_packages/football/Resources/Public/Css/index.css index d70008c..f58dca6 100644 --- a/local_packages/football/Resources/Public/Css/index.css +++ b/local_packages/football/Resources/Public/Css/index.css @@ -10855,7 +10855,8 @@ a { display: none; } -input[type=text] { +.form-group input[type=text], +.form-group input[type=email] { min-height: 3rem; } From 3819a1c9f724ca1fb60f9fc8f360af8acaacfd70 Mon Sep 17 00:00:00 2001 From: Andreas Nedbal Date: Fri, 12 Apr 2024 14:55:45 +0100 Subject: [PATCH 3/3] [TASK] Rebuild assets --- .../football/Resources/Public/Css/index.css | 62 +++++++++++++++++-- 1 file changed, 56 insertions(+), 6 deletions(-) diff --git a/local_packages/football/Resources/Public/Css/index.css b/local_packages/football/Resources/Public/Css/index.css index e5c1a87..77db5af 100644 --- a/local_packages/football/Resources/Public/Css/index.css +++ b/local_packages/football/Resources/Public/Css/index.css @@ -10666,15 +10666,15 @@ h6, .btn-primary { padding: 0.5rem 1.875rem; - background-color: #FF4D08; - border-color: #FF4D08; + background-color: #2D479A; + border-color: #2D479A; transition: all 0.3s ease-in-out; } .btn-primary:hover { background-color: #ffffff; - color: #FF4D08; - border-color: #FF4D08; + color: #2D479A; + border-color: #2D479A; } .footer { @@ -10709,7 +10709,7 @@ h6, .footer--icons a { margin-left: 0.5rem; padding: 0.5rem; - color: #FF4D08; + color: #2D479A; background-color: #ECECE7; border-radius: 1.25rem; text-decoration: none; @@ -10806,7 +10806,7 @@ a { } .footer-menu--link:hover { - color: #FF4D08; + color: #2D479A; } .footer-menu--secondary { @@ -10881,4 +10881,54 @@ a { .tx-indexedsearch-browsebox ul li.tx-indexedsearch-browselist-next { border: 0; +} + +.pt-navbar form { + margin: auto; + padding-top: 3.75rem; +} + +@media (min-width: 768px) { + .pt-navbar form { + max-width: 75%; + } +} + +.form-check { + padding-left: 0; + margin: 0.9375rem 0; +} + +.form-check-label, +.form-label { + font-family: "Lato", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; + color: #002345; +} + +.form-check-label { + font-size: 0.75rem; + font-weight: 300; +} + +.form-check-label span { + padding-left: 0.75rem; +} + +.form-control { + border-radius: 0; + font-size: 0.9375rem; + font-weight: 300; +} + +.required { + display: none; +} + +.form-group input[type=text], +.form-group input[type=email] { + min-height: 3rem; +} + +textarea.form-control { + min-height: 8.875rem; } \ No newline at end of file