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

Shaping and cleanup

Browse Source
This commit is contained in:
bumi committed 2020-04-25 00:56:38 +02:00
1 parent 7b060bf1c7
commit 970ce9dcb6
6 files changed
+140 -70
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

app/assets/images/airtable-icon.svg
+3
View File
@@ -0,0 +1,3 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid meet" viewBox="0.09468918918919078 -1 45.83829054054054 39.00004276878759" width="41.84" height="35"><defs><path d="M19.78 0.44C10.42 4.31 5.22 6.47 4.18 6.9C3.31 7.26 3.32 8.49 4.19 8.83C5.76 9.45 18.29 14.42 19.86 15.04C21.23 15.59 22.77 15.59 24.14 15.04C25.71 14.42 38.24 9.45 39.81 8.83C40.68 8.49 40.69 7.26 39.82 6.9C38.26 6.25 25.78 1.09 24.22 0.44C22.8 -0.15 21.2 -0.15 19.78 0.44" id="afxk2jVRR"></path><path d="M23.39 18.44C23.39 27.75 23.39 32.92 23.39 33.95C23.39 34.69 24.13 35.2 24.82 34.93C26.56 34.25 40.53 28.83 42.27 28.15C42.67 27.99 42.93 27.61 42.93 27.18C42.93 25.63 42.93 13.21 42.93 11.66C42.93 10.92 42.19 10.42 41.5 10.69C39.76 11.37 25.79 16.79 24.05 17.47C23.65 17.62 23.39 18.01 23.39 18.44" id="aJF2tNe0H"></path><path d="M19.31 19.24L14.13 21.74L13.61 21.99C7.05 25.14 3.4 26.88 2.67 27.23C1.98 27.57 1.09 27.06 1.09 26.29C1.09 24.83 1.09 13.18 1.09 11.73C1.09 11.45 1.24 11.21 1.43 11.03C1.51 10.95 1.6 10.88 1.69 10.83C1.96 10.67 2.33 10.63 2.64 10.76C4.3 11.41 17.57 16.67 19.23 17.32C20.07 17.66 20.14 18.84 19.31 19.24" id="b14YubYMIc"></path><path d="M19.31 19.24L14.13 21.74C6.51 15.31 2.28 11.74 1.43 11.03C1.51 10.95 1.6 10.88 1.69 10.83C1.96 10.67 2.33 10.63 2.64 10.76C4.3 11.41 17.57 16.67 19.23 17.32C20.07 17.66 20.14 18.84 19.31 19.24" id="a8kR7HrKS"></path></defs><g><g><use xlink:href="#afxk2jVRR" opacity="1" fill="#fcb400" fill-opacity="1"></use><g><use xlink:href="#afxk2jVRR" opacity="1" fill-opacity="0" stroke="#000000" stroke-width="1" stroke-opacity="0"></use></g></g><g><use xlink:href="#aJF2tNe0H" opacity="1" fill="#18bfff" fill-opacity="1"></use><g><use xlink:href="#aJF2tNe0H" opacity="1" fill-opacity="0" stroke="#000000" stroke-width="1" stroke-opacity="0"></use></g></g><g><use xlink:href="#b14YubYMIc" opacity="1" fill="#f82b60" fill-opacity="1"></use><g><use xlink:href="#b14YubYMIc" opacity="1" fill-opacity="0" stroke="#000000" stroke-width="1" stroke-opacity="0"></use></g></g><g><use xlink:href="#a8kR7HrKS" opacity="1" fill="#000000" fill-opacity="0.25"></use><g><use xlink:href="#a8kR7HrKS" opacity="1" fill-opacity="0" stroke="#000000" stroke-width="1" stroke-opacity="0"></use></g></g></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.4 KiB

