mno-enterprise-frontend 2.0.0

data/app/assets/stylesheets/mno_enterprise/custom/utility/app-presentation.less

@@ -0,0 +1,77 @@
+.app-presentation {
+  .title {
+    .font(20px,700,@bg-inverse-color);
+  }
+
+  .tagline {
+    .font(16px,300,@text-inverse-color);
+  }
+
+  .media-heading {
+    .font(12px,300,@decorator-inverse-color);
+  }
+
+  img.app-logo {
+    width:75px;
+    height:75px;
+    .border-radius(5px);
+  }
+
+  .app-name {
+    .font(14px,700,@text-inverse-color);
+  }
+
+}
+
+.hover-description {
+  z-index:5;
+  padding:20px 0px;
+  .border-radius(5px);
+  background-color:@bg-inverse-color;
+  width:150px;
+  position:absolute;
+  left:50%;
+  top:50%;
+  margin-top:-70px;
+  margin-left:-75px;
+  min-height:130px;
+
+  .check-hover-description {
+    position:absolute;
+    right:0;
+    z-index:5;
+    margin:-18px 6px 0px 0px;
+    a {
+      position:absolute;
+      .square(50px);
+      margin:0px 0px 0px -34px;
+      .fa {
+        color:@elem-positive-color;
+        &.active {
+          color:@brand-primary;
+        }
+      }
+    }
+  }
+
+  .app-name-hover-description {
+    text-align:center;
+    .font(14px,700,white);
+    a {
+      .font(14px,700,white);
+      &:hover {
+        color:@brand-primary;
+        text-decoration:underline;
+      }
+    }
+  }
+
+  .body-hover-description {
+    text-align:center;
+    .font(12px,500,@text-inverse-color);
+  }
+
+  img {
+    margin:10px;
+  }
+}

data/app/assets/stylesheets/mno_enterprise/custom/utility/banners.less

@@ -0,0 +1,145 @@
+.banners {
+  width:100%;
+  padding: 58px 0 58px 0;
+
+  &.small-padding {
+    padding:10px 0px 10px 0px;
+  }
+
+  &.lightgray {
+    background-color:@bg-main-color;
+  }
+
+  &.purple {
+    background-color:@elem-cozy-color;
+  }
+
+  &.darkblue {
+    background-color:@bg-inverse-color;
+    p {
+      color: @bg-main-color;
+      font-size: 1.1em;
+      font-weight: 300;
+    }
+  }
+
+  &.happy-customer {
+    background: #000 image-url('banners/happy-customer.jpg') 0px 0px no-repeat;
+    background-size:cover;
+    background-repeat:no-repeat;
+    h2 {
+      text-shadow: 0px 0px 20px rgba(0,0,0,0.7);
+    }
+  }
+
+  &.generic {
+    background: transparent image-url('banners/happy-customer.jpg') 0px 0px no-repeat;
+    background-size:cover;
+    background-repeat:no-repeat;
+    &.center {
+      background-position-x:center;
+      background-position-y:top;
+    }
+  }
+
+  &.laptop {
+    background: #000 image-url('banners/desktop-background.jpg') 0px 0px no-repeat;
+    background-size:cover;
+    background-repeat:no-repeat;
+    h2 {
+      text-shadow: 0px 0px 20px rgba(0,0,0,0.7);
+    }
+  }
+
+  &.maestrano-mobile {
+    background: #000 image-url('banners/maestrano-mobile.jpg') 0px 0px no-repeat;
+    background-size:cover;
+    background-repeat:no-repeat;
+    h2 {
+      text-shadow: 0px 0px 20px rgba(0,0,0,0.7);
+    }
+  }
+
+  &.happy-collins {
+    background: #000 image-url('banners/happy-collins.jpg') 0px 0px no-repeat;
+    background-size:cover;
+    background-repeat:no-repeat;
+    h2 {
+      text-shadow: 0px 0px 20px rgba(0,0,0,0.7);
+    }
+  }
+
+  &.star {
+    background: #000 image-url('banners/star-screenshot.jpg') 0px 0px no-repeat;
+    background-size:cover;
+    background-repeat:no-repeat;
+    min-height:540px;
+    h2 {
+      text-shadow: 0px 0px 20px rgba(0,0,0,0.7);
+    }
+  }
+
+  h2 {
+    font-weight:700;
+    font-size:40px;
+    color:@bg-inverse-color;
+  }
+
+  h4 {
+    font-weight:900;
+    font-size:14px;
+    color:@bg-inverse-color;
+  }
+
+  p {
+    color:@text-inverse-color;
+    font-weight:300;
+    font-size:14px;
+  }
+
+  &.promo {
+    h2 {
+      font-weight:700;
+      font-size:40px;
+      text-align:center;
+      color:@bg-inverse-color;
+    }
+    h3 {
+      font-weight:300;
+      font-size:18px;
+      text-align:center;
+      color:@bg-inverse-color;
+    }
+    h4 {
+      font-size:24px;
+      font-weight:300;
+    }
+    h5 {
+      text-align:center;
+      font-size:14px;
+      font-weight:300;
+    }
+
+    &.dark {
+      h2,h3,h4 {
+        color: @text-inverse-color;
+      }
+      
+      h5 {
+        color: @decorator-inverse-color;
+      }
+    }
+
+  }
+
+  .alert {
+    h2 {
+      font-size:20px;
+    }
+  }
+
+
+  .banner-bottom-sticky {
+    margin-bottom: -58px;
+  }
+}

