Skip to content

GitLab

Commit 146bf603 authored by Simon Daron's avatar Simon Daron
Browse files

Display compact news on Homepage

parent c923ae92
Hide whitespace changes
Inline Side-by-side
panikweb/views.py
View file @ 146bf603
......@@ -240,9 +240,7 @@ class Home(TemplateView):
def get_context_data(self, **kwargs):
context = super(Home, self).get_context_data(**kwargs)
context['newsImaged'] = list(NewsItem.objects.all().exclude(
image__isnull=True).exclude(image__exact='').order_by('-datetime')[:3])
context['news'] = list(NewsItem.objects.all().order_by('-datetime')[:60])
context['newsImaged'] = list(NewsItem.objects.all().exclude(image__isnull=True).exclude(image__exact='').order_by('-datetime')[:10])
context['emissions'] = list(Emission.objects.filter(archived=False).order_by('title'))
return context
......
panikweb_templates/static/css/general.css
View file @ 146bf603
......@@ -2,11 +2,10 @@
/*HTML TAG DISPLAYS */
/******************/
body {
background-color: white;
font-family: "RegloNormal";
line-height: normal;
text-align: left;
margin:1.8em auto;
margin:1.8em auto 0 auto;
/*padding: 0px 10px;*/
clear: both;
}
......@@ -35,7 +34,7 @@ img {max-width:100%;}
h1, h2, h3, h4, h5{
font-family: 'RegloBold';
}
h1, h2{
h1, h2, h3{
text-transform: uppercase;
}
h1 { font-size: 6em;}
......@@ -61,6 +60,8 @@ h1, h2, .squashed{
-moz-transform-origin: 0 0;
-ms-transform-origin: 0 0;
transform-origin: 0 0;
}
h1, .squashed{
width:200%;
}
......@@ -221,8 +222,8 @@ nav a.active, nav button.active{
}
.block {display:block;}
.inBlock{display:inline-block;}
.right{float:right;margin-left:1em;}
.left{float:left;margin-right:1em;}
.right{float:right;margin-left:1em;margin-bottom:1em;}
.left{float:left;margin-right:1em;margin-bottom:1em;}
.smooth{opacity:0.5;}
.hidden{display:none;}
.padded{padding:1.5em;}
......
panikweb_templates/static/css/specifics.css
View file @ 146bf603
......@@ -5,6 +5,7 @@
@blue: #364b63;
@white: #FFFFFF;
*/
/****************************************************/
/* FONTS */
.resymbol:hover,.control:hover{ opacity:0.5; }
......@@ -39,33 +40,7 @@ text-transform: uppercase;
}
.iconLabel{margin-left:0.1em;}
#userLog{
z-index:2000;
position: fixed;
bottom: 0px;
}
#userLog .log{
margin:0.2em;
-moz-box-shadow: 0px 0px 3px #000;
-webkit-box-shadow: 0px 0px 3px #000;
box-shadow: 0px 0px 3px #000;
border-radius:0.5em;-moz-border-radius:0.5em;-webkit-border-radius:0.5em;
text-align:center;
padding: 0.2em;
font-size:0.9em;
color:black;
background-color:orange;
border: 2px solid yellow;
background-image: linear-gradient(135deg, rgba(0, 0, 0, 0.04) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.04) 50%, rgba(0, 0, 0, 0.04) 75%, transparent 75%, transparent);
}
#main {}
#mainLegend{
width:30%;
text-align:right;
float:right;
padding:1em;
}
/****************************************************/
.wrapper {max-width: 1024px; margin:auto;}
.wrapper.text {max-width: 780px; margin:auto;}
.wrapper.half {max-width: 510px; margin:auto;}
......@@ -143,11 +118,43 @@ button.tag {
/**** TABS ****/
/****************************************************/
body{
background:#333;
color:white;
}
#Main{
color:#333;
background-color: white;
}
/* GLOBAL SITE NAV */
#userLog{
z-index:2000;
position: fixed;
bottom: 0px;
}
#userLog .log{
margin:0.2em;
-moz-box-shadow: 0px 0px 3px #000;
-webkit-box-shadow: 0px 0px 3px #000;
box-shadow: 0px 0px 3px #000;
border-radius:0.5em;-moz-border-radius:0.5em;-webkit-border-radius:0.5em;
text-align:center;
padding: 0.2em;
font-size:0.9em;
color:black;
background-color:orange;
border: 2px solid yellow;
background-image: linear-gradient(135deg, rgba(0, 0, 0, 0.04) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.04) 50%, rgba(0, 0, 0, 0.04) 75%, transparent 75%, transparent);
}
#main {}
#mainLegend{
width:30%;
text-align:right;
float:right;
padding:1em;
}
#search-form{content:'Rechercher';}
#search-form:focus{content:'';}
#metaNav {
font-size: 0.9em;
......@@ -178,6 +185,11 @@ button.tag {
background-color:white;
}
#Footer{
border-top:2px solid #333;
background:#333;
color:white;
}
/* PANIK LOGO */
#Panik {background:white;padding-top:2em;}
......@@ -188,8 +200,6 @@ button.tag {
/**** SCREEN NAV ****/
#Nav{
text-align:center;
border-width:0 0 2px 0;
border-style:solid;
}
#Nav nav ul{
margin:1em 0 1em 0;
......@@ -197,10 +207,14 @@ button.tag {
#Nav{ background:#EED1B1;}
#Nav *{ color:#342E2E;border-color:#342E2E;}
#Nav nav *:focus{
#Nav nav *:focus, #Nav li.current > a{
font-weight:bold;
}
#Nav nav ul.distributed li {border-width:0 2px 0 2px;border-style:solid;}
#Nav li a{
display: inline-block;
padding: 0.5em;
}
#Nav nav ul.distributed li {padding: 0;border-width:0 2px 0 2px;border-style:solid;}
#Nav nav ul.columns {column-rule:2px solid #342E2E;-moz-column-rule:2px solid #342E2E;-webkit-column-rule:2px solid #342E2E;}
#Nav nav.right{
......@@ -213,13 +227,22 @@ button.tag {
display:block;
color:#EED1B1 !important;
}
#Nav nav.sub{
}
#Nav nav.sub li a{
min-width:10em;
padding:1em;
}
/****************************************************/
/**** PLAYER ****/
/*#Home #player{ float: left; } */
#player .metas, #player img{border-color:#fff;}
#Player, #player{background-color:#ff6633; border-color:#fff;color:white !important;}
#player{background-color:#ff6633; border-color:#fff;color:white !important;}
#player *{border-color:#fff; color:white !important;background-color:#ff6633;}
#player{
border-top:2px solid black;
......@@ -244,6 +267,9 @@ button.tag {
#player .playlist .item img{ float:left;}
#Listen.small-player ul.metas { display: none; }
#Listen.small-player div.content { padding: 5px 5%; }
/****************************************************/
.inline .link{display:block;padding:1em;}
/**** Liste ****/
......@@ -405,8 +431,9 @@ button.tag {
border-style:solid;
border-width:1px 0;
}
.news a.block{padding:1em;}
.news a .content{padding:1em;}
.news a.block:hover{text-decoration:none;}
.news .date{padding:1em;}
.news .inline .title{
margin-bottom:1em;
......@@ -414,12 +441,12 @@ button.tag {
.news .logo{
border-style:solid;
border-width:2px;
margin:5px;
max-width:50%;
}
.content-inline .logo.right{
}
@media (max-width: 600px) {
.list.news .logo{
max-width:50%;
}
.list.news .num-1 .logo{
max-width:100% !important;
float:none;
......@@ -427,12 +454,16 @@ button.tag {
margin: 0 0 0 0 !important;
}
}
@media (max-width: 800px) {
.list.news .special .logo {
float:right;
margin:0 0 1em 1em;
}
}
@media (min-width: 800px) {
.list.news a{
max-height:350px;
text-overflow: ellipsis;
overflow: hidden;
}
.list.news .logo{
max-width:50% !important;
......@@ -453,10 +484,6 @@ button.tag {
.list.news .special.content{
padding : 1em;
}
.list.news .special .logo.right {
float:none;
margin: 0 !important!;
}
.list.news .num-4{
border-width:1px 0 1px 0;
clear:both;
......@@ -514,46 +541,22 @@ button.tag {
text-align:center;
}
/**** SCREEN SIZE ADAPTATIONS ****/
html #main{ font-size: 70%; }
body { font-size: 16px;}
@media screen and (max-width:475px){
#metaNav .iconLabel {display:none;}
}
@media (max-width: 300px){
body #All{ font-size: 70%; }
}
@media (min-width: 300px) and (max-width:700px){
body #All{ font-size: 80%; }
}
/**** COLOR VARIANTS ****/
@media (min-width: 700px) and (max-width:1200px){
body #All{ font-size: 90%; }
}
@media (min-width: 1200px) {
body #All{ font-size: 100%; }
}
/**** COLOR VARIANTS ****/
/*
#News,
.news,
.news *
{background-color:#1663d5; border-color:#fff !important;color:#fff !important;}
*/
/*
#News, #news,.news, .news *,.mainLegend.news {
background-color:#fff;
border-color:#1663d5 !important;
color:#1663d5 !important;
}
}*/
#Listen.small-player ul.metas { display: none; }
#Listen.small-player div.content { padding: 5px 5%; }
ul.tag-facets {
font-size: 80%;
text-transform: lowercase;
......@@ -578,22 +581,25 @@ ul#search-results li.next-page {
font-style: italic;
}
div#fiber-nav ul,
div#fiber-nav li {
display: inline-block;
padding: 0.5ex 1ex;
/**** SCREEN SIZE ADAPTATIONS ****/
html #main{ font-size: 70%; }
body { font-size: 16px;}
@media screen and (max-width:475px){
#metaNav .iconLabel {display:none;}
}
@media (max-width: 300px){
body #All{ font-size: 70%; }
}
div#fiber-nav > ul {
display: block;
margin: auto 0;
text-align: center;
@media (min-width: 300px) and (max-width:700px){
body #All{ font-size: 80%; }
}
div#fiber-nav li.current > a {
font-weight: bold;
@media (min-width: 700px) and (max-width:1200px){
body #All{ font-size: 90%; }
}
div#fiber-content {
padding-top: 1ex;
@media (min-width: 1200px) {
body #All{ font-size: 100%; }
}
panikweb_templates/templates/base.html
View file @ 146bf603
......@@ -36,21 +36,21 @@
{% block listen %}{% player %}{% endblock %}
</div>
</div>
<div id="Changing">
<div id="Changing" class="cf">
<div id="Nav">
<div class="wrapper">
{% block nav %}{% endblock %}
</div>
</div>
<div id="Main">
<div id="Main" class="cf">
{% block main %}{% endblock %}
</div>
<div id="Links">
<div class="wrapper">
{% block links %}{% endblock %}
</div>
</div>
</div>
<div id="Footer">
</div>
<div id="userLog"></div>
</div>
......
panikweb_templates/templates/home.html
View file @ 146bf603
{% extends "news.html" %}
{% extends "base.html" %}
{% load thumbnails %}
{% block bodyID %}Home{% endblock %}
{% block nav %}{% endblock %}
{% block title %}{% endblock %}
{% block main %}
<div class="news">
<div class="wrapper padded news">
<h2 class="">News</h2>
<ul class="custom inline ellipsis">
{% for content in newsImaged %}
<li class="item">
<a class="inBlock news" href="{% url 'news-view' slug=content.slug %}">
{% if content.image %}
<img class="logo" src="{{ content.image|thumbnail:'120x120' }}"/>
{% endif %}
</a>
</li>
{% endfor %}
</ul>
</div>
</div>
{% endblock %}
{% block links %}
<div class="wrapper">
<div class="wrapper padded">
<h2>Emissions</h2>
<ul class="custom list columns padded">
{% for emission in emissions %}
<li class="item">
......
panikweb_templates/templates/includes/metaNav.html
View file @ 146bf603
......@@ -35,10 +35,17 @@
<span class="iconLabel">About</span>
</a></li>
<li><form id="search" action="{% url 'search' %}">
<li><a href="/search" onclick="$('#SearchForm').toggle();return false;">
<span class="icon-search" ></span>
<input name="q" type="search" class="iconLabel" placeholder="Rechercher..."></input>
</form></li>
<span class="iconLabel">Search</span>
</a>
<div id="SearchForm" class="hidden">
<form id="search" action="{% url 'search' %}">
<input name="q" type="search" class="iconLabel" placeholder="Rechercher..."></input>
</form>
</div>
</li>
</ul>
</div>
</nav>
panikweb_templates/templates/listen.html
View file @ 146bf603
{% extends "base.html" %}
{% block bodyID %}Player{% endblock %}
{% block main %}
<div class="wrapper">
<ul class="small custom list columns padded">
<div class="wrapper padded">
<ul class="small custom list columns">
{% for sound in sounds %}
<li class="item ellipsis">
{% include "includes/audio.html" with src=sound.file %}
......
panikweb_templates/templates/news.html
View file @ 146bf603
......@@ -3,6 +3,7 @@
{% block bodyID %}News{% endblock %}
{% block title %}News{% endblock %}
{% block nav %}
<!--
{% if categories %}
<nav class="center cf">
<ul class="custom columns">
......@@ -14,6 +15,7 @@
</ul>
</nav>
{% endif %}
-->
{% endblock %}
{% block main %}
<div class="news">
......
panikweb_templates/templates/news/inline.html
View file @ 146bf603
......@@ -7,22 +7,24 @@
{% endif %}
{% if content.image %}
{% if logo == "large" %}
<img class="logo right" src="{{ content.image|thumbnail:'800x600' }}"/>
<img class="logo" src="{{ content.image|thumbnail:'800x600' }}"/>
{% elif logo == "medium" %}
<img class="logo right" src="{{ content.image|thumbnail:'320x240' }}"/>
<img class="logo" src="{{ content.image|thumbnail:'320x240' }}"/>
{% else %}
<img class="logo right" src="{{ content.image|thumbnail:'60x60' }}"/>
<img class="logo" src="{{ content.image|thumbnail:'60x60' }}"/>
{% endif %}
{% endif %}
<h5 class="title {% if not class %}ellipsis{% endif %}">{{ content.title }}</h5>
<div class="description {% if not class %}ellipsis{% endif %}">
{% if logo == "large" %}
{{ content.text|safe|striptags|truncatewords:100}}
{% elif logo == "medium" %}
{{ content.text|safe|striptags|truncatewords:50}}
{% else %}
{{ content.text|safe|striptags|truncatewords:20}}
{% endif %}
<div class="content">
<h5 class="title {% if not class %}ellipsis{% endif %}">{{ content.title }}</h5>
<div class="description {% if not class %}ellipsis{% endif %}">
{% if logo == "large" %}
{{ content.text|safe|striptags|truncatewords:100}}
{% elif logo == "medium" %}
{{ content.text|safe|striptags|truncatewords:50}}
{% else %}
{{ content.text|safe|striptags|truncatewords:20}}
{% endif %}
</div>
</div>
</a>
</div>
......
panikweb_templates/templates/tpl-default.html
View file @ 146bf603
......@@ -5,11 +5,11 @@
{% block nav %}
<div id="fiber-nav">
<nav>
<nav class="distributed">
{% show_menu "main-menu" 1 1 "all" %}
</nav>
<div class="wrapper text">
<nav class="right">
<nav class="sub right">
{% show_menu "main-menu" 2 3 "all_descendants" %}
</nav>
</div>
......@@ -22,7 +22,7 @@
<div id="fiber-content" class="padded">
<h2>{{ fiber_page.title }}</h2>
{% show_page_content "main" %}
<div class="text userContent">{% show_page_content "main" %}</div>
</div>
</div>
......
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