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
Simon Daron
panikweb
Commits
e17e1254
Commit
e17e1254
authored
Aug 19, 2013
by
Simon Daron
Browse files
Organising CSS & JS
parent
cdd72568
Changes
6
Hide whitespace changes
Inline
Side-by-side
panikweb_templates/static/css/general.css
0 → 100644
View file @
e17e1254
/******************/
/*HTML TAG DISPLAYS */
/******************/
a
{
color
:
black
;
text-decoration
:
none
;
}
a
:hover
{
opacity
:
0.8
;
text-decoration
:
underline
;
}
img
{
border
:
2px
solid
black
;
margin-right
:
10px
;
}
h1
,
h2
,
h3
,
h4
,
h5
{
font-family
:
'RegloBold'
;
}
h4
,
h5
{
}
h1
{
font-size
:
5em
;}
h2
{
font-size
:
4em
;}
h3
{
font-size
:
3em
;}
h4
{
font-size
:
1.8em
;}
h5
{
font-size
:
1.3em
;}
/*Specific rules for text writen by final users */
article
h1
,
.content
h1
{
color
:
#aaa
;
font-size
:
2.5em
;}
article
h2
,
.content
h2
{
color
:
#aaa
;
font-size
:
2.3em
;}
article
h3
,
.content
h3
{
color
:
#aaa
;
font-size
:
2em
;}
article
h4
,
.content
h4
{
color
:
#aaa
;
font-size
:
1.5em
;}
article
h5
,
.content
h5
{
color
:
#aaa
;
font-size
:
1.3em
;}
h1
{
transform
:
scale
(
0.5
,
1
);
-webkit-transform
:
scale
(
0.5
,
1
);
-moz-transform
:
scale
(
0.5
,
1
);
-ms-transform
:
scale
(
0.5
,
1
);
-o-transform
:
scale
(
0.5
,
1
);
-webkit-transform-origin
:
0
0
;
-moz-transform-origin
:
0
0
;
-ms-transform-origin
:
0
0
;
transform-origin
:
0
0
;
width
:
200%
;
}
nav
{
font-family
:
"RegloBold"
;
text-transform
:
uppercase
;
}
nav
a
.active
,
nav
a
:hover
{
text-decoration
:
underline
;
}
p
{
/*line-height: 1.2;*/
margin-bottom
:
1em
;
}
p
a
{
text-decoration
:
underline
}
em
{
font-family
:
RegloBold
;
}
blockquote
{
font-family
:
RegloBold
;
color
:
#aaa
;
font-size
:
1.5em
;
padding
:
1em
;
font-style
:
italic
;
}
ul
,
ol
,
dl
{
margin
:
0
;
}
dt
,
dd
{
letter-spacing
:
1px
;
font-size
:
0.8em
;
line-height
:
150%
;
}
dt
{
font-family
:
"RegloBold"
;
}
dd
{
font-family
:
"RegloNormal"
;
margin-left
:
4px
;
}
dt
:after
{
content
:
":"
;
}
dl
.metadata
dt
{
clear
:
none
;
margin
:
0
;
}
dl
.metadata
dd
{
margin-right
:
4px
;
}
button
{
display
:
inline-block
;}
ul
.custom
,
ul
.custom
li
{
list-style
:
none
;
margin
:
none
;
padding
:
none
;
}
/******************/
/*USEFULL CLASSES */
/******************/
.ui-tabs
{
background
:
transparent
;
border
:
none
;
}
.ui-tabs
.ui-widget-header
{
background
:
transparent
;
border
:
none
;
-moz-border-radius
:
0px
;
-webkit-border-radius
:
0px
;
border-radius
:
0px
;
}
.ui-tabs
.ui-tabs-nav
.ui-state-default
{
background
:
transparent
;
border
:
none
;
}
.ui-tabs
.ui-tabs-nav
.ui-state-active
{
background
:
transparent
;
border
:
none
;
}
.ui-tabs
.ui-tabs-nav
.ui-state-default
a
{
color
:
#000
;
}
.ui-tabs
.ui-tabs-nav
.ui-state-active
a
{
border-bottom
:
2px
solid
black
;
}
.ui-tabs
.ui-tabs-panel
,
.tabs
.ui-tabs
.ui-tabs-panel
{
margin
:
0
0
0
0
;
padding
:
0
0
0
0
;
}
.todo
:hover
,
.todo
*
:hover
{
text-decoration
:
line-through
;
color
:
red
!important
;
}
.focusFade
{
-webkit-transition-property
:
color
;
-webkit-transition-duration
:
0.2s
;
-webkit-transition-timing-function
:
ease
;
}
.extra-margin
{
margin-bottom
:
16px
;
}
.ellipsis
{
white-space
:
nowrap
;
text-overflow
:
ellipsis
;
overflow
:
hidden
;
}
.block
{
display
:
block
;}
/**
* For modern browsers
* 1. The space content is one way to avoid an Opera bug when the
* contenteditable attribute is included anywhere else in the document.
* Otherwise it causes space to appear at the top and bottom of elements
* that are clearfixed.
* 2. The use of `table` rather than `block` is only necessary if using
* `:before` to contain the top-margins of child elements.
*/
.cf
:before
,
.cf
:after
{
content
:
" "
;
/* 1 */
display
:
table
;
/* 2 */
}
.cf
:after
{
clear
:
both
;
}
/**
* For IE 6/7 only
* Include this rule to trigger hasLayout and contain floats.
*/
.cf
{
*
zoom
:
1
;
}
panikweb_templates/static/css/reset.css
View file @
e17e1254
...
...
@@ -31,7 +31,6 @@ body {
line-height
:
1
;
}
ol
,
ul
{
list-style
:
none
;
}
blockquote
,
q
{
quotes
:
none
;
...
...
panikweb_templates/static/css/s
tyle
.css
→
panikweb_templates/static/css/s
pecifics
.css
View file @
e17e1254
...
...
@@ -10,6 +10,24 @@
#player
,
#player
.symbol
{
color
:
#FF6633
;
}
#player
.label
{
background-color
:
#FF6633
;
}
#player
.controls
,
#player
hr
,
player
.item
,
#player
img
{
border-color
:
#FF6633
;}
/* FONTS */
.dateBloc
{
font-family
:
"Reglo"
;
text-transform
:
uppercase
;
}
.dateBloc
*
{
line-height
:
100%
;}
.dateBloc
.day
{
font-size
:
2.2em
;}
.dateBloc
.number
{
font-size
:
2.2em
;}
.dateBloc
.month
{
font-size
:
0.8em
;}
.dateBloc
.time
{
font-size
:
1.2em
;}
.tabs
.ui-tabs-nav
{
font-size
:
0.8em
;
font-family
:
"Reglo"
;
text-transform
:
uppercase
;
}
/* SIZES
@xxs: 8px;
...
...
@@ -59,34 +77,7 @@ body {
@media
screen
and
(
min-width
:
400px
)
and
(
max-width
:
780px
)
{
#main
{
font-size
:
90%
;}
}
/* Mixins & USEFUL CLASSES */
.squash
(
@x
,
@
y
:
1
)
{
transform
:
scale
(
@
x
,
@
y
);
-webkit-transform
:
scale
(
@
x
,
@
y
);
-moz-transform
:
scale
(
@
x
,
@
y
);
-ms-transform
:
scale
(
@
x
,
@
y
);
-o-transform
:
scale
(
@
x
,
@
y
);
-webkit-transform-origin
:
0
0
;
-moz-transform-origin
:
0
0
;
-ms-transform-origin
:
0
0
;
transform-origin
:
0
0
;
width
:
200%
;
}
.focusFade
{
-webkit-transition-property
:
color
;
-webkit-transition-duration
:
0.2s
;
-webkit-transition-timing-function
:
ease
;
}
.extra-margin
{
margin-bottom
:
16px
;
}
.ellipsis
{
white-space
:
nowrap
;
text-overflow
:
ellipsis
;
overflow
:
hidden
;
}
.symbol
{
font-size
:
3em
;
...
...
@@ -100,8 +91,6 @@ body {
font-size
:
6em
;
}
.label
{
text-transform
:
uppercase
;
font-family
:
"Reglo"
;
...
...
@@ -114,6 +103,25 @@ body {
color
:
white
;
padding
:
5px
7px
0px
7px
;
}
ul
.tags
{
margin
:
10px
0
0
0
;
overflow
:
hidden
;
margin-bottom
:
15px
;
}
ul
.tags
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
;
}
/*
.symbol {
font-family: RegloSymbol;
...
...
@@ -131,7 +139,6 @@ body {
left:68px;
}
*/
.block
{
display
:
block
;}
button
.control
,
button
.symbol
{
background
:
transparent
;
border
:
none
;
margin
:
0
;
padding
:
0
;}
nav
.menu
{
width
:
100%
;
...
...
@@ -143,6 +150,9 @@ nav.menu li{
margin-right
:
2em
;
}
/**** TABS ****/
/* GLOBAL SITE NAV */
#search-form
{
content
:
'Rechercher'
;}
...
...
@@ -519,250 +529,12 @@ ul.tagsArchives li {
text-align
:
center
;
}
/**** PROGRAM ****/
/****************************************************/
/**** Breves
.breves, #content.breve {
color:@blue;
a, a:visited, a:active {
color:@blue;
}
a:hover{
color: lighten(@blue, 30%);
}
}
.breves {
width: @breves-width;
float: left;
margin-left: 50px;
}
.breves img {
border: 2px solid @blue;
}
.breves-header span {
background-color: @blue;
color: white;
padding: 10px @s;
height: @s;
font-size: @s;
font-family: RegloBold;
text-transform: uppercase;
display: inline-block;
}
.breves h4 {
clear:both;
margin:10px 0 16px 0;
}
.label p{
margin-top:5px;
margin-right:5px;
float:left;
text-decoration:underline;
}
.breves-big {
width:350px;
margin:0 10px;
float:left
}
.breves-small {
width:165px;
margin:0 10px;
float:left
}
.breves .suite {
margin:10px 0 40px 0;
height:20px;
width:124px;
background-color: @blue;
clear:both;
margin-left: 10px;
}
.breves .symbol {
margin:2px 5px;
color:white;
font-size:@l;
}
.breves .suite p {
color: white;
text-transform: uppercase;
letter-spacing:1px;
font-family: RegloMedium;
font-size:@xs;
padding-top:4px;
}
.breves-image {
position: relative;
}
.breves .trans {
text-transform: uppercase;
font-family: Reglo;
letter-spacing:1px;
font-size:@m;
background-color:@blue;
position: absolute;
left:10px;
top:-5px;
color:white;
padding:5px 7px 0px 7px;
}
****/
/**** TO REWRITE ****/
/* The h1 needs to be two times bigger, than it’s containing box, because with the matrix transform we’re going to squash it in 2 */
/*
#content h1 {
width: 996px;
}
#content h3 {
margin-bottom:30px;
}
#content {
width: @content-width;
float: left;
margin-left: 60px;
}
#content.wide {
width: 498px + 50px + 370px;
}
a, .menuEmissions a, a:visited, .menuEmissions a:visited, a:active, .menuEmissions a:active {
color: lighten(@black, 20%);
}
#content hr {
display: block;
height: 1px;
border-top: 3px solid @black;
}
.accordion {
margin-bottom:50px;
}
.accordion .slide-out {
display: none;
}
.accordion .strip {
margin:2px 0;
height:20px;
background-color: @black;
color: white;
font-family:RegloMedium;
text-transform: uppercase;
letter-spacing:1px;
font-size:@xs;
padding-top:4px;
.focusFade();
cursor: pointer;
}
.accordion .strip:hover {
background-color: @black;
}
.accordion .symbol {
color: white;
font-size:@l;
margin: 0px 5px;
}
.a-propos {
margin: 30px 10px;
}
.a-propos p {
margin-bottom:15px;
}
.a-propos h4 {
margin:15px 0;
height: 12px;
background-color:@black;
color:white;
font-family:RegloMedium;
padding:4px;
letter-spacing:1px;
font-size:@xs;
display:inline-block;
}
.associated-sounds {
margin: 30px 0;
.symbols {
font-size:@xl*1.3;
float: right;
line-height:50%;
}
.soundGrey {
background-color:#D0D0D0;
}
div.item {
margin-top: 20px;
padding: 10px;
}
h3 {
margin-bottom:30px;
}
}
*/
.todo
:hover
,
.todo
*
:hover
{
text-decoration
:
line-through
;
color
:
red
!important
;
}
/**
* For modern browsers
* 1. The space content is one way to avoid an Opera bug when the
* contenteditable attribute is included anywhere else in the document.
* Otherwise it causes space to appear at the top and bottom of elements
* that are clearfixed.
* 2. The use of `table` rather than `block` is only necessary if using
* `:before` to contain the top-margins of child elements.
*/
.cf
:before
,
.cf
:after
{
content
:
" "
;
/* 1 */
display
:
table
;
/* 2 */
#Program
.dateBloc
{
float
:
left
;
padding-top
:
1em
;
margin-right
:
2em
;
}
.cf
:after
{
clear
:
both
;
}
/**
* For IE 6/7 only
* Include this rule to trigger hasLayout and contain floats.
*/
.cf
{
*
zoom
:
1
;
}
panikweb_templates/static/js/specifics.js
0 → 100644
View file @
e17e1254
$
(
function
()
{
$
(
"
.tabs
"
).
tabs
();
});
panikweb_templates/templates/base.html
View file @
e17e1254
...
...
@@ -7,12 +7,13 @@
<script
type=
"text/javascript"
src=
"{{ STATIC_URL }}js/jquery.js"
></script>
<script
type=
"text/javascript"
src=
"http://code.jquery.com/ui/1.10.3/jquery-ui.js"
></script>
<link
rel=
"stylesheet"
href=
"http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css"
/>
<script
type=
"text/javascript"
src=
"{{ STATIC_URL }}js/specifics.js"
></script>
<link
rel=
"stylesheet"
href=
"{{ STATIC_URL }}css/reset.css"
type=
"text/css"
/>
<link
rel=
"stylesheet"
href=
"{{ STATIC_URL }}css/type.css"
type=
"text/css"
/>
<link
rel=
"stylesheet"
href=
"{{ STATIC_URL }}css/
tags
.css"
type=
"text/css"
/>
<link
rel=
"stylesheet"
href=
"{{ STATIC_URL }}css/s
tyle
.css"
type=
"text/css"
/>
<link
rel=
"stylesheet"
href=
"{{ STATIC_URL }}css/
general
.css"
type=
"text/css"
/>
<link
rel=
"stylesheet"
href=
"{{ STATIC_URL }}css/s
pecifics
.css"
type=
"text/css"
/>
<!--<script src="{{ STATIC_URL }}js/less-1.4.1.js" type="text/javascript"></script>
<link rel="stylesheet" href="{{ STATIC_URL }}css/style.css" />-->
...
...
panikweb_templates/templates/program.html
View file @
e17e1254
{% extends "base.html" %}
{% block main %}
<h1>
Programme
</h1>
<div
id=
"tabs"
>
<ul>
{% for day in days %}
<li><a
href=
"#tabs-{{ day.datetime|date:"
w
"
}}"
>
{{ day.datetime|date:"D" }}
</a></li>
{% endfor %}
</ul>
{% for day in days %}
<div
id=
"tabs-{{ day.datetime|date:"
w
"
}}"
>
<ul
class=
"emission-list"
>
{% for schedule in day.schedules %}
<li
>
<div
class=
"date"
>
<div
class=
"time"
>
{{ schedule.datetime|date:"H:i" }}
</div>
</div>
{% include "emissions/inline.html" with emission=schedule.emission %}
</li>
{% endfor %}
</ul>
</div>
{% endfor %}
<div
id=
"Program"
>
<h1>
Programme
</h1>
<div
class=
"tabs"
>