github-docs 0.0.5 → 0.0.18

data/_sass/cherry/_spacing.scss

@@ -0,0 +1,56 @@
+$sizes: 0 0.5 1 1.5 2 2.5 3 4 5 6 7 8 9 10 11 12 13 14 !default;
+$spacing-multiplier: 0.5rem !default;   // i.e. 7.5px
+$spacing-multiplier-lg: false !default;
+$spacing-multiplier-md: false !default;
+$spacing-multiplier-sm: false !default;
+$spacing-multiplier-xs: false !default;
+
+$spacing-breakpoints: (
+  (lg, $breakpoint-lg, $spacing-multiplier-lg),
+  (md, $breakpoint-md, $spacing-multiplier-md),
+  (sm, $breakpoint-sm, $spacing-multiplier-sm),
+  (xs, $breakpoint-xs, $spacing-multiplier-xs)
+);
+
+/* ---- Main ------------------------- */
+
+  @mixin spacing($t, $type, $multipler, $prefix) {
+    @each $i in $sizes {
+      $ii: $i;
+      @if $i == 0.5 { $ii: '0-5'; }
+      @if $i == 1.5 { $ii: '1-5'; }
+      @if $i == 2.5 { $ii: '2-5'; }
+      .#{$prefix}#{$t}-#{$ii} {
+        #{$type}: $spacing-multiplier * $i * $multipler !important;
+      }
+      .#{$prefix}#{$t}t-#{$ii},
+      .#{$prefix}#{$t}y-#{$ii} {
+        #{$type}-top: $spacing-multiplier * $i * $multipler !important;
+      }
+      .#{$prefix}#{$t}b-#{$ii},
+      .#{$prefix}#{$t}y-#{$ii} {
+        #{$type}-bottom: $spacing-multiplier * $i * $multipler !important;
+      }
+      .#{$prefix}#{$t}l-#{$ii},
+      .#{$prefix}#{$t}x-#{$ii} {
+        #{$type}-left: $spacing-multiplier * $i * $multipler !important;
+      }
+      .#{$prefix}#{$t}r-#{$ii},
+      .#{$prefix}#{$t}x-#{$ii} {
+        #{$type}-right: $spacing-multiplier * $i * $multipler !important;
+      }
+    }
+  }
+
+  @each $type, $t in (padding, p), (margin, m) {
+    @include spacing($t, $type, 1.0, '');
+  }
+
+  @each $size, $width, $multiplier in $spacing-breakpoints {
+    @media screen and (max-width: $width) {
+      @each $type, $t in (padding, p), (margin, m) {
+        @if ($multiplier != false) { @include spacing($t, $type, $multiplier, ''); }
+        @include spacing($t, $type, 1.0, $size + '\\:');
+      }
+    }
+  }

data/_sass/cherry/_tooltips.scss

