kickstart_rails 3.0.36 → 3.0.39

data/app/assets/stylesheets/kickstart_rails/core/_animations.sass

@@ -1,8 +0,0 @@
-@keyframes fadeInDown 
-  0%
-    opacity: 0
-    transform: translateY(-20px)
-
-  100%
-    opacity: 1
-    transform: translateY(0)

data/app/assets/stylesheets/kickstart_rails/core/_base.sass

@@ -1,16 +0,0 @@
-*
-  box-sizing: border-box
-
-iframe
-  width: 100%
-  border: 0
-  padding: 15px
-  margin-bottom: 25px
-
-=above-footer
-  flex: 1
-
-=screen
-  display: flex
-  min-height: 100vh
-  flex-direction: column

data/app/assets/stylesheets/kickstart_rails/core/_base_components.sass

@@ -1,15 +0,0 @@
-// Base Components
-// ===============
-// These are the base components from which dependent components can extend.
-
-// Components
-@import components/_alerts
-@import components/_buttons
-@import components/_hr
-@import components/_images
-@import components/_labels
-@import components/_modals
-@import components/_progress
-@import components/_tables
-@import components/_dropdown_menu
-@import components/_navbar

data/app/assets/stylesheets/kickstart_rails/core/_dependent_components.sass

@@ -1,12 +0,0 @@
-// Dependent Components
-// ====================
-// These components extend the core and base components.
-
-// Components
-@import components/_growls
-@import components/_modals
-@import components/_notifications
-@import components/_tabs
-@import components/_tooltips
-@import components/_forms
-@import components/_pagination

data/app/assets/stylesheets/kickstart_rails/core/_direct-apply.sass

