Semantic UI version
This commit is contained in:
parent
b82cacc665
commit
b54674c703
@ -85,6 +85,7 @@ class CalendarSocialApp(Flask):
|
||||
self.config.from_pyfile(f'config_{config_name}.py', True)
|
||||
# Make sure we look up users both by their usernames and email addresses
|
||||
self.config['SECURITY_USER_IDENTITY_ATTRIBUTES'] = ('username', 'email')
|
||||
self.config['SECURITY_LOGIN_USER_TEMPLATE'] = 'login.html'
|
||||
db.init_app(self)
|
||||
babel = Babel(app=self)
|
||||
babel.localeselector(get_locale)
|
||||
|
@ -2,6 +2,14 @@ header > h1 > img {
|
||||
height: 1em;
|
||||
}
|
||||
|
||||
#content {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.timezone-warning {
|
||||
color: #e94a4a;
|
||||
}
|
||||
|
||||
footer {
|
||||
margin-top: 3em;
|
||||
font-weight: bold;
|
||||
@ -14,3 +22,68 @@ footer {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
table.calendar > * {
|
||||
font-family: sans;
|
||||
}
|
||||
|
||||
table.calendar {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
table-layout: fixed;
|
||||
}
|
||||
|
||||
tr.month > td {
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
border-bottom: 2px solid black;
|
||||
padding-bottom: .5em;
|
||||
}
|
||||
|
||||
tr.month > td > a {
|
||||
font-weight: normal;
|
||||
color: black;
|
||||
}
|
||||
|
||||
tr.month > td.month-name > a {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
tr.days > td {
|
||||
text-align: center;
|
||||
border-bottom: 2px solid black;
|
||||
}
|
||||
|
||||
tr.week > td {
|
||||
height: 3em;
|
||||
}
|
||||
|
||||
tr.week > td > span.day-num {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
tr.week > td.other-month > span.day-num {
|
||||
font-weight: normal;
|
||||
color: #909090;
|
||||
}
|
||||
|
||||
tr.week > td.today {
|
||||
background-color: #d8d8d8;
|
||||
}
|
||||
|
||||
tr.week > td > a.event {
|
||||
display: block;
|
||||
color: black;
|
||||
text-decoration: none;
|
||||
border: 1px solid green;
|
||||
background-color: white;
|
||||
border-radius: 2px;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
tr.sizer > td {
|
||||
width: 14.2857%;
|
||||
height: 0;
|
||||
}
|
||||
|
364
calsocial/static/semantic/semantic.min.css
vendored
Normal file
364
calsocial/static/semantic/semantic.min.css
vendored
Normal file
File diff suppressed because one or more lines are too long
11
calsocial/static/semantic/semantic.min.js
vendored
Normal file
11
calsocial/static/semantic/semantic.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
@ -1,4 +1,5 @@
|
||||
{% macro field(field, inline=false) %}
|
||||
<div class="{% if inline %}inline {% endif %}field">
|
||||
{% if field.errors %}
|
||||
{% for error in field.errors %}
|
||||
{{ error }}
|
||||
@ -10,12 +11,10 @@
|
||||
{% endif %}
|
||||
{{ field }}
|
||||
{% if field.widget.input_type == 'checkbox' %}
|
||||
{{ field.label }}
|
||||
{% endif %}
|
||||
{% if not inline %}
|
||||
<br>
|
||||
{{ field.label }}<br>
|
||||
{% endif %}
|
||||
{% if field.description %}
|
||||
{{ field.description }}
|
||||
{% endif %}
|
||||
</div>
|
||||
{% endmacro %}
|
||||
|
@ -9,6 +9,7 @@
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="{{ url_for('static', filename='images/calendar-social-icon-192.png') }}">
|
||||
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/fork-awesome@1.1.0/css/fork-awesome.min.css" integrity="sha256-sX8HLspqYoXVPetzJRE4wPhIhDBu2NB0kYpufzkQSms=" crossorigin="anonymous">
|
||||
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='semantic/semantic.min.css') }}">
|
||||
|
||||
<link rel="stylesheet" href="{{ url_for('static', filename='css/style.css') }}" type="text/css">
|
||||
|
||||
@ -18,30 +19,34 @@
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<h1>
|
||||
<div class="ui top attached menu">
|
||||
<div class="header item">
|
||||
<img src="{{ url_for('static', filename='images/calendar-social-icon.svg') }}">
|
||||
Calendar.social
|
||||
</h1>
|
||||
<nav class="menu">
|
||||
{% if current_user.is_authenticated %}
|
||||
{{ _('Logged in as %(username)s', username=('<a href="' + url_for('display_profile', username=current_user.username) + '">' + current_user.username + '</a>') | safe) }}
|
||||
{% endif %}
|
||||
<ul>
|
||||
</div>
|
||||
<div class="right menu">
|
||||
{% if not current_user.is_authenticated %}
|
||||
<li><a href="{{ url_for('security.login') }}">{% trans %}Login{% endtrans %}</a></li>
|
||||
<a class="item" href="{{ url_for('security.login') }}">{% trans %}Login{% endtrans %}</a>
|
||||
{% else %}
|
||||
<li><a href="{{ url_for('hello') }}">{% trans %}Calendar view{% endtrans %}</a></li>
|
||||
<li><a href="{{ url_for('notifications') }}">{% trans %}Notifications{% endtrans %}</a></li>
|
||||
<li><a href="{{ url_for('settings') }}">{% trans %}Settings{% endtrans %}</a></li>
|
||||
<li><a href="{{ url_for('security.logout') }}">{% trans %}Logout{% endtrans %}</a></li>
|
||||
<div class="item">
|
||||
{{ _('Logged in as %(username)s', username=('<a href="' + url_for('display_profile', username=current_user.username) + '">' + current_user.username + '</a>') | safe) }}
|
||||
</div>
|
||||
<a class="item" href="{{ url_for('hello') }}">{% trans %}Calendar view{% endtrans %}</a>
|
||||
<a class="item" href="{{ url_for('notifications') }}">{% trans %}Notifications{% endtrans %}</a>
|
||||
<a class="item" href="{{ url_for('settings') }}">{% trans %}Settings{% endtrans %}</a>
|
||||
<a class="item" href="{{ url_for('security.logout') }}">{% trans %}Logout{% endtrans %}</a>
|
||||
{% endif %}
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<div class="ui container" id="content">
|
||||
{% block content %}{% endblock %}
|
||||
<footer>
|
||||
</div>
|
||||
<footer class="ui segment">
|
||||
Soon…™
|
||||
</footer>
|
||||
{% block scripts %}{% endblock %}
|
||||
<script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
|
||||
<script src="{{ url_for('static', filename='semantic/semantic.min.js') }}"></script> <link rel="stylesheet" href="{{ url_for('static', filename='css/style.css') }}" type="text/css">
|
||||
</body>
|
||||
</html>
|
||||
|
@ -2,15 +2,23 @@
|
||||
{% from '_macros.html' import field %}
|
||||
|
||||
{% block content %}
|
||||
<h1>
|
||||
<h2 class="ui header">
|
||||
<div class="content">
|
||||
{{ event.title }}<br>
|
||||
<small>
|
||||
{{ event.start_time_for_user(current_user) }}–{{ event.end_time_for_user(current_user) }}
|
||||
{% if current_user.timezone | string != event.time_zone %}
|
||||
({{ event.start_time_tz }}–{{ event.end_time_tz }} {{ event.time_zone }})
|
||||
<div class="sub header">
|
||||
{%- if current_user.timezone | string != event.time_zone -%}
|
||||
<span title="{{ _('This event is organised in the %(timezone)s time zone, in which it happens between %(start_time)s and %(end_time)s', timezone=event.time_zone, start_time=event.start_time_tz|datetimeformat(rebase=false), end_time=event.end_time_tz|datetimeformat(rebase=false)) }}">
|
||||
<i class="fa fa-exclamation-triangle timezone-warning"></i>
|
||||
<span class="sr-only">
|
||||
{{ _('This event is organised in the %(timezone)s time zone, in which it happens between %(start_time)s and %(end_time)s', timezone=event.time_zone, start_time=event.start_time_tz, end_time=event.end_time_tz) }}
|
||||
</span>
|
||||
</span>
|
||||
{% endif %}
|
||||
</small>
|
||||
</h1>
|
||||
{{ event.start_time_for_user(current_user) | datetimeformat(rebase=false) }}
|
||||
–
|
||||
{{ event.end_time_for_user(current_user) | datetimeformat(rebase=false) }}
|
||||
</div>
|
||||
</h2>
|
||||
{{ event.description }}
|
||||
<hr>
|
||||
<h2>{% trans %}Invited users{% endtrans %}</h2>
|
||||
@ -26,11 +34,12 @@
|
||||
</ul>
|
||||
<hr>
|
||||
<h2>{% trans %}Invite{% endtrans %}</h2>
|
||||
<form method="post">
|
||||
<form method="post" class="ui form">
|
||||
{{ form.hidden_tag() }}
|
||||
|
||||
<div class="inline fields">
|
||||
{{ field(form.invitee, inline=true) }}
|
||||
|
||||
<button type="submit">{% trans %}Invite{% endtrans %}</button>
|
||||
<button type="submit" class="ui button">{% trans %}Invite{% endtrans %}</button>
|
||||
</div>
|
||||
</form>
|
||||
{% endblock %}
|
||||
|
@ -3,7 +3,7 @@
|
||||
|
||||
{% block content %}
|
||||
<h2>Create event</h2>
|
||||
<form method="post">
|
||||
<form method="post" class="ui form">
|
||||
{{ form.hidden_tag() }}
|
||||
|
||||
{% if form.errors %}
|
||||
@ -20,7 +20,7 @@
|
||||
{{ field(form.all_day) }}
|
||||
{{ field(form.description) }}
|
||||
|
||||
<button type="submit">{% trans %}Save{% endtrans %}</button>
|
||||
<a href="{{ url_for('hello') }}">Cancel</a>
|
||||
<button type="submit" class="ui primary button">{% trans %}Save{% endtrans %}</button>
|
||||
<a href="{{ url_for('hello') }}" class="ui button">Cancel</a>
|
||||
</form>
|
||||
{% endblock content %}
|
||||
|
@ -9,17 +9,19 @@
|
||||
<p>
|
||||
{% trans %}These are the first steps you should make before you can start using the site.{% endtrans %}
|
||||
</p>
|
||||
<form method="post">
|
||||
{{ form.errors }}
|
||||
<form method="post" class="ui form">
|
||||
{{ form.hidden_tag() }}
|
||||
|
||||
<p>
|
||||
{{ field(form.display_name) }}
|
||||
</p>
|
||||
<p>
|
||||
{{ field(form.time_zone) }}
|
||||
</p>
|
||||
{% if form.errors %}
|
||||
{% for error in form.errors %}
|
||||
{{ error }}
|
||||
{% endfor %}
|
||||
<br>
|
||||
{% endif %}
|
||||
|
||||
<button type="submit">{% trans %}Save{% endtrans %}</button>
|
||||
{{ field(form.display_name) }}
|
||||
{{ field(form.time_zone) }}
|
||||
|
||||
<button type="submit" class="ui primary button">{% trans %}Save{% endtrans %}</button>
|
||||
</form>
|
||||
{% endblock content %}
|
||||
|
@ -2,12 +2,22 @@
|
||||
|
||||
{% block content %}
|
||||
<h2>{% trans %}Follow requests{% endtrans %}</h2>
|
||||
{% if requests.count() %}
|
||||
<ul>
|
||||
{% for req in requests %}
|
||||
<li>
|
||||
{{ req.follower }}
|
||||
<a href="{{ url_for('accept_follow', follower_id=req.follower_id) }}">{% trans %}Accept{% endtrans %}</a>
|
||||
<a href="{{ url_for('accept_follow', follower_id=req.follower_id) }}" class="ui button">{% trans %}Accept{% endtrans %}</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
{% else %}
|
||||
{% trans %}No requests to display.{% endtrans %}
|
||||
{% endif %}
|
||||
{% if not current_user.profile.locked %}
|
||||
<p>
|
||||
{% trans %}Your profile is not locked.{% endtrans %}
|
||||
{% trans %}Anyone can follow you without your consent.{% endtrans %}
|
||||
</p>
|
||||
{% endif %}
|
||||
{% endblock content %}
|
||||
|
@ -5,5 +5,5 @@
|
||||
|
||||
{% include 'month-view.html' %}
|
||||
|
||||
<a href="{{ url_for('new_event') }}">{% trans %}Add event{% endtrans %}</a>
|
||||
<a href="{{ url_for('new_event') }}" class="ui primary button">{% trans %}Add event{% endtrans %}</a>
|
||||
{% endblock content %}
|
||||
|
26
calsocial/templates/login.html
Normal file
26
calsocial/templates/login.html
Normal file
@ -0,0 +1,26 @@
|
||||
{#
|
||||
FIXME: This template should live under security/ if the app templates would override extension
|
||||
templates…
|
||||
#}
|
||||
{% extends 'base.html' %}
|
||||
{% from '_macros.html' import field %}
|
||||
|
||||
{% block content %}
|
||||
<h1>{% trans %}Login{% endtrans %}</h1>
|
||||
<form method="post" class="ui form">
|
||||
{{ login_user_form.hidden_tag() }}
|
||||
|
||||
{% if login_user_form.errors %}
|
||||
{% for error in login_user_form.errors %}
|
||||
{{ error }}
|
||||
{% endfor %}
|
||||
<br>
|
||||
{% endif %}
|
||||
|
||||
{{ field(login_user_form.email) }}
|
||||
{{ field(login_user_form.password) }}
|
||||
{{ field(login_user_form.remember) }}
|
||||
|
||||
<button type="submit" class="ui primary button">{% trans %}Login{% endtrans %}</button>
|
||||
</form>
|
||||
{% endblock %}
|
@ -1,69 +1,3 @@
|
||||
<style>
|
||||
table.calendar > * {
|
||||
font-family: sans;
|
||||
}
|
||||
|
||||
table.calendar {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
table-layout: fixed;
|
||||
}
|
||||
|
||||
tr.month > td {
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
border-bottom: 2px solid black;
|
||||
padding-bottom: .5em;
|
||||
}
|
||||
|
||||
tr.month > td > a {
|
||||
font-weight: normal;
|
||||
color: black;
|
||||
}
|
||||
|
||||
tr.month > td.month-name > a {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
tr.days > td {
|
||||
text-align: center;
|
||||
border-bottom: 2px solid black;
|
||||
}
|
||||
|
||||
tr.week > td {
|
||||
height: 3em;
|
||||
}
|
||||
|
||||
tr.week > td > span.day-num {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
tr.week > td.other-month > span.day-num {
|
||||
font-weight: normal;
|
||||
color: #909090;
|
||||
}
|
||||
|
||||
tr.week > td.today {
|
||||
background-color: #d8d8d8;
|
||||
}
|
||||
|
||||
tr.week > td > a.event {
|
||||
display: block;
|
||||
color: black;
|
||||
text-decoration: none;
|
||||
border: 1px solid green;
|
||||
background-color: white;
|
||||
border-radius: 2px;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
tr.sizer > td {
|
||||
width: 14.2857%;
|
||||
height: 0;
|
||||
}
|
||||
</style>
|
||||
<table class="calendar">
|
||||
<thead>
|
||||
<tr class="sizer">
|
||||
|
@ -3,5 +3,7 @@
|
||||
{% block content %}
|
||||
{% for notif in notifs %}
|
||||
{{ notif.html }}<br>
|
||||
{% else %}
|
||||
{% trans %}Nothing to show.{% endtrans %}
|
||||
{% endfor %}
|
||||
{% endblock content %}
|
||||
|
@ -1,16 +1,21 @@
|
||||
{% extends 'settings-base.html' %}
|
||||
{% from '_macros.html' import field %}
|
||||
|
||||
{% block content %}
|
||||
{{ super() }}
|
||||
{% block settings_content %}
|
||||
<h2>{% trans %}Edit profile{% endtrans %}</h2>
|
||||
<form method="post">
|
||||
<form method="post" class="ui form">
|
||||
{{ form.hidden_tag() }}
|
||||
{{ form.errors }}
|
||||
|
||||
{% if form.errors %}
|
||||
{% for error in form.errors %}
|
||||
{{ error }}
|
||||
{% endfor %}
|
||||
<br>
|
||||
{% endif %}
|
||||
|
||||
{{ field(form.display_name) }}
|
||||
{{ field(form.locked) }}
|
||||
{{ field(form.locked, inline=true) }}
|
||||
|
||||
<button type="submit">{% trans %}Save{% endtrans %}</button>
|
||||
<button type="submit" class="ui primary button">{% trans %}Save{% endtrans %}</button>
|
||||
</form>
|
||||
{% endblock content %}
|
||||
{% endblock settings_content %}
|
||||
|
@ -2,15 +2,18 @@
|
||||
{% from '_macros.html' import field %}
|
||||
|
||||
{% block content %}
|
||||
<form method="post">
|
||||
{{ form.errors }}
|
||||
<form method="post" class="ui form">
|
||||
{{ form.hidden_tag() }}
|
||||
|
||||
{% for error in form.errors %}
|
||||
{{ form.errors }}
|
||||
{% endfor %}
|
||||
|
||||
{{ field(form.username) }}
|
||||
{{ field(form.email) }}
|
||||
{{ field(form.password) }}
|
||||
{{ field(form.password_retype) }}
|
||||
|
||||
<button type="submit">{% trans %}Register{% endtrans %}</button>
|
||||
<button type="submit" class="ui primary button">{% trans %}Register{% endtrans %}</button>
|
||||
</form>
|
||||
{% endblock %}
|
||||
|
@ -1,10 +1,15 @@
|
||||
{% extends 'base.html' %}
|
||||
|
||||
{% block content %}
|
||||
<nav>
|
||||
<ul>
|
||||
<li><a href="{{ url_for('edit_profile') }}">{% trans %}Edit profile{% endtrans %}</a></li>
|
||||
<li><a href="{{ url_for('settings') }}">{% trans %}Settings{% endtrans %}</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<div class="ui grid">
|
||||
<div class="four wide column">
|
||||
<div class="ui secondary pointing vertical menu">
|
||||
<a class="item{% if request.endpoint == 'edit_profile' %} active{% endif %}" href="{{ url_for('edit_profile') }}">{% trans %}Edit profile{% endtrans %}</a>
|
||||
<a class="item{% if request.endpoint == 'settings' %} active{% endif %}" href="{{ url_for('settings') }}">{% trans %}Settings{% endtrans %}</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="twelve wide stretched column">
|
||||
{% block settings_content %}{% endblock %}
|
||||
</div>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
@ -1,18 +1,20 @@
|
||||
{% extends 'settings-base.html' %}
|
||||
{% from '_macros.html' import field %}
|
||||
|
||||
{% block content %}
|
||||
{{ super() }}
|
||||
{% block settings_content %}
|
||||
<h2>{% trans %}Settings{% endtrans %}</h2>
|
||||
<form method="post">
|
||||
<form method="post" class="ui form">
|
||||
{{ form.hidden_tag() }}
|
||||
|
||||
{{ form.errors }}
|
||||
{% if form.errors %}
|
||||
{% for error in form.errors %}
|
||||
{{ error }}
|
||||
{% endfor %}
|
||||
<br>
|
||||
{% endif %}
|
||||
|
||||
{{ field(form.timezone) }}
|
||||
|
||||
<button type="submit">{% trans %}Save{% endtrans %}</button>
|
||||
<a href="{{ url_for('hello') }}">Cancel</a>
|
||||
<button type="submit" class="ui primary button">{% trans %}Save{% endtrans %}</button>
|
||||
</form>
|
||||
{% endblock content %}
|
||||
{% endblock settings_content %}
|
||||
|
Loading…
Reference in New Issue
Block a user