app/assets/images/airtable-logo.svg
+1
View File
@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" width="163.2" height="35.519999999999996" viewBox="0 0 680 148" style="shape-rendering:geometricPrecision" class=""><g><path fill="rgb(51, 51, 51)" d="M272.8495 85.1981L261.0145 53.2891C260.5305 51.9841 258.6855 51.9841 258.2015 53.2891L246.3655 85.1981C246.0025 86.1781 246.7275 87.2201 247.7725 87.2201L271.4435 87.2201C272.4885 87.2201 273.2125 86.1781 272.8495 85.1981M278.3175 103.1321L240.8985 103.1321C240.2705 103.1321 239.7095 103.5221 239.4915 104.1101L232.1245 123.9641C231.9065 124.5521 231.3455 124.9421 230.7185 124.9421L214.5015 124.9421C213.4395 124.9421 212.7135 123.8691 213.1095 122.8841L250.4505 29.8621C250.6785 29.2941 251.2295 28.9211 251.8425 28.9211L267.3725 28.9211C267.9845 28.9211 268.5365 29.2941 268.7645 29.8621L306.1055 122.8831C306.5015 123.8691 305.7755 124.9421 304.7135 124.9421L288.4965 124.9421C287.8695 124.9421 287.3085 124.5521 287.0905 123.9641L279.7235 104.1101C279.5055 103.5221 278.9445 103.1321 278.3175 103.1321M313.7043 61.5684L327.5763 61.5684C328.4053 61.5684 329.0763 62.2404 329.0763 63.0684L329.0763 123.4424C329.0763 124.2704 328.4053 124.9424 327.5763 124.9424L313.7043 124.9424C312.8763 124.9424 312.2043 124.2704 312.2043 123.4424L312.2043 63.0684C312.2043 62.2404 312.8763 61.5684 313.7043 61.5684M379.6682 76.2549C379.6682 77.0829 378.9962 77.7549 378.1682 77.7549L377.7482 77.7549C370.8892 77.7549 365.8582 79.4009 362.6582 82.6929 359.4562 85.9849 357.8572 91.4269 357.8572 99.0169L357.8572 123.4429C357.8572 124.2709 357.1862 124.9429 356.3572 124.9429L342.6222 124.9429C341.7942 124.9429 341.1222 124.2709 341.1222 123.4429L341.1222 63.0679C341.1222 62.2399 341.7942 61.5679 342.6222 61.5679L356.2202 61.5679C357.0492 61.5679 357.7202 62.2399 357.7202 63.0679L357.7202 75.0109 357.9952 75.0109C359.6412 70.0729 362.2472 66.2799 365.8142 63.6259 369.3802 60.9749 373.7702 59.6479 378.9822 59.6479L379.6682 59.6479 379.6682 76.2549zM417.5974 75.6973C416.7694 75.6973 416.0974 76.3693 416.0974 77.1973L416.0974 102.3093C416.0974 104.8703 416.5984 106.6983 417.6064 107.7963 418.6114 108.8933 420.3494 109.4423 422.8184 109.4423L424.1994 109.4423C425.0274 109.4423 425.6994 110.1133 425.6994 110.9423L425.6994 123.5793C425.6994 124.4083 425.0274 125.0793 424.1994 125.0793L418.2914 125.0793C412.1644 125.0793 407.4554 123.5023 404.1634 120.3473 400.8704 117.1923 399.2244 112.5073 399.2244 106.2873L399.2244 77.1973C399.2244 76.3693 398.5534 75.6973 397.7244 75.6973L389.0654 75.6973C388.2364 75.6973 387.5654 75.0253 387.5654 74.1973L387.5654 63.0683C387.5654 62.2403 388.2364 61.5683 389.0654 61.5683L397.7244 61.5683C398.5534 61.5683 399.2244 60.8973 399.2244 60.0683L399.2244 37.6913C399.2244 36.8633 399.8964 36.1913 400.7244 36.1913L414.5974 36.1913C415.4254 36.1913 416.0974 36.8633 416.0974 37.6913L416.0974 60.0683C416.0974 60.8973 416.7694 61.5683 417.5974 61.5683L427.6284 61.5683C428.4574 61.5683 429.1284 62.2403 429.1284 63.0683L429.1284 74.1973C429.1284 75.0253 428.4574 75.6973 427.6284 75.6973L417.5974 75.6973zM481.1191 106.1499C484.2741 102.8579 485.8511 98.5599 485.8511 93.2549 485.8511 87.9529 484.2741 83.6529 481.1191 80.3609 477.9641 77.0689 473.8251 75.4229 468.7041 75.4229 463.5821 75.4229 459.4461 77.0689 456.2901 80.3609 453.1361 83.6529 451.5581 87.9529 451.5581 93.2549 451.5581 98.5599 453.1361 102.8579 456.2901 106.1499 459.4461 109.4419 463.5821 111.0879 468.7041 111.0879 473.8251 111.0879 477.9641 109.4419 481.1191 106.1499M449.0891 123.0219C444.4251 120.3709 440.7431 116.5059 438.0471 111.4309 435.3481 106.3559 434.0001 100.2979 434.0001 93.2549 434.0001 86.2149 435.3481 80.1549 438.0471 75.0799 440.7431 70.0049 444.4251 66.1429 449.0891 63.4889 453.7531 60.8369 458.8731 59.5109 464.4521 59.5109 469.3901 59.5109 473.6191 60.4709 477.1411 62.3919 480.6601 64.3119 483.4721 67.0099 485.5771 70.4849L485.8511 70.4849 485.8511 63.0679C485.8511 62.2399 486.5231 61.5679 487.3511 61.5679L501.0861 61.5679C501.9151 61.5679 502.5861 62.2399 502.5861 63.0679L502.5861 123.4419C502.5861 124.2709 501.9151 124.9419 501.0861 124.9419L487.3511 124.9419C486.5231 124.9419 485.8511 124.2709 485.8511 123.4419L485.8511 116.0259 485.5771 116.0259C483.4721 119.5029 480.6601 122.1989 477.1411 124.1189 473.6191 126.0399 469.3901 126.9999 464.4521 126.9999 458.8731 126.9999 453.7531 125.6729 449.0891 123.0219M559.709 106.1499C562.864 102.8579 564.441 98.5599 564.441 93.2549 564.441 87.9529 562.864 83.6529 559.709 80.3609 556.555 77.0689 552.416 75.4229 547.295 75.4229 542.173 75.4229 538.036 77.0689 534.881 80.3609 531.727 83.6529 530.148 87.9529 530.148 93.2549 530.148 98.5599 531.727 102.8579 534.881 106.1499 538.036 109.4419 542.173 111.0879 547.295 111.0879 552.416 111.0879 556.555 109.4419 559.709 106.1499M538.859 124.1189C535.338 122.1989 532.525 119.5029 530.423 116.0259L530.148 116.0259 530.148 123.4419C530.148 124.2709 529.477 124.9419 528.648 124.9419L514.776 124.9419C513.948 124.9419 513.276 124.2709 513.276 123.4419L513.276 30.4209C513.276 29.592Line truncated
Side by Side

