--- /dev/null
+<?php
+
+class Cubedesigners_View_Helper_CasestudiesRelatedList extends CubeIT_View_Helper_Abstract {
+
+ protected $_datas;
+ protected $_tags;
+ protected $_page_data;
+ protected $_counter = 0;
+
+ public function CasestudiesRelatedList($datas, $currentStudie = null, $categories = null, $limit = null, $IDs = null) {
+
+ $this->addScriptAndStyle('casestudies_grid');
+ $this->_datas = $datas;
+ $listStudies = array();
+ $listStudiesPropulsed = array();
+
+ // ToDo: see if there's a better way to do this
+ $this->_page_data = Bootstrap::getInstance()->getCMSDatasOfPage(4); // ID 4 = casestudies page
+
+ if ($currentStudie != null) {
+ // fb($currentStudie);
+ $studieCategorie = $currentStudie->categories;
+ $studieSecondaires = $currentStudie->tags_secondaires;
+ $studieTechnologies = $currentStudie->technologies;
+ $studieDomaines = $currentStudie->domaines;
+ $studieDate = $currentStudie->annee;
+ }
+
+ $acl = Bootstrap::getInstance()->isAllowed("edition");
+
+ $db = Zend_Db_Table::getDefaultAdapter();
+ $s = $db->select()->from('casestudies')
+ ->order('annee DESC');
+
+ if(is_array($categories)) {
+ $s->where('categories IN (?)', $categories);
+ }
+
+ // Fetch specific case study IDs
+ if(is_array($IDs)) {
+ $s->where('id IN (?)', $IDs);
+ }
+
+ if($limit) {
+ $s->limit($limit);
+ }
+
+ if (!$acl) {
+ $s->where('online = ?', 1);
+ }
+ $q = $s->query();
+
+ $count = 1;
+
+ $res = '';
+
+ while ($r = $q->fetch()) {
+
+ if (null === $currentStudie || $r->id != $currentStudie->id) {
+ $r = CubeIT_Util_Cms::unserialize($r);
+ $r->point = 0;
+
+ $addSpacer = false;
+
+ if ($count == 3) {
+ $count = 1;
+ $addClass = '';
+ } else {
+ $addClass = ' blocmargin';
+ $count++;
+ }
+
+ $addOffline = '';
+ if ($acl && $r->online == 0) {
+ $addOffline = 'data-offline="1"';
+ }
+
+ if ($currentStudie != null) {
+ if ($r->propulse == 1) {
+ $r->point += 10000;
+ }
+
+ if ($r->categories == $studieCategorie) {
+ $r->point += 1000;
+ }
+
+ if (is_array($r->tags_secondaires) && is_array($currentStudie->tags_secondaires)) {
+ if (count($r->tags_secondaires) >= 1 && count($currentStudie->tags_secondaires) >= 1) {
+
+ for ($i = 0; $i < count($studieSecondaires); $i++) {
+ if (in_array($currentStudie->tags_secondaires[$i], $r->tags_secondaires)) {
+ $r->point += 100;
+ }
+ }
+ }
+ }
+
+ if (is_array($r->technologies) && is_array($currentStudie->technologies)) {
+ if (count($r->technologies) >= 1 && count($currentStudie->technologies) >= 1) {
+
+ foreach ($currentStudie->technologies as $t) {
+ if (in_array([$i], $r->technologies)) {
+ $r->point += 15;
+ }
+ }
+ }
+ }
+
+ if ($r->domaines != '') {
+ if ($r->domaines == $currentStudie->domaines)
+ $r->point += 10;
+ }
+
+ if ($r->annee != '') {
+ if ($r->annee == $currentStudie->annee)
+ $r->point += 5;
+ }
+ }
+
+ if (count($listStudies) < 3) {
+ array_push($listStudies, $r);
+ } else {
+ if ($r->point > $listStudies[0]->point) {
+ $listStudies[2] = $listStudies[1];
+ $listStudies[1] = $listStudies[0];
+ $listStudies[0] = $r;
+ } else if ($r->point > $listStudies[1]->point) {
+ $listStudies[2] = $listStudies[1];
+ $listStudies[1] = $r;
+ } else if ($r->point > $listStudies[2]->point) {
+ $listStudies[2] = $r;
+ } else {
+
+ }
+ }
+
+
+ if ($currentStudie == null) {
+ $res.=$this->_case($r);
+ }
+ }
+ }
+
+ if ($currentStudie != null) {
+
+ $nbStudies = 0;
+ $count = 1;
+
+ $listStudies = array_reverse($listStudies);
+
+
+ foreach ($listStudies as $i => $s) {
+ $res.=$this->_case($s);
+ }
+ }
+ return $res;
+ }
+
+ protected function _case($study) {
+
+ // Max display size is 512 but we over-sample the size by 20% because there is a CSS scale effect on hover
+ $image = $this->view->imageProcess($study->visuel, $study->titre, 615, 615, ['class' => 'responsive casestudies-grid-item-image']);
+ $url = Cubedesigners_Util::generateAutoUri($study, $this->_page_data['seourl_stu']);
+
+ /*
+ $tag_names = [];
+ foreach ($study->tags_secondaires as $categoryID) {
+ $tag_names[] = $this->_getTagName($categoryID);
+ }
+ */
+
+ $hover_style = empty($study->hover_color) ? '' : 'background-color:'. CubeIT_Util_Cms::hexToRGBA($study->hover_color, 0.75) .';';
+
+ $c = $image;
+ $c.= '<div class="casestudies-grid-item-label" style="'. $hover_style .'">';
+ $c.= '<h2 class="casestudies-grid-item-title">' . $study->titre . '</h2>';
+ //$c.= '<h3 class="casestudies-grid-item-tags">' . implode(' / ', $tag_names) . '</h3>';
+ $c.= '<h3 class="casestudies-grid-item-tags">' . $study->legende . '</h3>';
+ $c.= '</div>'; // .casestudies-grid-item-label
+
+
+
+ // Create a staggered delay for each row (3 items per row)
+ $delay = 300 + (($this->_counter % 3) * 200);
+
+ $this->_counter++;
+
+ return $this->link($c, $url, array(
+ 'data-cat' => $study->categories,
+ 'class' => 'casestudies-grid-item wow fadeInUp',
+ 'data-wow-delay' => $delay . 'ms',
+ )) . ' '; // Space needed between elements for justified alignment
+ }
+
+ // Get secondary category names
+ protected function _getTagName($catID) {
+
+ // Cache the query data if it's not already done
+ if (!$this->_tags) {
+
+ $db = Zend_Db_Table::getDefaultAdapter();
+ $query = $db->select()->from('tags')->query();
+
+ while ($category = $query->fetch()) {
+ $category = CubeIT_Util_Cms::unserializeRow($category);
+ $this->_tags[$category->id] = CubeIT_Util_Object::toArray($category);
+ }
+ }
+
+ return $this->_tags[$catID]['name'];
+ }
+
+}
<?php
+$this->headScript()->addScriptAndStyle('fancy-select');
$this->headScript()->addScriptAndStyle('casestudies');
?>
<?php
$this->headScript()->addScriptAndStyle('expertises');
+$this->headScript()->addScriptAndStyle('fancy-select');
echo $this->twocols();
if(!empty($this->citation)) {
$related_casestudies = CubeIT_Util_Cms::unserialize($this->related_casestudies);
-echo '<div class="casestudies-list related content jgroup">';
+echo '<div class="casestudies-list content">';
echo '<div class="title">';
echo '<h1>'. __('Case Studies') .'</h1>';
echo '<h2>'. $related_casestudies['title'] .'</h2>';
echo '</div>'; // .title
$limit_results = 3; // How many case studies to return
-echo $this->CasestudiesList($casestudy_page_data, null, null, $limit_results, $related_casestudies['casestudies']);
+echo '<div class="casestudies-grid">';
+echo $this->CasestudiesRelatedList($casestudy_page_data, null, null, $limit_results, $related_casestudies['casestudies']);
+echo '</div>'; // .casestudies-grid
echo '</div>'; // .casestudies-list
TO_LOAD_ONCE[TO_LOAD_ONCE.length] = 'load_casestudies();';
-var showIds = new Array();
-
function load_casestudies() {
- initTagsLink();
-
- // Check referrer and if it is a cubedesigners page, switch to a history.back() link instead of a standard link to speed things up
- if(document.referrer.indexOf("cubedesigners.") > -1) {
- $("#closeButton").on('click',function(){
- console.log('using back button...');
- history.back();
- return false;
- });
- }
-
-}
-
-function initTagsLink() {
- $(".tag").click(function () {
- $(this).toggleClass('active');
-
- if ($(this).hasClass('active')) {
- if ($(this).attr("data-id") != 0) {
- showIds.push($(this).attr("data-id"));
- } else {
- showIds = new Array();
- $(".tag").removeClass('active');
- }
- } else {
- var index = $.inArray($(this).attr("data-id"), showIds);
- showIds.splice(index, 1);
- }
-
- if (showIds.length > 0) {
- $(".tag:first").removeClass('active');
- } else {
- $(".tag:first").addClass('active');
- }
-
- displayStudies();
- });
-
+ $('#casestudies-list-filter').fancySelect().on('change.fs', function() {
+ $(this).trigger('change.$');
+ }); // trigger the DOM's change event when changing FancySelect
}
-function displayStudies() {
- if (showIds.length) {
- $('#casestudies-list .bloc').each(function () {
- var categories = $(this).attr("data-categories");
- if ($.inArray(categories, showIds) == -1) {
- $(this).fadeOut(500, function () {
- });
- } else {
- $(this).fadeIn(500, function () {
- });
- }
- });
- } else {
- $('#casestudies-list .bloc').fadeIn(500, function () {
- });
- }
-}
+//
+// var showIds = new Array();
+//
+// function load_casestudies() {
+// initTagsLink();
+//
+// // Check referrer and if it is a cubedesigners page, switch to a history.back() link instead of a standard link to speed things up
+// if(document.referrer.indexOf("cubedesigners.") > -1) {
+// $("#closeButton").on('click',function(){
+// console.log('using back button...');
+// history.back();
+// return false;
+// });
+// }
+//
+// }
+//
+// function initTagsLink() {
+// $(".tag").click(function () {
+// $(this).toggleClass('active');
+//
+// if ($(this).hasClass('active')) {
+// if ($(this).attr("data-id") != 0) {
+// showIds.push($(this).attr("data-id"));
+// } else {
+// showIds = new Array();
+// $(".tag").removeClass('active');
+// }
+// } else {
+// var index = $.inArray($(this).attr("data-id"), showIds);
+// showIds.splice(index, 1);
+// }
+//
+// if (showIds.length > 0) {
+// $(".tag:first").removeClass('active');
+// } else {
+// $(".tag:first").addClass('active');
+// }
+//
+// displayStudies();
+// });
+//
+// }
+//
+// function displayStudies() {
+//
+// if (showIds.length) {
+// $('#casestudies-list .bloc').each(function () {
+// var categories = $(this).attr("data-categories");
+// if ($.inArray(categories, showIds) == -1) {
+// $(this).fadeOut(500, function () {
+// });
+// } else {
+// $(this).fadeIn(500, function () {
+// });
+// }
+// });
+// } else {
+// $('#casestudies-list .bloc').fadeIn(500, function () {
+// });
+// }
+// }
--- /dev/null
+/* https://github.com/paulstraw/FancySelect */
+(function() {
+ var $;
+
+ $ = window.jQuery || window.Zepto || window.$;
+
+ $.fn.fancySelect = function(opts) {
+ var isiOS, settings;
+ if (opts == null) {
+ opts = {};
+ }
+ settings = $.extend({
+ forceiOS: false,
+ includeBlank: false,
+ optionTemplate: function(optionEl) {
+ return optionEl.text();
+ },
+ triggerTemplate: function(optionEl) {
+ return optionEl.text();
+ }
+ }, opts);
+ isiOS = !!navigator.userAgent.match(/iP(hone|od|ad)/i);
+ return this.each(function() {
+ var copyOptionsToList, disabled, options, sel, trigger, updateTriggerText, wrapper;
+ sel = $(this);
+ if (sel.hasClass('fancified') || sel[0].tagName !== 'SELECT') {
+ return;
+ }
+ sel.addClass('fancified');
+ sel.css({
+ width: 1,
+ height: 1,
+ display: 'block',
+ position: 'absolute',
+ bottom: 0,
+ right: 0,
+ opacity: 0
+ });
+ sel.wrap('<div class="fancy-select">');
+ wrapper = sel.parent();
+ if (sel.data('class')) {
+ wrapper.addClass(sel.data('class'));
+ }
+ wrapper.append('<div class="trigger">');
+ if (!(isiOS && !settings.forceiOS)) {
+ wrapper.append('<ul class="options">');
+ }
+ trigger = wrapper.find('.trigger');
+ options = wrapper.find('.options');
+ disabled = sel.prop('disabled');
+ if (disabled) {
+ wrapper.addClass('disabled');
+ }
+ updateTriggerText = function() {
+ var triggerHtml;
+ triggerHtml = settings.triggerTemplate(sel.find(':selected'));
+ return trigger.html(triggerHtml);
+ };
+ sel.on('blur.fs', function() {
+ if (trigger.hasClass('open')) {
+ return setTimeout(function() {
+ return trigger.trigger('close.fs');
+ }, 120);
+ }
+ });
+ trigger.on('close.fs', function() {
+ trigger.removeClass('open');
+ return options.removeClass('open');
+ });
+ trigger.on('click.fs', function() {
+
+ // Close if it is already open
+ if(trigger.hasClass('open')) {
+ return trigger.trigger('close.fs');
+ }
+
+ var offParent, parent;
+ if (!disabled) {
+ trigger.toggleClass('open');
+ if (isiOS && !settings.forceiOS) {
+ if (trigger.hasClass('open')) {
+ return sel.focus();
+ }
+ } else {
+ if (trigger.hasClass('open')) {
+ parent = trigger.parent();
+ offParent = parent.offsetParent();
+ if ((parent.offset().top + parent.outerHeight() + options.outerHeight() + 20) > $(window).height() + $(window).scrollTop()) {
+ options.addClass('overflowing');
+ } else {
+ options.removeClass('overflowing');
+ }
+ }
+ options.toggleClass('open');
+ if (!isiOS) {
+ return sel.focus();
+ }
+ }
+ }
+ });
+ sel.on('enable', function() {
+ sel.prop('disabled', false);
+ wrapper.removeClass('disabled');
+ disabled = false;
+ return copyOptionsToList();
+ });
+ sel.on('disable', function() {
+ sel.prop('disabled', true);
+ wrapper.addClass('disabled');
+ return disabled = true;
+ });
+ sel.on('change.fs', function(e) {
+ // if (e.originalEvent && e.originalEvent.isTrusted) {
+ // return e.stopPropagation();
+ // } else {
+ return updateTriggerText();
+ // }
+ });
+ sel.on('keydown', function(e) {
+ var hovered, newHovered, w;
+ w = e.which;
+ hovered = options.find('.hover');
+ hovered.removeClass('hover');
+ if (!options.hasClass('open')) {
+ if (w === 13 || w === 32 || w === 38 || w === 40) {
+ e.preventDefault();
+ return trigger.trigger('click.fs');
+ }
+ } else {
+ if (w === 38) {
+ e.preventDefault();
+ if (hovered.length && hovered.index() > 0) {
+ hovered.prev().addClass('hover');
+ } else {
+ options.find('li:last-child').addClass('hover');
+ }
+ } else if (w === 40) {
+ e.preventDefault();
+ if (hovered.length && hovered.index() < options.find('li').length - 1) {
+ hovered.next().addClass('hover');
+ } else {
+ options.find('li:first-child').addClass('hover');
+ }
+ } else if (w === 27) {
+ e.preventDefault();
+ trigger.trigger('click.fs');
+ } else if (w === 13 || w === 32) {
+ e.preventDefault();
+ hovered.trigger('mousedown.fs');
+ } else if (w === 9) {
+ if (trigger.hasClass('open')) {
+ trigger.trigger('close.fs');
+ }
+ }
+ newHovered = options.find('.hover');
+ if (newHovered.length) {
+ options.scrollTop(0);
+ return options.scrollTop(newHovered.position().top - 12);
+ }
+ }
+ });
+ options.on('mousedown.fs', 'li', function(e) {
+ var clicked;
+ clicked = $(this);
+ sel.val(clicked.data('raw-value'));
+ if (!isiOS) {
+ sel.trigger('blur.fs').trigger('focus.fs');
+ }
+ options.find('.selected').removeClass('selected');
+ clicked.addClass('selected');
+ trigger.addClass('selected');
+ return sel.val(clicked.data('raw-value')).trigger('change.fs').trigger('blur.fs').trigger('focus.fs');
+ });
+ options.on('mouseenter.fs', 'li', function() {
+ var hovered, nowHovered;
+ nowHovered = $(this);
+ hovered = options.find('.hover');
+ hovered.removeClass('hover');
+ return nowHovered.addClass('hover');
+ });
+ options.on('mouseleave.fs', 'li', function() {
+ return options.find('.hover').removeClass('hover');
+ });
+ copyOptionsToList = function() {
+ var selOpts;
+ updateTriggerText();
+ if (isiOS && !settings.forceiOS) {
+ return;
+ }
+ selOpts = sel.find('option');
+ return sel.find('option').each(function(i, opt) {
+ var optHtml;
+ opt = $(opt);
+ if (!opt.prop('disabled') && (opt.val() || settings.includeBlank)) {
+ optHtml = settings.optionTemplate(opt);
+ if (opt.prop('selected')) {
+ return options.append("<li data-raw-value=\"" + (opt.val()) + "\" class=\"selected\">" + optHtml + "</li>");
+ } else {
+ return options.append("<li data-raw-value=\"" + (opt.val()) + "\">" + optHtml + "</li>");
+ }
+ }
+ });
+ };
+ sel.on('update.fs', function() {
+ wrapper.find('.options').empty();
+ return copyOptionsToList();
+ });
+ return copyOptionsToList();
+ });
+ };
+
+}).call(this);
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, maxWidth: 263}, {top: 14, maxWidth: 57}), 0);\r
+ htl.add(TweenMax.fromTo(logo, 1, {top: 36}, {top: 14}), 0);\r
// Resize cube logo (two parts)\r
- //var img = $(logo).find('img');\r
- htl.add(TweenMax.fromTo(logo, 1, {height: 48}, {height: 40}), 0);\r
+ var logoSVG = $(logo).find('svg');\r
+ htl.add(TweenMax.fromTo(logoSVG, 1, {height: 48}, {height: 40}), 0);\r
// Typo logo\r
var typo = $(logo).find('.logo-text');\r
htl.add(TweenMax.fromTo(typo, 1, {opacity: 1}, {opacity: 0}), 1);\r
}
.blocs {
- padding: 40px 0 0 0;
- margin-top: -25px;
+ padding: 15px 0 0 0;
}
.spacer {
}
- @media screen and (max-width: 1048px) {
+ @media screen and (max-width: 1200px) {
width: 100%;
+ padding: 0 !important;
}
}
--- /dev/null
+@import "00-constants";
+
+div.fancy-select {
+ position: relative;
+ font-weight: 300;
+ font-size: 20px;
+
+ .m & {
+ font-size: 11px;
+ }
+
+ &.disabled {
+ opacity: 0.5;
+ }
+
+ select:focus + div.trigger {
+ //box-shadow: 0 0 0 1px #aaa; // Outline box
+ }
+
+ select:focus + div.trigger.open {
+ box-shadow: none;
+ }
+
+ div.trigger {
+ background: url('data:image/svg+xml;utf8,<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 14.6 8" style="enable-background:new 0 0 14.6 8;" xml:space="preserve"><path d="M14.3,0.4c-0.2-0.2-0.5-0.2-0.7,0L7.3,6.6L1.1,0.4c-0.2-0.2-0.5-0.2-0.7,0s-0.2,0.5,0,0.7L7,7.7c0,0,0,0,0,0c0.1,0.1,0.2,0.1,0.4,0.1c0,0,0,0,0,0s0,0,0,0c0.1,0,0.3,0,0.4-0.1c0,0,0,0,0,0l6.6-6.6C14.5,0.9,14.5,0.5,14.3,0.4z"/></svg>') center right no-repeat;
+ background-size: auto 0.4em;
+ cursor: pointer;
+ padding: 0 1.5em 0 0.4em;
+ line-height: 2;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ position: relative;
+ //background: #f8f8f8;
+ //color: #aaa; // Placeholder text
+ //width: 100%;
+ display: inline-block;
+ z-index: 2;
+ transition: all 140ms ease-out;
+
+ &.selected {
+ color: #323232;
+ }
+
+ &.open {
+ box-shadow: none;
+ }
+ }
+
+ ul.options {
+ list-style: none;
+ margin: 0;
+ position: absolute;
+ top: 100%;
+ right: 0;
+ visibility: hidden;
+ opacity: 0;
+ z-index: 1;
+ //max-height: 0; // Start hidden and expand up
+ //max-height: unit(10*2*0.8,em); // Show 10 max
+ //width: 100%;
+ overflow: auto;
+ background: #fff;
+ //border-top: 1px solid #7DD8D2;
+ //box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
+ transition: all 150ms ease-out;
+
+ &.open {
+ z-index: 10;
+ visibility: visible;
+ opacity: 1;
+
+ /* have to use a non-visibility transition to prevent this iOS issue (bug?): */
+ /*http://stackoverflow.com/questions/10736478/css-animation-visibility-visible-works-on-chrome-and-safari-but-not-on-ios*/
+ //transition: opacity, max-height 200ms ease-out;
+ }
+
+ &.overflowing {
+ top: auto;
+ bottom: 110%;
+
+ &.open {
+ //transition: opacity, max-height 300ms ease-out;
+ }
+ }
+
+ li {
+ padding: 0.5em 2em;
+ cursor: pointer;
+ white-space: nowrap;
+ text-overflow: ellipsis;
+ overflow: hidden;
+ text-align: left;
+ //transition: all 100ms ease-out;
+
+ &:before {
+ display: none;
+ }
+
+ &.selected {
+ background: rgba(200,200,200,0.2);
+ color: #000;
+ }
+
+ &.hover {
+ background: @yellow;
+ color: #fff;
+ }
+ }
+ }
+
+}
@import "00-constants";
// Variables
-@black: #666;
+@black: #222428;
@hover-color: @yellow;
@text-arrow-space: 10px;
// The Arrow
.the-arrow {
width: @shaft-width;
- transition: all 0.2s;
+ //transition: transform 0.2s;
&.-left {
position: absolute;
left: 0;
> .shaft {
- width: 0;
+ //width: 0;
+ width: @shaft-width;
+ transform: scaleX(0);
background-color: currentColor;
+ transition-duration: 0.1s;
&:before,
&:after {
- width: 0;
+ //width: 0;
+ width: @arrow-head-width;
+ transform: scaleX(0);
background-color: currentColor;
+ transition-duration: 0.1s;
}
&:before {
> .shaft {
width: @shaft-width;
- transition-delay: 0.2s;
+ transition-delay: 0.1s;
&:before,
&:after {
width: @arrow-head-width;
- transition-delay: 0.3s;
- transition: all 0.5s;
+ transition-delay: 0.1s;
+ transition: transform 0.3s;
}
&:before {
display: block;
height: @shaft-thickness;
position: relative;
- transition: all 0.2s;
- transition-delay: 0;
+ transition: transform 0.2s;
+ transition-delay: 0s;
will-change: transform;
&:before,
position: absolute;
top: 0;
right: 0;
- transition: all 0.2s;
- transition-delay: 0;
+ transition: transform 0.2s;
+ transition-delay: 0s;
}
&:before {
//font-style: italic;
//text-decoration: none;
position: relative;
- transition: all 0.2s;
+ //transition: all 0.2s;
- &:hover {
+ &:hover, &:active {
color: @hover-color;
> .the-arrow.-left {
> .shaft {
- width: @shaft-width;
+ transform: scaleX(1);
transition-delay: 0.1s;
background-color: @hover-color;
&:before,
&:after {
- width: @arrow-head-width;
+ transform: scaleX(1);
transition-delay: 0.1s;
background-color: @hover-color;
}
> .main {
transform: translateX(@shaft-width + @text-arrow-space);
+ color: @hover-color;
> .the-arrow.-right {
+ //color: @black;
+
> .shaft {
- width: 0;
- transform: translateX(200%);
- transition-delay: 0;
+ //color: @black;
+ //width: 0;
+ transform: scaleX(0);
+ transform-origin: left;
+ transition-delay: 0s;
&:before,
&:after {
- width: 0;
- transition-delay: 0;
- transition: all 0.1s;
+ //width: 0;
+ transform: scaleX(0);
+ transition-delay: 0s;
+ transition: transform 0.1s;
}
&:before {
> .main {
display: flex;
align-items: center;
- transition: all 0.2s;
+ transition: transform 0.2s;
+ transition-delay: 0.2s;
> .text {
margin: 0 @text-arrow-space 0 0;
margin: 0 0 50px 0;
&:extend(.media);
+ &:last-child {
+ margin-bottom: 0;
+ }
+
.text {
&:extend(.media--body);
}
projects / cubedesigners-v7.git / commitdiff