From f2b264d787d06a3f8c6c14457c9dde7812fe7221 Mon Sep 17 00:00:00 2001 From: Yannick Date: Mon, 20 Apr 2020 11:06:52 +0200 Subject: [PATCH 1/9] Define a custom layout for submission thank you page --- app/controllers/forms_controller.rb | 3 +++ app/controllers/submissions_controller.rb | 1 + app/views/layouts/submission.html.erb | 21 +++++++++++++++++++++ 3 files changed, 25 insertions(+) create mode 100644 app/views/layouts/submission.html.erb diff --git a/app/controllers/forms_controller.rb b/app/controllers/forms_controller.rb index 4b0ac01..108268a 100644 --- a/app/controllers/forms_controller.rb +++ b/app/controllers/forms_controller.rb @@ -2,6 +2,7 @@ require 'google/apis/sheets_v4' require 'google/api_client/client_secrets' class FormsController < ApplicationController before_action :require_login, except: [:form] + layout 'submission', only: [:form] def new @form = current_user.forms.build @@ -39,7 +40,9 @@ class FormsController < ApplicationController end def form + @form = Form.find_by!(token: params[:id]) + render 'submissions/create' end private diff --git a/app/controllers/submissions_controller.rb b/app/controllers/submissions_controller.rb index 9d801af..262ac9b 100644 --- a/app/controllers/submissions_controller.rb +++ b/app/controllers/submissions_controller.rb @@ -2,6 +2,7 @@ require 'google/apis/sheets_v4' class SubmissionsController < ApplicationController skip_before_action :verify_authenticity_token wrap_parameters false + layout 'submission', only: [:create] def create @form = Form.find_by!(token: params[:form_id]) diff --git a/app/views/layouts/submission.html.erb b/app/views/layouts/submission.html.erb new file mode 100644 index 0000000..9f24203 --- /dev/null +++ b/app/views/layouts/submission.html.erb @@ -0,0 +1,21 @@ + + + + + Tinyform + <%= csrf_meta_tags %> + <%= csp_meta_tag %> + + + <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %> + <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %> + + + + +
+ <%= yield %> +
+ + + From 7a7a2e49b7523e1a676b46c30cfd0473cfb2fb27 Mon Sep 17 00:00:00 2001 From: Michael Bumann Date: Mon, 20 Apr 2020 11:51:10 +0200 Subject: [PATCH 2/9] Submission table tweaks smaller fontsize and use vertical scrolling for large tables --- app/assets/stylesheets/application.css.scss | 6 ++++++ app/views/forms/show.html.erb | 2 +- 2 files changed, 7 insertions(+), 1 deletion(-) diff --git a/app/assets/stylesheets/application.css.scss b/app/assets/stylesheets/application.css.scss index 8405ae7..91236b0 100644 --- a/app/assets/stylesheets/application.css.scss +++ b/app/assets/stylesheets/application.css.scss @@ -59,5 +59,11 @@ body { } .table-wrapper { + overflow: auto; + overflow-y: scroll; box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06); +} + +.submission-table tbody { + font-size: 0.75em; } \ No newline at end of file diff --git a/app/views/forms/show.html.erb b/app/views/forms/show.html.erb index 7c103b4..7c44119 100644 --- a/app/views/forms/show.html.erb +++ b/app/views/forms/show.html.erb @@ -27,7 +27,7 @@
- +
<% @form.spreadsheet_headers.each do |value| %> From d304db99dba127418b22fa25a915d10e0ead6ce1 Mon Sep 17 00:00:00 2001 From: karemarsy Date: Mon, 20 Apr 2020 19:14:42 +0200 Subject: [PATCH 3/9] Implement the submission thank you page Implementated the page of submission thank you --- app/views/submissions/create.html.erb | 22 +++++++++++++++++++++- 1 file changed, 21 insertions(+), 1 deletion(-) diff --git a/app/views/submissions/create.html.erb b/app/views/submissions/create.html.erb index 3b2a45f..6deea9c 100644 --- a/app/views/submissions/create.html.erb +++ b/app/views/submissions/create.html.erb @@ -1 +1,21 @@ -Thanks +
+
+
+
+
+
+ + +
+
+

Thank You!


+

We received your submission.


