Show - Index Page, CSS
This commit is contained in:
parent
82f2e3dc83
commit
5e0aa075d1
12
.editorconfig
Normal file
12
.editorconfig
Normal 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
|
@ -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)
|
||||||
|
@ -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
40
Show/templates/show.html
Normal 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
23
Show/urls.py
Normal 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())
|
||||||
|
]
|
@ -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
|
||||||
|
Reference in New Issue
Block a user