@@ -1,337 +0,0 @@
-// Direct applications
-// ===================
-// Regardless of semantic or non-semantic usage, some styles
-// Should be applied directly to classes or elements no matter
-// what. This include should be included near the end of the
-// import chain but before kickstart.sass to accomplish this.
-
-body
-  &.dismiss-modal
-    cursor: pointer
-
-// Buttons
-// -------
-
-button,
-input[type="submit"],
-input[type="button"],
-  +button
-
-input[type="file"]::-webkit-file-upload-button
-  +button
-
-+dropdown_menu
-
-// Forms
-// -----
-
-%error_message
-  font-style: italic
-  margin:
-    top: 7px
-    bottom: 14px
-
-form
-  .errors, .warnings, .successes
-    p
-      @extend %error_message
-
-  .errors
-    +field-colors(map-get($colors, red))
-
-  .warnings
-    +field-colors(map-get($colors, yellow))
-
-  .successes
-    +field-colors(map-get($colors, green))
-
-  p
-    &.error, &.warning, &.success
-      @extend %error_message
-
-  label, span, p
-    &.error
-      color: map-get($colors, red)
-
-    &.warning
-      color: map-get($colors, yellow)
-
-    &.success
-      color: map-get($colors, green)
-
-  input, select
-    &.error
-      border-color: map-get($colors, red)
-
-    &.warning
-      border-color: map-get($colors, yellow)
-
-    &.success
-      border-color: map-get($colors, green)
-
-
-// Growls
-// ------
-
-.growl_container
-  position: fixed
-  top: 0
-  right: 0
-  padding: $space/2
-  z-index: 2000
-  width: 300px
-  overflow: auto
-  max-height: 100vh
-
-  .growl
-    box-shadow: 0px 0px $space/2 rgba(0, 0, 0, 0.5)
-    transition: all 0.5s
-
-    &.show, &.hide
-      +fadeInDown
-
-    &.hide
-      animation-direction: reverse
-
-    +growl
-
-// Status
-// ------
-
-.status_bar
-  +status_bar
-    .status_bar-status
-      &[data-type="status-red"]
-        +label(map-get($colors, red))
-
-      &[data-type="status-orange"]
-        +label(map-get($colors, orange))
-
-      &[data-type="status-yellow"]
-        +label(map-get($colors, yellow))
-
-      &[data-type="status-green"]
-        +label(map-get($colors, green))
-
-      &[data-type="status-blue"]
-        +label(map-get($colors, blue))
-
-      &[data-type="status-violet"]
-        +label(map-get($colors, violet))
-
-// Tabs
-// ----
-
-[data-panel]
-  display: none
-
-  &.open
-    display: block
-
-// Tooltips
-// --------
-
-=tooltip_base
-  margin-bottom: 0
-  position: absolute
-  display: block
-  opacity: 0
-  bottom: 100%
-  box-shadow: 0px 5px 25px rgba(0, 0, 0, 0.25)
-  pointer-events: none
-  max-width: 350px
-  min-width: 100px
-  text-align: center
-  transition: all 0.25s
-
-=tooltip_arrow
-  border-top-style: solid
-  border-top-width: 10px
-  border-left: 10px solid transparent
-  border-right: 10px solid transparent
-  width: 0px
-  height: 0px
-  content: ' '
-  display: block
-  background: transparent
-  position: absolute
-  left: 50%
-  margin-left: -8px
-  opacity: 0
-
-=pseudo-tooltip-color($color: $primary-color)
-  &:after
-    +label($color)
-    margin-bottom: 0
-
-  &:before
-    border-top-color: $color
-
-[data-ks-tooltip]
-  position: relative
-
-  +pseudo-tooltip-color
-
-  &:after
-    content: attr(data-ks-tooltip)
-    +tooltip_base
-    transform: translateY(0px)
-    z-index: 10
-
-  &:before
-    +tooltip_arrow
-    bottom: 100%
-    z-index: 100
-
-  &:hover
-    &:after, &:before
-      opacity: 1
-
-    &:after
-      transform: translateY(-8px)
-      transition: transform 0.25s
-
-  // Positioning
-
-  &[data-ks-tooltip-position="bottom"]
-    &:after
-      top: 100%
-      bottom: auto
-      margin-top: 15px
-      transform: translateY(-6px)
-
-    &:before
-      transform: rotate(180deg)
-      top: 100%
-      bottom: auto
-
-  &[data-ks-tooltip-position="left"]
-    &:after
-      transform: translateY(6px)
-      top: 50%
-      bottom: auto
-      margin:
-        top: -19px
-        right: 12px
-      left: auto
-      right: 100%
-
-    &:before
-      transform: rotate(-90deg)
-      top: 50%
-      margin-top: -4px
-      bottom: auto
-      left: auto
-      right: 100%
-
-  &[data-ks-tooltip-position="right"]
-    &:after
-      transform: translateY(6px)
-      top: 50%
-      bottom: auto
-      margin:
-        top: -19px
-        left: 16px
-      left: 100%
-      right: auto
-
-    &:before
-      transform: rotate(90deg)
-      top: 50%
-      margin-top: -4px
-      margin-left: 4px
-      bottom: auto
-      left: 100%
-      right: auto
-
-  &[data-ks-tooltip-color="red"]
-    +pseudo-tooltip-color(map-get($colors, red))
-
-  &[data-ks-tooltip-color="orange"]
-    +pseudo-tooltip-color(map-get($colors, orange))
-
-  &[data-ks-tooltip-color="yellow"]
-    +pseudo-tooltip-color(map-get($colors, yellow))
-
-  &[data-ks-tooltip-color="green"]
-    +pseudo-tooltip-color(map-get($colors, green))
-
-  &[data-ks-tooltip-color="blue"]
-    +pseudo-tooltip-color(map-get($colors, blue))
-
-  &[data-ks-tooltip-color="violet"]
-    +pseudo-tooltip-color(map-get($colors, violet))
-
-.tooltip
-  +tooltip_base
-  left: -30px
-  right: -30px
-  transform: translateY(8px)
-  z-index: 10
-  +label(map-get($colors, blue))
-  margin: 10px auto
-
-  &:after
-    +tooltip_arrow
-    top: 100%
-
-  &.tooltip-bottom
-    top: 100%
-    bottom: auto
-
-    &:after
-      bottom: 100%
-      top: auto
-      transform: rotate(180deg)
-
-  &.tooltip-left
-    right: 100%
-    left: auto
-
-    &:after
-      transform: rotate(-90deg)
-      left: 100%
-
-  &.tooltip-right
-    left: 100%
-    right: auto
-
-    &:after
-      transform: rotate(90deg)
-      left: auto
-      right: 100%
-      margin:
-        left: 0
-        right: -8px
-
-  &.tooltip-right, &.tooltip-left
-    top: 0
-    bottom: auto
-    margin: 0
-
-    &:after
-      top: 8px
-
-  &.tooltip-red
-    +label(map-get($colors, red))
-
-  &.tooltip-orange
-    +label(map-get($colors, orange))
-
-  &.tooltip-yellow
-    +label(map-get($colors, yellow))
-
-  &.tooltip-green
-    +label(map-get($colors, green))
-
-  &.tooltip-blue
-    +label(map-get($colors, blue))
-
-  &.tooltip-violet
-    +label(map-get($colors, violet))
-
-  &.tooltip-primary
-    +label(map-get($colors, primary))
-
-  &.tooltip-secondary
-    +label(map-get($colors, secondary))

data/app/assets/stylesheets/kickstart_rails/core/_grid.sass