data/app/assets/stylesheets/mno_enterprise/custom/utility/carousel.less

@@ -0,0 +1,68 @@
+.carousel-control {
+  opacity:1;
+  background-image: none;
+  
+  &.right {
+    margin-right:-64px;
+    background-image: none;
+  }
+  
+  &.left {
+    margin-left:-80px;
+    background-image: none;
+  }
+  
+  .fa {
+    .font(20px,700,#111c21);
+    position:absolute;
+    top:50%;
+    display:inline-block;
+    z-index:5;
+  }
+}
+
+.carousel-inner {
+  width:95%;
+  margin:auto;
+}
+
+.screenshots {
+  .carousel-control {
+    opacity:1;
+    text-shadow:none;
+    background-image:none;
+  }
+  .carousel {
+    width:100%;
+    margin:auto;
+  }
+  a {
+    .fa {
+      color:@bg-main-color;
+    }
+  }
+  img {
+    margin:auto;
+  }
+}
+
+ol.carousel-indicators.image-indicator {
+  left:inherit;
+  position:relative;
+  width:100%;
+  margin:auto;
+  li {
+    margin:10px;
+    .border-radius(0px);
+    border:0px;
+    text-indent:0px;
+    width:140px;
+    height:inherit;
+    opacity:0.15;
+    .font(14px,300,black);
+    &.active {
+      opacity:1;
+      border:0px;
+    }
+  }
+}

data/app/assets/stylesheets/mno_enterprise/custom/utility/helptext.less

@@ -0,0 +1,40 @@
+.arrow-down {
+  width: 0;
+  height: 0;
+  border-left: 5px solid transparent;
+  border-right: 5px solid transparent;
+  margin-left:50%-5px;
+  margin-top:2px;
+  border-top: 5px solid @elem-positive-color;
+
+  &.warning {
+    border-top: 5px solid @elem-cozy-color;
+  }
+
+  &.blue {
+    border-top: 5px solid @decorator-main-color;
+  }
+}
+
+.helptext {
+  letter-spacing:1px;
+  text-align:center;
+  text-transform:none;
+  position:absolute;
+  margin-top:-38px;
+  font-size:11px;
+  font-weight:300;
+  color:@elem-positive-color;
+
+  &.warning {
+    color:@elem-cozy-color;
+  }
+
+  &.blue {
+    color:@decorator-main-color;
+  }
+
+  &.green {
+    color:@elem-positive-color;
+  }
+}

data/app/assets/stylesheets/mno_enterprise/custom/utility/miscellaneous.less

@@ -0,0 +1,134 @@
+.rounded-number {
+  .border-radius(45px);
+  height:45px;
+  width:45px;
+  background-color:@brand-primary;
+  color:white;
+  font-size:30px;
+  font-weight:700;
+  &.center {
+    margin:auto;
+  }
+  &.small {
+    .border-radius(18px);
+    height:18px;
+    width:18px;
+    color:white;
+    font-size:12px;
+    font-weight:700;
+  }
+  &.green {
+    background-color:@elem-positive-color;
+  }
+
+  &.bluegray2 {
+    background-color:@decorator-alt-color;
+  }
+
+  &.lightblue {
+    background-color:@decorator-inverse-color;
+  }
+
+  &.medium {
+    .border-radius(60px);
+    height:60px;
+    width:60px;
+  }
+
+  &.size-30 {
+    .border-radius(30px);
+    height:30px;
+    width:30px;
+  }
+
+  &.size-26 {
+    .border-radius(26px);
+    height:26px;
+    width:26px;
+  }
+}
+
+.price-presenter {
+  width:220px;
+
+  .config {
+    padding:15px 0px;
+    .border-top-radius(5px);
+    background-color:@decorator-main-color;
+    text-align:center;
+    font-weight:900;
+    font-size:13px;
+    color:#0e181c;
+
+    .title {
+      text-align:center;
+      margin-bottom:5px;
+    }
+  }
+
+  .body {
+    padding:15px 25px;
+    margin-top:-5px;
+    .border-bottom-radius(5px);
+    background-color:white;
+    .title {
+      font-size:16px;
+      font-weight:900;
+      margin-top:9px;
+    }
+    .price {
+      font-size:27px;
+      font-weight:900;
+    }
+    .btn.btn-promo {
+      padding-left:0px;
+      padding-right:0px;
+      margin-top:10px;
+      width:190px;
+      margin-left:-10px;
+    }
+  }
+
+}
+
+.modal-content .gibbon {
+  margin-top:0px;
+}
+
+.gibbon {
+  position:absolute;
+  margin-top:-20px;
+  .square(90px);
+
+  &.new {
+    background: transparent image-url('icons/gibbon-new-yellow.png') 0px 0px no-repeat;
+  }
+
+  &.popular {
+    background: transparent image-url('icons/gibbon-popular-pink.png') 0px 0px no-repeat;
+  }
+
+  &.beta {
+    background: transparent image-url('icons/gibbon-beta.png') 0px 0px no-repeat;
+  }
+}
+
+.app-presenter {
+  text-align:center;
+  padding:20px 0px;
+  background-color:#2f3c42;
+  .border-radius(5px);
+  img {
+    .square(140px);
+  }
+}
+
+// Hide Google remarketing iframe
+iframe[name='google_conversion_frame'] { 
+  height: 0 !important;
+  width: 0 !important; 
+  line-height: 0 !important; 
+  font-size: 0 !important;
+  margin-top: -13px;
+  float: left;
+}