@@ -0,0 +1,113 @@
+$tooltip-bg: #532C6E !default;
+
+/* ---- Tooltips --------------------- */
+
+  .has-tooltip {
+    display: inline-block;
+    /* vertical-align: bottom; */
+    /* font-weight: 400; */
+    /* font-family: Hind; */
+    /* padding: 0 0.4em; */
+    /* font-size: 0.95em; */
+  }
+  .tooltip {
+    display: block !important;
+    z-index: 10000;
+  }
+  .tooltip .tooltip-inner {
+    background: $tooltip-bg;
+    color: white;
+    text-shadow: 0 0 1px rgba(255, 255, 255, 0.54);
+    text-align: center;
+    border-radius: 4px;
+    font-family: Open Sans;
+    font-style: normal;
+    font-weight: 600;
+    font-size: 11px;
+    line-height: 144.2%;
+    padding: 0.5em 1.4em 0.65em;
+    box-shadow: 0 5px 30px rgba(0, 0, 0, 0.1);
+    max-width: 270px;
+    /* letter-spacing: 0; */
+  }
+  .tooltip .tooltip-arrow {
+    width: 0;
+    height: 0;
+    border-style: solid;
+    position: absolute;
+    margin: 5px;
+    border-color: $tooltip-bg;
+    z-index: 1;
+  }
+  .tooltip[x-placement^="top"] {
+    margin-bottom: 5px;
+  }
+  .tooltip[x-placement^="top"] .tooltip-arrow {
+    border-width: 5px 5px 0 5px;
+    border-left-color: transparent !important;
+    border-right-color: transparent !important;
+    border-bottom-color: transparent !important;
+    bottom: -5px;
+    left: calc(50% - 5px);
+    margin-top: 0;
+    margin-bottom: 0;
+  }
+  .tooltip[x-placement^="bottom"] {
+    margin-top: 5px;
+  }
+  .tooltip[x-placement^="bottom"] .tooltip-arrow {
+    border-width: 0 5px 5px 5px;
+    border-left-color: transparent !important;
+    border-right-color: transparent !important;
+    border-top-color: transparent !important;
+    top: -5px;
+    left: calc(50% - 5px);
+    margin-top: 0;
+    margin-bottom: 0;
+  }
+  .tooltip[x-placement^="right"] {
+    margin-left: 5px;
+  }
+  .tooltip[x-placement^="right"] .tooltip-arrow {
+    border-width: 5px 5px 5px 0;
+    border-left-color: transparent !important;
+    border-top-color: transparent !important;
+    border-bottom-color: transparent !important;
+    left: -5px;
+    top: calc(50% - 5px);
+    margin-left: 0;
+    margin-right: 0;
+  }
+  .tooltip[x-placement^="left"] {
+    margin-right: 5px;
+  }
+  .tooltip[x-placement^="left"] .tooltip-arrow {
+    border-width: 5px 0 5px 5px;
+    border-top-color: transparent !important;
+    border-right-color: transparent !important;
+    border-bottom-color: transparent !important;
+    right: -5px;
+    top: calc(50% - 5px);
+    margin-left: 0;
+    margin-right: 0;
+  }
+  .tooltip.popover .popover-inner {
+    background: #f9f9f9;
+    color: black;
+    padding: 24px;
+    border-radius: 5px;
+    box-shadow: 0 5px 30px rgba(black, .1);
+  }
+  .tooltip.popover .popover-arrow {
+    border-color: #f9f9f9;
+  }
+  .tooltip[aria-hidden='true'] {
+    visibility: hidden;
+    opacity: 0;
+    transition: opacity .15s, visibility .15s;
+  }
+  .tooltip[aria-hidden='false'] {
+    visibility: visible;
+    opacity: 1;
+    transition: opacity .15s;
+  }

data/_sass/cherry/_typography.scss

@@ -0,0 +1,90 @@
+/* ---- Content (wysiwyg) ------------ */
+
+  .content {
+    h1, h2, h3, h4 {
+      font-style: normal;
+      font-weight: bold;
+      line-height: 1.5em;
+      letter-spacing: -0.03em;
+      margin: 0 0 0.8em 0;
+    }
+    h1 {
+      font-size: 27px;
+    }
+    h2 {
+      font-size: 25px;
+    }
+    h3 {
+      font-size: 22px;
+    }
+    h4 {
+      font-size: 18px;
+    }
+    b, strong {
+      font-weight: bold;
+    }
+    p,
+    ul,
+    ol,
+    q,
+    small,
+    code {
+      margin-top: 0;
+      margin-bottom: 1.4rem;
+      line-height: 1.6em;
+    }
+    small,
+    code {
+      display: block;
+    }
+    pre {
+      margin: 0;
+    }
+    ul, ol {}
+    li {
+      margin: 0 0 0.2em 2em;
+    }
+    .ul-blank {
+      list-style: none;
+    }
+    .ul-blank li {
+      margin: 0 0 0.5em 0em;
+    }
+    ol a,
+    ul a,
+    p a {
+      text-decoration: underline;
+      //transition: color 0.1s ease;
+    }
+    ol a:hover,
+    ul a:hover,
+    p a:hover,
+    ol a:focus,
+    ul a:focus,
+    p a:focus {
+      text-decoration: underline;
+    }
+    ul li:last-child {
+      padding-bottom: 0.1em;
+    }
+    ul li:last-child {
+      padding-bottom: 0.1em;
+    }
+    small {
+      font-size: 0.85em;
+      line-height: 1.6em;
+    }
+    q {
+      background-color: #abc3441f;
+      color: #536311;
+      border-radius: 4px;
+      padding: 1.4em 1.5em;
+      & b {
+        color: #536311;
+      }
+      &:before,
+      &:after {
+        display: none;
+      }
+    }
+  }

data/_sass/cherry/_utilities.scss

