active_frontend 1.0.0

data/vendor/assets/stylesheets/grid.scss

@@ -0,0 +1,287 @@
+/* Table of Contents
+==================================================
+# Desktop
+# Tablet (Landscape)
+# Tablet (Portrait)
+# Mobile (Portrait)
+# Mobile (Landscape)
+# Displays
+# Pulls
+# Rows
+# Clearing */
+
+/* # Desktop
+================================================== */
+.container {
+  margin: 0 auto;
+  padding: 0;
+  position: relative;
+  width: 1200px;
+}
+.container .column,
+.container .columns {
+  display: inline;
+  float: left;
+  margin-right: 10px;
+   margin-left: 10px;
+}
+.column.alpha,
+.columns.alpha {
+  margin-right: 10px;
+   margin-left: 0;
+}
+.column.omega,
+.columns.omega {
+  margin-right: 0;
+   margin-left: 10px;
+}
+.alpha.omega {
+  margin-right: 0;
+   margin-left: 0;
+}
+.container .one.column,
+.container .one.columns { width: 55px;  }
+.container .two.columns { width: 130px; }
+.container .three.columns { width: 205px; }
+.container .four.columns { width: 280px; }
+.container .five.columns { width: 355px; }
+.container .six.columns { width: 430px; }
+.container .seven.columns { width: 505px; }
+.container .eight.columns { width: 580px; }
+.container .nine.columns { width: 655px; }
+.container .ten.columns { width: 730px; }
+.container .eleven.columns { width: 805px; }
+.container .twelve.columns { width: 880px; }
+.container .thirteen.columns { width: 955px; }
+.container .fourteen.columns { width: 1030px; }
+.container .fifteen.columns { width: 1105px; }
+.container .sixteen.columns { width: 1180px; }
+.container .one-third.column { width: 380px; }
+.container .two-thirds.column { width: 780px; }
+.container .offset-by-one { padding-left: 75px; }
+.container .offset-by-two { padding-left: 150px; }
+.container .offset-by-three { padding-left: 225px; }
+.container .offset-by-four { padding-left: 300px; }
+.container .offset-by-five { padding-left: 375px; }
+.container .offset-by-six { padding-left: 450px; }
+.container .offset-by-seven { padding-left: 525px; }
+.container .offset-by-eight { padding-left: 600px; }
+.container .offset-by-nine { padding-left: 675px; }
+.container .offset-by-ten { padding-left: 750px; }
+.container .offset-by-eleven { padding-left: 825px; }
+.container .offset-by-twelve { padding-left: 900px; }
+.container .offset-by-thirteen { padding-left: 975px; }
+.container .offset-by-fourteen { padding-left: 1050px; }
+.container .offset-by-fifteen { padding-left: 1125px; }
+.hidden { display: none !important; }
+.visible-phone { display: none !important; }
+.visible-tablet { display: none !important; }
+.hidden-desktop { display: none !important; }
+
+/* # Tablet (Landscape)
+================================================== */
+@media only screen and (min-width: 960px) and (max-width: 1199px) {
+  .container { width: 960px; }
+  .container .one.column,
+  .container .one.columns { width: 40px; }
+  .container .two.columns { width: 100px; }
+  .container .three.columns { width: 160px; }
+  .container .four.columns { width: 220px; }
+  .container .five.columns { width: 280px; }
+  .container .six.columns { width: 340px; }
+  .container .seven.columns { width: 400px; }
+  .container .eight.columns { width: 460px; }
+  .container .nine.columns { width: 520px; }
+  .container .ten.columns { width: 580px; }
+  .container .eleven.columns { width: 640px; }
+  .container .twelve.columns { width: 700px; }
+  .container .thirteen.columns { width: 760px; }
+  .container .fourteen.columns { width: 820px; }
+  .container .fifteen.columns { width: 880px; }
+  .container .sixteen.columns { width: 940px; }
+  .container .one-third.column { width: 300px; }
+  .container .two-thirds.column { width: 620px; }
+  .container .offset-by-one { padding-left: 60px; }
+  .container .offset-by-two { padding-left: 120px; }
+  .container .offset-by-three { padding-left: 180px; }
+  .container .offset-by-four { padding-left: 240px; }
+  .container .offset-by-five { padding-left: 300px; }
+  .container .offset-by-six { padding-left: 360px; }
+  .container .offset-by-seven { padding-left: 420px; }
+  .container .offset-by-eight { padding-left: 480px; }
+  .container .offset-by-nine { padding-left: 540px; }
+  .container .offset-by-ten { padding-left: 600px; }
+  .container .offset-by-eleven { padding-left: 660px; }
+  .container .offset-by-twelve { padding-left: 720px; }
+  .container .offset-by-thirteen { padding-left: 780px; }
+  .container .offset-by-fourteen { padding-left: 840px; }
+  .container .offset-by-fifteen { padding-left: 900px; }
+}
+
+/* # Tablet Screen (Portrait)
+================================================== */
+@media only screen and (min-width: 768px) and (max-width: 959px) {
+  .container { width: 768px; }
+  .container .one.column,
+  .container .one.columns { width: 28px; }
+  .container .two.columns { width: 76px; }
+  .container .three.columns { width: 124px; }
+  .container .four.columns { width: 172px; }
+  .container .five.columns { width: 220px; }
+  .container .six.columns { width: 268px; }
+  .container .seven.columns { width: 316px; }
+  .container .eight.columns { width: 364px; }
+  .container .nine.columns { width: 412px; }
+  .container .ten.columns { width: 460px; }
+  .container .eleven.columns { width: 508px; }
+  .container .twelve.columns { width: 556px; }
+  .container .thirteen.columns { width: 604px; }
+  .container .fourteen.columns { width: 652px; }
+  .container .fifteen.columns { width: 700px; }
+  .container .sixteen.columns { width: 748px; }
+  .container .one-third.column { width: 236px; }
+  .container .two-thirds.column { width: 492px; }
+  .container .offset-by-one { padding-left: 48px; }
+  .container .offset-by-two { padding-left: 96px; }
+  .container .offset-by-three { padding-left: 144px; }
+  .container .offset-by-four { padding-left: 192px; }
+  .container .offset-by-five { padding-left: 240px; }
+  .container .offset-by-six { padding-left: 288px; }
+  .container .offset-by-seven { padding-left: 336px; }
+  .container .offset-by-eight { padding-left: 384px; }
+  .container .offset-by-nine { padding-left: 432px; }
+  .container .offset-by-ten { padding-left: 480px; }
+  .container .offset-by-eleven { padding-left: 528px; }
+  .container .offset-by-twelve { padding-left: 576px; }
+  .container .offset-by-thirteen { padding-left: 624px; }
+  .container .offset-by-fourteen { padding-left: 672px; }
+  .container .offset-by-fifteen { padding-left: 720px; }
+  .visible-tablet { display: inherit !important; }
+  .hidden-tablet { display: none !important; }
+  .hidden-desktop { display: inherit !important; }
+  .visible-desktop { display: none !important ; }
+}
+
+/* # Mobile Screen (Portrait)
+================================================== */
+@media only screen and (max-width: 767px) {
+  .container { width: 300px; }
+  .container .column,
+  .container .columns { margin: 0; }
+  .container .one.column,
+  .container .one.columns,
+  .container .two.columns,
+  .container .three.columns,
+  .container .four.columns,
+  .container .five.columns,
+  .container .six.columns,
+  .container .seven.columns,
+  .container .eight.columns,
+  .container .nine.columns,
+  .container .ten.columns,
+  .container .eleven.columns,
+  .container .twelve.columns,
+  .container .thirteen.columns,
+  .container .fourteen.columns,
+  .container .fifteen.columns,
+  .container .sixteen.columns,
+  .container .one-third.column,
+  .container .two-thirds.column { width: 100%; }
+  .container .offset-by-one,
+  .container .offset-by-two,
+  .container .offset-by-three,
+  .container .offset-by-four,
+  .container .offset-by-five,
+  .container .offset-by-six,
+  .container .offset-by-seven,
+  .container .offset-by-eight,
+  .container .offset-by-nine,
+  .container .offset-by-ten,
+  .container .offset-by-eleven,
+  .container .offset-by-twelve,
+  .container .offset-by-thirteen,
+  .container .offset-by-fourteen,
+  .container .offset-by-fifteen { padding-left: 0; }
+  .visible-phone { display: inherit !important; }
+  .hidden-phone { display: none !important; }
+  .hidden-desktop { display: inherit !important; }
+  .visible-desktop { display: none !important; }
+}
+
+/* # Mobile Screen (Landscape)
+================================================== */
+@media only screen and (min-width: 480px) and (max-width: 767px) {
+  .container { width: 460px; }
+  .container .one.column,
+  .container .one.columns,
+  .container .two.columns,
+  .container .three.columns,
+  .container .four.columns,
+  .container .five.columns,
+  .container .six.columns,
+  .container .seven.columns,
+  .container .eight.columns,
+  .container .nine.columns,
+  .container .ten.columns,
+  .container .eleven.columns,
+  .container .twelve.columns,
+  .container .thirteen.columns,
+  .container .fourteen.columns,
+  .container .fifteen.columns,
+  .container .sixteen.columns,
+  .container .one-third.column,
+  .container .two-thirds.column { width: 100%; }
+}
+
+/* # Displays
+================================================== */
+.display-block { display: block; }
+.display-inline { display: inline; }
+.display-inline-block { display: inline-block; }
+
+/* # Pulls
+================================================== */
+.pull-none { float: none; }
+.pull-left { float: left; }
+.pull-right { float: right; }
+
+/* # Rows
+================================================== */
+.row { margin-bottom: 20px; }
+.row-small { margin-bottom: 10px; }
+.row-medium { margin-bottom: 40px; }
+.row-large { margin-bottom: 60px; }
+
+/* # Clearing
+================================================== */
+.clear,
+.clearfix:before,
+.clearfix:after,
+.row:before,
+.row-small:before,
+.row-medium:before,
+.row-large:before,
+.row:after,
+.row-small:after,
+.row-medium:after,
+.row-large:after, {
+  clear: both;
+  content: '\0020';
+  display: block;
+  height: 0;
+  overflow: hidden;
+  visibility: hidden;
+  width: 0;
+}
+.clear:after,
+.clearfix:after,
+.row:after,
+.row-small:after,
+.row-medium:after,
+.row-large:after { clear: both; }
+.clear,
+.clearfix,
+.row,
+.row-small,
+.row-medium,
+.row-large { zoom: 1; }

