1
0
Fork 0

Reorganize artists page (WIP)

This commit is contained in:
Dece 2017-08-17 15:21:14 +02:00
parent 20dac82f18
commit 0df2dedff2
6 changed files with 55 additions and 42 deletions

View file

@ -43,21 +43,21 @@ class Release(models.Model):
ident: catalog number
title: release title
contributors: list of Artists who contributed to this release
release_type: see below
release_type: see TYPE_HINT
year: year of release
cover: image file associated to this release
"""
REL_TYPES_HINT = 'full-length (0), EP (1), Split (2), Démo (3)'
REL_EMBED_HINT = 'HTML iframe -- for Bandcamp, add the whole tracklist'
TYPE_HINT = 'full-length (0), EP (1), Split (2), Démo (3)'
EMBED_HINT = 'HTML iframe -- for Bandcamp, add the whole tracklist'
ident = models.IntegerField()
title = models.CharField(max_length=256)
contributors = models.ManyToManyField(Artist)
release_type = models.IntegerField(default=0, help_text=REL_TYPES_HINT)
release_type = models.IntegerField(default=0, help_text=TYPE_HINT)
cover = models.ImageField(upload_to='releases')
year = models.IntegerField()
embed = models.TextField(blank=True, help_text=REL_EMBED_HINT)
embed = models.TextField(blank=True, help_text=EMBED_HINT)
description = models.TextField(blank=True)
def __str__(self):

View file

@ -11,24 +11,24 @@
{% block content %}
<h1>Artists</h1>
<p class="artists">
{% for artist in artists %}
{% if artist.artist_type == 0 %}
<span class="artist">
<a href="{% url 'artist' artist.slug %}">
<img src="{{ MEDIA_URL }}{{ artist.image }}" alt="" /> <br />
<div class="artists">
{% for artist in artists %}
{% if artist.artist_type == 0 %}
<a href="{% url 'artist' artist.slug %}">
<span class="artist">
<div class="logo" style="background-image: url('{{ MEDIA_URL }}{{ artist.image }}');"></div>
{{ artist.name }}
<span class="artist-genre">{{ artist.genre }}</span>
</a>
</span>
{% endif %}
{% endfor %}
</p>
</span>
</a>
{% endif %}
{% endfor %}
</div>
<h1>Side projects</h1>
<!-- <h1>Side projects</h1>
<p class="artists">
{% for artist in artists %}
{% if artist.artist_type == 1 %}
{% for artist in artists %}
{% if artist.artist_type == 1 %}
<span class="artist">
<a href="{% url 'artist' artist.slug %}">
<img src="{{ MEDIA_URL }}{{ artist.image }}" alt="" /> <br />
@ -36,7 +36,7 @@
<span class="artist-genre">{{ artist.genre }}</span>
</a>
</span>
{% endif %}
{% endfor %}
</p>
{% endif %}
{% endfor %}
</p> -->
{% endblock %}

View file

@ -9,7 +9,7 @@
}
.artists .artist {
width: 120px;
width: 160px;
position: relative;
margin: 5px;
display: inline-block;
@ -19,27 +19,25 @@
color: #929292;
text-decoration: none;
transition: .5s;
-moz-transition: .5s;
-ms-transition: .5s;
-o-transition: .5s;
-webkit-transition: .5s;
}
.artists .artist img {
height: 120px;
width: 120px;
.artists .artist .logo {
height: 160px;
width: 160px;
background-size: cover;
background-color: white;
border: none;
border-radius: 5px;
}
.artists .artist-genre {
height: 120px;
width: 120px;
position:absolute;
display: flex;
position: absolute;
top: 0px;
left: 0px;
display: flex;
height: 150px;
width: 150px;
padding: 5px;
align-items: center;
justify-content: center;
background-color: rgba(0, 0, 0, 0.6);
@ -47,7 +45,6 @@
color: white;
opacity: 0;
transition: all 0.7s ease;
-webkit-transition: all 0.7s ease;
}
.artists .artist-genre:hover {

View file

@ -1,3 +1,5 @@
/* General */
body {
background: url("/static/img/bg.png") no-repeat center center fixed;
background-color: white;
@ -12,11 +14,12 @@ body {
margin-top: 20px;
margin-bottom: 20px;
padding: 10px 10px 10px 10px;
box-shadow: h-pos v-pos (blur) (spread) (color) (inset);
}
/* Header */
header {
margin: 0px;
margin-bottom: 6px;
@ -30,6 +33,8 @@ header img {
/* Nav bar */
nav {
margin: 0px;
margin-bottom: 6px;
@ -54,6 +59,8 @@ nav a:hover {
/* Content */
#content {
margin: 10px;
}
@ -88,6 +95,8 @@ nav a:hover {
/* Extra */
.grayscale {
/* Firefox 10+ (& Android) */
filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
@ -95,4 +104,4 @@ nav a:hover {
filter: gray;
/* Chrome 19+, Safari 6+ (& iOS), Opera 15+ */
-webkit-filter: grayscale(100%);
}
}

View file

@ -21,7 +21,8 @@
margin: auto;
}
#infos #left, #infos #right {
#infos #left,
#infos #right {
width: 50%;
padding: 10px;
vertical-align: top;

View file

@ -7,9 +7,15 @@
<meta charset="utf-8" />
<title>{% block title %}Idiocrates Records{% endblock %}</title>
<link rel="stylesheet" href="{% static 'css/base.css' %}" />
<link rel="stylesheet" type="text/css"
href="https://fonts.googleapis.com/css?family=Lato" />
<link
rel="stylesheet"
href="{% static 'css/base.css' %}"
/>
<link
rel="stylesheet"
type="text/css"
href="https://fonts.googleapis.com/css?family=Lato"
/>
{% block stylesheets %}{% endblock %}
{% block scripts %}{% endblock %}