Skip to content
GitLab
Menu
Projects
Groups
Snippets
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
radiopanik
panikweb
Commits
b65094b3
Commit
b65094b3
authored
Sep 01, 2013
by
Simon Daron
Browse files
CSS Styling emission/episode/player
parent
edc37b4a
Changes
7
Hide whitespace changes
Inline
Side-by-side
panikweb_templates/static/css/specifics.css
View file @
b65094b3
...
...
@@ -16,7 +16,7 @@
.inline
.date
,
.resume
.date
{
text-align
:
center
;
}
.dateBloc
{
width
:
5.5
em
;
.dateBloc
{
width
:
4
em
;
text-align
:
center
;}
.dateBloc
{
display
:
inline-block
;}
.dateBloc
*
{
line-height
:
100%
;}
...
...
@@ -28,6 +28,7 @@
.dateBloc.small
{
font-size
:
80%
;
}
.tabs
.ui-tabs-nav
{
font-family
:
"Reglo"
;
text-transform
:
uppercase
;
...
...
@@ -299,13 +300,14 @@ background-color:#ff6633; border-color:#fff;}
background-color
:
transparent
;
}
#player-container
.metas
,
#player-container
img
{
border-color
:
#fff
;}
#player-container
.padded
{
padding
:
1%
;}
#player-container
.padded
{
padding
:
0.5em
;}
#player-container
*
.label
{
padding
:
0.2em
;
}
#player-container
button
,
#player-container
a
{
}
#player-container
.metas
{
text-align
:
center
;
color
:
white
!important
;
}
#player-container
.label
{
...
...
@@ -337,7 +339,7 @@ background-color:#ff6633; border-color:#fff;}
font-size
:
0.9em
;
}
#player-container
.fixed
.padded
{
padding
:
0.5em
;
}
#Player
.withPlaylist
#player-container
#audioPlayer
{
float
:
left
;
...
...
@@ -360,13 +362,15 @@ background-color:#ff6633; border-color:#fff;}
#Playlist
button
{
font-size
:
1em
;
}
#Playlist
.l
abel
{
#Playlist
#playlistL
abel
{
float
:
right
;
}
#Playlist
.playlistControls
{
font-size
:
120%
;
text-align
:
left
;
#Playlist
.playListControls
{
}
#Playlist
.playListControls
button
{
margin-right
:
0.2em
;
display
:
inline-block
;
}
#Playlist
.playing
.icon-pause
{
-webkit-animation
:
loading
1s
infinite
linear
;
...
...
@@ -461,8 +465,7 @@ background-color:#ff6633; border-color:#fff;}
max-width
:
1000px
;
}
#Emissions
#Changing
.wrapper.sided
#Emission-tabs-detail
,
#Emissions
#Changing
.wrapper.sided
#Emission-tabs-last
,
#Emissions
#Changing
.wrapper.sided
.monthGroup
{
#Emissions
#Changing
.wrapper.sided
#Emission-tabs-last
{
width
:
45%
;
}
#Emissions
#Changing
.wrapper.sided
#Emission-tabs-detail
{
...
...
@@ -471,6 +474,10 @@ background-color:#ff6633; border-color:#fff;}
#Emissions
#Changing
.wrapper.sided
#Emission-tabs-last
{
float
:
right
;
}
/*
#Emissions #Changing .wrapper.sided .monthGroup{
width:45%;
}
#Emissions #Changing .wrapper.sided .monthGroup.even{
float:right;
clear:left;
...
...
@@ -479,6 +486,7 @@ background-color:#ff6633; border-color:#fff;}
float:left;
clear:right;
}
*/
}
/**** Detail ****/
.emission-detail
.metas
{
...
...
@@ -550,6 +558,13 @@ background-color:#ff6633; border-color:#fff;}
.episode.resume
.logo
{
float
:
right
;
}
.episode.resume
.sound
{
float
:
right
;
margin
:
0
0
1em
1em
;
}
.episode.inline
.sound
{
font-size
:
80%
;
}
.episode.resume
.sound.right
.icon-download
{
text-align
:
center
;
}
...
...
@@ -560,14 +575,11 @@ background-color:#ff6633; border-color:#fff;}
max-width
:
50%
;
}
@media
screen
and
(
max-width
:
300px
)
{
.episode.resume
.logo
{
display
:
none
;}
}
.episode.resume
.date
.day
,
.emission-detail
.date
.day
{
}
.episode.resume
.content
{
padding-left
:
6.
5em
;
padding-left
:
5em
;
}
.episode.resume
.content
.title
{
}
...
...
@@ -580,6 +592,19 @@ background-color:#ff6633; border-color:#fff;}
font-size
:
80%
;
}
@media
screen
and
(
max-width
:
400px
)
{
.episode
.dateBloc
{
width
:
4em
;
font-size
:
80%
}
.episode.resume
.content
{
padding-left
:
4em
;
}
}
@media
screen
and
(
max-width
:
300px
)
{
.episode.resume
.logo
{
display
:
none
;}
}
/****************************************************/
/**** News ****/
.list.news
li
{
...
...
panikweb_templates/static/js/specifics.js
View file @
b65094b3
...
...
@@ -9,7 +9,7 @@ $(function() {
var
$main
=
$
(
"
#Changing
"
);
var
$log
=
$
(
"
#userLog
"
);
var
$localList
=
$
(
'
#localList
'
).
playlist
({
controlContainer
:
$
(
'
<div>
'
,{
class
:
""
}).
sortable
(),
controlContainer
:
$
(
'
<div>
'
,{
class
:
"
playListControls label
"
}).
sortable
(),
playlistContainer
:
$
(
'
<ol>
'
,{
id
:
"
myPlaylist
"
,
class
:
"
custom
"
}).
sortable
(),
onLoad
:
function
(
self
){
$
(
'
#localList
'
).
children
(
'
.label
'
).
on
(
'
click
'
,
function
(){
...
...
panikweb_templates/templates/emissions/emission_detail.html
View file @
b65094b3
...
...
@@ -7,27 +7,31 @@
{% block main %}
<div
class=
"wrapper {% if episodes %}sided{% endif %}"
>
<div
id=
"Emission-container"
class=
"emission padded"
>
{% if episode %}
<div
data-tabbed=
"true"
id=
"Emission-tabs-current"
class=
"episodes wrapper half"
>
{% episode_detail %}
</div>
{% endif %}
<div
data-tabbed=
"true"
id=
"Emission-tabs-default"
>
<div
id=
"Emission-tabs-detail"
>
<h5
class=
"sectionLabel"
>
À propos
</h5>
{% emission_detail %}
</div>
{% if episodes %}
<div
id=
"Emission-tabs-last"
class=
"episodes"
>
{% if episode %}
{% episode_detail %}
{% elif episodes %}
<h5
class=
"sectionLabel"
>
Derniers épisodes
</h5>
{% with episodes|slice:"0:
3
" as episodes %}
{% with episodes|slice:"0:
1
" as episodes %}
{% for episode in episodes %}
<div
class=
"legend"
>
{{ episode.first_diffusion|date:"F Y" }}
</div>
{% episode_resume date="daytime" %}
{% endfor %}
{% endwith %}
</div>
{% with episodes|slice:"1:3" as episodes %}
{% for episode in episodes %}
<div
class=
"legend"
>
{{ episode.first_diffusion|date:"F Y" }}
</div>
{% episode_resume model="inline" date="daytime" %}
{% endfor %}
{% endwith %}
{% endif %}
</div>
</div>
{% if episodes %}
<div
data-tabbed=
"true"
id=
"Emission-tabs-episodes"
class=
"episodes"
>
...
...
panikweb_templates/templates/emissions/nav.html
View file @
b65094b3
...
...
@@ -68,10 +68,12 @@
</button
>
</li>
</ul>
<!--
{% if episode %}
<hr />
<h4 class="active button padded " data-tab="#Emission-tabs-current">{{ episode.title }}</h4>
{% endif %}
-->
</nav>
</div>
{% endif %}
...
...
panikweb_templates/templates/episodes/detail.html
View file @
b65094b3
...
...
@@ -3,6 +3,7 @@
<div
class=
"episode detail episode-detail cf"
>
{% if diffusions %}
<header
class=
"center padded"
>
<h4
class=
""
>
{{ episode.title }}
</h4>
<div
class=
"label"
>
Diffusions
</div>
<ul
class=
"diffusions custom"
>
{% for schedule in diffusions %}
...
...
@@ -12,7 +13,9 @@
</header>
{% endif %}
{% if episode.main_sound %}
{% audio sound=episode.main_sound %}
<div
class=
"sound center"
>
{% audio sound=episode.main_sound %}
</div>
{% endif %}
{% if episode.image %}
<div
class=
"logo right"
>
...
...
panikweb_templates/templates/episodes/resume.html
View file @
b65094b3
{% load thumbnails %}
{% load paniktags %}
<div
class=
"episode
resume
{% if model = "
inline
"
%}
inline
{%
endif
%}
cf
"
>
<div
class=
"episode {% if model = "
inline
"
%}
inline
{%
else
%}
resume
{%
endif
%}
cf
"
>
<div
class=
"dateBloc left"
>
<div
class=
"date"
>
<div
class=
"day"
>
...
...
@@ -30,7 +30,7 @@
{% endif %}
<div
class=
"content"
>
{% if episode.main_sound %}
{% if episode.main_sound
and model != "inline"
%}
<div
class=
"sound right"
>
{% audio sound=episode.main_sound %}
</div>
{% endif %}
{% if class = "standalone" %}
...
...
@@ -44,7 +44,7 @@
{% if model = "inline" %}
{% if episode.description %}
<div
class=
"description ellipsis"
>
{{ episode.description|safe|striptags
}}
{{ episode.description|safe|striptags
|truncatewords:20
}}
</div>
{% elif episode.text %}
<div
class=
"description ellipsis"
>
...
...
@@ -54,14 +54,18 @@
{% else %}
{% if episode.description %}
<article
class=
"text userContent"
>
{{ episode.description|safe }}
{{ episode.description|safe
|truncatewords:50
}}
</article>
{% elif episode.text %}
<article
class=
"text userContent"
>
{{ episode.text|safe}}
{{ episode.text|safe
|truncatewords:50
}}
</article>
{% endif %}
{% endif %}
{% if episode.main_sound and model = "inline"%}
<div
class=
"sound"
>
{% audio sound=episode.main_sound %}
</div>
{% endif %}
<div
class=
"metas"
>
{% if episode.serie or episode.auteur or episode.redif %}
<dl
class=
"credits cf"
>
...
...
panikweb_templates/templates/includes/player.html
View file @
b65094b3
...
...
@@ -34,7 +34,7 @@
</div>
<div
id=
"Playlist"
class=
"sub cf"
>
<div
id=
"localList"
class=
"padded"
>
<div
class=
"label button"
>
Playlist
<span
class=
"icon-list"
></span></div>
<div
id=
"playlistLabel"
class=
"label button"
>
Playlist
<span
class=
"icon-list"
></span></div>
</div>
</div>
<script
type=
"text/javascript"
>
...
...
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment