curo-material-interface 0.0.3 → 0.0.4

data/lib/assets/stylesheets/cmi/components/_loading-indicator.sass

@@ -19,23 +19,23 @@
     left: 50%
     top: 50%
     margin: ($loading-diameter * -0.5) 0 0 ($loading-diameter * -0.5)
-  .circular
+  .cmi-circular
     position: relative
     height: $loading-diameter
     width: $loading-diameter
-    +animation(cumaLoadingRotate 2s linear infinite)
-  .path
+    +animation(cmiLoadingRotate 2s linear infinite)
+  .cmi-path
     stroke-dasharray: 1, 200
     stroke-dashoffset: 0
     stroke-linecap: round
     stroke: $loading-color
-    +animation(cumaLoadingDash 1.5s ease-in-out infinite)
+    +animation(cmiLoadingDash 1.5s ease-in-out infinite)
 
-+keyframes(cumaLoadingRotate)
++keyframes(cmiLoadingRotate)
   100%
     +transform(rotate(360deg))
 
-+keyframes(cumaLoadingDash)
++keyframes(cmiLoadingDash)
   0%
     stroke-dasharray: 1, 200
     stroke-dashoffset: 0

data/lib/assets/stylesheets/cmi/components/_navbar.sass

@@ -3,7 +3,7 @@
   z-index: 1
   margin-bottom: 5px
   background-color: #fff