@@ -1,142 +0,0 @@
-// Still playing with this
-  $mobile: (
-    default: 360px,
-    large: 480px,
-    larger: 600px,
-    largest: 768px
-  )
-
-//
-  $display: (
-    smallest: 960px,
-    smaller: 1024px,
-    small: 1200px,
-    default: 1400px
-  )
-
-$phone: 360px
-$phablet: 480px
-$tablet: 768px
-$tablet-landscape: 960px
-$desktop: 1024px
-$large-monitor: 1200px
-$xl-monitor: 1400px
-$xxl-monitor: 1800px
-
-$grid-columns: 12
-$grid-gutter: 15px
-
-// Grid breakpoints
-// ----------------
-// Critical breakpoints where offsets and alternative grid styles will
-// be displayed
-
-$showOffsets:        $tablet-landscape // Offsets render at this breakpoint
-$showColumns:        $phablet          // Allow < 12 columns
-$showPartialColumns: $tablet           // Simpler alternative to actual columns
-$showFullColumns:    $desktop          // Actual user-defined column measurement
-
-=container-default($fluid: false)
-  margin: 0px auto
-  
-  @if $fluid == false
-    max-width: $tablet
-  padding:
-    left: $space
-    right: $space
-
-  @if $fluid == false
-    @media screen and (min-width: $showOffsets)
-      max-width: $desktop
-
-    @media screen and (min-width: $xxl-monitor)
-      max-width: $large-monitor
-
-=row
-  display: flex
-  width: 100%
-  justify-content: space-between
-  align-items: stretch
-  flex-wrap: wrap
-
-=measure-columns($columns, $prop)
-  // TODO: DRY this somehow?
-  @if $prop == "width"
-    width: calc(#{percentage($columns/$grid-columns)} - #{(($grid-columns/$columns - 1) * $grid-gutter)/($grid-columns/$columns)})
-
-  @else if $prop == "margin-left"
-    margin-left: calc(#{percentage($columns/$grid-columns)} - #{(($grid-columns/$columns - 1) * $grid-gutter)/($grid-columns/$columns) - $grid-gutter})
-
-  @else if $prop == "margin-right"
-    margin-right: calc(#{percentage($columns/$grid-columns)} - #{(($grid-columns/$columns - 1) * $grid-gutter)/($grid-columns/$columns) - $grid-gutter})
-
-=set-offset($columns, $side: "margin-right")
-  // Never show leftes and rights on mobile
-  // +measure-columns(0, $side)
-
-  // Look for keywords
-  @if $columns == "half"
-    @media screen and (min-width: $showPartialColumns)
-      +measure-columns(6, $side)
-
-  @else if $columns == "third"
-    @media screen and (min-width: $showPartialColumns)
-      +measure-columns(6, $side)
-
-    @media screen and (min-width: $showFullColumns)
-      +measure-columns(4, $side)
-
-  @else if $columns == "twothirds"
-    @media screen and (min-width: $showPartialColumns)
-      +measure-columns(6, $side)
-
-    @media screen and (min-width: $showFullColumns)
-      +measure-columns(8, $side)
-
-  @else
-    @media screen and (min-width: $showPartialColumns)
-      +measure-columns($columns, $side)
-
-// Convenience mixins
-=right($columns)
-  +set-offset($columns, "margin-right")
-=left($columns)
-  +set-offset($columns, "margin-left")
-
-=set-column($columns, $right, $left)
-  +measure-columns($columns, "width")
-  clear: none
-  display: block
-  // margin-left: 0
-
-  @if $right != 0
-    +set-offset($right, "margin-right")
-
-  @if $left != 0
-    +set-offset($left, "margin-left")
-
-=column($columns: 12, $right: 0, $left: 0)
-  // Everything is a full width column on mobile by default
-  +set-column(12, 0, 0)
-
-  // Look for keywords
-  @if $columns == "half"
-    @media screen and (min-width: $showPartialColumns)
-      +set-column($grid-columns/2, $right, $left)
-
-  @else if $columns == "third"
-    @media screen and (min-width: $showPartialColumns)
-      +set-column($grid-columns/2, $right, $left)
-    @media screen and (min-width: $showFullColumns)
-      +set-column($grid-columns/3, $right, $left)
-
-  @else if $columns == "twothirds"
-    @media screen and (min-width: $showPartialColumns)
-      +set-column($grid-columns/2, $right, $left)
-    @media screen and (min-width: $showFullColumns)
-      +set-column(($grid-columns * 2/3), $right, $left)
-
-  @else
-    // No keywords found, pass in values.
-    @media screen and (min-width: $showColumns)
-      +set-column($columns, $right, $left)