cleaning up css styles for mobile. Removing menu on confirmation / message pages

This commit is contained in:
Cole Krumbholz 2017-02-12 02:49:05 -05:00
parent 13c07cf20a
commit 7786909087
11 changed files with 57 additions and 31 deletions

View File

@ -211,7 +211,6 @@ table {
height: 0; }
.container {
width: 100%;
max-width: 950px;
margin: 0 auto; }
.container:after {
@ -221,8 +220,9 @@ table {
visibility: hidden;
line-height: 0;
height: 0; }
.container.narrow {
max-width: 600px; }
@media (min-width: 760px) {
.container.narrow {
max-width: 600px; } }
@media (max-width: 760px) {
.container {
max-width: 100% !important; } }
@ -717,7 +717,6 @@ a.alert-box.success:hover {
border-bottom: 5px solid #ddd; }
.dashboard table.responsive tr td {
display: block;
text-align: center;
font-size: 13px;
border-bottom: 1px dotted #ccc;
margin: 10px auto;
@ -727,7 +726,6 @@ a.alert-box.success:hover {
.dashboard table.responsive tr td:before {
content: attr(data-label);
display: block;
text-align: center;
text-transform: uppercase;
font-weight: bold; } }
.dashboard table.submissions {
@ -738,8 +736,7 @@ a.alert-box.success:hover {
.dashboard table.submissions tr:first-child td {
padding-top: 10px; }
.dashboard table.submissions td {
padding: 3px 1px;
border: 1px ridge; }
padding: 3px 1px; }
.dashboard table.submissions pre {
font-family: inherit;
margin: 0;
@ -919,6 +916,12 @@ a.alert-box.success:hover {
.html-highlight .comment {
color: #696969; }
a.button.export {
width: 11em;
text-align: center;
display: inline-block;
margin: 0 0 20px 20px; }
.slicknav_btn {
position: relative;
display: block;
@ -1303,9 +1306,6 @@ body#card {
text-align: center; }
body#card.dashboard {
padding-top: 0; }
@media screen and (max-width: 40em) {
body#card {
padding-top: 0; } }
.tooltip {
font-weight: 600;
@ -1349,21 +1349,24 @@ body#card {
padding-bottom: 1em; }
@media (max-width: 760px) {
.container {
padding-bottom: 0 !important;
padding-top: 0 !important; } }
padding-bottom: 0 !important; } }
.container.block {
padding-bottom: 1.5em;
padding-top: 1.5em; }
@media (max-width: 760px) {
.container.block {
padding-top: 0 !important;
padding-bottom: 0 !important; } }
.container.block:first-child {
padding-top: 0; }
.container.block:last-child {
padding-bottom: 0; }
.container.card {
max-width: 500px; }
@media (min-width: 760px) {
.container.card {
max-width: 500px; } }
@media (max-width: 760px) {
.container.card {
margin-right: 20px;
margin-left: 20px; } }
.container.index-card {
max-width: 950px; }

View File

@ -72,7 +72,6 @@
td {
display: block;
text-align: center;
font-size: 13px;
border-bottom: 1px dotted #ccc;
margin: 10px auto;
@ -86,7 +85,6 @@
td:before {
content: attr(data-label);
display: block;
text-align: center;
text-transform: uppercase;
font-weight: bold;
}
@ -104,7 +102,6 @@
tr:first-child td { padding-top: 10px; }
td {
padding: 3px 1px;
border: 1px ridge;
}
pre {
font-family: inherit;
@ -351,3 +348,10 @@
.attrvalue { color: #0000e6 }
.comment { color: #696969 }
}
a.button.export {
width: 11em;
text-align: center;
display: inline-block;
margin: 0 0 20px 20px;
}

View File

@ -11,7 +11,6 @@
}
.container {
width: 100%;
max-width: 950px;
margin: 0 auto;
@ -25,7 +24,9 @@
}
&.narrow {
max-width: 600px;
@media (min-width: 760px) {
max-width: 600px;
}
}
@media (max-width: 760px) {

View File

@ -40,9 +40,6 @@ body#card {
padding-top: 0;
}
@media screen and (max-width: 40em) {
padding-top: 0;
}
}
.tooltip {
@ -117,7 +114,6 @@ body#card {
@media (max-width: 760px) {
padding-bottom: 0 !important;
padding-top: 0 !important;
}
&.block {
@ -125,7 +121,6 @@ body#card {
padding-top: 1.5em;
@media (max-width: 760px) {
padding-top: 0 !important;
padding-bottom: 0 !important;
}
@ -138,7 +133,15 @@ body#card {
}
&.card {
max-width: 500px;
@media (min-width: 760px) {
max-width: 500px;
}
@media (max-width: 760px) {
margin-right: 20px;
margin-left: 20px;
}
}
&.index-card {

View File

@ -36,7 +36,8 @@
grecaptcha.render('recaptcha', {
'sitekey' : {{ config.RECAPTCHA_KEY|tojson|safe }},
'callback' : success
'callback' : success,
'size': window.innerWidth < 400 ? 'compact' : 'normal'
});
};
</script>

View File

@ -9,7 +9,8 @@
'sitekey' : {{ config.RECAPTCHA_KEY|tojson|safe }},
'callback' : function () {
document.querySelector('form').submit()
}
},
'size': window.innerWidth < 400 ? 'compact' : 'normal'
});
}
</script>

View File

@ -59,8 +59,8 @@
</div>
<div class="container block">
<div class="col-1-1 right">
<a href="{{ url_for('form-submissions', hashid=form.hashid, format='csv') }}" target="_blank" class="button">Export as CSV</a>
<a href="{{ url_for('form-submissions', hashid=form.hashid, format='json') }}" target="_blank" class="button">Export as JSON</a>
<a href="{{ url_for('form-submissions', hashid=form.hashid, format='csv') }}" target="_blank" class="button export">Export&nbsp;as&nbsp;CSV</a>
<a href="{{ url_for('form-submissions', hashid=form.hashid, format='json') }}" target="_blank" class="button export">Export&nbsp;as&nbsp;JSON</a>
</div>
{% endblock %}

View File

@ -7,7 +7,8 @@
'sitekey' : {{ config.RECAPTCHA_KEY|tojson|safe }},
'callback' : function () {
document.querySelector('form').submit()
}
},
'size': window.innerWidth < 400 ? 'compact' : 'normal'
});
}
</script>

View File

@ -40,6 +40,7 @@ ga('send', 'pageview');
{% endwith %}
</noscript>
{% block nav %}
<nav>
{% if g.user.is_authenticated %}
<div class="greetings">
@ -63,6 +64,7 @@ ga('send', 'pageview');
{% endif %}
</div>
</nav>
{% endblock %}
<div class="row">
{% block base %}

View File

@ -1,5 +1,7 @@
{% extends 'layouts/base.html' %}
{% block nav %}{% endblock %}
{% block footer %}
<div class="container narrow">
<p class="footer">Powered by {{config.SERVICE_NAME}}. <a href="{{config.SERVICE_URL}}">Read more.</a></p>

8
web/test2.html Normal file
View File

@ -0,0 +1,8 @@
<html>
<form action="http://localhost:5000/test@formspree.io" method="POST">
<input type="text" name="email" placeholder="email" />
<input type="text" name="message" placeholder="message" />
<input type="hidden" name="_next" value="http://localhost:8000/thanks.html"/>
<input type="submit"/>
</form>
</html>