-  +box-shadow(0px 4px 4px -2px rgba(#000, 0.3))
+  +cmi-box-shadow(0px 4px 4px -2px rgba(#000, 0.3))
   &.cmi-navbar-padding
     padding: 1rem
   & + .cmi-navbar-alert
@@ -12,11 +12,11 @@
     margin: -5px 0 5px 0
     padding: 15px 15px 10px 15px
     background-color: rgba(#000, 0.03)
-    +box-shadow(inset 0px -5px 3px -5px rgba(#000, 0.3))
-    p
+    +cmi-box-shadow(inset 0px -5px 3px -5px rgba(#000, 0.3))
+    .cmi-p
       margin: 0 0 5px 0
       font-size: 0.75rem
       color: #333
     &.cmi-navbar-alert-danger
-      p
-        color: #c00
+      .cmi-p
+        color: #c00

data/lib/assets/stylesheets/cmi/components/_ripples.sass

@@ -1,26 +1,25 @@
-.cmi
-  .cmi-ripples,
-  .cmi-ripples-standalone
-    .cmi-ink
-      position: absolute
-      display: block
-      transform: scale(0)
-      background: $ripples-color-default
-      opacity: 1
-      +border-radius(100%)
-      &.cmi-animate
-        +animation(cmiRipple 0.4s linear)
+.cmi-ripples,
+.cmi-ripples-standalone
+  .cmi-ink
+    position: absolute
+    display: block
+    transform: scale(0)
+    background: $ripples-color-default
+    opacity: 1
+    +cmi-border-radius(100%)
+    &.cmi-animate
+      +animation(cmiRipple 0.4s linear)
 
-    &.cmi-ripples-dark
-      .cmi-ink
-        background: $ripples-color-dark
+  &.cmi-ripples-dark
+    .cmi-ink
+      background: $ripples-color-dark
 
-    &.cmi-ripples-primary
-      .cmi-ink
-        background: $ripples-color-primary
+  &.cmi-ripples-primary
+    .cmi-ink
+      background: $ripples-color-primary
 
 
 +keyframes(cmiRipple)
   100%
     opacity: 0
-    +transform(scale(2.5))
+    +transform(scale(2.5))

data/lib/assets/stylesheets/cmi/components/_tabs.sass

@@ -6,7 +6,7 @@
   font-size: 16px
   font-size: 1rem
   +clearfix
-  a
+  .cmi-a
     display: block
     padding: 0.8rem 1em 0.7rem 1em
     font-size: 0.875em
@@ -17,14 +17,14 @@
     &:hover
       text-decoration: none
       background-color: $tabs-color-hover-bg
-  li
+  .cmi-li
     position: relative
     overflow: hidden
     float: left
-  li.cmi-tabs-active
-    a
+  .cmi-li.cmi-tabs-active
+    .cmi-a
       color: $tabs-color-link-active
-  li.cmi-tabs-active-indicator
+  .cmi-li.cmi-tabs-active-indicator
     position: absolute
     float: none
     height: 3px

data/lib/assets/stylesheets/cmi/form_components/_checkbox.sass

@@ -6,7 +6,7 @@
   font-size: 14px
   font-size: 0.875rem
   +backface-visibility(hidden)
-  label
+  .cmi-label
     position: relative
     display: inline-block
     max-width: 100%
@@ -18,15 +18,15 @@
     cursor: pointer
     vertical-align: top
     +user-select(none)
-  input[type="checkbox"]
+  .cmi-input[type="checkbox"]
     position: absolute
     opacity: 0
     visibility: hidden
     margin-left: -9999px
-  span
+  .cmi-span
     left: 0px
     +transition-duration(0.2s)
-  span.cmi-animation
+  .cmi-span.cmi-animation
     position: absolute
     display: block
     overflow: hidden
@@ -39,8 +39,8 @@
     visibility: hidden
     opacity: 0
     background-color: rgba(#000, 0.07)
-    +border-radius(100%)
-  span.cmi-checkbox
+    +cmi-border-radius(100%)
+  .cmi-span.cmi-checkbox
     position: relative
     display: inline-block
     overflow: hidden
@@ -50,7 +50,7 @@
     top: 3px
     margin-right: 11px
     border: 2px solid rgba(#000, 0.5)
-    +border-radius(2px)
+    +cmi-border-radius(2px)
     &:before
       position: relative
       content: "\e899"
@@ -61,12 +61,12 @@
       line-height: 15px
       color: #fff
   &.cmi-valid
-    label
+    .cmi-label
       color: $checkbox-color-valid
   &.cmi-invalid
-    label
+    .cmi-label
       color: $checkbox-color-invalid
-  p.cmi-hint
+  p.cmi-hint, .cmi-p.cmi-hint
     margin: 0 0 0 40px
     font-size: 0.86em
     color: $checkbox-color-hint
@@ -74,14 +74,14 @@
       color: $checkbox-color-valid
     &.cmi-invalid
       color: $checkbox-color-invalid
-  label:hover
+  .cmi-label:hover
     .cmi-animation
       visibility: visible
       opacity: 1
       +transition(all 0.1s linear)
   &.cmi-active
-    span.cmi-checkbox
+    .cmi-span.cmi-checkbox
       border-color: $checkbox-color-check
       background-color: $checkbox-color-check
-    span.cmi-checkbox:before
+    .cmi-span.cmi-checkbox:before
       font-size: 15px

data/lib/assets/stylesheets/cmi/form_components/_text_field.sass

@@ -3,7 +3,7 @@
   margin: 1.25rem 0 1.5rem 0
   font-size: 14px
   font-size: 0.875rem
-  label
+  .cmi-label
     position: absolute
     left: 0
     font-size: 1em
@@ -11,23 +11,23 @@
     pointer-events: none
     cursor: text
     +transition(.2s ease-out all)
-  input
+  .cmi-input
     font-size: 1em
     height: 2em
     padding: 0
-    + label
+    + label, + .cmi-label
       top: 0.3em
-  textarea
+  .cmi-textarea
     width: 100%
     min-height: 2rem
     padding: 0.6em 0 0.7em 0
     font-size: 1em
     background-color: transparent
     overflow: hidden
-    + label
+    + label, .cmi-label
       top: 0.5em
   &.cmi-growing-textarea
-    textarea
+    .cmi-textarea
       resize: none
       +transition(height 0.05s ease)
   .cmi-hidden-textarea-reference
@@ -36,65 +36,65 @@
     top: 9999px
     left: 9999px
 
-  input,
-  textarea
+  .cmi-input,
+  .cmi-textarea
     background-color: transparent
     border: none
     border-bottom: 1px solid $input-color-border
     outline: none
     width: 100%
     margin: 0
-    +box-shadow(none)
+    +cmi-box-shadow(none)
     +box-sizing(content-box)
     +transition(border-bottom .3s ease)
     &:focus
       border-bottom: 1px solid $input-color-focus
-      +box-shadow(0 1px 0 0 $input-color-focus)
+      +cmi-box-shadow(0 1px 0 0 $input-color-focus)
 
   &.cmi-active,
-  input:focus,
-  textarea:focus
-    label
+  .cmi-input:focus,
+  .cmi-textarea:focus
+    .cmi-label
       top: 0
       font-size: 0.8125em
       font-weight: 300
       +transform(translateY(-80%))
 
   &.cmi-active
-    label
+    .cmi-label
       color: color("grey", "base")
 
-  input:focus,
-  textarea:focus
-    + label
+  .cmi-input:focus
+  .cmi-textarea:focus
+    + .cmi-label
       color: $input-color-focus
 
   &.cmi-valid
-    label
+    .cmi-label
       color: $input-color-valid
-    input,
-    textarea
+    .cmi-input,
+    .cmi-textarea
       border-bottom: 1px solid $input-color-valid
-      +box-shadow(0 1px 0 0 $input-color-valid)
+      +cmi-box-shadow(0 1px 0 0 $input-color-valid)
 
   &.cmi-invalid
-    label
+    .cmi-label
       color: $input-color-invalid
-    input,
-    textarea
+    .cmi-input,
+    .cmi-textarea
       border-bottom: 1px solid $input-color-invalid
-      +box-shadow(0 1px 0 0 $input-color-invalid)
+      +cmi-box-shadow(0 1px 0 0 $input-color-invalid)
 
   // hints
-  p.cmi-hint
+  .cmi-p.cmi-hint
     margin: 3px 0 0 0
     font-size: 0.85em
     font-weight: 300
     text-align: right
     color: color("grey", "lighten-1")
-  p.cmi-hint.cmi-valid
+  .cmi-p.cmi-hint.cmi-valid
     color: $input-color-valid
-  p.cmi-hint.cmi-invalid
+  .cmi-p.cmi-hint.cmi-invalid
     color: $input-color-invalid
 
 

data/lib/curo_material_interface/version.rb

@@ -1,3 +1,3 @@
 module CuroMaterialInterface
-  VERSION = "0.0.3"
+  VERSION = "0.0.4"
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: curo-material-interface
 version: !ruby/object:Gem::Version
-  version: 0.0.3
+  version: 0.0.4
 platform: ruby
 authors:
 - Sascha Hillig
@@ -10,7 +10,7 @@ authors:
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2015-04-20 00:00:00.000000000 Z
+date: 2015-05-16 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: sass