After

Width:  |  Height:  |  Size: 8.5 KiB

app/assets/images/google-sheets-icon.svg
+90
View File
@@ -0,0 +1,90 @@
<?xml version="1.0" encoding="UTF-8"?>
<svg width="49px" height="67px" viewBox="0 0 49 67" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 54.1 (76490) - https://sketchapp.com -->
<title>Sheets-icon</title>
<desc>Created with Sketch.</desc>
<defs>
<path d="M29.5833333,0 L4.4375,0 C1.996875,0 0,1.996875 0,4.4375 L0,60.6458333 C0,63.0864583 1.996875,65.0833333 4.4375,65.0833333 L42.8958333,65.0833333 C45.3364583,65.0833333 47.3333333,63.0864583 47.3333333,60.6458333 L47.3333333,17.75 L29.5833333,0 Z" id="path-1"></path>
<path d="M29.5833333,0 L4.4375,0 C1.996875,0 0,1.996875 0,4.4375 L0,60.6458333 C0,63.0864583 1.996875,65.0833333 4.4375,65.0833333 L42.8958333,65.0833333 C45.3364583,65.0833333 47.3333333,63.0864583 47.3333333,60.6458333 L47.3333333,17.75 L29.5833333,0 Z" id="path-3"></path>
<path d="M29.5833333,0 L4.4375,0 C1.996875,0 0,1.996875 0,4.4375 L0,60.6458333 C0,63.0864583 1.996875,65.0833333 4.4375,65.0833333 L42.8958333,65.0833333 C45.3364583,65.0833333 47.3333333,63.0864583 47.3333333,60.6458333 L47.3333333,17.75 L29.5833333,0 Z" id="path-5"></path>
<linearGradient x1="50.0053945%" y1="8.58610612%" x2="50.0053945%" y2="100.013939%" id="linearGradient-7">
<stop stop-color="#263238" stop-opacity="0.2" offset="0%"></stop>
<stop stop-color="#263238" stop-opacity="0.02" offset="100%"></stop>
</linearGradient>
<path d="M29.5833333,0 L4.4375,0 C1.996875,0 0,1.996875 0,4.4375 L0,60.6458333 C0,63.0864583 1.996875,65.0833333 4.4375,65.0833333 L42.8958333,65.0833333 C45.3364583,65.0833333 47.3333333,63.0864583 47.3333333,60.6458333 L47.3333333,17.75 L29.5833333,0 Z" id="path-8"></path>
<path d="M29.5833333,0 L4.4375,0 C1.996875,0 0,1.996875 0,4.4375 L0,60.6458333 C0,63.0864583 1.996875,65.0833333 4.4375,65.0833333 L42.8958333,65.0833333 C45.3364583,65.0833333 47.3333333,63.0864583 47.3333333,60.6458333 L47.3333333,17.75 L29.5833333,0 Z" id="path-10"></path>
<path d="M29.5833333,0 L4.4375,0 C1.996875,0 0,1.996875 0,4.4375 L0,60.6458333 C0,63.0864583 1.996875,65.0833333 4.4375,65.0833333 L42.8958333,65.0833333 C45.3364583,65.0833333 47.3333333,63.0864583 47.3333333,60.6458333 L47.3333333,17.75 L29.5833333,0 Z" id="path-12"></path>
<path d="M29.5833333,0 L4.4375,0 C1.996875,0 0,1.996875 0,4.4375 L0,60.6458333 C0,63.0864583 1.996875,65.0833333 4.4375,65.0833333 L42.8958333,65.0833333 C45.3364583,65.0833333 47.3333333,63.0864583 47.3333333,60.6458333 L47.3333333,17.75 L29.5833333,0 Z" id="path-14"></path>
<radialGradient cx="3.16804688%" cy="2.71744318%" fx="3.16804688%" fy="2.71744318%" r="161.248516%" gradientTransform="translate(0.031680,0.027174),scale(1.000000,0.727273),translate(-0.031680,-0.027174)" id="radialGradient-16">
<stop stop-color="#FFFFFF" stop-opacity="0.1" offset="0%"></stop>
<stop stop-color="#FFFFFF" stop-opacity="0" offset="100%"></stop>
</radialGradient>
</defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="Consumer-Apps-Sheets-Large-VD-R8-" transform="translate(-451.000000, -451.000000)">
<g id="Hero" transform="translate(0.000000, 63.000000)">
<g id="Personal" transform="translate(277.000000, 299.000000)">
<g id="Sheets-icon" transform="translate(174.833333, 89.958333)">
<g id="Group">
<g id="Clipped">
<mask id="mask-2" fill="white">
<use xlink:href="#path-1"></use>
</mask>
<g id="SVGID_1_"></g>
<path d="M29.5833333,0 L4.4375,0 C1.996875,0 0,1.996875 0,4.4375 L0,60.6458333 C0,63.0864583 1.996875,65.0833333 4.4375,65.0833333 L42.8958333,65.0833333 C45.3364583,65.0833333 47.3333333,63.0864583 47.3333333,60.6458333 L47.3333333,17.75 L36.9791667,10.3541667 L29.5833333,0 Z" id="Path" fill="#0F9D58" fill-rule="nonzero" mask="url(#mask-2)"></path>
</g>
<g id="Clipped">
<mask id="mask-4" fill="white">
<use xlink:href="#path-3"></use>
</mask>
<g id="SVGID_1_"></g>
<path d="M11.8333333,31.8020833 L11.8333333,53.25 L35.5,53.25 L35.5,31.8020833 L11.8333333,31.8020833 Z M22.1875,50.2916667 L14.7916667,50.2916667 L14.7916667,46.59375 L22.1875,46.59375 L22.1875,50.2916667 Z M22.1875,44.375 L14.7916667,44.375 L14.7916667,40.6770833 L22.1875,40.6770833 L22.1875,44.375 Z M22.1875,38.4583333 L14.7916667,38.4583333 L14.7916667,34.7604167 L22.1875,34.7604167 L22.1875,38.4583333 Z M32.5416667,50.2916667 L25.1458333,50.2916667 L25.1458333,46.59375 L32.5416667,46.59375 L32.5416667,50.2916667 Z M32.5416667,44.375 L25.1458333,44.375 L25.1458333,40.6770833 L32.5416667,40.6770833 L32.5416667,44.375 Z M32.5416667,38.4583333 L25.1458333,38.4583333 L25.1458333,34.7604167 L32.5416667,34.7604167 L32.5416667,38.4583333 Z" id="Shape" fill="#F1F1F1" fill-rule="nonzero" mask="url(#mask-4)"></path>
</g>
<g id="Clipped">
<mask id="mask-6" fill="white">
<use xlink:href="#path-5"></use>
</mask>
<g id="SVGID_1_"></g>
<polygon id="Path" fill="url(#linearGradient-7)" fill-rule="nonzero" mask="url(#mask-6)" points="30.8813021 16.4520313 47.3333333 32.9003646 47.3333333 17.75"></polygon>
</g>
<g id="Clipped">
<mask id="mask-9" fill="white">
<use xlink:href="#path-8"></use>
</mask>
<g id="SVGID_1_"></g>
<g id="Group" mask="url(#mask-9)">
<g transform="translate(26.625000, -2.958333)">
<image id="Bitmap" fill="none" opacity="0.2" x="0" y="0" width="26.625" height="26.71375" xlink:href="data:image/png;base64,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 truncated
<path d="M2.95833333,2.95833333 L2.95833333,16.2708333 C2.95833333,18.7225521 4.94411458,20.7083333 7.39583333,20.7083333 L20.7083333,20.7083333 L2.95833333,2.95833333 Z" id="Path" fill="#87CEAC" fill-rule="nonzero"></path>
</g>
</g>
</g>
<g id="Clipped">
<mask id="mask-11" fill="white">
<use xlink:href="#path-10"></use>
</mask>
<g id="SVGID_1_"></g>
<path d="M4.4375,0 C1.996875,0 0,1.996875 0,4.4375 L0,4.80729167 C0,2.36666667 1.996875,0.369791667 4.4375,0.369791667 L29.5833333,0.369791667 L29.5833333,0 L4.4375,0 Z" id="Path" fill-opacity="0.2" fill="#FFFFFF" fill-rule="nonzero" mask="url(#mask-11)"></path>
</g>
<g id="Clipped">
<mask id="mask-13" fill="white">
<use xlink:href="#path-12"></use>
</mask>
<g id="SVGID_1_"></g>
<path d="M42.8958333,64.7135417 L4.4375,64.7135417 C1.996875,64.7135417 0,62.7166667 0,60.2760417 L0,60.6458333 C0,63.0864583 1.996875,65.0833333 4.4375,65.0833333 L42.8958333,65.0833333 C45.3364583,65.0833333 47.3333333,63.0864583 47.3333333,60.6458333 L47.3333333,60.2760417 C47.3333333,62.7166667 45.3364583,64.7135417 42.8958333,64.7135417 Z" id="Path" fill-opacity="0.2" fill="#263238" fill-rule="nonzero" mask="url(#mask-13)"></path>
</g>
<g id="Clipped">
<mask id="mask-15" fill="white">
<use xlink:href="#path-14"></use>
</mask>
<g id="SVGID_1_"></g>
<path d="M34.0208333,17.75 C31.5691146,17.75 29.5833333,15.7642188 29.5833333,13.3125 L29.5833333,13.6822917 C29.5833333,16.1340104 31.5691146,18.1197917 34.0208333,18.1197917 L47.3333333,18.1197917 L47.3333333,17.75 L34.0208333,17.75 Z" id="Path" fill-opacity="0.1" fill="#263238" fill-rule="nonzero" mask="url(#mask-15)"></path>
</g>
</g>
<path d="M29.5833333,0 L4.4375,0 C1.996875,0 0,1.996875 0,4.4375 L0,60.6458333 C0,63.0864583 1.996875,65.0833333 4.4375,65.0833333 L42.8958333,65.0833333 C45.3364583,65.0833333 47.3333333,63.0864583 47.3333333,60.6458333 L47.3333333,17.75 L29.5833333,0 Z" id="Path" fill="url(#radialGradient-16)" fill-rule="nonzero"></path>
</g>
</g>
</g>
</g>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 60 KiB

