$citation->setAttrib('rows', 3);
$this->addElement($citation);
+ $citation_author = new Zend_Form_Element_Text('citation_author');
+ $citation_author->setLabel('Citation Author');
+ $this->addElement($citation_author);
+
$expertises = new Cubedesigners_Form_CMS_Sub_Home_Expertises();
$expertises->setLegend('Domaines d\'expertises');
$this->addSubForm($expertises, 'expertises');
parent::init();
$titre = new Zend_Form_Element_Text('title');
- $titre->setLabel('Expertise Titre');
+ $titre->setLabel('Case Studies sous-titre');
$this->addElementLocalized($titre);
$categories = new Cubedesigners_Form_Element_CategoriesCheckboxes('categories');
$titre->setLabel('Titre du bloc');
$this->addElement($titre);
+ $page = new CubeIT_Form_Element_Page('lien');
+ $page->setLabel('Lien vers');
+ $this->addElement($page);
+
$texte = new CubeIT_Form_Element_Markitup_Basic('texte');
$texte->setLabel('Texte');
$this->addElement($texte);
$titre->setLabel('Titre du bloc');
$this->addElement($titre);
+ $page = new CubeIT_Form_Element_Page('lien');
+ $page->setLabel('Lien vers');
+ $this->addElement($page);
+
$texte = new CubeIT_Form_Element_Markitup_Basic('texte');
$texte->setLabel('Texte');
$this->addElement($texte);
$titre->setLabel('Titre du bloc');
$this->addElement($titre);
+ $page = new CubeIT_Form_Element_Page('lien');
+ $page->setLabel('Lien vers');
+ $this->addElement($page);
+
$texte = new CubeIT_Form_Element_Markitup_Basic('texte');
$texte->setLabel('Texte');
$this->addElement($texte);
$picto->setLabel('Pictogramme');
$picto->setMaxItems(1);
$this->addElement($picto);
-
- $page = new CubeIT_Form_Element_Page('lien');
- $page->setLabel('Lien vers');
- $this->addElement($page);
}
}
$addOffline = 'data-offline="1"';
} */
- $image = $this->view->imageProcess($s->visuel, $s->titre, 318, 318);
- $url = Cubedesigners_Util::generateAutoUri($s, $this->_datas['seourl_stu']);
+ // Max display size is 318 but we over-sample the size by 20% because there is a CSS scale effect on hover
+ $image = $this->view->imageProcess($s->visuel, $s->titre, 382, 382);
+ $url = Cubedesigners_Util::generateAutoUri($s, $this->_datas['seourl_stu']);
- $c = $image;
+ $c = '<div class="img-wrapper">';
+ $c.= $image;
+ $c.= '</div>';
$c.= '<h2>' . $s->titre . '</h2>';
$c.='<h3>' . $s->description . '</h3>';
$res.='<div class="numeros">';
$res.='<p itemprop="telephone">' . __('Tel') . ' ' . $this->view->linkPhone($bureau['coordonnees']['tel']) . '</p>';
- $res.='<p itemprop="faxNumber">' . __('Fax') . ' ' . $this->view->linkPhone($bureau['coordonnees']['fax']) . '</p>';
+ //$res.='<p itemprop="faxNumber">' . __('Fax') . ' ' . $this->view->linkPhone($bureau['coordonnees']['fax']) . '</p>';
$res.='</div>';
//$res.= $this->view->microdataPlace($bureau['coordonnees']['adresse']);
// }
// }
$image = $this->view->imageCms($bloc['picto'], $bloc['titre'], 120, 120);
+
+ if(!empty($bloc['lien'])) {
+ $image = $this->view->linkInternal($image, $bloc['lien']);
+ }
+
$res .= '<article class="sousbloc">';
$res.= $image;
$res.= '<div class="text">';
- $res.= '<h3>' . $bloc['titre'] . '</h3>';
+ $titre = !empty($bloc['lien']) ? $this->view->linkInternal($bloc['titre'], $bloc['lien']) : $bloc['titre'];
+ $res.= '<h3>' . $titre . '</h3>';
$res.=$this->view->markupDotclear($bloc['texte']);
if ($displayDetailsButton && isset($bloc['lien']) && $bloc['lien']) {
$res.=$this->view->linkInternal(__('En savoir plus'), $bloc['lien'], array('class' => 'but'));
$time = $slide['time'] * 1000;
}
- $attributes['style'] = 'background-image:url("/images/slideshow/pattern.png"),url("' . CubeIT_View_Helper_ImageCms::getPath($slide['image']) . '");';
+ $attributes['style'] = 'background-image:url("' . CubeIT_View_Helper_ImageCms::getPath($slide['image']) . '");';
$attributes['data-time'] = $time;
$attributes['class'] = 'slide';
$link = $slide['lien'];
$this->view->headLink()->appendStylesheet('/less/list.less');
$res = '<div class="bloc-holder content">';
if ($items['titre']) {
- $res .= '<h2>' . ucfirst($items['titre']) . '</h2>';
+ $t = '<h2>' . ucfirst($items['titre']) . '</h2>';
+
+ // Link title if applicable
+ if ($items['button']['label']) {
+ $title_link = $items['button']; // Copy the button details
+ $title_link['label'] = $t; // Override the title of the link
+ $res .= $this->view->linkCMS($title_link);
+ } else {
+ $res .= $t; // no link on the title
+ }
}
$res .= $this->view->homeBlocs($items, $displayDetailsButtons, $cols);
if ($items['button']['label']) {
//$visuel = $this->view->imageProcess($r->visuel_detail, '', null, 440);
$rea = '<div class="img-wrapper">';
- $rea .= $this->view->imageProcess($r->visuel, $r->titre, 236, 236);
+ $rea .= $this->view->imageProcess($r->visuel, $r->titre, 284, 284);
$rea .= '</div>';
// fb($r, 'r');
$rea.= '<div class="details-positioner">';
<div id="casestudies-tagslist">
<?php
- echo $this->CategoriesList('casestudies', 'casestudies-list', 300, 40);
+ echo $this->CategoriesList('casestudies', 'casestudies-list', 382, 13);
?>
</div>
$this->headScript()->addScriptAndStyle('expertises');
echo $this->twocols();
-echo $this->htmlElement($this->citation, 'blockquote', array('class' => 'citation content'));
+
+if(!empty($this->citation)) {
+ $citation_author = isset($this->citation_author) ? $this->htmlElement($this->citation_author, 'div', array('class' => 'citation-author')) : '';
+ $citation = $this->htmlElement($this->citation . $citation_author, 'blockquote');
+ echo $this->htmlElement($citation, 'div', array('class' => 'citation'));
+}
+
echo $this->liste($this->expertises, true, array('id' => 'expertises'), 1);
$casestudy_page_data = Bootstrap::getInstance()->getCMSDatasOfPage(4); // Fetch page details - needed for the SEO URL to build links
$expertise = CubeIT_Util_Cms::unserialize($this->expertises);
-echo '<div class="casestudies-list related content">';
+echo '<div class="casestudies-list related content jgroup">';
echo '<div class="title">';
echo '<h1>'. __('Case Studies') .'</h1>';
-echo '<h2>'. sprintf(__('Projets de %s'), $expertise['related_categories']['title']) .'</h2>'; // ToDo: improve the way this is done
+echo '<h2>'. $expertise['related_categories']['title'] .'</h2>';
echo '</div>'; // .title
$limit_results = 3; // How many case studies to return
$this->headScript()->addScriptAndStyle('expertises');
echo $this->twocols();
-echo $this->htmlElement($this->citation, 'blockquote', array('class' => 'citation'));
+
+if(!empty($this->citation)) {
+ $citation_author = isset($this->citation_author) ? $this->htmlElement($this->citation_author, 'div', array('class' => 'citation-author')) : '';
+ $citation = $this->htmlElement($this->citation . $citation_author, 'blockquote');
+ echo $this->htmlElement($citation, 'div', array('class' => 'citation'));
+}
+
echo $this->liste($this->expertises, true, array('id' => 'expertises'));
echo '<section id="casestudies">';
echo '<div class="bloc-holder content">';
-echo '<h2 class="title">'. $this->case_studies['titre'] .'</h2>';
-echo $this->markupDotclear($this->case_studies['texte']);
+
+$t = '<h2 class="title">'. $this->case_studies['titre'] .'</h2>';
+// Link title using button link
+if ($this->case_studies['button']['label']) {
+ $title_link = $this->case_studies['button']; // Copy the button details
+ $title_link['label'] = $t; // Override the title of the link
+ echo $this->linkCMS($title_link);
+} else {
+ echo $t; // no link on the title
+}
+
+echo $this->markupDotclear($this->case_studies['texte'], array(), array('class' => 'intro'));
echo '<div class="casestudies-list jgroup">';
echo $this->CasestudiesList($case_studies_data, null, null, $this->case_studies['display_count']);
<div id="realisations-tagslist">
<?php
- echo $this->CategoriesList("realisations", 'realisations-list', 236, 12);
+ echo $this->CategoriesList("realisations", 'realisations-list', 284, 12);
?>
</div>
{backgroundColor: 'rgba(34,36,40,1)', height: 68}), 0);\r
// Navigation\r
var nav = $(h).find('.navigation');\r
- htl.add(TweenMax.fromTo(nav, 1, {marginTop: 57}, {marginTop: 24}), 0);\r
+ htl.add(TweenMax.fromTo(nav, 1, {marginTop: 59}, {marginTop: 24}), 0);\r
// Logo\r
var logo = $(h).find('.logo');\r
htl.add(TweenMax.fromTo(logo, 1, {top: 36}, {top: 14}), 0);\r
//min-width: 980px;
//max-width: 980px;
//margin: 0 auto;
- padding-bottom: 50px;
+// padding-bottom: 50px;
overflow: hidden;
// Settings specific to the isotope grid
&.grid {
display: none; // Hidden until Isotope is ready
-
- img {
- margin-top: 0;
- }
+ margin-bottom: 50px;
}
a {
display: inline-block;
- margin: 0;
+ margin-bottom: 4.333333%;
+
+ .img-wrapper {
+ overflow: hidden; // Give blurred image hovers a sharp edge by hiding any blur bleed
+ position: relative;
+
+ &:before {
+ content: '';
+ display: block;
+ width: 100%;
+ height: 100%;
+ background-color: transparent;
+ background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEIAAABCCAMAAADUivDaAAABp1BMVEUAAAD2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH2rgH5x1H967/84Z/////+9d/714D5zGH3sxH85q/++u/98M/4vTH4wkH3uCH60nH7249RxKUJAAAAfHRSTlMAIlmJsM/k8/LOrocCRJvjmEIeiOGGHCWc+ZkjDI77+lLlTgqdCB/QzBsy598mOO/qM/DtLejJBp6PU/5MDQ+NJIuCBd4BSj6R1Bdainmizcfg3ezx+NfGr6FRIRXSmkg76dx+GSDiTwnF2xYuKMsYn/aTHYUDQ5dBetmgCFBy9QAAArJJREFUeF6l1Plb01gYxfFTwKgD0gpYiaAFR8UqKhRwwKogBXVQlEVU3HBlAGdFcT3dV5Y/2oY+eabc5N4m8fN7v3lv3txCyldX37BP208e0A7+0ljngztNh5r9FPgDh5vgVEurRlttR4Jw4mi7Tin9WAdq6Tx+gkqh+k4odXWzpraTkPv1FB0JnIbEmR46dDYMW+fO07HeC7Bx8RJd6Ou3mSFCVwYGIQgO0SV/UNhFD127/BuqDdODEVS5Qi+iV2HCNY2eaNdhGqVHo2Zh7AQ9CvlQcYqeDWNXi04b8WQilUonMltU0YMw3KBVNp0yJZSRcZTF+ijK5VNVClnKTUwCuGktFFOGdCKfqERUjVsAminanSFfoiFbMBqblLoNQKMgXnlw9UjpHGV+BzooMt7ktnAs+VGiU7hDQcnYAqtslhNFSnXhLgUZy0ONMeQnmUaD3cvMCVHVC72H+xQYi+Qem8rEDGZrJ7LKxBzmKUiWE1ustqNMRKBTsF1OZCxbptQDLFCwZVyLnNDMUzHFPEX5vT8pFZTnoIZeWscwGuYccaOQoNxDcanm5KlCpkTm4pW7upMtUeYRHtMqmbLKUmIRjRSZV9xULCob06ijna2kGUlnmVTO8QRPKRHPlG2XzHPJGtFnQBtryRUVjecAXvCnGiMAlvhTjZcAYq/cNOJC4fUkylrpoiF+p29gCOrOG+JJ9LfYFaCC+p+8HRW+kLNGoiAWFt6hAvX06C5Mncv0ZPkaTPiDXkSXUCVAD+pRbeUsXVuNYY+gny6tvYdgcICu9I3Bor+PLgz9CRt/zdKxuTHYCv9Nh2b+gUTseJQORFtjkLuqsaaJJShdH9WppI+voBbfvyFK/bfeAic+fOymre7xKTi18enzHAVr61824E646+vi6rfuSET7tvp9uisMmR8A02/S/W9HBAAAAABJRU5ErkJggg==');
+ background-position: center;
+ background-repeat: no-repeat;
+ position: absolute;
+ top: 0;
+ left: 0;
+ z-index: 1;
+ opacity: 0;
+ transition: all 0.2s ease-out;
+ background-size: 33px;
+ }
+ }
+
+
img {
//width:100%;
//height:auto;
display: block;
- background-color: #ccc;
- margin-top: 13.333333%; // 40/300 - 40px margin at full size
- margin-bottom: 10px;
+// background-color: #ccc;
max-width: 100%;
height: auto;
+ transition: transform 0.25s ease-out; // Speed of the hover-out animation
}
h2, h3 {
white-space: nowrap;
line-height: 1.4;
height: 18px;
color: #545454;
- margin: -3px 0 20px;
+ margin-top: -3px;
}
}
+ a:hover {
+
+ .img-wrapper {
+
+ &:before {
+ opacity: 1;
+ background-size: 66px;
+ }
+ }
+
+ img {
+ //filter: blur(2.4px);
+ transform: scale(1.2);
+ transition-duration: 0.4s; // Speed of the hover animation
+ }
+ }
+
+
// Styling for related case studies at the bottom of the case study detail page
- &.related a {
- margin-right: 3.5%; // 2 gutters
- width: 31%; // 3 cols
+ &.related {
+ margin-bottom: 50px;
- &:last-of-type {
- margin-right: 0;
- }
+ .title {
+ margin-top: 0;
- h2 {
- @media screen and (max-width: 1048px) {
- font-size: 28px;
- }
+ h1 {
+ margin-bottom: 5px;
+ }
+ h2 {
+ margin-bottom: 15px;
+ }
+ }
- @media screen and (max-width: 890px) {
- font-size: 24px;
- }
+ a {
+ // margin-right: 3.5%; // 2 gutters
+ width: 32.5%; // 3 cols
+ max-width: 318px;
- @media screen and (max-width: 780px) {
- font-size: 20px;
- }
- }
- }
+ &:last-of-type {
+ margin-right: 0;
+ }
+
+ h2 {
+ @media screen and (max-width: 1048px) {
+ font-size: 28px;
+ }
+
+ @media screen and (max-width: 890px) {
+ font-size: 24px;
+ }
+
+ @media screen and (max-width: 780px) {
+ font-size: 20px;
+ }
+ }
+ }
+ }
.blocmargin {
margin-right: 40px;
body {
font-family: @roboto;
- font-size: 16px;
+ font-size: 18px;
font-weight: 300;
color: #1b1b1b;
opacity: 0;
h1, h2, h3, h4, h5, h6 {
font-family: @Klavika;
+// -webkit-font-smoothing: antialiased;
}
h1, h2 {
font-weight: 400;
- text-transform: uppercase;
}
h3, h4, h5, h6 {
}
a {
- text-decoration: none;
+ color: #222428;
+ text-decoration: none;
&:hover,
&:active {
color: @yellow;
ul {
list-style: none;
li {
+ line-height: 1.4;
&:before {
content: "- ";
}
}
.title {
- margin: 0 auto;
- padding-top: 40px;
+ margin: 50px auto 10px auto;
h1 {
text-align: left;
font-size: 56px;
line-height: 1;
- margin-bottom: 10px;
+ margin-bottom: 20px;
}
h2 {
text-align: left;
- font-size: 22px;
- line-height: 25px;
+ font-size: 26px;
+ line-height: 1.3;
white-space: pre-line; // Preserve line breaks from content
font-family: @roboto;
text-transform: none;
}
.dotclear {
+ a {
+ color: #1b1b1b;
+ text-decoration: underline;
+ }
+
h3, h4 {
font-weight: 400;
}
p {
- line-height: 1.56em;
+ line-height: 1.4;
}
}
@import "00-constants";
-blockquote.citation {
- font-size: 32px;
- font-style: italic;
- color: @yellow;
- line-height: 37px;
- text-align: center;
- margin: -20px auto 50px;
- white-space: pre-line;
+.citation {
+ background-color: #eeeff3;
+ padding: 70px 0;
+ margin-bottom: 50px;
- @media screen and (max-width: 1048px) {
- white-space: normal;
- width: 85%;
- }
+ blockquote {
+ font-size: 32px;
+ font-style: italic;
+ font-family: @Klavika;
+ line-height: 1.2;
+ text-align: center;
+ margin: 0 auto;
+ width: 80%;
+ max-width: 800px;
+
+// white-space: pre-line;
+
+ @media screen and (max-width: 1048px) {
+// white-space: normal;
+
+ }
+ }
+}
+
+.citation-author {
+ font-size: 18px;
+ margin-top: 15px;
}
\ No newline at end of file
#footer {
a {
.link(#fff; @yellow);
+ text-decoration: none;
&.but {
.button(#fff, #212327);
}
}
.navigation {
- margin: 57px 0 0;
+ margin: 59px 0 0;
float: right;
li {
margin: 0 20px 0 0;
.slides {
.slideshowmixin();
.slide {
- background-repeat: repeat, no-repeat;
- background-size: auto, cover;
- background-position: 0 0, 50% 0;
- background-blend-mode: multiply;
+ background-repeat: no-repeat;
+ background-size: cover;
+ background-position: 50% 0;
+// background-blend-mode: multiply;
> div {
text-align: center;
background-color: #222428;
color: #fff;
font-size: 22px;
- padding: 100px 0 77px 0;
+ padding: 10px 0 70px 0;
.title {
font-size: 56px;
padding-top: 0;
+ color: #fff;
+ display: inline-block;
+ }
+
+ .intro {
+ margin-bottom: 30px;
+ }
+
+ a:hover .title {
+ color: @yellow;
}
.casestudies-list {
@import "00-constants";
section.list {
- padding-top: 100px;
- padding-bottom: 100px;
+ padding: 60px 0;
+ color: #222428;
&.white {
background-color: #fff;
- color: #222428;
- a {
- color: #222428;
- text-decoration: underline;
- }
}
&.grey {
background-color: #eeeff3;
- color: #222428;
- a {
- color: #222428;
- text-decoration: underline;
- }
}
&#expertisehome {
overflow: hidden;
h2 {
font-size: 56px;
+ line-height: 1;
+ display: inline-block;
}
h3 {
font-size: 32px;
- padding: 0 0 20px 0;
+ line-height: 1;
+ margin-bottom: 10px;
+ }
+ a {
+ text-decoration: none;
}
a.but {
background-color: @yellow;
overflow: hidden;
&.two {
- margin-bottom: -50px; // Offset the 50px margins on the .sousbloc
+// margin-bottom: -50px; // Offset the 50px margins on the .sousbloc
.sousbloc {
white-space: normal;
img {
display: block;
+ transition: transform 0.25s ease-out; // Speed of the hover-out animation
}
h2, h3 {
}
img {
- filter: blur(2.4px);
- transform: scale(1.02); // Scale up a little bit to clean up the edges after blurring
- transition: filter 0.25s ease-in;
+ //filter: blur(2.4px);
+ transform: scale(1.2);
+ transition-duration: 0.4s; // Speed of the hover animation
}
}
.dotclear {
p {
- margin: 30px 0 30px 0;
+ margin: 20px 0;
}
ul {
- margin: 15px 0 30px 0;
+ margin: 20px 0;
list-style: none;
li {
+ line-height: 1.4;
+
&:before {
content: "- ";
}
}
.cols {
- padding-bottom: 50px;
+ padding-bottom: 30px;
white-space: nowrap;
.col {