jekyll-theme-pga-default 0.1.0 → 0.2.0

data/_sass/_styleguide.scss

@@ -0,0 +1,273 @@
+.styleguide-item {
+  margin-bottom: 2rem;
+
+  .copy-link {
+    > h2,
+     > h4,
+     > h5,
+    > h3 {
+      padding-top: 2rem;
+    }
+  }
+
+  .styleguide-item-inner {
+    position: relative;
+    padding: 1rem;
+    margin: 1rem 0 0;
+    border: solid #f7f7f9;
+    border-width: 0.2rem 0 0;
+    border-width: 0.2rem;
+  }
+
+  .styleguide-item-html {
+    position: relative;
+    padding: 1rem;
+    border: solid #f7f7f9;
+    background-color: #f7f7f9;
+    border-width: 0.2rem 0 0;
+    border-width: 0.2rem;
+    @media (max-width: 768px) {
+      padding: 1rem 0;
+    }
+
+    pre {
+      margin-bottom: 0;
+    }
+  }
+}
+
+.copy-link {
+  h4 {
+    padding-top: 2rem;
+  }
+}
+
+.styleguide-item-inner {
+  h1,
+  h2,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
+    margin-bottom: 0.7rem;
+    padding-bottom: 0;
+  }
+}
+
+.styleguide-btn-list {
+  .btn {
+    margin-bottom: 5px;
+  }
+}
+
+.s {
+  color: #d44950;
+}
+
+.mf {
+  color: #f60;
+}
+
+.na {
+  color: #4f9fcf;
+}
+
+.nt {
+  color: #2f6f9f;
+}
+
+.sidebar-styleguide {
+  margin-top: 1.5rem;
+  margin-left: -64px;
+  .navbar {
+    padding: 0;
+  }
+}
+
+.copy-link {
+  display: block;
+
+  &:after {
+    content: "";
+    height: 1rem;
+    width: 1rem;
+    margin-left: 0.25rem;
+    display: inline-block;
+    background-image: url("../assets/images/icons/icon-unlink.svg");
+  }
+
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
+    display: inline-block;
+  }
+}
+
+// CODE SYNTAX HIGHLIGHTING
+.highlight pre, pre {
+  background-color: #f8f8f8;
+  border: 1px solid #ccc;
+  padding: 6px 10px;
+  border-radius: 3px;
+}
+
+.highlight {
+  .hll {
+    background-color: #f8f8f8;
+    border: 1px solid #ccc;
+    padding: 6px 10px;
+    border-radius: 3px;
+  }
+  .c {
+    color: #999988;
+    font-style: italic;
+  }
+  .err {
+    color: #a61717;
+    background-color: #e3d2d2;
+  }
+  .k, .o {
+    font-weight: bold;
+  }
+  .cm {
+    color: #999988;
+    font-style: italic;
+  }
+  .cp {
+    color: #999999;
+    font-weight: bold;
+  }
+  .c1 {
+    color: #999988;
+    font-style: italic;
+  }
+  .cs {
+    color: #999999;
+    font-weight: bold;
+    font-style: italic;
+  }
+  .gd {
+    color: #000000;
+    background-color: #ffdddd;
+    .x {
+      color: #000000;
+      background-color: #ffaaaa;
+    }
+  }
+  .ge {
+    font-style: italic;
+  }
+  .gr {
+    color: #aa0000;
+  }
+  .gh {
+    color: #999999;
+  }
+  .gi {
+    color: #000000;
+    background-color: #ddffdd;
+    .x {
+      color: #000000;
+      background-color: #aaffaa;
+    }
+  }
+  .go {
+    color: #888888;
+  }
+  .gp {
+    color: #555555;
+  }
+  .gs {
+    font-weight: bold;
+  }
+  .gu {
+    color: #800080;
+    font-weight: bold;
+  }
+  .gt {
+    color: #aa0000;
+  }
+  .kc, .kd, .kn, .kp, .kr {
+    font-weight: bold;
+  }
+  .kt {
+    color: #445588;
+    font-weight: bold;
+  }
+  .m {
+    color: #009999;
+  }
+  .s {
+    color: #dd1144;
+  }
+  .n {
+    color: #333333;
+  }
+  .na {
+    color: teal;
+  }
+  .nb {
+    color: #0086b3;
+  }
+  .nc {
+    color: #445588;
+    font-weight: bold;
+  }
+  .no {
+    color: teal;
+  }
+  .ni {
+    color: purple;
+  }
+  .ne, .nf {
+    color: #990000;
+    font-weight: bold;
+  }
+  .nn {
+    color: #555555;
+  }
+  .nt {
+    color: navy;
+  }
+  .nv {
+    color: teal;
+  }
+  .ow {
+    font-weight: bold;
+  }
+  .w {
+    color: #bbbbbb;
+  }
+  .mf, .mh, .mi, .mo {
+    color: #009999;
+  }
+  .sb, .sc, .sd, .s2, .se, .sh, .si, .sx {
+    color: #dd1144;
+  }
+  .sr {
+    color: #009926;
+  }
+  .s1 {
+    color: #dd1144;
+  }
+  .ss {
+    color: #990073;
+  }
+  .bp {
+    color: #999999;
+  }
+  .vc, .vg, .vi {
+    color: teal;
+  }
+  .il {
+    color: #009999;
+  }
+  .gc {
+    color: #999;
+    background-color: #EAF2F5;
+  }
+}

