Verified Commit d750e8c7 authored by Sébastiaan Versteeg's avatar Sébastiaan Versteeg
Browse files

Create constants for thumbnail sizes and make navbar sticky

parent 3fcf53fd
......@@ -23,7 +23,7 @@
<a href="{{ board.get_absolute_url }}" class="current-board col-12 text-center">
{% if board.photo %}
<img alt="{{ board.name }}"
src="{% thumbnail board.photo '1024x683' fit=False %}">
src="{% thumbnail board.photo THUMBNAIL_SIZE_LARGE fit=False %}">
{% else %}
<img alt="{{ board.name }}"
src="{% static 'activemembers/images/placeholder.png' %}">
......
......@@ -13,7 +13,7 @@
<div class="row">
{% if membergroup.photo %}
<img alt="{{ membergroup.name }}" class="col-12"
src="{% thumbnail membergroup.photo '1024x683' fit=False %}">
src="{% thumbnail membergroup.photo THUMBNAIL_SIZE_LARGE fit=False %}">
{% else %}
<img alt="{{ membergroup.name }}" class="col-12"
src="{% static 'activemembers/images/placeholder.png' %}">
......
from django import template
from django.conf import settings
from django.templatetags.static import static
from django.utils.translation import ugettext_lazy as _
......@@ -13,7 +14,7 @@ register = template.Library()
def membergroup_card(group):
image_url = static('activemembers/images/placeholder_overview.png')
if group.photo:
image_url = thumbnail(group.photo, '220x220')
image_url = thumbnail(group.photo, settings.THUMBNAIL_SIZES['medium'])
return grid_item(
title=group.name,
......@@ -31,9 +32,9 @@ def membergroup_member_card(membership):
since_text = _('Committee member since: ') + '?'
if membership['since'].year > 1970:
since_text = _('Committee member since: ') + str(membership['since'].year)
meta_text += '<p>{}</p>'.format(since_text)
meta_text += '<p class="px-1">{}</p>'.format(since_text)
if 'role' in membership and membership['role']:
meta_text += '<p>{}</p>'.format(membership['role'])
meta_text += '<p class="px-1">{}</p>'.format(membership['role'])
ribbon = None
if membership['chair']:
ribbon = _('Chair')
......
from base64 import b64encode
from django.conf import settings
from django.contrib.staticfiles.finders import find as find_static_file
from django.templatetags.static import static
from django.urls import reverse
......@@ -136,7 +138,7 @@ class MemberListSerializer(serializers.ModelSerializer):
def _photo(self, instance):
if instance.profile.photo:
return self.context['request'].build_absolute_uri(
thumbnail(instance.profile.photo, '220x220', 1))
thumbnail(instance.profile.photo, settings.THUMBNAIL_SIZES['medium'], 1))
else:
return self.context['request'].build_absolute_uri(
static('members/images/default-avatar.jpg'))
......
from django import template
from django.conf import settings
from django.templatetags.static import static
from django.urls import reverse
from django.utils.translation import ugettext_lazy as _
......@@ -12,15 +13,15 @@ register = template.Library()
@register.inclusion_tag('includes/grid_item.html')
def member_card(member, meta_text=None, ribbon=None):
if meta_text is None and member.profile.starting_year:
meta_text = "{}: {}".format(_('Cohort'), member.profile.starting_year)
meta_text = '<p class="px-1">{}: {}</p>'.format(_('Cohort'), member.profile.starting_year)
image_url = static('members/images/default-avatar.jpg')
if member.profile.photo:
image_url = thumbnail(member.profile.photo, '220x220')
image_url = thumbnail(member.profile.photo, settings.THUMBNAIL_SIZES['medium'])
return grid_item(
title=member.profile.display_name(),
meta_text='<p>{}<p/>'.format(meta_text),
meta_text=meta_text,
url=reverse('members:profile', kwargs={'pk': member.pk}),
image_url=image_url,
ribbon=ribbon,
......
......@@ -3,8 +3,9 @@ from utils.templatetags.thumbnail import thumbnail
def create_image_thumbnail_dict(request, file, placeholder='',
size_small='110x110', size_medium='220x220',
size_large='1024x768'):
size_small=settings.THUMBNAIL_SIZES['small'],
size_medium=settings.THUMBNAIL_SIZES['medium'],
size_large=settings.THUMBNAIL_SIZES['large']):
if file:
return {
'full': request.build_absolute_uri('{}{}'.format(
......
......@@ -3,8 +3,18 @@ These context processors can be used to expand the context provided
tos views.
"""
import os
from django.conf import settings
def source_commit(_):
"""Get the SOURCE_COMMIT environment variable"""
return {'SOURCE_COMMIT': os.environ.get('SOURCE_COMMIT', 'unknown')}
def thumbnail_sizes(_):
"""Get the defined sizes for thumbnails"""
return {
'THUMBNAIL_SIZE_SMALL': settings.THUMBNAIL_SIZES['small'],
'THUMBNAIL_SIZE_MEDIUM': settings.THUMBNAIL_SIZES['medium'],
'THUMBNAIL_SIZE_LARGE': settings.THUMBNAIL_SIZES['large'],
}
......@@ -123,6 +123,7 @@ TEMPLATES = [
'partners.context_processors.showcased_partners',
'announcements.context_processors.announcements',
'thaliawebsite.context_processors.source_commit',
'thaliawebsite.context_processors.thumbnail_sizes',
],
},
},
......@@ -258,6 +259,12 @@ MEMBERSHIP_PRICES = {
'study': 30,
}
THUMBNAIL_SIZES = {
'small': '150x150',
'medium': '300x300',
'large': '1024x768',
}
# Default FROM email
DEFAULT_FROM_EMAIL = 'noreply@thalia.nu'
SERVER_EMAIL = DEFAULT_FROM_EMAIL
......
......@@ -7,6 +7,7 @@
.navbar {
font-size: 16px;
background-color: $white;
border-bottom: 1px solid $grey;
> .container {
justify-content: end;
......@@ -113,6 +114,7 @@
#page-content {
padding: 1rem 0 4rem 0;
border-top: 1px solid $grey;
.page-section {
padding: 2rem 1rem 0 1rem;
......@@ -216,13 +218,20 @@ img {
width: 100%;
height: 100%;
display: flex;
align-items: center;
text-align: center;
img {
width: auto;
height: auto;
min-width: 100%;
max-width: 100%;
min-height: 100%;
max-height: 100%;
transition: all 300ms ease-in-out 0s;
-moz-transition: all 300ms ease-in-out 0s;
-webkit-transition: all 300ms ease-in-out 0s;
-o-transition: all 300ms ease-in-out 0s;
}
}
......@@ -248,6 +257,8 @@ img {
-moz-transition: all 300ms ease-in-out 0s;
-webkit-transition: all 300ms ease-in-out 0s;
-o-transition: all 300ms ease-in-out 0s;
margin-bottom: 0;
padding-bottom: 0.5rem;
}
p {
......@@ -289,6 +300,7 @@ img {
opacity: 1;
h5, p {
-moz-transform: translateY(0px);
-webkit-transform: translateY(0px);
transform: translateY(0px);
}
......@@ -296,9 +308,18 @@ img {
.name {
opacity: 0;
-moz-transform: translateY(50px);
-webkit-transform: translateY(50px);
transform: translateY(50px);
}
.image {
img {
-moz-transform: scale(1.05);
-webkit-transform: scale(1.05);
transform: scale(1.05);
}
}
}
&:after {
......@@ -318,6 +339,7 @@ img {
p {
font-size: 11px;
line-height: normal;
}
}
}
......@@ -341,6 +363,7 @@ img {
p {
font-size: 9px;
line-height: normal;
}
}
}
......
......@@ -51,7 +51,7 @@
<div id="accentbar"></div>
<nav class="navbar navbar-expand-lg">
<nav class="navbar navbar-expand-lg sticky-top">
<div class="container">
<a class="navbar-brand" href="{% url 'index' %}">
<img
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment