...
 
Commits (2)
...@@ -11,7 +11,7 @@ ...@@ -11,7 +11,7 @@
include('inc/variables.php'); include('inc/variables.php');
include('inc/functions.php'); include('inc/functions.php');
include('inc/head.php'); include('inc/head.php');
include('agenda.php'); include('agenda.php');
?> ?>
<section id="apropos" class="content" data-simplebar data-simplebar-auto-hide="false"> <section id="apropos" class="content" data-simplebar data-simplebar-auto-hide="false">
...@@ -22,7 +22,7 @@ ...@@ -22,7 +22,7 @@
<li class="en">En</li> <li class="en">En</li>
</ul> </ul>
<?php endif ?> <?php endif ?>
<img class="claire" src="<?php echo $config->urls->templates ?>/style/claire-s-working.png"/> <img class="claire" src="<?php echo $config->urls->templates ?>/style/claire-s-working.png"/>
<article class="letexte"> <article class="letexte">
<h1><?= $page->title ?></h1> <h1><?= $page->title ?></h1>
......
...@@ -4,15 +4,16 @@ ...@@ -4,15 +4,16 @@
<html> <html>
<head> <head>
<title>Claire Williams</title> <title>Claire Williams</title>
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0,
maximum-scale=1.0, user-scalable=no, shrink-to-fit=no">
<link rel="stylesheet" type="text/css" href="<?php echo $config->urls->templates ?>style/reset.css" /> <link rel="stylesheet" type="text/css" href="<?php echo $config->urls->templates ?>style/reset.css" />
<link rel="shortcut icon" type="image/x-icon" href="<?php echo $config->urls->templates ?>style/faviconok.ico"/> <link rel="shortcut icon" type="image/x-icon" href="<?php echo $config->urls->templates ?>style/faviconok.ico"/>
<link rel="stylesheet" type="text/css" href="<?php echo $config->urls->templates ?>style/main.css" /> <link rel="stylesheet" type="text/css" href="<?php echo $config->urls->templates ?>style/main.css" />
<!-- <link rel="stylesheet/less" type="text/css" href="<?php echo $config->urls->templates ?>style/main.less" /> --> <!-- <link rel="stylesheet/less" type="text/css" href="<?php echo $config->urls->templates ?>style/main.less" /> -->
<link rel="stylesheet/less" type="text/css" href="<?php echo $config->urls->templates?>style/responsive.less" /> <link rel="stylesheet/less" type="text/css" href="<?php echo $config->urls->templates?>style/responsive.css" />
<script type="text/javascript" src="<?php echo $config->urls->templates ?>js/lib/jquery-3.2.1.min.js"></script> <script type="text/javascript" src="<?php echo $config->urls->templates ?>js/lib/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="<?php echo $config->urls->templates ?>js/lib/less.min.js"></script> <script type="text/javascript" src="<?php echo $config->urls->templates ?>js/lib/less.min.js"></script>
<script type="text/javascript" src="<?php echo $config->urls->templates ?>js/lib/masonry.pkgd.min.js"></script> <script type="text/javascript" src="<?php echo $config->urls->templates ?>js/lib/masonry.pkgd.min.js"></script>
<script type="text/javascript" src="<?php echo $config->urls->templates ?>js/lib/simplebar.js"></script>
<noscript> <noscript>
<style> <style>
[data-simplebar] { [data-simplebar] {
......
...@@ -105,16 +105,14 @@ ...@@ -105,16 +105,14 @@
<?php endforeach ?> <?php endforeach ?>
</div> </div>
<?php if ($currentPage == 'apropos' || $currentPage == 'onePage'): ?>
<?php if ($currentPage == 'apropos'): ?>
<div id="licencescredits" class="licencescredits"> <div id="licencescredits" class="licencescredits">
<img class="logoFWB" alt="Fédération Wallonie Bruxelles" src="http://www.culture.be/fileadmin/sites/culture/upload/culture_super_editor/culture_editor/images/Logos_FWB/logo_noir.jpg"/> <?php echo $currentPage == 'apropos' ? '<img class="logoFWB" alt="Fédération Wallonie Bruxelles" src="http://www.culture.be/fileadmin/sites/culture/upload/culture_super_editor/culture_editor/images/Logos_FWB/logo_noir.jpg"/><br>' : ''; ?>
<br>
<a rel="license" href="http://creativecommons.org/licenses/by-sa/4.0/"> This work is licensed under <a href="http://artlibre.org/licence/lal/en/">Free Art License</a> and&nbsp;<a rel="license" href="http://creativecommons.org/licenses/by-sa/4.0/">Creative Commons Attribution-ShareAlike 4.0 International License</a>
<img alt="Creative Commons License" src="https://i.creativecommons.org/l/by-sa/4.0/80x15.png" /></a> <img alt="Creative Commons License" src="https://i.creativecommons.org/l/by-sa/4.0/80x15.png" /></a>
This work is licensed under a <a rel="license" href="http://creativecommons.org/licenses/by-sa/4.0/">Creative Commons Attribution-ShareAlike 4.0 International License</a> <?php echo $currentPage == 'apropos' ? '<p>Design &amp; développement: <a href="http://www.luuse.io/">Luuse</a></p>' : ''; ?>
<p>Design &amp; développement: <a href="http://www.luuse.io/">Luuse</a></p>
</div> </div>
<?php endif; ?> <?php endif; ?>
......
...@@ -203,6 +203,7 @@ function hoverGoAfter(){ ...@@ -203,6 +203,7 @@ function hoverGoAfter(){
function escalier(nav, tagList) { function escalier(nav, tagList) {
var size2 = tagList.css('font-size'); var size2 = tagList.css('font-size');
console.log(size2);
var size = parseInt(size2.substr(0, size2.length - 2))+2; var size = parseInt(size2.substr(0, size2.length - 2))+2;
tagList.each(function(){ tagList.each(function(){
var li = $(this); var li = $(this);
...@@ -285,6 +286,7 @@ function openAgenda(nav, actu){ ...@@ -285,6 +286,7 @@ function openAgenda(nav, actu){
} }
function closeAgenda(actu){ function closeAgenda(actu){
actu.find('h1').click(function(){ actu.find('h1').click(function(){
actu.css({'visibility': 'hidden'}); actu.css({'visibility': 'hidden'});
actu.children('.simplebar-track').hide(); actu.children('.simplebar-track').hide();
...@@ -426,3 +428,13 @@ function addPreToCode(){ ...@@ -426,3 +428,13 @@ function addPreToCode(){
} }
}) })
} }
function navTop(nav) {
var title = nav.find('h1');
title.children('a').click(function(e){
e.preventDefault();
})
title.click(function(){
$(this).parents('#nav').toggleClass('mobileClicked');
})
}
...@@ -58,11 +58,20 @@ $(document).ready(function() { ...@@ -58,11 +58,20 @@ $(document).ready(function() {
addPreToCode(); addPreToCode();
if ($(window).width() < 600) {
navTop(nav);
} else if ($(window).width() >= 600){
$('head').append('<script type="text/javascript" src="<?php echo $config->urls->templates ?>js/lib/simplebar.js"></script>');
}
}) })
$(window).on('load', function() { $(window).on('load', function() {
var actu = $('#actu'); var actu = $('#actu');
var nav = $('#nav'); var nav = $('#nav');
var page = $('.content').attr('id');
var tagListCats = nav.find('.categories ul li:not(:nth-of-type(1))'); var tagListCats = nav.find('.categories ul li:not(:nth-of-type(1))');
var tagListMenu = nav.find('#menu ul li:not(:nth-of-type(1)) a'); var tagListMenu = nav.find('#menu ul li:not(:nth-of-type(1)) a');
var tagListTitle = nav.find('.categories ul li.title h1'); var tagListTitle = nav.find('.categories ul li.title h1');
...@@ -72,9 +81,11 @@ $(window).on('load', function() { ...@@ -72,9 +81,11 @@ $(window).on('load', function() {
setTimeout(function(){ masoFallback(article) }, 3000); setTimeout(function(){ masoFallback(article) }, 3000);
openAgendaOnLoad(actu); openAgendaOnLoad(actu);
whiteSpaceHeight(nav); whiteSpaceHeight(nav);
escalier(nav, tagListMenu); // if (page != 'apropos') {
escalier(nav, tagListCats); escalier(nav, tagListMenu);
escalier(nav, tagListTitle); escalier(nav, tagListCats);
escalier(nav, tagListTitle);
// }
}) })
......
This diff is collapsed.
// out: main.css, sourcemap: false, compress: true
@unit: 12px; @unit: 12px;
@color2: #110F2E; @color2: #110F2E;
// @color3: #66FF80; //vert // @color3: #66FF80; //vert
...@@ -337,7 +339,7 @@ display: flex; ...@@ -337,7 +339,7 @@ display: flex;
} }
.grid_item[class^="projet workshops"]{ .grid_item[class^="projet workshops"]{
h1{ h1{
transform: skewX(40deg); // transform: skewX(40deg);
} }
} }
...@@ -680,11 +682,15 @@ display: flex; ...@@ -680,11 +682,15 @@ display: flex;
padding-bottom:@unit*5; padding-bottom:@unit*5;
position: relative; position: relative;
border-bottom: initial; border-bottom: initial;
h1{ h1,
h2{
color: @color4; color: @color4;
font-size: 50px; font-size: 50px;
margin-bottom: @unit; margin-bottom: @unit;
} }
h2{
margin-top: @unit * 6;
}
div{ div{
width: 90%; width: 90%;
} }
...@@ -699,6 +705,18 @@ display: flex; ...@@ -699,6 +705,18 @@ display: flex;
p:first-child{ p:first-child{
text-indent: 0; text-indent: 0;
} }
li{
margin-left: @unit*4;
display: block;
a{
font-size: .75em;
font-family: "oldS-round";
color: blue;
}
}
li:hover,
li.current{
}
} }
} }
...@@ -1408,8 +1426,11 @@ section#projet { ...@@ -1408,8 +1426,11 @@ section#projet {
} }
.licencescredits{ .licencescredits{
position: fixed; position: fixed;
bottom: @unit / 2; bottom: 0;
padding-bottom: @unit / 2;
font-family: 'iA-regular'; font-family: 'iA-regular';
font-size: 0.75em;
background: white;
a{ a{
text-decoration: underline; text-decoration: underline;
} }
...@@ -1417,7 +1438,6 @@ section#projet { ...@@ -1417,7 +1438,6 @@ section#projet {
color: blue; color: blue;
} }
img{ img{
margin-top: @unit*2;
} }
img.logoFWB{ img.logoFWB{
width: 60px; width: 60px;
...@@ -1438,6 +1458,9 @@ section#projet { ...@@ -1438,6 +1458,9 @@ section#projet {
} }
} }
section#nav{ section#nav{
#categoriesonePage{
padding-bottom: 150px;
}
#menu{ #menu{
h1{ h1{
font-size: 24px; font-size: 24px;
......
This diff is collapsed.
// out: responsive.css, sourcemap: false, compress: false
@unit: 12px; @unit: 12px;
@color2: #110F2E; // @color3: #66FF80; //vert @color2: #110F2E; // @color3: #66FF80; //vert
@color3: #110F2E; @color3: #110F2E;
...@@ -87,28 +90,45 @@ ...@@ -87,28 +90,45 @@
@media screen and (max-device-width: 600px) and (orientation: portrait) { @media screen and (max-device-width: 600px) and (orientation: portrait) {
body { html, body {
width: 100%;
overflow-y: scroll;
height: auto !important;
section#nav { section#nav {
// display: none; // display: none;
position: fixed; position: fixed;
top: 0; top: 0;
width: 100%; width: 100%;
height: auto; overflow-x: hidden;
height: 20px;
border-bottom: 1px solid @color3; border-bottom: 1px solid @color3;
#menu { #menu {
li { ul{
float: left; li {
} float: left;
li:nth-of-type(1), h1{
li:nth-of-type(6), text-align: center;
{ display: block;
float: none; outline: none;
&::before{
content: '≡ ';
text-align: left;
position: absolute;
left: @unit;
}
}
}
li:nth-of-type(1),
li:nth-of-type(6),
{
float: none;
}
} }
h1 { h1 {
font-size: 4vw;
margin-bottom: 4px; margin-bottom: 4px;
} }
...@@ -125,13 +145,40 @@ ...@@ -125,13 +145,40 @@
.categories { .categories {
display: none; display: none;
} }
#licencescredits.licencescredits{
z-index: -100;
position: relative;
padding-top: @unit*2;
}
}
section#nav.mobileClicked{
height: 100%;
#menu {
ul{
li {
h1::before{
content: 'X ';
}
}
}
}
} }
section#blogPost, section#blogPost,
section#menu, section#menu,
section#projet, section#projet,
section#documentation, section#documentation,
section#projets { section#projets,
section#docs{
z-index: 0;
position: relative;
overflow-x: hidden;
margin-top: @unit * 4;
width: 100% !important;
.simplebar-track.horizontal{
display: none;
overflow-x: hidden;
}
.grid { .grid {
width: calc(100% ~'- 5px'); width: calc(100% ~'- 5px');
...@@ -147,6 +194,10 @@ ...@@ -147,6 +194,10 @@
section#doc, section#doc,
section#documentation, section#documentation,
section#projet { section#projet {
z-index: 0;
position: relative;
overflow-x: hidden;
margin-top: @unit * 4;
article { article {
h1 { h1 {
margin-left: @unit; margin-left: @unit;
...@@ -157,6 +208,7 @@ ...@@ -157,6 +208,7 @@
h2 { h2 {
margin-left: @unit; margin-left: @unit;
margin-right: @unit * 1.5;
margin-top: @unit; margin-top: @unit;
font-size: 8vw; font-size: 8vw;
} }
...@@ -179,25 +231,32 @@ ...@@ -179,25 +231,32 @@
line-height: 5.5vw; line-height: 5.5vw;
} }
} }
figure,
iframe,
p img,
figure img{
overflow-x: hidden;
max-width: 100% !important;
float: none;
width: 100% !important;
}
p { p {
width: 90%; width: 90%;
font-size: 4.5vw; font-size: 4.5vw;
line-height: 5.5vw; line-height: 5.5vw;
margin-left: @unit; margin-left: @unit;
cite::first-line { cite::first-line {
margin-top: @unit; margin-top: @unit;
} }
cite { cite {
padding: @unit/4; padding: @unit/4;
font-size: 5vw; font-size: 4.5vw;
line-height: 5.5vw; line-height: 5.5vw;
a { a {
font-family: "iA-regularItalic"; font-family: "iA-regularItalic";
font-size: 4.5vw; font-size: 4vw;
} }
} }
...@@ -296,14 +355,23 @@ ...@@ -296,14 +355,23 @@
} }
} }
section#docs { section#docs .grid{
article { article {
a { a {
.bloc-vignettes { .bloc-vignettes {
display: none; display: none;
} }
h1{
width: 97%;
}
} }
} }
} }
section#apropos{
overflow: auto;
img.claire{
z-index: -100;
}
}
} }
} }