+
+ +
+ +
+
+ +
+
From 4b8269b868973ef37e78a14ad01e2f57350b8f19 Mon Sep 17 00:00:00 2001 From: karemarsy Date: Tue, 21 Apr 2020 09:40:46 +0200 Subject: [PATCH 4/9] Fix the identation of codes Making codes easier to read --- app/views/submissions/create.html.erb | 36 +++++++++++++-------------- 1 file changed, 18 insertions(+), 18 deletions(-) diff --git a/app/views/submissions/create.html.erb b/app/views/submissions/create.html.erb index 6deea9c..b1494b2 100644 --- a/app/views/submissions/create.html.erb +++ b/app/views/submissions/create.html.erb @@ -1,21 +1,21 @@
-
-
-
-
-
- - -
-
-

Thank You!


-

We received your submission.


-
- -
+
+
+
+
+
+ +
+
+

Thank You! +


+

We received your submission.


+
+ +
-
-
+
+
-
-
+
+ \ No newline at end of file From 8f730854e1a2373d2b740d756fa35b61effb846a Mon Sep 17 00:00:00 2001 From: karemarsy Date: Tue, 21 Apr 2020 13:17:42 +0200 Subject: [PATCH 5/9] Make the submission thank you page vertically centered --- app/assets/stylesheets/application.css.scss | 4 ++++ app/views/submissions/create.html.erb | 7 +++---- 2 files changed, 7 insertions(+), 4 deletions(-) diff --git a/app/assets/stylesheets/application.css.scss b/app/assets/stylesheets/application.css.scss index 71872c4..97ac9c5 100644 --- a/app/assets/stylesheets/application.css.scss +++ b/app/assets/stylesheets/application.css.scss @@ -35,6 +35,10 @@ $light: #fff; height: 100%; } +.is-vcentered{ + height: 100vh; +} + .content { padding: 30px 60px 50px; diff --git a/app/views/submissions/create.html.erb b/app/views/submissions/create.html.erb index b1494b2..5526924 100644 --- a/app/views/submissions/create.html.erb +++ b/app/views/submissions/create.html.erb @@ -1,6 +1,5 @@ -
-
-
+
+
@@ -15,7 +14,7 @@
+
-
\ No newline at end of file From 144fa228204e29d79632424e34872595cbee82ea Mon Sep 17 00:00:00 2001 From: karemarsy Date: Tue, 21 Apr 2020 13:29:45 +0200 Subject: [PATCH 6/9] Make codes more readable --- app/views/submissions/create.html.erb | 32 +++++++++++++-------------- 1 file changed, 16 insertions(+), 16 deletions(-) diff --git a/app/views/submissions/create.html.erb b/app/views/submissions/create.html.erb index 5526924..7f13f5f 100644 --- a/app/views/submissions/create.html.erb +++ b/app/views/submissions/create.html.erb @@ -1,20 +1,20 @@
-
-
-
-
- -
-
-

Thank You! -


-

We received your submission.


-
- -
+
+
+
+
+ +
+
+

Thank You! +


+

We received your submission.


