breezeblocks 0.0.1 → 0.0.2

data/source/stylesheets/_bourbon-nav.sass

@@ -1,57 +0,0 @@
-$bourbon-nav-background-color: #5b5e63
-
-nav.bourbon
-  +clearfix
-  background-color: $bourbon-nav-background-color
-  padding: 0 2em 0 1em
-  +media(max-width em(510))
-    padding: 0
-
-  ul
-    text-align: center
-    +media(em(901))
-      float: left
-      text-align: left
-  li
-    display: inline-block
-  a
-    background-position: 1em center
-    background-repeat: no-repeat
-    color: #fff
-    display: inline-block
-    font-weight: bold
-    padding: 1em 1em 1em 3em
-    +media(max-width em(515))
-      padding: 0.75em 0.5em
-      text-align: center
-
-    +media(max-width em(900))
-      display: block
-
-    &:focus,
-    &:hover
-      background-color: darken($bourbon-nav-background-color, 10)
-      color: #fff
-    &.current
-      background-color: darken($bourbon-nav-background-color, 5)
-    $sites: bourbon, neat, bitters, breezeblocks
-    @each $site in $sites
-      &.#{$site}
-        background-image: url("/images/bourbon-nav/#{$site}.png")
-        +hidpi
-          background-image: url("/images/bourbon-nav/#{$site}@2x.png")
-          background-size: 20%
-
-        +media(max-width em(515))
-          background-image: none
-  h1
-    color: rgba(#fff, 0.6)
-    float: right
-    font-size: 1em
-    +media(max-width em(900))
-      display: none
-
-    a
-      padding: 1em 0
-      &:hover
-        background-color: transparent

data/source/stylesheets/_refills-nav.sass

@@ -1,80 +0,0 @@
-$sidebar-width: em(200)
-
-section.inner-content
-  margin-left: auto
-
-.breezeblocks-menu-anchor
-  +position(fixed, 4.5em null null 1em)
-  +size(50px)
-  border: 1px solid darken(desaturate(#93e9be, 50), 15%)
-  border-radius: 50%
-  cursor: pointer
-  display: inline-block
-  font-size: 1em
-  padding: 0.7em 1em
-  margin-bottom: 1.5em
-  transition: all 0.2s ease-in-out
-  z-index: 9999
-  &.fixedsticky-on
-    margin-top: -3.5em
-  &.fixedsticky-off
-    position: fixed
-  img
-    +size(30px 26px)
-    max-width: 100%
-
-.breezeblocks-menu-anchor-moved
-  top: 1em
-
-.fixedsticky-dummy
-  height: 0 !important
-
-.breezeblocks-menu-screen
-  +position(fixed, 0 0 0 0)
-  +transition
-  background-color: teal
-  opacity: 0
-  visibility: hidden
-  z-index: 999998
-  &.is-visible
-    opacity: 0
-    visibility: visible
-
-.er_toc_title,
-.er_toc_top
-  display: none
-
-.er_toc
-  $base-line-height: 1.5em !default
-  +position(fixed, 0 auto 0 0)
-  +size(220px 100%)
-  +transform(translateX(-220px))
-  +transition(all 0.2s linear)
-  background-color: black
-  overflow-y: auto
-  -webkit-font-smoothing: antialiased
-  -webkit-overflow-scrolling: touch
-  transition: all 0.2s linear
-  z-index: 999999
-  ul
-    margin: 0
-    padding: 1em
-  ul li
-    a
-      color: darken(#fff, 15%)
-      font-size: 1em
-      font-weight: 300
-      line-height: $base-line-height
-      text-decoration: none
-      &:focus,
-      &:hover
-        color: #fff
-        text-decoration: none
-  ul ul
-    margin-bottom: 1em
-    margin-top: 0.5em
-    padding: 0
-  ul ul li a
-    font-weight: 200
-  &.is-visible
-    +transform(translateX(0))

data/source/stylesheets/_refills-styles.sass

@@ -1,483 +0,0 @@
-body
-  -webkit-font-smoothing: antialiased
-
-$breezeblocks-body-background-color: #fff
-
-nav.bourbon
-  text-rendering: optimizeLegibility
-  ul
-    list-style-type: none
-    margin: 0
-    padding: 0
-    li a
-      text-decoration: none
-  h1
-    margin: 0
-    a
-      text-decoration: none
-
-$breezeblocks-color: lighten(desaturate(teal, 60%), 40%)
-$breezeblocks-accent-color: #477dca
-$breezeblocks-nav-height: 60px
-$breezeblocks-logo-color: #93e9be
-$breezeblocks-anchor-color: #f55481
-$breezeblocks-hero-background: #e7f1ec
-$breezeblocks-highlight-color: #bbb295
-$breezeblocks-narrow-sans: "Oswald", sans-serif
-$breezeblocks-white-shadow: 0 1px 1px transparentize(#fff, 0.6)
-$breezeblocks-medium-screen: em(640)
-$breezeblocks-large-screen: em(860)
-
-$breezeblocks-serif: "Lusitana", $georgia
-$breezeblocks-second-serif: $georgia
-
-=breezeblocks-inset
-  background: darken($breezeblocks-hero-background, 2%)
-  box-shadow: inset 0 1px 2px darken($breezeblocks-hero-background, 7%), $breezeblocks-white-shadow
-  text-shadow: $breezeblocks-white-shadow
-
-body
-  -webkit-backface-visibility: hidden
-  background: $breezeblocks-body-background-color
-  min-width: 320px
-
-.breezeblocks-header
-  @extend .breezeblocks-header
-  +clearfix
-  background-color: $breezeblocks-hero-background
-  clear: both
-  margin-bottom: 1em
-  padding: 5em 0
-  text-align: center
-  width: 100%
-  +media($breezeblocks-medium-screen)
-    margin-bottom: 4em
-    padding: 6em 0
-
-  +media($breezeblocks-large-screen)
-    margin-bottom: 4em
-    padding: 6em 0 11em 0
-
-  .breezeblocks-logo
-    display: inline-block
-    margin: 0 auto 1.4em auto
-    +media($breezeblocks-medium-screen)
-      max-width: 8em
-      max-height: 8em
-
-    img
-      background: #fff
-      border-radius: 50%
-      padding: 0.3em
-      margin-bottom: 1em
-      max-width: 5em
-      max-height: 5em
-      +media($breezeblocks-medium-screen)
-        margin-bottom: 2em
-        max-width: 8em
-        max-height: 8em
-        padding: 0.5em
-  h2
-    font-family: $breezeblocks-second-serif
-    font-size: 1.4em
-    font-weight: 100
-    margin: 0 auto 2em auto
-    max-width: 90%
-    text-align: center
-    line-height: 1.4em
-    +media($breezeblocks-medium-screen)
-      font-size: 2em
-      margin-bottom: 1em
-      max-width: 90%
-
-    +media($breezeblocks-large-screen)
-      font-size: 3em
-      margin-bottom: 0.8em
-      line-height: 1.3em
-      max-width: 55%
-  h3
-    font-size: 1.3em
-    font-weight: 200
-    margin-bottom: 1em
-    text-align: center
-  a
-    color: $breezeblocks-anchor-color
-    text-decoration: none
-    &:focus,
-    &:hover
-      color: lighten($breezeblocks-anchor-color, 10%)
-  p
-    +breezeblocks-inset
-    border-radius: 30px
-    color: darken(desaturate($breezeblocks-logo-color, 50%), 15%)
-    display: inline
-    font-family: $breezeblocks-narrow-sans
-    font-size: 0.8em
-    font-weight: 400
-    padding: 0.5em 1.4em
-    +media($breezeblocks-large-screen)
-      font-size: 0.8em
-
-.menu-wrapper
-  +clearfix
-
-// Refill menu
-
-ul.breezeblocks-menu
-  font-weight: normal
-  margin-bottom: 5em
-  margin: -3.3em auto 0 auto
-  text-align: center
-  +media($breezeblocks-medium-screen)
-    margin: -6em auto 0 auto
-
-  +media($breezeblocks-large-screen)
-    margin: -6.7em auto 0 auto
-
-  .menu-item
-    display: inline
-    a
-      text-decoration: none
-      border-radius: 3px
-      color: darken($breezeblocks-hero-background, 20%)
-      font-family: "Lusitana", serif
-      font-size: 0.9em
-      padding: 0.5em 0.5em 2em
-      +media($breezeblocks-medium-screen)
-        font-size: 1.1em
-        padding: 0.5em 0.8em 2em
-
-      +media($breezeblocks-large-screen)
-        font-size: 1.3em
-        padding: 0.5em 1.3em 2em
-
-      &:hover
-        color: darken($breezeblocks-hero-background, 30%)
-
-.breezeblocks-patterns li.patterns a
-  background: $breezeblocks-body-background-color
-  &:hover
-    color: darken($breezeblocks-hero-background, 20%)
-
-.breezeblocks-components li.components a
-  background: $breezeblocks-body-background-color
-  &:hover
-    color: darken($breezeblocks-hero-background, 20%)
-
-.breezeblocks-type-systems li.type-systems a
-  background: $breezeblocks-body-background-color
-  &:hover
-    color: darken($breezeblocks-hero-background, 20%)
-
-#example
-  padding-top: 6em
-
-// Refill section
-
-section.refill
-  +clearfix
-  margin-bottom: 2em
-  padding-bottom: 1em
-  position: relative
-  > h3
-    margin-bottom: 1.3em
-    margin-top: 1em
-    padding-top: 0.5em
-
-.breezeblocks-wrapper
-  +outer-container
-  padding: 1em
-  h1.main-header
-    background-color: $breezeblocks-color
-    display: inline-block
-    padding: 0.5em
-
-// this centers the refill and sets back to text-align left below first object
-.refill-centering
-  text-align: center
-  & > *
-    display: inline-block
-    & > *
-      text-align: left
-  script
-    display: none
-
-.line-behind-text
-  border-bottom: 1px solid #cacaca
-  text-align: center
-  margin-bottom: 4.5em
-
-.line-behind-text h6
-  background: #fff
-  color: gray
-  display: inline-block
-  font-family: $breezeblocks-narrow-sans
-  font-size: 1em
-  font-weight: 500
-  padding: 0 10px
-  position: relative
-  text-transform: uppercase
-  top: 34px
-
-.refill h6
-  margin-bottom: 1.5em
-
-// Hiding and showing code
-
-.js-hide-code,
-.js-show-code
-  border-top: 1px dashed #bebcbc
-  color: #7e7a7a
-  font-size: 0.8em
-  text-transform: uppercase
-  width: 9em
-  &:hover
-    color: $breezeblocks-accent-color
-
-.js-show-code
-  display: inline-block
-  padding: 0.5em 1em
-
-.js-hide-code
-  display: none
-  padding: 0.5em 1em
-
-.refill-control
-  display: block
-  margin-bottom: 2em
-  text-align: center
-  width: 100%
-  a
-    line-height: 1.5em
-    text-decoration: none
-
-// Snippet
-
-.refill-snippet
-  margin-top: 4.5em
-  padding: 0 1em
-  table
-    border-collapse: collapse
-    margin: (1.5em / 2) 0
-    table-layout: fixed
-    width: 100%
-  th
-    font-weight: bold
-    padding: (1.5em / 2) 0
-    text-align: left
-  td
-    padding: (1.5em / 2) 0
-  tr,
-  td,
-  th
-    vertical-align: middle
-
-pre[class*="language-"]
-  background-color: #f8f8f8
-  border-top: 2px solid silver
-  height: 300px
-  line-height: 1em
-
-.snippets-table
-  display: none
-  td
-    border-bottom: 0
-  .snippet:nth-child(4n)
-    display: none
-
-.snippet
-  +media($breezeblocks-medium-screen)
-    margin-bottom: 2em
-
-  .copy-source-container
-    min-height: 3.4em
-    +media($breezeblocks-medium-screen)
-      min-height: 2.5em
-
-    +media($breezeblocks-large-screen)
-      min-height: 1em
-  &:nth-of-type(1) .copy-source
-    background: #e98065
-  &:nth-of-type(2) .copy-source
-    background: #55a1d4
-  &:nth-of-type(3) .copy-source:nth-of-type(1)
-    background: #e9c05b
-  &:nth-of-type(3) .copy-source:nth-of-type(2)
-    background: #89b981
-  .copy-source
-    border-bottom-left-radius: 10px
-    border-bottom-right-radius: 0
-    border-top-left-radius: 10px
-    border-top-right-radius: 10px
-    color: #fff
-    display: inline-block
-    font-size: 0.5em
-    font-weight: 800
-    padding: 0.4em 1em
-    text-transform: uppercase
-    &:hover,
-    &:active
-      background-color: lighten(#333, 20%)
-      color: #fff
-  a
-    text-decoration: none
-  code
-    font-size: 0.6em
-    line-height: 1.4em
-    max-height: em(400)
-    overflow: scroll
-
-.token.variable
-  background-color: transparent
-
-// Footer
-
-footer.breezeblocks-footer
-  color: silver
-  padding-bottom: 2em
-  padding-top: 1em
-  text-align: center
-  a
-    color: $breezeblocks-anchor-color
-    text-decoration: none
-  p
-    font-size: 0.8em
-    line-height: 1.5em
-    margin: 0 1em
-    +media($breezeblocks-large-screen)
-      font-size: 1em
-  .breezeblocks-footer-logo
-    margin-bottom: 2em
-  img
-    +clearfix
-    display: block
-    height: 60px
-    margin: auto
-  .footer-links
-    background: #f3f3f3
-    border-radius: 3em
-    box-shadow: inset 0 1px 2px darken(#f3f3f3, 6%)
-    display: inline-block
-    font-size: 0.8em
-    margin-bottom: 2em
-    padding: 0.6em
-    +media($breezeblocks-large-screen)
-      font-size: 1em
-      padding: 1em
-
-    li
-      display: inline
-      padding: 0.4em
-      a
-        color: #a7a7a7
-        text-decoration: none
-        &:hover
-          color: $breezeblocks-anchor-color
-
-// Adjustments
-
-.refill-smaller
-  +media($breezeblocks-large-screen)
-    margin: auto
-    width: 70%
-
-// Type Systems
-
-+keyframes(fadeInAccordionTabsArticles)
-  0%
-    opacity: 0
-  100%
-    opacity: 1
-
-
-.accordion-tabs-type-systems
-  $breezeblocks-border-color: gainsboro
-  $breezeblocks-border-radius: 3px
-  $breezeblocks-spacing: 1.5em
-  $breezeblocks-accent-color: #477dca
-  $breezeblocks-link-color: $breezeblocks-accent-color
-  $dark-gray: #333
-  $light-gray: #ddd
-  $breezeblocks-line-height: 1.5em
-  $tab-border-color: $breezeblocks-border-color
-  $tab-border: 1px solid $tab-border-color
-  $tab-content-background: lighten($light-gray, 15%)
-  $tab-active-background: $tab-content-background
-  $breezeblocks-body-inactive-color: $breezeblocks-body-background-color
-  $tab-inactive-hover-color: darken($light-gray, 5%)
-  $tab-mode: $breezeblocks-medium-screen
-  +clearfix
-  border: $tab-border
-  border-radius: $breezeblocks-border-radius
-  margin-bottom: $breezeblocks-spacing
-  +media($tab-mode)
-    border: none
-
-  .tab
-    +media($tab-mode)
-      display: inline
-
-    &:first-child .tab-link
-      border-top-left-radius: $breezeblocks-border-radius
-      border-top-right-radius: $breezeblocks-border-radius
-    &:last-child .tab-link
-      border-bottom-left-radius: $breezeblocks-border-radius
-      border-bottom-right-radius: $breezeblocks-border-radius
-      +media($tab-mode)
-        border-bottom-left-radius: 0
-        border-bottom-right-radius: 0
-    .tab-link-type-system
-      background-color: transparent
-      border-bottom: 1px solid $tab-border-color
-      color: $dark-gray
-      display: block
-      font-size: 0.9em
-      font-weight: 200
-      letter-spacing: 0.6px
-      padding: ($breezeblocks-spacing / 2) ($gutter / 2)
-      text-align: center
-      +media($tab-mode)
-        display: inline-block
-        border-bottom: 0
-        border-top-left-radius: $breezeblocks-border-radius
-        border-top-right-radius: $breezeblocks-border-radius
-
-      &:hover
-        color: $breezeblocks-link-color
-      &:focus
-        outline: none
-    section
-      padding: $breezeblocks-spacing $gutter
-      background: $tab-content-background
-      display: none
-      overflow: hidden
-      padding: $breezeblocks-line-height $gutter
-      width: 100%
-      +media($tab-mode)
-        +border-bottom-radius($breezeblocks-border-radius)
-        border-top: $tab-border
-        float: left
-        left: 0
-        padding: ($breezeblocks-spacing / 2) $gutter
-
-      .tab-content
-        opacity: 0
-    &.js-is-active
-      border-bottom: $tab-border
-      +media($tab-mode)
-        border-bottom: 0
-
-      .tab-link-type-system
-        background-color: $tab-active-background
-        border-bottom: 0
-        +media($tab-mode)
-          background-color: $tab-active-background
-          border-bottom: 1px solid $tab-active-background
-          border: $tab-border
-          margin-bottom: -1px
-      section
-        display: block
-        .tab-content
-          +animation-name(fadeInAccordionTabsArticles)
-          +animation-duration(1s)
-          opacity: 1