@@ -0,0 +1,552 @@
+$border-color:         #f5f5f5 !default;
+$under-color:          $text !default;
+$under-width:          3px !default;
+$border-radius-step:   2px !default;
+$utilities-multiplier: 0.5rem !default; // 7.5px
+$breakpoints: (
+  "none": null,
+  "lg": $breakpoint-lg,
+  "md": $breakpoint-md,
+  "sm": $breakpoint-sm,
+  "xs": $breakpoint-xs,
+);
+
+/* ---- Borders ---------------------- */
+
+  @each $i in [1, 2, 3, 4, 5] {
+    .b-#{$i} {
+      border: #{$i}px solid $border-color !important;
+    }
+    .bl-#{$i} {
+      border-left: #{$i}px solid $border-color !important;
+    }
+    .br-#{$i} {
+      border-right: #{$i}px solid $border-color !important;
+    }
+    .bt-#{$i} {
+      border-top: #{$i}px solid $border-color !important;
+    }
+    .bb-#{$i} {
+      border-bottom: #{$i}px solid $border-color !important;
+    }
+    .bx-#{$i} {
+      border-left: #{$i}px solid $border-color !important;
+      border-right: #{$i}px solid $border-color !important;
+    }
+    .by-#{$i} {
+      border-top: #{$i}px solid $border-color !important;
+      border-bottom: #{$i}px solid $border-color !important;
+    }
+  }
+
+  /* ---- Border radius -------------- */
+
+  @each $i in [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20, 'full'] {
+    $size: null;
+    @if ($i == 'full') {
+      $size: 999px;
+    }
+    @else {
+      $size: $border-radius-step * $i;
+    }
+    .rounded-#{$i} {
+      border-radius: $size !important;
+    }
+    .rounded-l-#{$i} {
+      border-top-left-radius: $size !important;
+      border-bottom-left-radius: $size !important;
+    }
+    .rounded-r-#{$i} {
+      border-top-right-radius: $size !important;
+      border-bottom-right-radius: $size !important;
+    }
+    .rounded-t-#{$i} {
+      border-top-left-radius: $size !important;
+      border-top-right-radius: $size !important;
+    }
+    .rounded-b-#{$i} {
+      border-bottom-left-radius: $size !important;
+      border-bottom-right-radius: $size !important;
+    }
+    .rounded-tl-#{$i} {
+      border-top-left-radius: $size !important;
+    }
+    .rounded-tr-#{$i} {
+      border-top-right-radius: $size !important;
+    }
+    .rounded-bl-#{$i} {
+      border-bottom-left-radius: $size !important;
+    }
+    .rounded-br-#{$i} {
+      border-bottom-right-radius: $size !important;
+    }
+    .rounded-br-#{$i} {
+      border-bottom-right-radius: $size !important;
+    }
+  }
+
+/* ---- Colors & Gradients ----------- */
+
+  @each $name, $color in map-merge($shades, $app-colors) {
+    @if (type-of($color) == 'map' or type-of($color) == 'list') {
+      $color-invert: nth($color, 2);
+      $color: nth($color, 1);
+    }
+    .text-#{$name} {
+      color: $color !important;;
+      text-decoration-color: $color !important;;
+      fill: $color !important;;
+    }
+    .bg-#{$name} {
+      color: $color !important;;
+      fill: $color !important;;
+    }
+    @if ($name == 'text') {
+      .text {
+        color: $color !important;;
+        text-decoration-color: $color !important;;
+        fill: $color !important;;
+      }
+    }
+    @if (variable-exists(color-invert)) {
+      .text-#{$name}-invert {
+        color: $color-invert !important;;
+        text-decoration-color: $color-invert !important;;
+        fill: $color-invert !important;
+      }
+      .bg-#{$name}-invert {
+        color: $color-invert !important;;
+        fill: $color-invert !important;;
+      }
+      @if ($name == 'text') {
+        .text-invert {
+          color: $color-invert !important;;
+          text-decoration-color: $color-invert !important;;
+          fill: $color-invert !important;;
+        }
+      }
+    }
+  }
+
+  @each $name, $gradient in $custom-gradients {
+    .bg-#{$name} {
+      background-image: linear-gradient($gradient) !important;
+    }
+  }
+
+/* ---- Display ---------------------- */
+
+  @mixin display($prefix) {
+    .#{$prefix}block {
+      display: block !important;
+    }
+    .#{$prefix}inline-block {
+      display: inline-block !important;
+    }
+    .#{$prefix}inline {
+      display: inline !important;
+    }
+    .#{$prefix}flex {
+      display: flex !important;
+    }
+    .#{$prefix}inline-flex {
+      display: inline-flex !important;
+    }
+    .#{$prefix}table {
+      display: table !important;
+    }
+    .#{$prefix}table-caption {
+      display: table-caption !important;
+    }
+    .#{$prefix}table-cell {
+      display: table-cell !important;
+    }
+    .#{$prefix}table-column {
+      display: table-column !important;
+    }
+    .#{$prefix}table-column-group {
+      display: table-column-group !important;
+    }
+    .#{$prefix}table-footer-group {
+      display: table-footer-group !important;
+    }
+    .#{$prefix}table-header-group {
+      display: table-header-group !important;
+    }
+    .#{$prefix}table-row-group {
+      display: table-row-group !important;
+    }
+    .#{$prefix}table-row {
+      display: table-row !important;
+    }
+    .#{$prefix}flow-root {
+      display: flow-root !important;
+    }
+    .#{$prefix}grid {
+      display: grid !important;
+    }
+    .#{$prefix}inline-grid {
+      display: inline-grid !important;
+    }
+    .#{$prefix}contents {
+      display: contents !important;
+    }
+    .#{$prefix}hidden {
+      display: none !important;
+    }
+  }
+
+  @each $key, $width in $breakpoints {
+    @if ($width) {
+      @media screen and (max-width: $width) { @include display($key + '\\:'); }
+    } @else {
+      @include display('');
+    }
+  }
+
+/* ---- Flex ------------------------- */
+
+  .flex-0 {
+    flex: 0 !important;
+  }
+  .flex-1 {
+    flex: 1 !important;
+  }
+  .flex-auto {
+    flex: auto !important;
+  }
+  .flex-initial {
+    flex: initial !important; /* can shrink, but not grow i.e flex: 0 */
+  }
+  .flex-none {
+    flex: none !important; /* can't shrink or grow */
+  }
+
+  /* Direction */
+
+  .flex-column {
+    flex-direction: column !important;
+  }
+  .flex-column-reverse {
+    flex-direction: column-reverse !important;
+  }
+  .flex-row {
+    flex-direction: row !important;
+  }
+  .flex-row-reverse {
+    flex-direction: row-reverse !important;
+  }
+
+  /* Wrap */
+
+  .flex-nowrap {
+    flex-wrap: nowrap !important;
+  }
+  .flex-wrap {
+    flex-wrap: wrap !important;
+  }
+  .flex-wrap-reverse {
+    flex-wrap: wrap-reverse !important;
+  }
+
+  /* Grow / shrink */
+
+  .flex-grow {
+    flex-grow: 1 !important;
+  }
+  .flex-grow-0 {
+    flex-grow: 0 !important;
+  }
+  .flex-shrink {
+    flex-shrink: 1 !important;
+  }
+  .flex-shrink-0 {
+    flex-shrink: 0 !important;
+  }
+
+  /* Order */
+
+  @each $i in [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12] {
+    .order-#{$i} {
+      order: #{$i} !important;
+    }
+  }
+  .order-first {
+    order: -9999 !important;
+  }
+  .order-last {
+    order: 9999 !important;
+  }
+  .order-none {
+    order: 0 !important;
+  }
+
+  /* Gap */
+
+  @each $i in [0, 0.5, 1, 1.5, 2, 2.5, 3, 4, 5, 6, 7, 8, 9] {
+    $ii: $i;
+    @if $i == 0.5 { $ii: '0-5'; }
+    @if $i == 1.5 { $ii: '1-5'; }
+    @if $i == 2.5 { $ii: '2-5'; }
+    .grid-gap-#{$ii} {
+      // Not used for cols, please see gap-*
+      gap: #{$utilities-multiplier * $i} !important;
+    }
+    .column-gap-#{$ii} {
+      column-gap: #{$utilities-multiplier * $i} !important;
+    }
+    .row-gap-#{$ii} {
+      row-gap: #{$utilities-multiplier * $i} !important;
+    }
+  }
+
+  /* Justify */
+
+  .justify-center {
+    justify-content: center !important;
+  }
+  .justify-end {
+    justify-content: flex-end !important;
+  }
+  .justify-space-around {
+    justify-content: space-around !important;
+  }
+  .justify-space-between {
+    justify-content: space-between !important;
+  }
+  .justify-space-evenly {
+    justify-content: space-evenly !important;
+  }
+  .justify-start {
+    justify-content: flex-start !important;
+  }
+
+  .justify-items-center {
+    justify-items: center !important;
+  }
+  .justify-items-end {
+    justify-items: flex-end !important;
+  }
+  .justify-items-start {
+    justify-items: flex-start !important;
+  }
+  .justify-items-stretch {
+    justify-items: stretch !important;
+  }
+
+  .justify-self-auto {
+    justify-self: auto !important;
+  }
+  .justify-self-center {
+    justify-self: center !important;
+  }
+  .justify-self-end {
+    justify-self: flex-end !important;
+  }
+  .justify-self-start {
+    justify-self: flex-start !important;
+  }
+  .justify-self-stretch {
+    justify-self: stretch !important;
+  }
+
+  /* Align */
+
+  .align-center {
+    align-content: center !important;
+  }
+  .align-end {
+    align-content: flex-end !important;
+  }
+  .align-space-around {
+    align-content: space-around !important;
+  }
+  .align-space-between {
+    align-content: space-between !important;
+  }
+  .align-space-evenly {
+    align-content: space-evenly !important;
+  }
+  .align-start {
+    align-content: flex-start !important;
+  }
+
+  .align-items-baseline {
+    align-items: baseline !important;
+  }
+  .align-items-center {
+    align-items: center !important;
+  }
+  .align-items-end {
+    align-items: flex-end !important;
+  }
+  .align-items-start {
+    align-items: flex-start !important;
+  }
+  .align-items-stretch {
+    align-items: stretch !important;
+  }
+
+  .align-self-auto {
+    align-self: auto !important;
+  }
+  .align-self-center {
+    align-self: center !important;
+  }
+  .align-self-end {
+    align-self: flex-end !important;
+  }
+  .align-self-start {
+    align-self: flex-start !important;
+  }
+  .align-self-stretch {
+    align-self: stretch !important;
+  }
+
+/* ---- Text weight ------------------ */
+
+  @each $i in [300, 400, 500, 600, 700, 800, 900] {
+    .weight-#{$i},
+    .text-weight-#{$i} {
+      font-weight: $i !important;
+    }
+  }
+
+/* ---- Text Overflow ---------------- */
+
+  @each $i in [ellipsis, clip] {
+    .overflow-#{$i}
+    .text-overflow-#{$i} {
+      text-overflow: $i !important;
+    }
+  }
+  .truncate,
+  .text-truncate {
+    text-overflow: ellipsis;
+    overflow: hidden;
+  }
+  .truncate1,
+  .text-truncate1 {
+    text-overflow: ellipsis;
+    overflow: hidden;
+    white-space: nowrap;
+  }
+
+/* ---- Vertical align --------------- */
+
+  @each $i in [baseline, top, middle, bottom, sub, text-top, text-bottom] {
+    .align-#{$i},
+    .vertical-align-#{$i} {
+      vertical-align: $i !important;
+    }
+  }
+
+/* ---- Helpers ---------------------- */
+
+  .relative {
+    position: relative !important;
+  }
+  .left {
+    float: left !important;
+  }
+  .right {
+    float: right !important;
+  }
+  .center,
+  .mx-auto {
+    margin-left: auto !important;
+    margin-right: auto !important;
+  }
+  .ml-auto {
+    margin-left: auto !important;
+  }
+  .mr-auto {
+    margin-right: auto !important;
+  }
+  .clear {
+    clear: both !important;
+  }
+  .cf:after {
+    content: "";
+    display: block;
+    clear: both;
+  }
+  .min-0 {
+    min-width: 0 !important;
+  }
+  .no-select {
+    -webkit-touch-callout: none !important;
+    -webkit-user-select: none !important;
+    -khtml-user-select: none !important;
+    -moz-user-select: none !important;
+    -ms-user-select: none !important;
+    user-select: none !important;
+  }
+  .text-left {
+    text-align: left !important;
+  }
+  .text-right {
+    text-align: right !important;
+  }
+  .text-center {
+    text-align: center !important;
+  }
+  .cover {
+    width: 100%;
+    height: 100%;
+    background-position: center;
+    background-size: cover;
+    object-fit: cover;
+    object-position: center center;
+    overflow: hidden;
+  }
+
+/* ---- Underline -------------------- */
+
+  .under {
+    position: relative;
+  }
+  .under:before {
+    content: "";
+    display: block;
+    position: absolute;
+    bottom: 0.25em;
+    height: $under-width;
+    width: 100%;
+    opacity: 0;
+    background-color: $under-color;
+    transition: transform 0.15s ease, opacity 0.2s ease;
+  }
+  .under:hover:before,
+  .under:focus:before,
+  .under.active:before {
+    transform: translateY(1px);
+    opacity: 1;
+  }
+
+/* ---- Vue animations --------------- */
+
+  /* Slide */
+
+  .slide-up-enter-active {
+    transition: all 0.2s ease-out;
+  }
+  .slide-up-leave-active {
+    transition: all 0.2s ease-in;
+  }
+  .slide-up-enter,
+  .slide-up-leave-to {
+    opacity: 0;
+    transform: translateY(-12px);
+  }
+
+  /* Fade */
+
+  .fade-enter-active,
+  .fade-leave-active {
+    transition: opacity 0.15s ease;
+  }
+  .fade-enter,
+  .fade-leave-to {
+    opacity: 0.1;
+  }