+
+ +
-
+
-
+
-
+
\ No newline at end of file From 139ae58906ea89dc66c308807f7af05b5f321e89 Mon Sep 17 00:00:00 2001 From: karemarsy Date: Wed, 22 Apr 2020 20:13:24 +0200 Subject: [PATCH 7/9] Add icon svg on the submission thank you page Added icon svg and animation --- app/assets/stylesheets/application.css.scss | 125 +++++++++++++++++++- app/views/layouts/submission.html.erb | 2 +- app/views/submissions/create.html.erb | 28 +++-- 3 files changed, 143 insertions(+), 12 deletions(-) diff --git a/app/assets/stylesheets/application.css.scss b/app/assets/stylesheets/application.css.scss index 97ac9c5..fad934e 100644 --- a/app/assets/stylesheets/application.css.scss +++ b/app/assets/stylesheets/application.css.scss @@ -35,7 +35,7 @@ $light: #fff; height: 100%; } -.is-vcentered{ +.is-vcentered { height: 100vh; } @@ -47,8 +47,6 @@ $light: #fff; } } - - body { min-height: 100vh; } @@ -56,4 +54,125 @@ body { .button.google { background: rgb(225, 98, 89); color: white; +} + + + + + + + + + + +.animation-ctn { + text-align: center; + margin-top: 5em; +} + +@-webkit-keyframes checkmark { + 0% { + stroke-dashoffset: 100px + } + + 100% { + stroke-dashoffset: 200px + } +} + +@-ms-keyframes checkmark { + 0% { + stroke-dashoffset: 100px + } + + 100% { + stroke-dashoffset: 200px + } +} + +@keyframes checkmark { + 0% { + stroke-dashoffset: 100px + } + + 100% { + stroke-dashoffset: 0px + } +} + +@-webkit-keyframes checkmark-circle { + 0% { + stroke-dashoffset: 480px + } + + 100% { + stroke-dashoffset: 960px; + + } +} + +@-ms-keyframes checkmark-circle { + 0% { + stroke-dashoffset: 240px + } + + 100% { + stroke-dashoffset: 480px + } +} + +@keyframes checkmark-circle { + 0% { + stroke-dashoffset: 480px + } + + 100% { + stroke-dashoffset: 960px + } +} + +@keyframes colored-circle { + 0% { + opacity: 0 + } + + 100% { + opacity: 100 + } +} + +/* other styles */ +/* .svg svg { + display: none +} + */ +.inlinesvg .svg svg { + display: inline +} + +.svg-icon { + align-items: center; + display: inline-flex; + justify-content: center; + height: 154px; + width: 154px; +} + +/* .svg img { + display: none +} */ + +.svg-icon--order-success svg polyline { + -webkit-animation: checkmark 0.30s ease-in-out 0.9s backwards; + animation: checkmark 0.30s ease-in-out 0.9s backwards +} + +.svg-icon--order-success svg circle { + -webkit-animation: checkmark-circle 0.8s ease-in-out backwards; + animation: checkmark-circle 0.8s ease-in-out backwards; +} + +.svg-icon--order-success svg circle#colored { + -webkit-animation: colored-circle 0.8s ease-in-out 0.9s backwards; + animation: colored-circle 0.8s ease-in-out 0.9s backwards; } \ No newline at end of file diff --git a/app/views/layouts/submission.html.erb b/app/views/layouts/submission.html.erb index 9f24203..e56263a 100644 --- a/app/views/layouts/submission.html.erb +++ b/app/views/layouts/submission.html.erb @@ -11,7 +11,7 @@ <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %> - +
<%= yield %> diff --git a/app/views/submissions/create.html.erb b/app/views/submissions/create.html.erb index 7f13f5f..d392df8 100644 --- a/app/views/submissions/create.html.erb +++ b/app/views/submissions/create.html.erb @@ -1,16 +1,28 @@
-
+
-
- -
+
+
+ + + + + + + + +
+
+
-

Thank You! +

Thank You!


-

We received your submission.


-
- +

We received your submission.


+
+
From b9723be2fbc2f11b43f971c686116a2d981b612b Mon Sep 17 00:00:00 2001 From: Yannick Date: Wed, 22 Apr 2020 20:19:44 +0200 Subject: [PATCH 8/9] Remove testing page render --- app/controllers/forms_controller.rb | 1 - app/views/submissions/create.html.erb | 2 +- 2 files changed, 1 insertion(+), 2 deletions(-) diff --git a/app/controllers/forms_controller.rb b/app/controllers/forms_controller.rb index 108268a..22b7850 100644 --- a/app/controllers/forms_controller.rb +++ b/app/controllers/forms_controller.rb @@ -42,7 +42,6 @@ class FormsController < ApplicationController def form @form = Form.find_by!(token: params[:id]) - render 'submissions/create' end private diff --git a/app/views/submissions/create.html.erb b/app/views/submissions/create.html.erb index d392df8..74ebe42 100644 --- a/app/views/submissions/create.html.erb +++ b/app/views/submissions/create.html.erb @@ -22,7 +22,7 @@

We received your submission.