data/_sass/_table.scss

@@ -0,0 +1,160 @@
+table {
+  td,
+  th {
+    border-width: 0;
+    padding: 0.5rem 0.25rem;
+    vertical-align: middle;
+  }
+
+  tbody tr:nth-of-type(odd) {
+    background-color: transparent;
+  }
+}
+
+.table-styled {
+  @extend .table;
+  @extend .table-striped;
+  box-shadow: 0 5px 10px 0 rgba(0, 35, 75, 0.15);
+
+  td {
+    font-size: 12px;
+    font-weight: 500;
+    color: rgba(0, 35, 75, 0.5);
+    padding-left: 0.5rem;
+    padding-right: 0.5rem;
+    border-top: 1px solid #f7f7f9;
+  }
+
+  th {
+    font-size: 10px;
+    font-weight: 500;
+    color: #7f91a5;
+    text-transform: uppercase;
+    padding-left: 0.5rem;
+    padding-right: 0.5rem;
+  }
+}
+
+.table-data {
+  @extend .table;
+  @extend .table-hover;
+
+  th {
+    font-size: 10px;
+    font-weight: 500;
+    color: $blue-grey;
+    text-transform: uppercase;
+
+    &:first-of-type {
+      padding-left: 40px;
+    }
+  }
+
+  th {
+    &:nth-of-type(4) {
+      text-align: center;
+    }
+
+    &:last-of-type {
+      padding-right: 20px;
+    }
+  }
+
+  td {
+    font-size: 12px;
+    font-weight: 500;
+    color: $navy-50;
+
+    &:first-of-type {
+      padding-left: 40px;
+      color: $navy-50;
+    }
+
+    &:last-of-type {
+      padding-right: 40px;
+    }
+
+    &:nth-of-type(2) {
+      color: $navy;
+    }
+
+    &:nth-of-type(5) {
+      text-align: center;
+    }
+
+    a {
+      text-decoration: underline;
+      @extend .text-info;
+    }
+  }
+}
+
+.table-hover tbody tr:hover td {
+  color: $navy;
+}
+@media (max-width: 768px) {
+  .table-data {
+    thead {
+      display: none;
+    }
+
+    tr {
+      display: -webkit-flex;
+      display: -ms-flex;
+      display: flex;
+      flex-wrap: wrap;
+      border-bottom: solid 1px #e0e0e0;
+      padding: 25px 0;
+
+      td {
+        padding: 0;
+      }
+
+      td:nth-of-type(2) {
+        min-width: 40px;
+        max-width: 40px;
+        border-right: solid 1px #e0e0e0;
+        line-height: 1;
+        text-transform: uppercase;
+
+        h2 {
+          margin-bottom: 0;
+          font-size: 2rem;
+        }
+      }
+
+      td:nth-of-type(3) {
+        min-width: calc(100% - 80px);
+        max-width: 100%;
+        padding-left: 10px;
+      }
+
+      td:nth-of-type(5) {
+        -ms-flex-order: 3;
+        order: 3;
+        padding-left: 50px;
+        margin-top: -20px;
+        padding-right: 0;
+
+        &:after {
+          content: "Credits";
+          margin-right: 10px;
+        }
+      }
+
+      td:nth-of-type(4) {
+        -ms-flex-order: 4;
+        order: 4;
+        margin-top: -20px;
+
+        &:before {
+          content: '\2219';
+          font-size: 30px;
+          line-height: 0;
+          vertical-align: -4px;
+          margin-right: 10px;
+        }
+      }
+    }
+  }
+}

