ul, ol, dl {
margin: 0;
}
-dl{}
dt, dd{
letter-spacing:1px;
+ font-size: 0.8em;
line-height: 150%;
}
dt {
- float:left;
font-family: "RegloBold";
- margin-right: 0.3em;
}
dd {
font-family: "RegloNormal";
+ margin-left: 4px;
}
dt:after {
margin: none;
padding: none;
}
-ul.inline li{
- display:inline-block;
-}
/******************/
/*USEFULL CLASSES */
overflow: hidden;
}
.block {display:block;}
-.right{float:right;margin-left:1em;}
-.left{float:left;margin-left:1em;}
/**
* For modern browsers
* 1. The space content is one way to avoid an Opera bug when the
#player .controls, #player hr,player .item,#player img{border-color:#FF6633;}
/* FONTS */
-h1.title{
- text-transform: uppercase;
-}
-.date, .dateBloc {
- text-align: center;
+
+.dateBloc {
font-family: "Reglo";
text-transform: uppercase;
}
-.dateBloc span{display:block;}
.dateBloc *{line-height: 100%;}
.dateBloc .day {font-size: 2.2em;}
.dateBloc .number {font-size: 2.2em;}
font-family: "Reglo";
text-transform: uppercase;
}
-.legend{
- font-size:1.2em;
- font-weight:bold;
- border-bottom:3px solid black;
- padding: 0.2em 0 0.2em 0;
- margin: 0.2em 0 0.2em 0;
-}
/* SIZES
@xxs: 8px;
color:white;
padding:5px 7px 0px 7px;
}
-button.control, button.symbol{background:transparent;border:none;margin:0;padding:0;}
-nav.menu{
- width:100%;
- text-align: justify;
- text-justify: distribute-all-lines;
-}
-nav.menu li{
- display: inline-block;
- margin-right:2em;
+
+ul.tags {
+ margin: 10px 0 0 0;
+ overflow:hidden;
+ margin-bottom:15px;
}
-button.tag {
+ul.tags li {
font-size: 0.8em;
- font-family: "RegloBold";
+ font-family: RegloBold;
letter-spacing: 1px;
text-transform: uppercase;
- display:inline-block;
+ float: left;
border: 1px solid black;
margin: 2px 2px;
padding: 3px 3px 0px 3px;
border-radius: 7px;
-moz-border-radius: 7px;
}
-.list > li{
- padding:0.5em;
- min-height: 2.5em;
- border-bottom: 1px solid #000000;
+/*
+.symbol {
+ font-family: RegloSymbol;
+ font-size: @xxl*1.5;
+ line-height: 80%;
+}
+
+.symbol-absolute {
+ position:absolute;
+ font-family: RegloSymbol;
+ font-size: @xxl*2;
+ line-height: 80%;
+ float: left;
+ top:21px;
+ left:68px;
+}
+*/
+button.control, button.symbol{background:transparent;border:none;margin:0;padding:0;}
+nav.menu{
+ width:100%;
+ text-align: justify;
+ text-justify: distribute-all-lines;
+}
+nav.menu li{
+ display: inline-block;
+ margin-right:2em;
}
/**** TABS ****/
/****************************************************/
/**** EMISSIONS ****/
-#Emission{max-width:600px;}
-#Emission .emission-detail .title{}
/**** Detail ****/
+.emission{max-width:600px;margin:auto;}
+.emission-detail .title{
+ text-transform: uppercase;
+}
.emission-detail .metas {
float: left;
width: 40%;
}
/**** Inline ****/
.emission-inline {
+ padding:0.5em;
+ min-height: 2.5em;
+ border-bottom: 1px solid #000000;
+ overflow:hidden;
}
.emission-inline div.date {
font-family: "RegloMedium";
}
+ul.tagsArchives {
+ margin-top:5px;
+ overflow:hidden;
+ margin-bottom:15px;
+}
-/**** EPISODE ****/
-/**** Liste ****/
-.episodes .list > li{
- border-bottom: 0px solid #000000;
+ul.tagsArchives li {
+ font-size: 0.8em;
+ font-family: "RegloBold";
+ letter-spacing: 1px;
+ text-transform: uppercase;
+ float: left;
+ border: 1px solid black;
+ margin: 2px 2px;
+ padding: 3px 3px 0px 3px;
+ border-radius: 7px;
+ -moz-border-radius: 7px;
}
-/**** Detail ****/
+
+/**** EPISODE ****/
+/**** Detail ****/
.episode-detail {
+ border-top: 3px solid black;
min-height: 100px;
}
.episode-detail .logo{display:none;}
}
.episode-detail .date {
+ font-family: "Reglo";
+ text-transform: uppercase;
width: 3.5em;
text-align: center;
margin-right: 1em;
}
+.episode-detail .date *{
+ line-height: 100%;
+}
.episode-detail .date .day, .emission-detail .date .day {
margin-top: 20px;
+ font-size: 2.2em;
+}
+
+.episode-detail .date .number {
+ font-size: 2.2em;
}
+.episode-detail .date .month {
+ font-size: 0.8em;
+}
.episode-detail .date .time, .emission-details .time {
margin: 5px 0 10px 0;
font-size: 1.2em;
}
.episode-detail .content {
- padding-left: 5em;
+ padding-left: 4em;
}
.episode-detail .content .title {
text-align: center;
}
-.episode-inline .date{ font-size:50%; margin-top:1em;}
-
-.episode-inline .content {
- padding-left: 5em;
-}
/**** PROGRAM ****/
.program .dateBloc {
+<div class="emission">
+ <div class="emission emission-detail cf">
+ <!--
+ <nav class="menu">
+ <ul>
+ <li><a href="#">épisodes</a></li>
+ <li><a href="#" class="active">à propos</a></li>
+ </ul>
+ </nav>
+ -->
+ <header class="mainHeader">
+ <h1 class="title">{{ emission.title }}</h1>
+ </header>
+ <div class="metas">
+ <div class="schedule">
+ <div>mercredi & jeudi</div>
+ <div class="time">7:30-8:00</div>
-<div class="emission emission-detail cf">
- <!--
- <nav class="menu">
- <ul>
- <li><a href="#">épisodes</a></li>
- <li><a href="#" class="active">à propos</a></li>
- </ul>
- </nav>
- -->
- <header class="mainHeader">
- <h1 class="title">{{ emission.title }}</h1>
- </header>
- <div class="metas">
- <div class="schedule">
- <div>mercredi & jeudi</div>
- <div class="time">7:30-8:00</div>
-
- <div>vendredi</div>
- <div class="time">9:00-9:30</div>
- </div>
- <button class="control todo">
- <span class="symbol huge">G</span>
- <span class="listen">Écouter <!--la dernière--></span>
- </button>
- <div class="cf"></div>
- {% if emission.description %}
- <div class="description">
- {{ emission.description|safe|striptags }}
+ <div>vendredi</div>
+ <div class="time">9:00-9:30</div>
+ </div>
+ <button class="control todo">
+ <span class="symbol huge">G</span>
+ <span class="listen">Écouter <!--la dernière--></span>
+ </button>
+ <div class="cf"></div>
+ {% if emission.description %}
+ <div class="description">
+ {{ emission.description|safe|striptags }}
+ </div>
+ {% endif %}
+ {% if emission.email %}
+ <div class="email ellipsis">{{ emission.email}}</div>
+ {% endif %}
+ {% if emission.website %}
+ <div class="contact ellipsis"><a href="{{ emission.website}}">{{ emission.website}}</a></div>
+ {% endif %}
</div>
- {% endif %}
- {% if emission.email %}
- <div class="email ellipsis">{{ emission.email}}</div>
- {% endif %}
- {% if emission.website %}
- <div class="contact ellipsis"><a href="{{ emission.website}}">{{ emission.website}}</a></div>
- {% endif %}
- </div>
- <img class="logo" src="http://placehold.it/280X180"/>
+ <img class="logo" src="http://placehold.it/280X180"/>
- {% if emission.text %}
- <article class="text content">
- {{ emission.text|safe }}
- </article>
+ {% if emission.text %}
+ <article class="text content">
+ {{ emission.text|safe }}
+ </article>
+ {% endif %}
+ </div>
+ {% if episodes %}
+ <div class="episode-list">
+ {% for episode in episodes %}
+ {% include "episodes/resume.html" %}
+ {% endfor %}
+ </div>
{% endif %}
</div>
{% extends "base.html" %}
{% block main %}
- {% include "includes/path.html" %}
- <div id="Emission" class="futurtabs">
-<!--
- <ul class="custom">
- <li><a href="#Emission-tabs-episodes">Episodes</a></li>
- <li><a href="#Emission-tabs-detail">A propos de l'émission</a></li>
- </ul>
- <header class="mainHeader">
- <h1 class="title">{{ emission.title }}</h1>
- </header>
--->
- <div id="Emission-tabs-detail">
- {% include "emissions/detail.html" %}
- </div>
- <div id="Emission-tabs-episodes" class="episodes">
- {% if episodes %}
- {% regroup episodes by first_diffusion|date:"F Y"|capfirst as month_list %}
- {% for month in month_list %}
- <div class="legend">{{ month.grouper }}</div>
- <ul class="custom list">
- {% for episode in month.list %}
-
- {% if episode.title == episodes.0.title %}
- <li>{% include "episodes/resume.html" with date="daytime" %}</li>
- {% else %}
- <li>{% include "episodes/inline.html" with date="daytime" %}</li>
- {% endif %}
- {% endfor %}
- </ul>
- {% endfor %}
- {% endif %}
- </div>
- </div>
+ {% include "includes/path.html" %}
+ {% include "emissions/detail.html" %}
{% endblock %}
{% block pageend %}
{% extends "base.html" %}
{% block main %}
- <ul class="custom list">
{% for emission in emissions %}
- <li>{% include "emissions/inline.html" %}</li>
+ {% include "emissions/inline.html" %}
{% endfor %}
- </ul>
{% endblock %}