- +
From 92cdd51c0dabd01f9957427b208a9a7729f551aa Mon Sep 17 00:00:00 2001 From: Michael Bumann Date: Wed, 22 Apr 2020 20:58:51 +0200 Subject: [PATCH 9/9] Cleanup --- app/assets/stylesheets/application.css.scss | 105 +----------------- .../stylesheets/checkmark-icon.css.scss | 89 +++++++++++++++ app/views/submissions/create.html.erb | 26 ++--- 3 files changed, 100 insertions(+), 120 deletions(-) create mode 100644 app/assets/stylesheets/checkmark-icon.css.scss diff --git a/app/assets/stylesheets/application.css.scss b/app/assets/stylesheets/application.css.scss index e5fb505..22157b6 100644 --- a/app/assets/stylesheets/application.css.scss +++ b/app/assets/stylesheets/application.css.scss @@ -25,6 +25,7 @@ $light: #fff; @import 'bulma/bulma'; +@import "checkmark-icon"; @import './demo'; .is-font-logo { @@ -64,88 +65,7 @@ body { box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06); } -.animation-ctn { - text-align: center; - margin-top: 5em; -} - -@-webkit-keyframes checkmark { - 0% { - stroke-dashoffset: 100px - } - - 100% { - stroke-dashoffset: 200px - } -} - -@-ms-keyframes checkmark { - 0% { - stroke-dashoffset: 100px - } - - 100% { - stroke-dashoffset: 200px - } -} - -@keyframes checkmark { - 0% { - stroke-dashoffset: 100px - } - - 100% { - stroke-dashoffset: 0px - } -} - -@-webkit-keyframes checkmark-circle { - 0% { - stroke-dashoffset: 480px - } - - 100% { - stroke-dashoffset: 960px; - - } -} - -@-ms-keyframes checkmark-circle { - 0% { - stroke-dashoffset: 240px - } - - 100% { - stroke-dashoffset: 480px - } -} - -@keyframes checkmark-circle { - 0% { - stroke-dashoffset: 480px - } - - 100% { - stroke-dashoffset: 960px - } -} - -@keyframes colored-circle { - 0% { - opacity: 0 - } - - 100% { - opacity: 100 - } -} - -/* other styles */ -/* .svg svg { - display: none -} - */ -.inlinesvg .svg svg { +.inline-svg svg { display: inline } @@ -153,25 +73,4 @@ body { align-items: center; display: inline-flex; justify-content: center; - height: 154px; - width: 154px; -} - -/* .svg img { - display: none -} */ - -.svg-icon--order-success svg polyline { - -webkit-animation: checkmark 0.30s ease-in-out 0.9s backwards; - animation: checkmark 0.30s ease-in-out 0.9s backwards -} - -.svg-icon--order-success svg circle { - -webkit-animation: checkmark-circle 0.8s ease-in-out backwards; - animation: checkmark-circle 0.8s ease-in-out backwards; -} - -.svg-icon--order-success svg circle#colored { - -webkit-animation: colored-circle 0.8s ease-in-out 0.9s backwards; - animation: colored-circle 0.8s ease-in-out 0.9s backwards; } \ No newline at end of file diff --git a/app/assets/stylesheets/checkmark-icon.css.scss b/app/assets/stylesheets/checkmark-icon.css.scss new file mode 100644 index 0000000..78e2612 --- /dev/null +++ b/app/assets/stylesheets/checkmark-icon.css.scss @@ -0,0 +1,89 @@ +@-webkit-keyframes checkmark { + 0% { + stroke-dashoffset: 100px + } + + 100% { + stroke-dashoffset: 200px + } +} + +@-ms-keyframes checkmark { + 0% { + stroke-dashoffset: 100px + } + + 100% { + stroke-dashoffset: 200px + } +} + +@keyframes checkmark { + 0% { + stroke-dashoffset: 100px + } + + 100% { + stroke-dashoffset: 0px + } +} + +@-webkit-keyframes checkmark-circle { + 0% { + stroke-dashoffset: 480px + } + + 100% { + stroke-dashoffset: 960px; + + } +} + +@-ms-keyframes checkmark-circle { + 0% { + stroke-dashoffset: 240px + } + + 100% { + stroke-dashoffset: 480px + } +} + +@keyframes checkmark-circle { + 0% { + stroke-dashoffset: 480px + } + + 100% { + stroke-dashoffset: 960px + } +} + +@keyframes colored-circle { + 0% { + opacity: 0 + } + + 100% { + opacity: 100 + } +} + +.svg-icon-checkmark svg polyline { + -webkit-animation: checkmark 0.30s ease-in-out 0.9s backwards; + animation: checkmark 0.30s ease-in-out 0.9s backwards +} + +.svg-icon-checkmark svg g { + stroke: $success; +} +.svg-icon-checkmark svg circle { + -webkit-animation: checkmark-circle 0.8s ease-in-out backwards; + animation: checkmark-circle 0.8s ease-in-out backwards; +} + +.svg-icon-checkmark svg circle#colored { + -webkit-animation: colored-circle 0.8s ease-in-out 0.9s backwards; + animation: colored-circle 0.8s ease-in-out 0.9s backwards; + fill: $success; +} diff --git a/app/views/submissions/create.html.erb b/app/views/submissions/create.html.erb index 74ebe42..7021320 100644 --- a/app/views/submissions/create.html.erb +++ b/app/views/submissions/create.html.erb @@ -1,32 +1,24 @@
-
-
-
-
+
+
- + -
-
- -
-

Thank You! -


-

We received your submission.


-
- -
+

Thank You!

+

We received your submission.

+

+ +

-
-
\ No newline at end of file