data/_sass/_tiles.scss

@@ -0,0 +1,196 @@
+// Tiles
+
+.tiles {
+  margin-bottom: 2rem;
+  position: relative;
+  box-shadow: 0 5px 10px 0 rgba(0, 35, 75, 0.15);
+  font-size: 0.75rem;
+  transition: transform 0.2s ease-in-out;
+
+  .tiles-image:after {
+    transition: background-image 0.2s ease-in-out;
+    background-image: linear-gradient(0deg, #00234B 0%, #00234B 12%, rgba(0,35,75, 0.7) 20%, rgba(0,35,75, 0) 45%, rgba(0,35,75, 0) 100%);
+    opacity: 0.9;
+  }
+}
+
+.tiles-body {
+  position: absolute;
+  left: 20px;
+  bottom: 20px;
+  right: 20px;
+
+  h3 {
+    margin-bottom: 0;
+    color: $white;
+    line-height: 1.25;
+    font-weight: 700;
+  }
+
+  a h3 {
+    &:after {
+      font-family: 'icomoon' !important;
+      content: "\e900";
+      font-size: 12px;
+      margin-left: 10px;
+      margin-top: -1px;
+    }
+  }
+}
+
+.tiles-label {
+  font-family: $font-family-sans-serif;
+  font-weight: 500;
+  color: $white;
+  text-transform: uppercase;
+}
+
+.tiles-square {
+  .tiles-image {
+    padding-bottom: 100%;
+  }
+
+  &:hover {
+    transform: scale(1.055);
+  }
+}
+
+.tiles-wrapper {
+  background-color: $white;
+  box-shadow: 0 5px 10px 0 rgba(0, 35, 75, 0.15);
+
+  .tiles {
+    box-shadow: none;
+    margin-bottom: 0;
+  }
+}
+
+.tiles-image {
+  position: relative;
+  margin-bottom: 1rem;
+  overflow: hidden;
+
+  &:after {
+    content: "";
+    opacity: 0.9;
+    position: absolute;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    top: 0;
+  }
+
+  img {
+    animation-delay: 0.75s;
+    animation-name: fade;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    height: 100%;
+    @include media-breakpoint-down(xs) {
+      width: 100%;
+      height: auto;
+    }
+  }
+}
+
+.tiles-footer {
+  padding: 1.875rem;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.tiles-stretch {
+  height: 100%;
+}
+
+.benefits-icon {
+  margin-bottom: 0.5rem;
+
+  svg {
+    display: block;
+    margin: 0 auto;
+  }
+}
+
+.benefits-items {
+  padding: 30px 40px;
+
+  p {
+    font-size: 0.75rem;
+  }
+
+  h3 {
+    margin-bottom: 1.5rem;
+  }
+
+  h6 {
+    margin-bottom: 0;
+  }
+
+  .row {
+    margin-right: -40px;
+    margin-left: -40px;
+  }
+
+  .col-md-12,
+  .col-md-4 {
+    padding-right: 40px;
+    padding-left: 40px;
+  }
+
+  .col-md-4 + .col-md-4 {
+    &:after {
+      content: "";
+      position: absolute;
+      border-left: 1px solid #dee2e3;
+      top: 5px;
+      bottom: 0;
+      left: 0;
+    }
+  }
+}
+
+.tiles-container {
+  padding: 40px 190px 40px 40px;
+  @include media-breakpoint-down(lg) {
+    padding-right: 60px;
+  }
+  @include media-breakpoint-down(md) {
+    padding-right: 40px;
+  }
+}
+
+.tiles-fixed-heading {
+  min-height: 90px;
+}
+
+.tiles-link {
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  top: 0;
+  z-index: 10;
+}
+
+.tiles-indent {
+  margin-top: -100px;
+  margin-bottom: 50px;
+}
+
+.tiles-icon-header {
+  position: absolute;
+  left: 50%;
+  top: 0;
+  transform: translate(-50%, -30%);
+}
+
+.tiles-icon-footer {
+  position: absolute;
+  left: 50%;
+  top: 100%;
+  transform: translate(-50%, -30%);
+}