bumi/tinyforms
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Merge branch 'form-submission-thank-you-page'

Browse Source 
* form-submission-thank-you-page:
  Cleanup
  Remove testing page render
  Add icon svg on the submission thank you page
  Make codes more readable
  Make the submission thank you page vertically centered
  Fix the identation of codes
  Implement the submission thank you page
  Define a custom layout for submission thank you page
This commit is contained in:
bumi
2020-04-22 21:00:34 +02:00
parent 7a7a2e49b7 92cdd51c0d
commit 81d86315aa
6 changed files with 152 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
app/views/layouts/submission.html.erb Normal file
View File

@@ -0,0 +1,21 @@
<!DOCTYPE html>
<html>
<head>
<title>Tinyform</title>
<%= csrf_meta_tags %>
<%= csp_meta_tag %>
<meta name="viewport" content="width=device-width, initial-scale=1">
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
</head>
<body>
<main>
<%= yield %>
</main>
</body>
</html>

25
app/views/submissions/create.html.erb
View File

@@ -1 +1,24 @@
Thanks
<div class="container">
<div class="columns is-vcentered">
<div class="column has-text-centered is-half is-offset-one-quarter">
<div class="svg-icon svg-icon-checkmark inline-svg">
<svg xmlns="http://www.w3.org/2000/svg" width="154px" height="154px">
<g fill="none" stroke-width="2">
<circle cx="77" cy="77" r="72" style="stroke-dasharray:480px, 480px; stroke-dashoffset: 960px;">
</circle>
<circle id="colored" cx="77" cy="77" r="72"
style="stroke-dasharray:480px, 480px; stroke-dashoffset: 960px;"></circle>
<polyline class="st0" stroke="#fff" stroke-width="10" points="43.5,77.8 63.7,97.9 112.2,49.4 "
style="stroke-dasharray:100px, 100px; stroke-dashoffset: 200px;" />
</g>
</svg>
</div>
<h1 class="title">Thank You!</h1>
<p class="subtitle is-5">We received your submission.</p>
<p>
<button onclick="window.history.back()" class="button is-success">Back to previous page</button>
<p>
</div>
</div>
</div>