data/vendor/assets/stylesheets/header.scss

@@ -0,0 +1,205 @@
+/* Table of Contents
+==================================================
+# Header
+# Application
+# Alternate
+# Media Queries */
+
+/* # Header
+================================================== */
+.header {
+  background: rgba(255,255,255,1);
+  border-bottom: 1px solid rgba(225,232,237,1);
+  box-sizing: border-box;
+  box-shadow: 0 1px 3px rgba(225,232,237,1);
+  height: 86px;
+  margin-bottom: 40px;
+  width: 100%;
+}
+.header-brand > a {
+  color: rgba(15,135,226,1);
+  float: left;
+  font-size: 44px;
+  margin-top: 21px;
+  text-decoration: none;
+}
+.header-trunk {
+  float: left;
+  height: 85px;
+  list-style-type: none;
+  margin: 0 0 0 30px;
+  padding: 0;
+}
+.header-trunk > li {
+  background: rgba(255,255,255,1);
+  border-right: 1px solid rgba(230,237,242,1);
+  color: rgba(102,117,127,1);
+  float: left;
+  font-weight: 500;
+    font-size: 13px;
+  height: 100%;
+  line-height: 65px;
+  margin: 0;
+  width: 220px;
+  text-align: center;
+}
+.header-trunk > li:first-child { border-left: 1px solid rgba(230,237,242,1); }
+.header-trunk > li.btn-group + li.btn-group { margin: 0; }
+.header-trunk > li > a {
+  background: rgba(255,255,255,1);
+  color: rgba(102,117,127,1);
+  display: block;
+  height: 100%;
+  letter-spacing: 1px;
+  overflow: hidden;
+  padding: 0 15px;
+  text-decoration: none;
+  text-transform: uppercase;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  width: 190px;
+}
+.header-trunk > li > a:active,
+.header-trunk > li > a.active,
+.header-trunk > li > a:hover,
+.header-trunk > li > a:focus { color: rgba(15,135,226,1); }
+.header-trunk > li > ul.dropdown-menu {
+  background: rgba(56,67,81,1);
+  border-top-right-radius: 0;
+   border-top-left-radius: 0;
+             border-color: rgba(26,37,51,1);
+  box-shadow: 0 1px 2px rgba(56,67,81,0.75);
+  margin: 0 0 0 -1px;
+  padding: 10px 0;
+  width: calc(100% + 2px);
+}
+.header-trunk > li > ul.dropdown-menu > li.divider {
+  background: rgba(26,37,51,1);
+  margin: 14px 0 10px 0;
+}
+.header-trunk > li > ul.dropdown-menu > li > a { color: rgba(255,255,255,1); }
+.header-trunk > li > ul.dropdown-menu > li > a:active,
+.header-trunk > li > ul.dropdown-menu > li > a.active,
+.header-trunk > li > ul.dropdown-menu > li > a:hover,
+.header-trunk > li > ul.dropdown-menu > li > a:focus { color: rgba(15,135,226,1); }
+.header-search {
+  float: left;
+  margin: 22px 0 0 30px;
+  width: 280px;
+}
+.header-search > input {
+  background: transparent;
+  font-weight: 200;
+  margin: 0;
+}
+.header-nav {
+  float: right;
+  list-style-type: none;
+  margin: 28px 0 10px 0;
+  padding: 0;
+}
+.header-nav > li {
+  color: rgba(102,117,127,1);
+  display: inline-block;
+  font-weight: 500;
+    font-size: 13px;
+  margin-left: 15px;
+  line-height: 13px;
+}
+.header-nav > li:first-child { margin-left: 0; }
+.header-nav > li > a {
+  border: 1px solid transparent;
+  border-radius: 2px;
+  color: rgba(102,117,127,1);
+  letter-spacing: 1px;
+  padding: 14px 0 13px 0;
+  text-decoration: none;
+   text-transform: uppercase;
+}
+.header-nav > li > a:active,
+.header-nav > li > a.active,
+.header-nav > li > a:hover,
+.header-nav > li > a:focus { color: rgba(15,135,226,1); }
+.header-nav > li.bordered > a {
+  border-color: rgba(230,237,242,1);
+  padding-right: 20px;
+   padding-left: 20px;
+}
+.header-nav > li.bordered > a:active,
+.header-nav > li.bordered > a.active,
+.header-nav > li.bordered > a:hover,
+.header-nav > li.bordered > a:focus { border-color: rgba(15,135,226,1); }
+.header-user {
+  float: right;
+  font-size: 13px;
+  margin: 21px 0 0 15px;
+}
+.header-user > a {
+  color: rgba(102,117,127,1);
+  text-decoration: none;
+}
+.header-user > img,
+.header-user-placeholder {
+  background: rgba(176,193,206,1);
+  color: rgba(255,255,255,1);
+  border-radius: 500px;
+  display: inline-block;
+  height: 40px;
+  text-align: center;
+  width: 40px;
+  vertical-align: middle;
+}
+.header-user-placeholder > i {
+  font-size: 26px;
+  line-height: 44px;
+}
+.header-user > ul.dropdown-menu { margin-right: 10px; }
+.header-toggle > a {
+  color: rgba(102,117,127,1);
+  float: right;
+  font-size: 40px;
+  padding: 4px 0px 3px 14px;
+  text-decoration: none;
+}
+
+/* # Application
+================================================== */
+.header-app { height: 66px; }
+.header-app .header-brand > a { margin-top: 10px; }
+.header-app .header-trunk {
+  height: 65px;
+  line-height: 65px;
+}
+.header-app .header-search { margin-top: 11px; }
+.header-app .header-nav { margin-top: 19px; }
+.header-app .header-user { margin-top: 11px; }
+
+/* # Alternate
+================================================== */
+.header-alt {
+  background: transparent;
+  border-color: transparent;
+  box-shadow: none;
+}
+.header-alt .header-brand > a { color: rgba(176,193,206,1); }
+.header-alt .header-nav > li > a { color: rgba(176,193,206,1); }
+.header-alt .header-nav > li.bordered > a:hover { border-color: rgba(230,237,242,1); }
+
+/* # Media Queries
+================================================== */
+@media only screen and (min-width: 960px) and (max-width: 1199px) {
+  .header-trunk > li { width: 200px; }
+  .header-trunk > li > a { width: 170px; }
+}
+@media only screen and (min-width: 768px) and (max-width: 959px) {
+  .header-trunk > li { width: 180px; }
+  .header-trunk > li > a { width: 150px; }
+}
+@media only screen and (max-width: 767px) {
+  .header { height: 50px; }
+  .header-brand > a,
+  .header-app .header-brand > a {
+    font-size: 36px;
+    margin-top: 7px;
+  }
+}