app/assets/stylesheets/application.css.scss
+22 -39
View File
@@ -1,11 +1,9 @@
@import "bulma/sass/utilities/initial-variables";
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,500;1,300;1,400&family=Lobster&family=Comfortaa:wght@400;500;600;700&display=swap');
@import url('https://use.fontawesome.com/releases/v5.12.0/css/all.css');
$family-sans-serif: 'Roboto',
sans-serif;
$family-secondary: 'Comfortaa',
cursive;
@import url('https://fonts.googleapis.com/css2?family=Calistoga&family=Roboto:wght@100;400&display=swap');
$family-sans-serif: 'Roboto', sans-serif;
// // https://coolors.co/06aed5-086788-f0c808-fff1d0-dd1c1a
// $blue: #083d77;
// $red: #dd1c1a;
@@ -28,8 +26,12 @@ $light: #fff;
@import "checkmark-icon";
@import './demo';
.is-font-logo {
font-family: 'Lobster', cursive;
.is-logo {
font-family: $family-sans-serif;
color: $grey;
a, a:visited {
color: $grey;
}
}
.card {
@@ -40,17 +42,17 @@ $light: #fff;
height: 100vh;
}
.content {
&>h1 {
margin-bottom: 40px;
}
}
body {
min-height: 100vh;
}
h1, h2, h3 {
font-family: 'Calistoga';
margin-bottom: 10px;
}
.button.google {
background: rgb(225, 98, 89);
color: white;
@@ -99,20 +101,6 @@ Colours
}
}
@import url('https://fonts.googleapis.com/css?family=Calistoga|Open+Sans&display=swap');
h1,
h2,
h3 {
font-family: 'Calistoga';
margin-bottom: 10px;
}
p,
a,
span {
font-family: 'Open Sans', sans-serif;
font-weight: 400;
}
.features .columns {
margin-bottom: 3em;
@@ -124,6 +112,13 @@ span {
.contact-form {
margin-top: 3em;
}
.tag-line {
img {
height: 30px;
vertical-align: text-bottom;
}
}
/*
Links
*/
@@ -161,23 +156,11 @@ Hero
top: 0;
right: 0;
}
@media(min-width: 1024px) {
.hero-body {
background-image: url(../img/hero.png);
background-size: 30%;
background-position: 80% 50%;
background-repeat: no-repeat;
}
}
.call-to-action {
margin-top: 2em;
}
@media(max-width: 1024px) {
margin: 0px 10px;
}
.box {
padding-top: 30px;
padding-bottom: 30px;
app/views/home/index.html.erb
+21 -28
View File
@@ -1,17 +1,16 @@
<div id="wrapper" class="has-text-centered">
<!-- Hero -->
<section id="hero" class="hero is-medium">
<div class="hero-body">
<div class="container">
<h1 class="is-size-1 is-size-3-mobile">
the form backend for designers and developers
The form backend for designers and developers
</h1>
<p class="">
Link your online forms to <span class="google-sheets">Google Sheets</span> or <span class="airtable">Airtable</span> and receive form submissions in your favorite spreadsheet tool.
<p class="tag-line is-size-5">
Link your online forms to <span class="google-sheets"><%= image_tag 'google-sheets-icon.svg' %> Google Sheets</span> or <span class="airtable"><%= image_tag 'airtable-icon.svg' %> Airtable</span> and receive form submissions in your favorite spreadsheet tool.
</p>
<p class="call-to-action">
<%= link_to "Signup", signup_url, class: 'button is-rounded is-primary has-text-white a-menu' %>
<%= link_to "Get started", signup_url, class: 'button is-rounded is-primary has-text-white a-menu' %>
or try our <%= link_to "Live demo", demo_url %>
</p>
</div>
@@ -26,15 +25,13 @@
<div class="box">
<article class="media">
<div class="media-left">
<h1 class="title">1.</h1>
<h3 class="title">1.</h3>
</div>
<div class="media-content">
<div class="content">
<h3 class="subtitle">Create a new form</h3>
<p>
tinyforms will automatically create and link a connected Google Sheets document for you.
</p>
</div>
<h3 class="title is-size-4">Create a new form</h3>
<p>
tinyforms will automatically create and link a connected Google Sheets document for you.
</p>
</div>
</article>
</div>
@@ -44,15 +41,13 @@
<div class="box">
<article class="media">
<div class="media-left">
<h1 class="title">2.</h1>
<h3 class="title">2.</h3>
</div>
<div class="media-content">
<div class="content">
<h3 class="subtitle">Point your online form to our server</h3>
<p>
Simply configure your form to POST to your tinyforms URL.
</p>
</div>
<h3 class="title is-size-4">Point your form to our server</h3>
<p>
Simply configure your form to POST to your tinyforms URL.
</p>
</div>
</article>
</div>
@@ -62,15 +57,13 @@
<div class="box">
<article class="media">
<div class="media-left">
<h1 class="title">3.</h1>
<h3 class="title">3.</h3>
</div>
<div class="media-content">
<div class="content">
<h3 class="subtitle">Done!</h3>
<p>
tinyforms will automatically append each submission to your Google Sheets or Airtable document.
</p>
</div>
<h3 class="title is-size-4">Done!</h3>
<p>
tinyforms will automatically append each submission to your Google Sheets or Airtable document.
</p>
</div>
</article>
</div>
@@ -142,7 +135,7 @@
<br>
We take care of the storage for you.
<br>
Files are added as secure links to your spreadsheet.
Files are added as secure links to your spreadsheet.
</p>
</div>
<div class="column">
@@ -150,7 +143,7 @@
JavaScript/AJAX ready
</h3>
<p class="paragraph">
Use our JavaScript library or our API directly to submit data using JavaScript.
Use our JavaScript library or our API directly to submit data using JavaScript.
</p>
</div>
</div>
app/views/layouts/_header.html.erb
+3 -3
View File
@@ -1,9 +1,9 @@
<nav class="navbar" role="navigation" aria-label="main navigation">
<div class="container">
<div class="navbar-brand">
<a class="navbar-item is-size-4 has-text-black has-text-weight-bold is-font-logo" href="/">
TinyForms
</a>
<h1 class="navbar-item is-size-4 is-logo">
<a href="/">tinyfor.ms</a>
</h1>
<a role="button" class="navbar-burger burger" aria-label="menu" aria-expanded="false"
data-target="navbar-menu">