Show - Index Page, CSS

This commit is contained in:
Evert Prants 2017-11-10 15:55:39 +02:00
parent 82f2e3dc83
commit 5e0aa075d1
Signed by: evert
GPG Key ID: 1688DA83D222D0B5
6 changed files with 162 additions and 0 deletions

12
.editorconfig Normal file
View File

@ -0,0 +1,12 @@
# top-most EditorConfig file
root = true
# Unix-style newlines with a newline ending every file
[*]
end_of_line = lf
insert_final_newline = true
[*.py]
charset = utf-8
indent_style = space
indent_size = 4

View File

@ -20,5 +20,6 @@ from django.conf.urls.static import static
urlpatterns = [ urlpatterns = [
url(r'^admin/', admin.site.urls), url(r'^admin/', admin.site.urls),
url(r'^show/(?P<abbreviation>\w{1,5})/', include('Show.urls')),
url(r'^', include('LandingPage.urls')) url(r'^', include('LandingPage.urls'))
] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT) ] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)

View File

@ -59,6 +59,72 @@ body {
width: 20%; width: 20%;
float: right; float: right;
} }
section.show-details {
position: relative;
}
.show-details .banner {
position: absolute;
width: 100%;
height: 100%;
filter: blur(4px);
background-position: center center;
background-size: cover;
z-index: -1;
}
.show-details .banner-cover {
overflow: auto;
}
.show-details .artwork {
width: 182px;
margin: 15px;
float: left;
}
.show-details .details {
margin-left: 220px;
margin-right: 10px;
margin-bottom: 10px;
margin-top: 10px;
display: block;
min-height: 260px;
overflow: hidden;
font-size: 150%;
background-color: #dadada38;
padding: 10px;
}
.show-details .details h1 {
margin: 0;
font-size: 200%;
}
.show-details .details .description {
display: inline-grid;
width: 80%;
}
.show-details .details .data {
display: inline-grid;
text-align: right;
}
.show-details .stats .param {
color: #a2a2a2;
}
section.seasons {
min-height: 100vh;
padding: 25px;
}
.season-name {
padding: 6px;
font-size: 180%;
background-color: #e8e8e8;
}
a.episode {
padding: 10px;
display: block;
color: #000;
text-decoration: none;
background-color: #f7f7f7;
}
a.episode:nth-child(even) {
background-color: #fbfbfb;
}
@media all and (max-width: 800px) { @media all and (max-width: 800px) {
.logo { .logo {
font-size: 5vw !important; font-size: 5vw !important;

40
Show/templates/show.html Normal file
View File

@ -0,0 +1,40 @@
{% extends "base.html" %}
{% block content %}
<section class="show-details">
<div class="banner" style="background-image: url(/media/uploaded_resources/{{show.banner}});"></div>
<div class="banner-cover">
<div class="artwork">
<img src="/media/uploaded_resources/{{show.artwork}}">
</div>
<div class="details">
<h1>{{show.name}}</h1>
<p class="description">
{{show.description}}
</p>
<!--<div class="data">
<a class="imdb" href="{{show.imdb}}" target="_blank">IMDb Page</a>
<div class="stats">
<div class="param">Seasons</div>
<div class="value">{{seasons|length}}</div>
<div class="param">Episodes</div>
<div class="value">{{episodes|length}}</div>
</div>
</div>-->
</div>
</div>
</section>
<section class="seasons">
{% for season in seasons %}
<div class="season" data-season="{{season.number}}">
<div class="season-name">{% if season.name %}{{season.number}} - {{season.name}}{% else %}Season {{season.number}}{%endif%}</div>
<div class="episodes">
{% for episode in episodes %}
{% if episode.season == season %}
<a class="episode" data-season="{{season.number}}" data-number="{{episode.episode}}" data-title="{{episode.name}}" href="episode/{{season.number}}/{{episode.episode}}">{{episode.episode}} - {{episode.name}}</a>
{% endif %}
{% endfor %}
</div>
</div>
{% endfor %}
</section>
{% endblock %}

23
Show/urls.py Normal file
View File

@ -0,0 +1,23 @@
"""Show URL Configuration
The `urlpatterns` list routes URLs to views. For more information please see:
https://docs.djangoproject.com/en/1.11/topics/http/urls/
Examples:
Function views
1. Add an import: from my_app import views
2. Add a URL to urlpatterns: url(r'^$', views.home, name='home')
Class-based views
1. Add an import: from other_app.views import Home
2. Add a URL to urlpatterns: url(r'^$', Home.as_view(), name='home')
Including another URLconf
1. Import the include() function: from django.conf.urls import url, include
2. Add a URL to urlpatterns: url(r'^blog/', include('blog.urls'))
"""
from django.conf import settings
from django.conf.urls import url, include
from . import views
urlpatterns = [
url(r'^', views.Index.as_view())
]

View File

@ -1,3 +1,23 @@
from django.shortcuts import render from django.shortcuts import render
from django.shortcuts import render
from django.views import View
from django.views.generic.base import TemplateView
from django.conf import settings
from django.http import HttpResponse
from django.http import HttpResponseRedirect
from LandingPage.models import Show
from LandingPage.models import Season
from LandingPage.models import Episode
# Create your views here. # Create your views here.
class Index (TemplateView):
template_name = "show.html"
def get_context_data(self, abbreviation, **kwargs):
ctx = super().get_context_data()
ctx['show'] = Show.objects.filter(abbr=abbreviation).first()
ctx['seasons'] = Season.objects.filter(show=ctx['show'])
ctx['episodes'] = Episode.objects.filter(show=ctx['show'])
return ctx