1
1
Fork 0

Better styles for forms, template indentation

dev
Jan Kužílek 5 years ago
parent cf21dc2917
commit 22e6b0db9e

@ -433,6 +433,27 @@ header {
} }
} }
} }
form {
margin: 0 auto;
width: 300px;
//text-align: center;
padding: 5px;
input {
margin: 5px 0;
//font-size: 1em;
&:not([type=checkbox]):not([type=submit]):not([type=radio]):not([type=file]) {
width: 100%;
}
&[type=file] {
//display: none;
}
}
}
} }
footer { // DUE TO OVERFLOW OF THE SIDE PANEL, TRY TO KEEP IT ON THE RIGHT footer { // DUE TO OVERFLOW OF THE SIDE PANEL, TRY TO KEEP IT ON THE RIGHT

@ -2,32 +2,32 @@
{% from '_includes.html' import render_tags, render_pagination with context %} {% from '_includes.html' import render_tags, render_pagination with context %}
{% block content %} {% block content %}
<div class="important_subwrap"> <div class="important_subwrap">
<section class="side_panel"> <section class="side_panel">
{{ render_tags() }} {{ render_tags() }}
</section> </section>
<section class="post_list"> <section class="post_list">
<div class="posts"> <div class="posts">
{% for post in posts %} {% for post in posts %}
<figure style="{{ post.flex }}"> <figure style="{{ post.flex }}">
<a href="{{ url_for('post.post_show', id=post.id) }}"> <a href="{{ url_for('post.post_show', id=post.id) }}">
<img src="{{ post.url(path=post.image_url, endpoint='thumb') }}" alt=""> <img src="{{ post.url(path=post.image_url, endpoint='thumb') }}" alt="">
</a> </a>
</figure> </figure>
{% endfor %} {% endfor %}
<!-- <figure style="flex: 307.87 1 307.87px;"> <!-- <figure style="flex: 307.87 1 307.87px;">
<a href="#"> <a href="#">
<img src="/static/ryuzu/916993.png" alt=""> <img src="/static/ryuzu/916993.png" alt="">
</a> </a>
<div class="thumb-info"> <div class="thumb-info">
<span>RyuZU²</span> <span>RyuZU²</span>
<span>1920x1080</span> <span>1920x1080</span>
<span>1.5M</span> <span>1.5M</span>
</div>
</figure> -->
</div> </div>
{{ render_pagination('post.posts') }} </figure> -->
</section>
</div> </div>
{{ render_pagination('post.posts') }}
</section>
</div>
{% endblock content %} {% endblock content %}

@ -2,22 +2,25 @@
{% from "_formhelpers.html" import errors %} {% from "_formhelpers.html" import errors %}
{% block content %} {% block content %}
<h1>Log In</h1> <form action="" method="post">
<form action="" method="post"> <h2>Log In</h2>
{{ form.csrf_token }} {{ form.csrf_token }}
<div> <div>
{{ form.username.label }} {{ form.username(size=32) }} {{ form.username(placeholder="Username") }}
{{ errors(form.username) }} {{ errors(form.username) }}
</div> </div>
<div> <div>
{{ form.password.label }} {{ form.password(size=32) }} {{ form.password(placeholder="Password") }}
{{ errors(form.password) }} {{ errors(form.password) }}
</div> </div>
<div> <div>
{{ form.remember_me() }} {{ form.remember_me.label }} {{ form.remember_me() }} {{ form.remember_me.label }}
{{ errors(form.remember_me) }} {{ errors(form.remember_me) }}
</div> </div>
<div>{{ form.submit() }}</div> <div>
</form> {{ form.submit() }}
<a href="{{ url_for('auth.reset_password') }}">Forgoten password?</a> <a href="{{ url_for('auth.reset_password') }}">Forgotten password?</a>
</div>
</form>
{% endblock content %} {% endblock content %}

@ -3,59 +3,59 @@
{% from "_formhelpers.html" import errors %} {% from "_formhelpers.html" import errors %}
{% block content %} {% block content %}
<div class="important_subwrap"> <div class="important_subwrap">
<section class="side_panel"> <section class="side_panel">
<article class="post_desc"> <article class="post_desc">
<!-- <h4>Description</h4> --> <!-- <h4>Description</h4> -->
<!-- <img src="/static/profile.jpg" alt=""> --> <!-- <img src="/static/profile.jpg" alt=""> -->
<div class="id">Id: {{ post.id }}</div> <div class="id">Id: {{ post.id }}</div>
<div class="author">Author: {{ post.author.username }}</div> <div class="author">Author: {{ post.author.username }}</div>
{% if post.is_approved %} {% if post.is_approved %}
<div class="approver">Approved by: {{ post.approver.username }}</div> <div class="approver">Approved by: {{ post.approver.username }}</div>
{% endif %} {% endif %}
{% if not post.is_approved %} {% if not post.is_approved %}
<div class="status">Status: {{ post.status.name.capitalize() }}</div> <div class="status">Status: {{ post.status.name.capitalize() }}</div>
{% endif %} {% endif %}
<div class="time">Posted: 10 hours ago</div> <div class="time">Posted: 10 hours ago</div>
<div class="source">Source: <a href="{{ post.source }}">{{ post.source }}</a></div> <div class="source">Source: <a href="{{ post.source }}">{{ post.source }}</a></div>
<div class="size">File size: {{ post.filesize_human }}</div> <div class="size">File size: {{ post.filesize_human }}</div>
<div class="resolution">Image res: {{ post.image_resolution }}</div> <div class="resolution">Image res: {{ post.image_resolution }}</div>
<div class="jpeg"><a href="{{ post.url(path=post.image_url, endpoint='jpeg') }}">Enlarge image</a></div> <div class="jpeg"><a href="{{ post.url(path=post.image_url, endpoint='jpeg') }}">Enlarge image</a></div>
{% if post.filetype.name == 'png' %} {% if post.filetype.name == 'png' %}
<div class="png"><a href="{{ post.url(path=post.image_url) }}">Original PNG file</a></div> <div class="png"><a href="{{ post.url(path=post.image_url) }}">Original PNG file</a></div>
{% endif %} {% endif %}
</article> </article>
{{ render_tags() }} {{ render_tags() }}
{% if post.can_edit %} {% if post.can_edit %}
{{ render_post_edit() }} {{ render_post_edit() }}
{% endif %} {% endif %}
</section> </section>
<section class="post_single"> <section class="post_single">
<div class="image"> <div class="image">
<img src="{{ post.url(path=post.image_url, endpoint='jpeg') }}" alt=""> <img src="{{ post.url(path=post.image_url, endpoint='jpeg') }}" alt="">
</div>
</section>
</div> </div>
<section class="comments"> </section>
<h3>Comments</h3> </div>
{{ render_comments() }} <section class="comments">
<h3>Comments</h3>
{{ render_comments() }}
{% if current_user.is_authenticated %} {% if current_user.is_authenticated %}
<div class="form"> <div class="form">
<h3>Reply</h3> <h3>Reply</h3>
<form action="{{ url_for('post.comment') }}" method="post"> <form action="{{ url_for('post.comment') }}" method="post">
{{ comment_form.csrf_token }} {{ comment_form.csrf_token }}
{{ comment_form.post_id() }} {{ comment_form.post_id() }}
<div> <div>
{{ comment_form.content(cols=55, rows=6) }} {{ comment_form.content(cols=55, rows=6) }}
{{ errors(comment_form.content) }} {{ errors(comment_form.content) }}
</div>
<div>{{ comment_form.submit() }}</div>
</form>
</div> </div>
{% else %} <div>{{ comment_form.submit() }}</div>
<h4>To comment, please log in.</h3> </form>
{% endif %} </div>
</section> {% else %}
<h4>To comment, please log in.</h3>
{% endif %}
</section>
{% endblock content %} {% endblock content %}

@ -2,25 +2,28 @@
{% from "_formhelpers.html" import errors %} {% from "_formhelpers.html" import errors %}
{% block content %} {% block content %}
<h1>Log In</h1> <form action="" method="post">
<form action="" method="post"> <h2>Sign Up</h2>
{{ form.csrf_token }} {{ form.csrf_token }}
<div> <div>
{{ form.username.label }} {{ form.username(size=32) }} {{ form.username(placeholder="Username") }}
{{ errors(form.username) }} {{ errors(form.username) }}
</div> </div>
<div> <div>
{{ form.email.label }} {{ form.email(size=32) }} {{ form.email(placeholder="Email address") }}
{{ errors(form.email) }} {{ errors(form.email) }}
</div> </div>
<div> <div>
{{ form.password.label }} {{ form.password(size=32) }} {{ form.password(placeholder="Password") }}
{{ errors(form.password) }} {{ errors(form.password) }}
</div> </div>
<div> <div>
{{ form.password_again.label }} {{ form.password_again(size=32) }} {{ form.password_again(placeholder="Repeat password") }}
{{ errors(form.password_again) }} {{ errors(form.password_again) }}
</div> </div>
<div>{{ form.submit() }}</div> <div>
</form> {{ form.submit() }}
<a href="{{ url_for('auth.login') }}">Already registered?</a>
</div>
</form>
{% endblock content %} {% endblock content %}

@ -2,13 +2,18 @@
{% from "_formhelpers.html" import errors %} {% from "_formhelpers.html" import errors %}
{% block content %} {% block content %}
<h1>Log In</h1> <form action="" method="post">
<form action="" method="post"> <h2>Reset password</h2>
{{ form.csrf_token }} <p>
<div> Please insert your email address and we will send you a request for password reset.
{{ form.email.label }} {{ form.email(size=32) }} </p>
{{ errors(form.email) }} {{ form.csrf_token }}
</div> <div>
<div>{{ form.submit() }}</div> {{ form.email(placeholder="Your email address") }}
</form> {{ errors(form.email) }}
</div>
<div>
{{ form.submit() }}
</div>
</form>
{% endblock content %} {% endblock content %}

@ -2,25 +2,25 @@
{% from "_formhelpers.html" import errors %} {% from "_formhelpers.html" import errors %}
{% block content %} {% block content %}
<h1>Upload image</h1> <form action="" method="post" enctype="multipart/form-data">
<form action="" method="post" enctype="multipart/form-data"> <h2>Upload post</h2>
{{ form.csrf_token }} {{ form.csrf_token }}
<div> <div>
{{ form.post_img.label }} {{ form.post_img() }} {{ form.post_img.label }} {{ form.post_img() }}
{{ errors(form.post_img) }} {{ errors(form.post_img) }}
</div> </div>
<div> <div>
{{ form.sauce.label }} {{ form.sauce() }} {{ form.sauce(placeholder="Source URL") }}
{{ errors(form.sauce) }} {{ errors(form.sauce) }}
</div> </div>
<div> <div>
{{ form.tags.label }} {{ form.tags() }} {{ form.tags(placeholder="Tags") }}
{{ errors(form.tags) }} {{ errors(form.tags) }}
</div> </div>
<div> <div>
{{ form.rating.label }} {% for r in form.rating %}{{ r.label }}{{ r() }}{% endfor %} {{ form.rating.label }} {% for r in form.rating %}{{ r.label }}{{ r() }}{% endfor %}
{{ errors(form.rating) }} {{ errors(form.rating) }}
</div> </div>
<div>{{ form.submit() }}</div> <div>{{ form.submit() }}</div>
</form> </form>
{% endblock content %} {% endblock content %}
Loading…
Cancel
Save