LibreGaming
/
contentdb
14
0
Fork 0
Code Issues 13 Pull Requests Projects Releases Wiki Activity

Improve form CSS

This commit is contained in:
rubenwardy 2018-05-18 04:06:27 +01:00
parent e45b4da09a
commit b6601e5bc4
No known key found for this signature in database
GPG Key ID: A1E29D52FF81513C
3 changed files with 87 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
app/scss/components.scss
View File

@ -25,16 +25,20 @@ a:hover {
padding: 0; padding: 0;
} }
.box h3 { .box h2, .box h3 {
margin: 0; margin: 0;
padding: 1em 0.5em 0.5em 15px; padding: 0.5em 0.5em 0.5em 15px;
border-bottom: 1px solid #444; border-bottom: 1px solid #444;
} }
.box p, .box table { .box > p, .box > table, .box > .buttonset, .box > form {
margin: 1em; margin: 1em;
} }
// .box form {
// padding: 1em;
// }
.box_grey { .box_grey {
background: #333; background: #333;
border: 1px solid #444; border: 1px solid #444;
@ -62,6 +66,7 @@ a:hover {
background: #3a3a3a; background: #3a3a3a;
} }
/* /*
buttonset buttonset
*/ */
@ -77,19 +82,59 @@ a:hover {
margin: 15px 0; margin: 15px 0;
} }
.button, .buttonset li a { .button, .buttonset li a, input[type=submit], input[type=text],
input[type=password], textarea, select {
text-align: center; text-align: center;
display: inline-block; display: inline-block;
padding: 0.5em 0.7em; padding: 0.4em 1em;
background: #333; background: rgba(255,255,255,0.07);
border: 1px solid #444; border: 1px solid rgba(255,255,255,0.1);
color: #ddd; color: #ddd;
border-radius: 5px; border-radius: 5px;
text-decoration: none; text-decoration: none;
font-size: 100%;
} }
.button:hover, .buttonset li a:hover { input[type=text], input[type=password], textarea, select {
background: #444; text-align: left;
}
select {
min-width: 200px;
}
select:not([multiple]) {
background: linear-gradient(#444, #333);
}
.form-group {
padding: 8px 0;
}
.form-group label {
display: block;
vertical-align: top;
padding: 0 8px 8px 0;
}
.form-group input, .form-group textarea {
display: block;
min-width: 100%;
max-width: 100%;
}
.box .form-group input, .box .form-group textarea {
min-width: 95%;
max-width: 95%;
}
.form-group textarea {
min-height: 200px;
}
.button:hover, .buttonset li a:hover, input[type=submit]:hover {
background: rgba(255,255,255,0.13);
border: 1px solid rgba(255,255,255,0.17);
border: 1px solid #555; border: 1px solid #555;
text-decoration: none; text-decoration: none;
} }

36
app/templates/packages/create_edit.html
View File

@ -8,32 +8,28 @@
{% endblock %} {% endblock %}
{% block content %} {% block content %}
<h2>Create Package</h2>
{% from "macros/forms.html" import render_field, render_submit_field %} {% from "macros/forms.html" import render_field, render_submit_field %}
<form method="POST" action=""> <form method="POST" action="" class="tableform">
{{ form.hidden_tag() }} {{ form.hidden_tag() }}
<div class="pkg_meta"> {{ render_field(form.name, class_="pkg_meta") }}
{{ render_field(form.name) }} {{ render_field(form.title, class_="pkg_meta") }}
{{ render_field(form.title) }} {{ render_field(form.shortDesc, class_="pkg_meta") }}
{{ render_field(form.shortDesc) }} {{ render_field(form.desc, class_="pkg_meta") }}
{{ render_field(form.desc) }} {{ render_field(form.type, class_="pkg_meta") }}
{{ render_field(form.type) }} {{ render_field(form.license, class_="pkg_meta") }}
{{ render_field(form.license) }} {{ render_field(form.tags, class_="pkg_meta") }}
{{ render_field(form.tags) }}
</div>
<div class="pkg_wiz_1"> <div class="pkg_wiz_1">
<h2>Import Package</h2>
<p>Enter the repo URL for the package. <p>Enter the repo URL for the package.
If it's hosted on Github then metadata will automatically be imported.</p> If it's hosted on Github then metadata will automatically be imported.</p>
<p>Leave blank if you don't have a repo.</p> <p>Leave blank if you don't have a repo.</p>
</div> </div>
<div class="pkg_repo"> {{ render_field(form.repo, class_="pkg_repo") }}
{{ render_field(form.repo) }}
</div>
<div class="pkg_wiz_1"> <div class="pkg_wiz_1">
<a id="pkg_wiz_1_next" class="button button-primary">Next</a> <a id="pkg_wiz_1_next" class="button button-primary">Next</a>
@ -43,12 +39,10 @@
Importing... Importing...
</div> </div>
<div class="pkg_meta"> {{ render_field(form.website, class_="pkg_meta") }}
{{ render_field(form.website) }} {{ render_field(form.issueTracker, class_="pkg_meta") }}
{{ render_field(form.issueTracker) }} {{ render_field(form.forums, class_="pkg_meta") }}
{{ render_field(form.forums) }} <div class="pkg_meta">{{ render_submit_field(form.submit) }}</div>
{{ render_submit_field(form.submit) }}
</div>
</form> </form>
{% if not package.title %} {% if not package.title %}

34
app/templates/users/user_profile_page.html
View File

@ -57,34 +57,36 @@
{% endfor %} {% endfor %}
</ul> </ul>
{% if user == current_user or user.checkPerm(current_user, "CHANGE_AUTHOR") %} {% if user == current_user or user.checkPerm(current_user, "CHANGE_AUTHOR") %}
<a href="{{ url_for('create_edit_package_page', author=user.username) }}"> <p><a class="button" href="{{ url_for('create_edit_package_page', author=user.username) }}">
Create Create
</a> </a></p>
{% endif %} {% endif %}
</div> </div>
{% if form %} {% if form %}
{% from "macros/forms.html" import render_field, render_submit_field %} {% from "macros/forms.html" import render_field, render_submit_field %}
<form class="box box_grey" action="" method="POST" class="form" role="form"> <div class="box box_grey">
<h2>Edit Details</h2> <h2>Edit Details</h2>
<div class="row"> <form action="" method="POST" class="form" role="form">
<div class="col-sm-6 col-md-5 col-lg-4"> <div class="row">
{{ form.hidden_tag() }} <div class="col-sm-6 col-md-5 col-lg-4">
{{ form.hidden_tag() }}
{{ render_field(form.display_name, tabindex=230) }} {{ render_field(form.display_name, tabindex=230) }}
{% if user.checkPerm(current_user, "CHANGE_EMAIL") %} {% if user.checkPerm(current_user, "CHANGE_EMAIL") %}
{{ render_field(form.email, tabindex=240) }} {{ render_field(form.email, tabindex=240) }}
{% endif %} {% endif %}
{% if user.checkPerm(current_user, "CHANGE_RANK") %} {% if user.checkPerm(current_user, "CHANGE_RANK") %}
{{ render_field(form.rank, tabindex=250) }} {{ render_field(form.rank, tabindex=250) }}
{% endif %} {% endif %}
{{ render_submit_field(form.submit, tabindex=280) }} {{ render_submit_field(form.submit, tabindex=280) }}
</div>
</div> </div>
</div> </form>
</form> </div>
{% endif %} {% endif %}
{% endblock %} {% endblock %}