UI: Implement toggle-bars to My conference filters #103981
@ -1 +1 @@
|
||||
Subproject commit 0cdfbd54f695493a549f87162a6a43f29b7f053f
|
||||
Subproject commit c6cc2d73f86e46e8710ba98e60f7d35eb7590fae
|
@ -72,14 +72,17 @@ class Location(models.Model):
|
||||
rgb = tuple(int(h[i : i + 2], 16) for i in (0, 2, 4))
|
||||
return rgb
|
||||
|
||||
# TODO: improve colour contrast further
|
||||
def color_to_hsv(self):
|
||||
rgb = self.color_to_rgb(self.color)
|
||||
# Turn colors into 255 range
|
||||
rgb = [c / 255.0 for c in rgb]
|
||||
# Turn RGB to HSV
|
||||
hsv = colorsys.rgb_to_hsv(*rgb)
|
||||
# Turn colors in to CSS HSV representation (360, 100, 100)
|
||||
return hsv[0] * 360, hsv[1] * 100, hsv[2] * 100
|
||||
# Shift hue to improve colour contrast
|
||||
hue_shift = 120
|
||||
hue = (hsv[0] * 360 + hue_shift) % 360
|
||||
return hue, hsv[1] * 100, hsv[2] * 100
|
||||
|
||||
def __str__(self):
|
||||
return self.name
|
||||
|
@ -80,7 +80,8 @@
|
||||
color: white
|
||||
display: flex
|
||||
justify-content: center
|
||||
+padding(2)
|
||||
+padding(2, y)
|
||||
+padding(3, x)
|
||||
|
||||
.btn-row
|
||||
flex: 1
|
||||
@ -88,3 +89,9 @@
|
||||
|
||||
.btn-accent
|
||||
box-shadow: none
|
||||
|
||||
.edition-logo-header
|
||||
svg, img
|
||||
fill: var(--color-text-tertiary)
|
||||
height: auto
|
||||
max-width: var(--spacer-6)
|
||||
|
@ -157,18 +157,19 @@ $col-time-width: 8%
|
||||
|
||||
&.toggle
|
||||
i
|
||||
border-radius: var(--spacer)
|
||||
background-color: currentColor
|
||||
background-color: transparent
|
||||
// TODO: improve border-color contrast in theme light
|
||||
border: var(--border-width) solid var(--border-color)
|
||||
color: currentColor
|
||||
height: var(--spacer)
|
||||
height: var(--spacer-4)
|
||||
+margin(1, right)
|
||||
position: relative
|
||||
transition: background-color ease-in-out var(--transition-speed), box-shadow ease-in-out var(--transition-speed)
|
||||
width: var(--spacer)
|
||||
width: var(--spacer-4)
|
||||
|
||||
&:before
|
||||
font-weight: bold
|
||||
left: calc(var(--spacer-1) * -1)
|
||||
left: calc(var(--spacer-1) * -.5)
|
||||
opacity: 0
|
||||
transform: scale(0)
|
||||
position: relative
|
||||
@ -177,8 +178,6 @@ $col-time-width: 8%
|
||||
|
||||
input:checked
|
||||
&~label i
|
||||
background-color: transparent
|
||||
|
||||
&:before
|
||||
opacity: 1
|
||||
transform: scale(.85)
|
||||
@ -248,6 +247,7 @@ $col-time-width: 8%
|
||||
+media-lg
|
||||
display: none
|
||||
|
||||
// TODO: cleanup either CSS or JS for sticky positioning of schedule day toggles. Currently both are used, JS handling the display
|
||||
body.is-scrolled
|
||||
.schedule-day-toggles
|
||||
box-shadow: 0 var(--spacer) calc(var(--spacer) * 2) rgba(black, .1)
|
||||
@ -298,11 +298,11 @@ body.is-scrolled
|
||||
display: flex
|
||||
flex-direction: column
|
||||
flex-wrap: nowrap
|
||||
overflow: hidden
|
||||
|
||||
@include media-breakpoint-up(lg)
|
||||
flex-wrap: wrap
|
||||
flex-direction: row
|
||||
overflow: hidden // Prevents position sticky on children on small screens
|
||||
|
||||
.flex-row-break-lg
|
||||
@include media-breakpoint-up(lg)
|
||||
@ -392,7 +392,11 @@ body.is-scrolled
|
||||
@include media-breakpoint-up(lg)
|
||||
display: none
|
||||
|
||||
background-color: var(--color-bg)
|
||||
+padding(2, y)
|
||||
position: sticky
|
||||
top: 0
|
||||
z-index: calc(var(--zindex-fixed) + 1)
|
||||
|
||||
/* Vertical schedule scrolls to this during conference days. */
|
||||
.time-line-break
|
||||
@ -559,7 +563,6 @@ body.is-scrolled
|
||||
|
||||
/* Ongoing events.. */
|
||||
&.happening-now
|
||||
background-color: var(--box-bg-color-hover) !important
|
||||
box-shadow: 0 var(--spacer-2) var(--spacer) var(--color-accent-bg-hover) // --box-shadow-lg with color-accent-bg-hover
|
||||
|
||||
/* Red indicator on top-left. */
|
||||
@ -692,9 +695,7 @@ body.is-scrolled
|
||||
border-radius: 50%
|
||||
display: none
|
||||
height: 1.2rem
|
||||
position: absolute
|
||||
right: var(--spacer-2)
|
||||
top: var(--spacer-2)
|
||||
margin-left: .2rem
|
||||
visibility: hidden
|
||||
width: 1.2rem
|
||||
|
||||
|
@ -15,32 +15,6 @@ footer
|
||||
img(src="{% static 'images/BCON_logo.svg'%}", alt="{{ edition.title }}")
|
||||
{% endif %}
|
||||
|
||||
| {% if main_menu_editions|length >= 2 or edition not in main_menu_editions and main_menu_editions|length >= 1 %}
|
||||
li
|
||||
button.btn.dropdown-toggle.py-0(
|
||||
aria-expanded='false',
|
||||
aria-haspopup='true',
|
||||
class="js-dropdown-toggle",
|
||||
data-toggle-menu-id="nav-edition-menu",
|
||||
id="nav-edition-dropdown")
|
||||
| Editions
|
||||
|
||||
.dropdown-menu.dropdown-menu-left.dropdown-menu-bottom(
|
||||
aria-labelledby='nav-edition-dropdown',
|
||||
class="js-dropdown-menu",
|
||||
id="nav-edition-menu")
|
||||
| {% for menu_edition in main_menu_editions %}
|
||||
a.dropdown-item(
|
||||
class="{% if menu_edition == edition %}active{% endif %}",
|
||||
href="{% url 'homepage' edition_path=menu_edition.path %}")
|
||||
{{ menu_edition.title }}
|
||||
| {% endfor %}
|
||||
| {% endif %}
|
||||
li
|
||||
a(href="/code-of-conduct/") Code of Conduct
|
||||
li
|
||||
a(href="/hosting-official-bcon/") Hosting an Official BCON
|
||||
|
||||
ul
|
||||
| {% if edition and edition.flatpage_call_for_participation_published %}
|
||||
li
|
||||
@ -85,7 +59,38 @@ footer
|
||||
target="_blank",
|
||||
title="Follow @BlenderConf on Twitter")
|
||||
| #[i.i-twitter]
|
||||
hr
|
||||
.container
|
||||
.justify-content-center.navbar-footer
|
||||
| {% if main_menu_editions|length >= 2 or edition not in main_menu_editions and main_menu_editions|length >= 1 %}
|
||||
{# TODO: check media queries breakpoints #}
|
||||
ul.mb-2.mb-lg-0
|
||||
li
|
||||
button.btn.dropdown-toggle.py-0(
|
||||
aria-expanded='false',
|
||||
aria-haspopup='true',
|
||||
class="js-dropdown-toggle",
|
||||
data-toggle-menu-id="nav-edition-menu",
|
||||
id="nav-edition-dropdown")
|
||||
| Editions
|
||||
|
||||
.dropdown-menu.dropdown-menu-left.dropdown-menu-bottom(
|
||||
aria-labelledby='nav-edition-dropdown',
|
||||
class="js-dropdown-menu",
|
||||
id="nav-edition-menu")
|
||||
| {% for menu_edition in main_menu_editions %}
|
||||
a.dropdown-item(
|
||||
class="{% if menu_edition == edition %}active{% endif %}",
|
||||
href="{% url 'homepage' edition_path=menu_edition.path %}")
|
||||
{{ menu_edition.title }}
|
||||
| {% endfor %}
|
||||
| {% endif %}
|
||||
|
||||
ul
|
||||
li.fs-sm
|
||||
a(href="/code-of-conduct/") Code of Conduct
|
||||
li.fs-sm
|
||||
a(href="/hosting-official-bcon/") Hosting an Official BCON
|
||||
|
||||
#hop(title='Be awesome in space')
|
||||
svg(xmlns='http://www.w3.org/2000/svg', viewbox='0 0 448 512')
|
||||
|
@ -7,7 +7,7 @@ nav.nav-global(role='navigation')
|
||||
a.nav-global-logo(
|
||||
href="{% if edition and edition.path %}{% url 'homepage' edition_path=edition.path %}{% else %}/{% endif %}",
|
||||
class="{% if request.path == '/' %}is-active{% endif %}")
|
||||
| {% include "conference_main/_navbar_logo.pug" %}
|
||||
| {% include "conference_main/_navbar_logo.pug" with show_date=True %}
|
||||
|
||||
button.nav-global-logo.js-dropdown-toggle(data-toggle-menu-id='nav-global-nav-links')
|
||||
{% if edition.logo_small %}
|
||||
|
@ -11,6 +11,7 @@
|
||||
img(src="{% static 'images/BCON_logo.svg'%}", alt="{{ edition.title }}")
|
||||
{% endif %}
|
||||
|
||||
{% if show_date %}
|
||||
.navbar-dates
|
||||
{% if edition.date_start %}
|
||||
span {{ edition.date_start | date:'F d' }}{% if edition.date_start != edition.date_end %}-{{ edition.date_end | date:'d' }}{% endif %}, {{ edition.date_end | date:'Y' }}
|
||||
@ -19,3 +20,4 @@
|
||||
{% if edition.location %}
|
||||
span {{ edition.location }}
|
||||
{% endif %}
|
||||
{% endif %}
|
||||
|
@ -31,11 +31,11 @@ li.dropdown
|
||||
a.dropdown-item.is-admin(href="{% url 'admin:tickets_ticket_changelist' %}")
|
||||
i.i-ticket
|
||||
| Tickets
|
||||
|
||||
li
|
||||
a.dropdown-item.is-admin(href="{% url 'admin:conference_main_event_changelist' %}{% if edition %}?edition__id__exact={{ edition.id }}{% endif %}")
|
||||
i.i-layers
|
||||
| Presentations
|
||||
|
||||
| {% if edition and not edition.is_archived and edition.festival_voting_open %}
|
||||
li
|
||||
a.dropdown-item.is-admin(href="{% url 'admin:conference_main_festivalentry_changelist' %}")
|
||||
@ -43,6 +43,15 @@ li.dropdown
|
||||
| Festival Entries
|
||||
| {% endif %}
|
||||
|
||||
| {% with album=edition.get_open_album %}
|
||||
| {% if album %}
|
||||
li
|
||||
a.dropdown-item.is-admin(href="{% url 'admin:conference_main_photo_changelist' %}{% if edition %}?edition__id__exact={{ edition.id }}{% endif %}")
|
||||
i.i-camera
|
||||
| Photos
|
||||
| {% endif %}
|
||||
| {% endwith %}
|
||||
|
||||
li.dropdown-divider
|
||||
| {% endif %}
|
||||
|
||||
@ -51,7 +60,6 @@ li.dropdown
|
||||
a.dropdown-item(href="{% url 'presentation_submit' edition_path=edition.path %}")
|
||||
i.i-upload
|
||||
| Submit Presentation
|
||||
li.dropdown-divider
|
||||
| {% endif %}
|
||||
|
||||
| {% if edition and not edition.is_archived and edition.festival_submissions_open %}
|
||||
@ -59,9 +67,10 @@ li.dropdown
|
||||
a.dropdown-item(href="{% url 'festival_entry_submit' edition_path=edition.path %}")
|
||||
i.i-upload
|
||||
| Submit Festival Entry
|
||||
li.dropdown-divider
|
||||
| {% endif %}
|
||||
|
||||
li.dropdown-divider
|
||||
|
||||
li
|
||||
a.dropdown-item(href="{% url 'profile_update' %}")
|
||||
i.i-user
|
||||
|
@ -0,0 +1,27 @@
|
||||
ul.bg-primary.pagination.py-2
|
||||
| {% if is_paginated and page_obj.number > 1 %}
|
||||
li.page-item.page-first
|
||||
a(href="?page=1") First
|
||||
| {% endif %}
|
||||
|
||||
| {% if is_paginated and page_obj.has_previous %}
|
||||
li.page-item.page-prev
|
||||
a(href="?page={{ page_obj.previous_page_number }}")
|
||||
i.i-chevron-left
|
||||
| Previous
|
||||
| {% endif %}
|
||||
|
||||
li.page-item.page-current
|
||||
a(href="#") Page {{ page_obj.number }} of {{ paginator.num_pages }}
|
||||
|
||||
| {% if is_paginated and page_obj.has_next %}
|
||||
li.page-item.page-next
|
||||
a(href="?page={{ page_obj.next_page_number }}")
|
||||
| Next
|
||||
i.i-chevron-right
|
||||
| {% endif %}
|
||||
|
||||
| {% if is_paginated and page_obj.number < paginator.num_pages %}
|
||||
li.page-item.page-last
|
||||
a(href="?page={{ paginator.num_pages }}") Last
|
||||
| {% endif %}
|
@ -16,7 +16,7 @@
|
||||
strong {{ location.name|upper }}
|
||||
|
||||
.board-date {{ date|date:"l jS" }}
|
||||
.board-logo {% include "conference_main/_navbar_logo.pug" %}
|
||||
.board-logo {% include "conference_main/_navbar_logo.pug" with show_date=True %}
|
||||
|
||||
| {% for event in events %}
|
||||
li(
|
||||
|
@ -3,17 +3,19 @@
|
||||
|
||||
| {% block content %}
|
||||
.album-container-fullscreen
|
||||
| {% if user.is_anonymous and album.is_upload_open %}
|
||||
header
|
||||
a.edition-logo-header.me-4(href="/")
|
||||
| {% include "conference_main/_navbar_logo.pug" %}
|
||||
|
||||
| {% if user.is_anonymous and album.is_upload_open %}
|
||||
a(href="{% url 'oauth:login' %}").d-block.p-3.text-decoration-underline
|
||||
| Log in to upload photos
|
||||
| {% endif %}
|
||||
| {% endif %}
|
||||
|
||||
| {% if can_upload_photos or request.user.is_staff %}
|
||||
header
|
||||
| {% if can_upload_photos or request.user.is_staff %}
|
||||
.btn-row
|
||||
| {% if can_upload_photos %}
|
||||
a.btn.btn-accent.px-5(href="{{ album.get_upload_url }}")
|
||||
a.btn.btn-accent(href="{{ album.get_upload_url }}")
|
||||
i.i-upload
|
||||
span Upload Photos
|
||||
| {% endif %}
|
||||
@ -22,16 +24,18 @@
|
||||
.whoosh-container
|
||||
a.whoosh(href="{% url 'admin:conference_main_album_change' album.pk %}")
|
||||
i.i-edit
|
||||
a.whoosh(href="{% url 'admin:conference_main_photo_changelist' %}?albums__id__exact={{ album.pk }}&edition__id__exact={{ edition.pk }}")
|
||||
i.i-camera
|
||||
| {% endif %}
|
||||
| {% endif %}
|
||||
|
||||
.photo-list
|
||||
| {% if is_paginated and page_obj.has_previous %}
|
||||
a.photo-list-page-nav(href="?page={{ page_obj.previous_page_number }}")
|
||||
i.i-arrow-left
|
||||
span Previous
|
||||
| {% endif %}
|
||||
|
||||
| {% if album.license %}
|
||||
span.mx-3.text-muted(title="All photos are {{ album.license }}") {{ album.license }}
|
||||
| {% endif %}
|
||||
|
||||
| {% include "conference_main/components/album-pagination.pug" %}
|
||||
|
||||
.photo-list
|
||||
| {% for photo in photos %}
|
||||
a.photo-list-item(href="{{ photo.file.url }}")
|
||||
img(src="{{ photo.thumbnail_m_url }}")
|
||||
@ -44,9 +48,5 @@
|
||||
| {% endif %}
|
||||
| {% endfor %}
|
||||
|
||||
| {% if is_paginated and page_obj.has_next %}
|
||||
a.photo-list-page-nav(href="?page={{ page_obj.next_page_number }}")
|
||||
span Next
|
||||
i.i-arrow-right
|
||||
| {% endif %}
|
||||
| {% include "conference_main/components/album-pagination.pug" %}
|
||||
| {% endblock content %}
|
||||
|
@ -1,6 +1,14 @@
|
||||
| {% extends "conference_main/base.pug" %}
|
||||
| {% load thumbnail %}
|
||||
|
||||
| {% block header %}
|
||||
| {% block jumbotron %}
|
||||
| {% with title="Photos" subtitle="Albums with impressions and portraits<br> from the Blender Conference "|add:edition.path|add:"." %}
|
||||
| {% include "conference_main/components/hero.pug" with title=title subtitle=subtitle|safe show_gradient=True show_overlay=True %}
|
||||
| {% endwith %}
|
||||
| {% endblock jumbotron %}
|
||||
| {% endblock header %}
|
||||
|
||||
| {% block content %}
|
||||
.container.py-4
|
||||
.box
|
||||
|
@ -96,10 +96,10 @@
|
||||
| {{ event.duration_minutes }} m
|
||||
| {% endif %}
|
||||
|
||||
li.divider
|
||||
|
||||
li.remarks
|
||||
|
||||
li.divider
|
||||
|
||||
| {% include "conference_main/components/event_buttons.pug" with without_login_button=True is_schedule=True %}
|
||||
|
||||
.event-name
|
||||
|
@ -199,9 +199,6 @@
|
||||
.event-details-info
|
||||
.event-header
|
||||
ul.event-description
|
||||
| {# Indicator for ongoing events. #}
|
||||
li.remarks
|
||||
|
||||
| {% if event.location.slug %}
|
||||
li.event-location(
|
||||
style="color: hsl(var(--location-hue-{{ event.location.slug }}), 80%, var(--schedule-container-location-color-l));")
|
||||
@ -218,6 +215,9 @@
|
||||
| {{ event.duration_minutes }} m
|
||||
| {% endif %}
|
||||
|
||||
| {# Indicator for ongoing events. #}
|
||||
li.remarks
|
||||
|
||||
li.divider
|
||||
|
||||
| {% include "conference_main/components/event_buttons.pug" with without_login_button=True is_schedule=True %}
|
||||
|
Loading…
Reference in New Issue
Block a user