bachir/Clameurs
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

more design : each theme has his own background

Browse Source
This commit is contained in:
bachir
2017-02-24 19:56:03 +01:00
parent fc8070a669
commit 242d6b0336
31 changed files with 1719 additions and 671 deletions
Download Patch File Download Diff File Expand all files Collapse all files
sites/all/themes/figureslibres/clameurs/css/dist/styles.css
Vendored
+146 -76
View File
@@ -40,7 +40,7 @@ input {
width: 1024px;
margin: 0 auto; }
#header h1 {
#header h1 a {
display: block;
height: 335px;
background-image: url(../../images/logo.png);
@@ -55,6 +55,25 @@ input {
text-align: center;
color: #20c498; }
#node-63 {
padding: 1em 0; }
#node-63 .content section {
display: inline; }
#node-63 .content p {
margin: 0; }
#node-63 ul.links {
text-align: right;
margin: 0;
padding: 0; }
#node-63 ul.links li {
margin: 0;
padding: 0;
display: inline-block; }
#node-63 ul.links a {
color: inherit;
text-decoration: none;
font-weight: 500; }
#thematique-anchor-links {
padding: 1em 0; }
#thematique-anchor-links ul {
@@ -67,84 +86,117 @@ input {
padding: 0;
margin: 0; }
#thematique-anchor-links ul li {
max-width: 7em;
list-style: none;
padding: 0 1em;
padding: 0;
margin: 0; }
#thematique-anchor-links ul li a {
text-decoration: none;
font-weight: 600; }
font-weight: 600;
display: block;
min-height: 3em;
background-position: center;
background-repeat: no-repeat;
background-size: contain; }
#thematique-anchor-links ul li a span {
display: block; }
#thematique-anchor-links ul li a.en_attente {
color: #ddd; }
#thematique-anchor-links ul li a.node-32 {
background-image: url(../../images/fond-theme-lite-0.jpg);
color: #2f82ff; }
#thematique-anchor-links ul li a.node-14 {
background-image: url(../../images/fond-theme-lite-1.jpg);
color: #ff0000; }
#thematique-anchor-links ul li a.node-38 {
background-image: url(../../images/fond-theme-lite-2.jpg);
color: #88aa00; }
#thematique-anchor-links ul li a.node-3 {
background-image: url(../../images/fond-theme-lite-3.jpg);
color: #ff6600; }
#thematique-anchor-links ul li a.node-20 {
background-image: url(../../images/fond-theme-lite-4.jpg);
color: #ff2ad4; }
#thematique-anchor-links ul li a.node-26 {
background-image: url(../../images/fond-theme-lite-5.jpg);
color: #8800aa; }
html,
body,
#container,
#main,
#main > .region,
#block-system-main,
#block-system-main > .content,
.node-thematique {
background-position: center;
background-size: contain;
background-repeat: no-repeat; }
.node-thematique.node-32 {
background-image: url(../../images/fond-theme-0.png); }
.node-thematique.node-32 > h2,
.node-thematique.node-32 .group-video .field-name-field-description h3,
.node-thematique.node-32 .group-description .field-name-field-ecouter,
.node-thematique.node-32 .node-documentair .field-name-field-doc,
.node-thematique.node-32 .node-episode .field-name-title-field {
color: #2f82ff; }
.node-thematique.node-14 {
background-image: url(../../images/fond-theme-0.png); }
.node-thematique.node-14 > h2,
.node-thematique.node-14 .group-video .field-name-field-description h3,
.node-thematique.node-14 .group-description .field-name-field-ecouter,
.node-thematique.node-14 .node-documentair .field-name-field-doc,
.node-thematique.node-14 .node-episode .field-name-title-field {
color: #ff0000; }
.node-thematique.node-38 {
background-image: url(../../images/fond-theme-0.png); }
.node-thematique.node-38 > h2,
.node-thematique.node-38 .group-video .field-name-field-description h3,
.node-thematique.node-38 .group-description .field-name-field-ecouter,
.node-thematique.node-38 .node-documentair .field-name-field-doc,
.node-thematique.node-38 .node-episode .field-name-title-field {
color: #88aa00; }
.node-thematique.node-3 {
background-image: url(../../images/fond-theme-0.png); }
.node-thematique.node-3 > h2,
.node-thematique.node-3 .group-video .field-name-field-description h3,
.node-thematique.node-3 .group-description .field-name-field-ecouter,
.node-thematique.node-3 .node-documentair .field-name-field-doc,
.node-thematique.node-3 .node-episode .field-name-title-field {
color: #ff6600; }
.node-thematique.node-20 {
background-image: url(../../images/fond-theme-0.png); }
.node-thematique.node-20 > h2,
.node-thematique.node-20 .group-video .field-name-field-description h3,
.node-thematique.node-20 .group-description .field-name-field-ecouter,
.node-thematique.node-20 .node-documentair .field-name-field-doc,
.node-thematique.node-20 .node-episode .field-name-title-field {
color: #ff2ad4; }
.node-thematique.node-26 {
background-image: url(../../images/fond-theme-0.png); }
.node-thematique.node-26 > h2,
.node-thematique.node-26 .group-video .field-name-field-description h3,
.node-thematique.node-26 .group-description .field-name-field-ecouter,
.node-thematique.node-26 .node-documentair .field-name-field-doc,
.node-thematique.node-26 .node-episode .field-name-title-field {
color: #8800aa; }
overflow-x: visible; }
.node-thematique {
min-height: 766px;
position: relative; }
.node-thematique::before {
position: absolute;
content: " ";
width: 110%;
height: 110%;
top: -5%;
left: -5%;
z-index: -1;
background-position: center;
background-size: contain;
background-repeat: no-repeat; }
.node-thematique.node-32::before {
background-image: url(../../images/fond-theme-0.jpg); }
.node-thematique.node-32 > h2,
.node-thematique.node-32 .group-video .field-name-field-description h3,
.node-thematique.node-32 .group-description .field-name-field-ecouter,
.node-thematique.node-32 .node-documentair .field-name-field-doc,
.node-thematique.node-32 .node-episode .field-name-title-field {
color: #2f82ff; }
.node-thematique.node-14::before {
background-image: url(../../images/fond-theme-1.jpg); }
.node-thematique.node-14 > h2,
.node-thematique.node-14 .group-video .field-name-field-description h3,
.node-thematique.node-14 .group-description .field-name-field-ecouter,
.node-thematique.node-14 .node-documentair .field-name-field-doc,
.node-thematique.node-14 .node-episode .field-name-title-field {
color: #ff0000; }
.node-thematique.node-38::before {
background-image: url(../../images/fond-theme-2.jpg); }
.node-thematique.node-38 > h2,
.node-thematique.node-38 .group-video .field-name-field-description h3,
.node-thematique.node-38 .group-description .field-name-field-ecouter,
.node-thematique.node-38 .node-documentair .field-name-field-doc,
.node-thematique.node-38 .node-episode .field-name-title-field {
color: #88aa00; }
.node-thematique.node-3::before {
background-image: url(../../images/fond-theme-3.jpg); }
.node-thematique.node-3 > h2,
.node-thematique.node-3 .group-video .field-name-field-description h3,
.node-thematique.node-3 .group-description .field-name-field-ecouter,
.node-thematique.node-3 .node-documentair .field-name-field-doc,
.node-thematique.node-3 .node-episode .field-name-title-field {
color: #ff6600; }
.node-thematique.node-20::before {
background-image: url(../../images/fond-theme-4.jpg); }
.node-thematique.node-20 > h2,
.node-thematique.node-20 .group-video .field-name-field-description h3,
.node-thematique.node-20 .group-description .field-name-field-ecouter,
.node-thematique.node-20 .node-documentair .field-name-field-doc,
.node-thematique.node-20 .node-episode .field-name-title-field {
color: #ff2ad4; }
.node-thematique.node-26::before {
background-image: url(../../images/fond-theme-5.jpg); }
.node-thematique.node-26 > h2,
.node-thematique.node-26 .group-video .field-name-field-description h3,
.node-thematique.node-26 .group-description .field-name-field-ecouter,
.node-thematique.node-26 .node-documentair .field-name-field-doc,
.node-thematique.node-26 .node-episode .field-name-title-field {
color: #8800aa; }
.node-thematique > h2 {
font-size: 3em;
font-weight: 400; }
font-weight: 400;
padding-left: 0.18em; }
.node-thematique .content {
letter-spacing: -0.25em; }
.node-thematique .content .field-name-field-emvideo img {
@@ -165,10 +217,12 @@ input {
position: relative;
height: 5.75em;
overflow: hidden;
background-color: transparent;
background-color: #fff;
transition: background-color 0.5 ease-in-out; }
.node-thematique .content article.main .field-name-body .summary p {
font-size: 1.3em; }
font-size: 1.1em;
padding: 0.5em;
font-weight: 500; }
.node-thematique .content article.main .field-name-body .value {
position: absolute;
height: 1px;
@@ -298,28 +352,31 @@ input {
width: 100%;
height: 100%; }
#block-menu-menu-footer-menu ul {
margin: 0;
padding: 0;
.page-title {
font-size: 3em;
font-weight: 400;
text-transform: capitalize; }
#block-menu-menu-footer-menu {
padding: 2em 0; }
#block-menu-menu-footer-menu ul {
margin: 0;
padding: 0;
text-align: center; }
#block-menu-menu-footer-menu li {
display: inline-block;
list-style: none; }
#block-menu-menu-footer-menu a {
text-decoration: none;
color: inherit; }
.region-footer-bottom {
text-align: center; }
#block-menu-menu-footer-menu li {
.region-footer-bottom .block {
display: inline-block;
list-style: none; }
#block-menu-menu-footer-menu a {
text-decoration: none;
color: inherit; }
.footer-block .block {
font-size: 0.75em; }
#footer-bottom {
text-align: center; }
#footer-bottom .block {
background-color: transparent;
font-size: 0.7em; }
font-size: 0.7em;
margin: 2em 0; }
#content {
padding: 1em; }
@@ -469,3 +526,16 @@ table tbody td {
td.active {
background-color: transparent; }
#tasks .tabs {
border: none;
padding: 0; }
#tasks .tabs a {
border: none;
border-radius: 3px;
background-color: #eee;
padding: 0.4em;
color: #000;
margin: 0 1em 0 0; }
#tasks .tabs a.active {
background-color: #999; }
sites/all/themes/figureslibres/clameurs/css/styles.scss
+118 -20
View File
@@ -51,10 +51,11 @@ body{
#container{
width:1024px; margin:0 auto;
// overflow-x: visible;
}
#header{
h1{
h1 a{
display:block;
height:335px;
background-image: url(../../images/logo.png);
@@ -74,6 +75,21 @@ body{
// about
#node-63{
// color:$bleu;
padding:1em 0;
.content{
section{display: inline;}
p{ margin:0;}
}
ul.links{
// display: block;
text-align: right;
margin: 0; padding: 0;
li{margin: 0; padding: 0; display: inline-block;}
a{
color: inherit; text-decoration: none;
font-weight: 500;
}
}
}
#thematique-anchor-links{
@@ -82,14 +98,22 @@ body{
display: flex;
flex-flow: row nowrap;
justify-content: space-between;
padding:0; margin:0;
li{
max-width: 7em;
list-style: none;
padding:0 1em; margin: 0;
padding:0; margin: 0;
a{
// color: $bleu;
text-decoration: none;
font-weight: 600;
display:block;
min-height: 3em;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
span{
display: block;
}
@@ -98,21 +122,27 @@ body{
color:#ddd;
}
&.node-32{
background-image: url(../../images/fond-theme-lite-0.jpg);
color:$coul0;
}
&.node-14{
background-image: url(../../images/fond-theme-lite-1.jpg);
color:$coul1;
}
&.node-38{
background-image: url(../../images/fond-theme-lite-2.jpg);
color:$coul2;
}
&.node-3{
background-image: url(../../images/fond-theme-lite-3.jpg);
color:$coul3;
}
&.node-20{
background-image: url(../../images/fond-theme-lite-4.jpg);
color:$coul4;
}
&.node-26{
background-image: url(../../images/fond-theme-lite-5.jpg);
color:$coul5;
}
}
@@ -121,57 +151,85 @@ body{
}
html,
body,
#container,
#main,
#main>.region,
#block-system-main,
#block-system-main>.content,
.node-thematique{
overflow-x: visible;
}
// thematique
.node-thematique{
min-height:766px;
position: relative;
background-position: center;
background-size: contain;
background-repeat: no-repeat;
&::before{
position: absolute;
content:" ";
width:110%; height:110%;
top:-5%; left:-5%;
z-index: -1;
background-position: center;
background-size: contain;
background-repeat: no-repeat;
// border: 1px dotted red;
}
&.node-32{
background-image: url(../../images/fond-theme-0.png);
&::before{background-image: url(../../images/fond-theme-0.jpg);}
>h2,
// .group-txt .summary p,
.group-video .field-name-field-description h3,
.group-description .field-name-field-ecouter,
.node-documentair .field-name-field-doc,
.node-episode .field-name-title-field{color: $coul0;}
}
&.node-14{
background-image: url(../../images/fond-theme-0.png);
&::before{background-image: url(../../images/fond-theme-1.jpg);}
>h2,
// .group-txt .summary p,
.group-video .field-name-field-description h3,
.group-description .field-name-field-ecouter,
.node-documentair .field-name-field-doc,
.node-episode .field-name-title-field{color: $coul1;}
}
&.node-38{
background-image: url(../../images/fond-theme-0.png);
&::before{background-image: url(../../images/fond-theme-2.jpg);}
>h2,
// .group-txt .summary p,
.group-video .field-name-field-description h3,
.group-description .field-name-field-ecouter,
.node-documentair .field-name-field-doc,
.node-episode .field-name-title-field{color: $coul2;}
}
&.node-3{
background-image: url(../../images/fond-theme-0.png);
&::before{background-image: url(../../images/fond-theme-3.jpg);}
>h2,
// .group-txt .summary p,
.group-video .field-name-field-description h3,
.group-description .field-name-field-ecouter,
.node-documentair .field-name-field-doc,
.node-episode .field-name-title-field{color: $coul3;}
}
&.node-20{
background-image: url(../../images/fond-theme-0.png);
&::before{background-image: url(../../images/fond-theme-4.jpg);}
>h2,
// .group-txt .summary p,
.group-video .field-name-field-description h3,
.group-description .field-name-field-ecouter,
.node-documentair .field-name-field-doc,
.node-episode .field-name-title-field{color: $coul4;}
}
&.node-26{
background-image: url(../../images/fond-theme-0.png);
&::before{background-image: url(../../images/fond-theme-5.jpg);}
>h2,
// .group-txt .summary p,
.group-video .field-name-field-description h3,
.group-description .field-name-field-ecouter,
.node-documentair .field-name-field-doc,
@@ -181,6 +239,7 @@ body{
>h2{
font-size: 3em;
font-weight: 400;
padding-left: 0.18em;
}
.content{
@@ -209,10 +268,12 @@ body{
.summary{
position: relative;
height:5.75em; overflow: hidden;
background-color: transparent;
background-color: #fff;
transition: background-color 0.5 ease-in-out;
p{
font-size: 1.3em;
font-size: 1.1em;
padding:0.5em;
font-weight: 500;
}
}
.value{
@@ -376,24 +437,43 @@ body{
}
}
// ____
// / __ \____ _____ ____
// / /_/ / __ `/ __ `/ _ \
// / ____/ /_/ / /_/ / __/
// /_/ \__,_/\__, /\___/
// /____/
.page-title{
font-size: 3em;
font-weight: 400;
text-transform: capitalize;
}
// ______ __
// / ____/___ ____ / /____ _____
// / /_ / __ \/ __ \/ __/ _ \/ ___/
// / __/ / /_/ / /_/ / /_/ __/ /
// /_/ \____/\____/\__/\___/_/
#footer{
}
#block-menu-menu-footer-menu{
padding:2em 0;
ul{ margin:0; padding:0; text-align: center;}
li{display:inline-block; list-style: none;}
a{ text-decoration: none; color: inherit;}
}
.footer-block .block{
font-size: 0.75em;
.region-footer-bottom{
text-align: center;
}
#footer-bottom{ text-align: center;}
#footer-bottom .block{
background-color: transparent;
// border: 0 solid #999;
.region-footer-bottom .block{
display: inline-block;
font-size:0.7em;
margin: 2em 0;
}
#content{padding:1em;}
@@ -580,3 +660,21 @@ table tbody td{
text-align: left;
}
td.active {background-color: transparent;}
#tasks{
.tabs{
border: none;
padding:0;
a{
border:none;
border-radius: 3px;
background-color: #eee;
padding:0.4em;
color: #000;
margin:0 1em 0 0;
&.active{
background-color: #999;
}
}
}
}