epfl-elements 1.0.1 → 4.0.0

package/src/scss/organisms/nav-main.scss

@@ -1,371 +0,0 @@
-@charset 'utf-8';
-
-$nav-spacer: 4px;
-
-//
-// Inner nav styles
-//
-.nav-main {
-  position: relative;
-  background: color('white');
-  z-index: $zindex-nav;
-  transition: left 0.3s;
-  border-right: 1px solid gray('100');
-
-  li.current-menu-item {
-    & > a:first-child,
-    & > a:first-child:hover {
-      background: theme-color('primary');
-      font-weight: bold;
-      color: $white;
-    }
-  }
-
-  ul {
-    display: none;
-    position: absolute;
-    top: 0;
-    left: 100%;
-    width: 100%;
-    margin: 0;
-    padding: 0 $spacer;
-    transition: left 0.2s;
-  }
-
-  li {
-    display: flex;
-    flex-flow: row nowrap;
-    max-height: 0;
-    border-bottom: 1px solid gray('200');
-    transition: max-height 0s 0.2s;
-  }
-
-  .current-menu-parent,
-  .current-menu-parent li { max-height: 100%; }
-
-  a {
-    display: block;
-    flex: 1 1 auto;
-    margin: $nav-spacer 0;
-    padding: 0.4 * $spacer;
-    transition: all 0.2s;
-    text-decoration: none;
-    margin-left: -0.7 * $spacer;
-    padding-left: 0.7 * $spacer;
-
-    &:before {
-      content: none;
-    }
-
-    &:hover,
-    &:focus {
-      color: $body-color;
-
-      &:not(.nav-arrow) {
-        background: gray('100');
-      }
-
-      .icon-container {
-        background: gray('100');
-      }
-    }
-  }
-
-  .menu-item-has-children > .nav-arrow {
-    margin-left: $nav-spacer;
-  }
-
-  .nav-menu {
-    display: block;
-    left: 0;
-  }
-}
-
-// navigation back or home button
-.nav-home,
-.nav-back {
-  display: block;
-  padding-bottom: 1.2 * $spacer;
-  margin-left: -2 * $spacer;
-  padding-left: 2 * $spacer;
-
-  a {
-    color: gray('700');
-  }
-
-  .icon {
-    color: gray('500');
-  }
-}
-
-li.nav-back {
-  .icon {
-    width: 0.8 * $spacer;
-    margin-right: 0.2 * $spacer;
-    color: gray('300');
-    transition: transform 0.2s, fill 0.2s;
-  }
-
-  &:hover {
-    .icon {
-      color: $body-color;
-      transform: translateX(-0.2 * $spacer);
-    }
-  }
-}
-
-li.nav-home {
-  .icon {
-    width: 0.6 * $spacer;
-    margin-top: 0.1 * $spacer;
-  }
-}
-
-a.nav-arrow {
-  flex: 0 0 (3 * $spacer);
-  position: relative;
-  margin-top: $nav-spacer;
-  margin-bottom: $nav-spacer;
-  padding: (0 $nav-spacer) (0 $nav-spacer+1) !important;
-  font-size: 1.3 * $font-size-base !important;
-  line-height: 1  * $font-size-base !important;
-  font-weight: normal !important;
-
-  .icon-container {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    width: 100%;
-    height: 100%;
-    transition: background-color 0.3s;
-  }
-
-  &:before,
-  &:after {
-    content: ' ';
-    position: absolute;
-    top: 5%;
-    left: 0;
-    width: 1px;
-    height: 90%;
-    background: gray('200');
-  }
-
-  &:after {
-    left: 100%;
-  }
-
-  .icon {
-    width: 1 * $spacer;
-    transform: translateY(-0.1 * $spacer);
-  }
-
-  &:hover {
-    .icon-container {
-      background: gray('100');
-    }
-  }
-}
-
-//
-// Vertical scroll for menu toggle
-// horizontal slide of menus
-//
-.nav-wrapper {
-  width: 100%;
-  height: 100%;
-  overflow-y: auto;
-
-  &::-webkit-scrollbar {
-    display: none;
-  }
-
-  .current-menu-ancestor > ul {
-    display: block;
-    left: 0;
-  }
-
-  .current-menu-parent > ul {
-    display: block;
-    left: 100%;
-  }
-}
-
-.nav-container {
-  display: block;
-  position: relative;
-  width: 100%;
-  margin-left: -100%;
-  padding-left: 100%;
-}
-
-//
-// Desktop
-//
-@include media-breakpoint-up(xl) {
-  // Solid nav
-  .nav-solid-layout {
-    display: flex;
-    flex-direction: row;
-    flex-wrap: nowrap;
-
-    .nav-main {
-      flex: 0 0 $main-nav-width;
-      max-width: $main-nav-width;
-      min-height: calc(100vh - #{$header-height});
-    }
-
-    .content {
-      flex: 1 1 auto;
-    }
-
-    .overlay {
-      display: none;
-    }
-  }
-
-  // Toggle nav
-  .nav-toggle-layout {
-    .nav-main {
-      position: fixed;
-      left: $main-nav-width * -1.3;
-      width: $main-nav-width;
-      height: calc(100% - #{ $header-height });
-      border: 1px solid gray('300');
-      border-radius: $btn-border-radius $btn-border-radius 0 0;
-    }
-
-    .content {
-      position: relative;
-    }
-
-    .nav-aside-wrapper {
-      display: none;
-    }
-  }
-
-  .desktop-menu-open {
-    height: 100vh;
-    overflow: hidden;
-
-    .nav-toggle-layout {
-
-      .overlay {
-        right: 0;
-        bottom: 0;
-        width: 100%;
-        height: 100%;
-        opacity: 0.95;
-      }
-
-      .nav-main {
-        left: 0;
-      }
-    }
-  }
-
-  .nav-main {
-    li {
-      font-size: 0.9 * $font-size-base;
-    }
-
-    .nav-back,
-    .nav-home {
-      border-bottom: none;
-    }
-  }
-}
-
-//
-// Mobile
-//
-@include media-breakpoint-down(lg) {
-  .main-container {
-    position: relative;
-  }
-
-  .nav-main {
-    position: absolute;
-    top: 0;
-    bottom: 0;
-    left: 0;
-    width: 100%;
-    border-top: 1px solid gray('300');
-    transform: translateX(-100%);
-    transition: transform 0.2s;
-  }
-
-  ul.nav-menu {
-    a {
-      font-size: $font-size-base;
-      padding-top: 0.8 * $spacer;
-      padding-bottom: 0.8 * $spacer;
-    }
-  }
-
-  .nav-arrow {
-    flex: 0 0 (4 * $spacer);
-  }
-
-  .nav-home {
-    display: none;
-  }
-
-  // handle breadcrumb
-  .content .breadcrumb {
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-  }
-
-  .nav-back,
-  .nav-home {
-    margin: 0;
-    padding: 0;
-  }
-
-  // mobile opened menu
-  .mobile-menu-open {
-    height: calc(100% - #{$header-height + $mm-breadcrumbs-height});
-
-    .nav-main {
-      transform: translateX(0);
-    }
-
-    .main-container {
-      max-height: calc(100vh - #{$header-height + $mm-breadcrumbs-height });
-      overflow: hidden;
-    }
-
-    .header .search-mobile {
-      bottom: 0;
-    }
-
-    .nav-lang {
-      bottom: 0;
-    }
-
-    .nav-lang-mobile {
-      display: block;
-    }
-  }
-}
-
-//
-// Overlay
-//
-.overlay {
-  content: ' ';
-  position: fixed;
-  top: 0;
-  left: 0;
-  width: 0;
-  height: 0;
-  overflow: hidden;
-  cursor: pointer;
-  z-index: $zindex-nav-overlay;
-  opacity: 0;
-  background: $white;
-  transition: opacity 0.3s;
-}

package/src/scss/organisms/newsletter-sign-up.scss

@@ -1,33 +0,0 @@
-@charset 'utf-8';
-
-$input-group-inner-space: 8px;
-
-.input-group-inner-space {
-  input,
-  button { border-radius: $border-radius !important; }
-
-  .input-group-append { padding-left: $input-group-inner-space; }
-}
-
-.newsletter-signup-wrapper {
-  @include media-breakpoint-down(xs) {
-    overflow: hidden;
-
-    .form-control,
-    .input-group-append,
-    .btn {
-      flex: 0 1 100%;
-      width: 100%;
-    }
-
-    .input-group-inner-space .input-group-append {
-      padding-left: 0;
-      margin-top: $input-group-inner-space;
-
-      .btn {
-        padding-top: 0.4rem;
-        padding-bottom: 0.4rem;
-      }
-    }
-  }
-}

package/src/scss/organisms/restauration.scss

@@ -1 +0,0 @@
-@charset 'utf-8';

package/src/scss/organisms/social-feed-group.scss

@@ -1,58 +0,0 @@
-@charset 'utf-8';
-
-.social-feed-group {
-  padding: 4rem 0;
-
-  @include media-breakpoint-up(lg) {
-    display: flex;
-    flex-flow: row nowrap;
-    align-items: stretch;
-    padding: 2rem 0;
-
-    .social-feed-container {
-      padding: 0 0.7rem;
-
-      .ie & {
-        flex: 0 0 33.33%;
-        max-width: 33.33%;
-      }
-
-      .social-feed {
-        height: 100%;
-      }
-
-      &:first-child {
-        padding-left: 0;
-      }
-
-      &:last-child {
-        padding-right: 0;
-      }
-    }
-  }
-}
-
-.social-feed-container {
-  display: flex;
-  flex-flow: column nowrap;
-
-  @include media-breakpoint-up(lg) {
-    flex-flow: row nowrap;
-  }
-
-  .social-feed {
-    margin-bottom: 3rem;
-
-    @include media-breakpoint-up(lg) {
-      margin-bottom: 0;
-      height: 100%;
-    }
-  }
-}
-
-.social-feed-content {
-  display: flex;
-  height: 100%;
-  flex-direction: column;
-  justify-content: space-between;
-}

package/src/scss/organisms.scss

@@ -1,16 +0,0 @@
-@import 'organisms/card-slider';
-@import 'organisms/contact';
-@import 'organisms/cookie-consent';
-@import 'organisms/footer';
-@import 'organisms/form';
-@import 'organisms/fullwidth-teaser';
-@import 'organisms/header';
-@import 'organisms/headlines';
-@import 'organisms/hero';
-@import 'organisms/introduction';
-@import 'organisms/key-number-group';
-@import 'organisms/nav-aside';
-@import 'organisms/nav-main';
-@import 'organisms/newsletter-sign-up';
-@import 'organisms/restauration';
-@import 'organisms/social-feed-group';

package/src/svg/epfl-logo.svg

@@ -1 +0,0 @@
-<svg id="logo_epfl_2019" data-name="logo epfl 2019" xmlns="http://www.w3.org/2000/svg" width="182.4" height="53" viewBox="0 0 182.4 53"><defs><style>.cls-1{fill:red;}</style></defs><title>epfl-logo-new</title><polygon class="cls-1" points="0 21.6 11.43 21.6 11.43 9.8 38.34 9.8 38.34 0 0 0 0 21.6"/><polygon class="cls-1" points="0 53 38.34 53 38.34 43.2 11.43 43.2 11.43 31.4 0 31.4 0 53"/><rect class="cls-1" x="11.43" y="21.6" width="24.61" height="9.8"/><path class="cls-1" d="M86,4.87a16.12,16.12,0,0,0-5.68-3.53A23.76,23.76,0,0,0,71.82,0H48.14V53H59.57V31.4H71.82a23.76,23.76,0,0,0,8.46-1.34A16.12,16.12,0,0,0,86,26.53a13.43,13.43,0,0,0,3.19-5,17.38,17.38,0,0,0,0-11.62A13.52,13.52,0,0,0,86,4.87ZM78,18.73a5.7,5.7,0,0,1-2.26,1.8,11.33,11.33,0,0,1-3.27.85,32,32,0,0,1-3.86.22H59.57V9.8h9.05a32,32,0,0,1,3.86.22,11,11,0,0,1,3.27.86A5.59,5.59,0,0,1,78,12.67a5,5,0,0,1,.86,3A5,5,0,0,1,78,18.73Z"/><polygon class="cls-1" points="155.47 43.2 155.47 0 144.04 0 144.04 53 182.38 53 182.38 43.2 155.47 43.2"/><polygon class="cls-1" points="97.42 21.6 108.85 21.6 108.85 9.8 135.76 9.8 135.76 0 97.42 0 97.42 21.6"/><rect class="cls-1" x="97.42" y="31.4" width="11.43" height="21.6"/><rect class="cls-1" x="108.85" y="21.6" width="24.61" height="9.8"/></svg>