compass-jquery-plugin 0.2.4.5 → 0.2.4.99

data/templates/jqtouch/jqtouch/apple.sass

@@ -0,0 +1,651 @@
+// Generated by compass-jquery-plugin/gem-tasks/jqtouch.rake
+
+body
+  background: rgb(0,0,0)
+
+  > *
+    background: rgb(197,204,211) url("/images/jqtouch/apple/pinstripes.png")
+
+
+h1, h2
+  font: bold 18px Helvetica
+  text-shadow: rgba(255,255,255,.2) 0 1px 1px
+  color: rgb(76, 86, 108)
+  margin: 10px 20px 6px
+
+
+.toolbar
+  -webkit-box-sizing: border-box
+  border-bottom: 1px solid #2d3642
+  padding: 10px
+  height: 45px
+  background: url("/images/jqtouch/apple/toolbar.png") #6d84a2 repeat-x
+  position: relative
+
+
+.black-translucent .toolbar
+  margin-top: 20px
+
+
+.toolbar > h1
+  position: absolute
+  overflow: hidden
+  left: 50%
+  top: 10px
+  line-height: 1em
+  margin: 1px 0 0 -75px
+  height: 40px
+  font-size: 20px
+  width: 150px
+  font-weight: bold
+  text-shadow: rgba(0, 0, 0, 0.4) 0px -1px 0
+  text-align: center
+  text-overflow: ellipsis
+  white-space: nowrap
+  color: #fff
+
+
+body.landscape .toolbar > h1
+  margin-left: -125px
+  width: 250px
+
+
+.button, .back, .cancel, .add
+  position: absolute
+  overflow: hidden
+  top: 8px
+  right: 6px
+  margin: 0
+  border-width: 0 5px
+  padding: 0 3px
+  width: auto
+  height: 30px
+  line-height: 30px
+  font-family: inherit
+  font-size: 12px
+  font-weight: bold
+  color: #fff
+  text-shadow: rgba(0, 0, 0, 0.5) 0px -1px 0
+  text-overflow: ellipsis
+  text-decoration: none
+  white-space: nowrap
+  background: none
+  -webkit-border-image: url("/images/jqtouch/apple/toolButton.png") 0 5 0 5
+
+
+.button.active, .back.active, .cancel.active, .add.active
+  -webkit-border-image: url("/images/jqtouch/apple/toolButton.png") 0 5 0 5
+
+
+.blueButton
+  -webkit-border-image: url("/images/jqtouch/apple/blueButton.png") 0 5 0 5
+  border-width: 0 5px
+
+
+.back
+  left: 6px
+  right: auto
+  padding: 0
+  max-width: 55px
+  border-width: 0 8px 0 14px
+  -webkit-border-image: url("/images/jqtouch/apple/backButton.png") 0 8 0 14
+
+
+.leftButton, .cancel
+  left: 6px
+  right: auto
+
+
+.add
+  font-size: 24px
+  line-height: 24px
+  font-weight: bold
+
+
+.whiteButton, .grayButton
+  display: block
+  border-width: 0 12px
+  padding: 10px
+  text-align: center
+  font-size: 20px
+  font-weight: bold
+  text-decoration: inherit
+  color: inherit
+
+
+.whiteButton
+  -webkit-border-image: url("/images/jqtouch/apple/whiteButton.png") 0 12 0 12
+  text-shadow: rgba(255, 255, 255, 0.7) 0 1px 0
+
+
+.grayButton
+  -webkit-border-image: url("/images/jqtouch/apple/grayButton.png") 0 12 0 12
+  color: #FFFFFF
+
+
+h1 + ul, h2 + ul, h3 + ul, h4 + ul, h5 + ul, h6 + ul
+  margin-top: 0
+
+
+ul
+  color: black
+  background: #fff
+  border: 1px solid #B4B4B4
+  font: bold 17px Helvetica
+  padding: 0
+  margin: 15px 10px 17px 10px
+  -webkit-border-radius: 8px
+
+  li
+    color: #666
+    border-top: 1px solid #B4B4B4
+    list-style-type: none
+    padding: 10px 10px 10px 10px
+
+
+li
+  &:first-child
+    border-top: 0
+    -webkit-border-top-left-radius: 8px
+    -webkit-border-top-right-radius: 8px
+
+    a
+      border-top: 0
+      -webkit-border-top-left-radius: 8px
+      -webkit-border-top-right-radius: 8px
+
+  &:last-child
+    -webkit-border-bottom-left-radius: 8px
+    -webkit-border-bottom-right-radius: 8px
+
+    a
+      -webkit-border-bottom-left-radius: 8px
+      -webkit-border-bottom-right-radius: 8px
+
+
+ul li.arrow
+  background-image: url("/images/jqtouch/apple/chevron.png")
+  background-position: right center
+  background-repeat: no-repeat
+
+
+#plastic ul li.arrow, #metal ul li.arrow
+  background-image: url(../images/chevron_dg.png")
+  background-position: right center
+  background-repeat: no-repeat
+
+
+ul li a, li.img a + a
+  color: #000
+  text-decoration: none
+  text-overflow: ellipsis
+  white-space: nowrap
+  overflow: hidden
+  display: block
+  padding: 12px 10px 12px 10px
+  margin: -10px
+  -webkit-tap-highlight-color: rgba(0,0,0,0)
+
+
+ul
+  li
+    a
+      &.active
+        background: #194fdb url("/images/jqtouch/apple/selection.png") 0 0 repeat-x
+        color: #fff
+
+      &.button
+        background-color: #194fdb
+        color: #fff
+
+    &.img a +
+      a
+        margin: -10px 10px -20px -5px
+        font-size: 17px
+        font-weight: bold
+
+        + a
+          font-size: 14px
+          font-weight: normal
+          margin-left: -10px
+          margin-bottom: -10px
+          margin-top: 0
+
+      small + a
+        margin-left: -5px
+
+        + a
+          margin-left: -10px
+          margin-top: -20px
+          margin-bottom: -10px
+          font-size: 14px
+          font-weight: normal
+
+          + a
+            margin-left: 0px !important
+            margin-bottom: 0
+
+    a + a
+      color: #000
+      font: 14px Helvetica
+      text-overflow: ellipsis
+      white-space: nowrap
+      overflow: hidden
+      display: block
+      margin: 0
+      padding: 0
+
+      + a
+        color: #666
+        font: 13px Helvetica
+        margin: 0
+        text-overflow: ellipsis
+        white-space: nowrap
+        overflow: hidden
+        display: block
+        padding: 0
+
+    &.img a +
+      a + a + a, small + a + a + a
+        color: #666
+        font: 13px Helvetica
+        margin: 0
+        text-overflow: ellipsis
+        white-space: nowrap
+        overflow: hidden
+        display: block
+        padding: 0
+
+  &.form li
+    padding: 7px 10px
+
+    &.error
+      border: 2px solid red
+
+      + li.error
+        border-top: 0
+
+    &:hover
+      background: #fff
+
+  li
+    input
+      &[type="text"], &[type="password"]
+        color: #777
+        background: #fff url(../.png)
+        border: 0
+        font: normal 17px Helvetica
+        padding: 0
+        display: inline-block
+        margin-left: 0px
+        width: 100%
+        -webkit-appearance: textarea
+
+    textarea, select
+      color: #777
+      background: #fff url(../.png)
+      border: 0
+      font: normal 17px Helvetica
+      padding: 0
+      display: inline-block
+      margin-left: 0px
+      width: 100%
+      -webkit-appearance: textarea
+
+    textarea
+      height: 120px
+      padding: 0
+      text-indent: -2px
+
+    select
+      text-indent: 0px
+      background: transparent url(../images/chevron.png) no-repeat 103% 3px
+      -webkit-appearance: textfield
+      margin-left: -6px
+      width: 104%
+
+    input
+      &[type="checkbox"], &[type="radio"]
+        margin: 0
+        color: rgb(50,79,133)
+        padding: 10px 10px
+
+      &[type="checkbox"]:after, &[type="radio"]:after
+        content: attr(title)
+        font: 17px Helvetica
+        display: block
+        width: 246px
+        margin: -12px 0 0 17px
+
+
+.edgetoedge
+  margin: 0
+  padding: 0
+  background-color: rgb(255,255,255)
+
+  h4
+    color: #fff
+    background: rgb(154,159,170) url("/images/jqtouch/apple/listGroup.png") top left repeat-x
+    border-top: 1px solid rgb(165,177,186)
+    text-shadow: #666 0 1px 0
+    margin: 0
+    padding: 2px 10px
+
+
+.metal
+  margin: 0
+  padding: 0
+  background-color: rgb(255,255,255)
+
+
+.edgetoedge ul, .metal ul, .plastic ul
+  -webkit-border-radius: 0
+  margin: 0
+  border-left: 0
+  border-right: 0
+  border-top: 0
+
+
+.metal ul
+  border-top: 0
+  border-bottom: 0
+  background: rgb(180,180,180)
+
+
+.edgetoedge ul li
+  &:first-child, &:last-child
+    -webkit-border-radius: 0
+
+    a
+      -webkit-border-radius: 0
+
+
+.metal ul li
+  &:first-child a, &:last-child a
+    -webkit-border-radius: 0
+
+
+.edgetoedge
+  ul li small
+    font-size: 16px
+    line-height: 28px
+
+  li
+    -webkit-border-radius: 0
+
+
+.metal li
+  -webkit-border-radius: 0
+
+
+.edgetoedge
+  li em
+    font-weight: normal
+    font-style: normal
+
+  h4 + ul
+    border-top: 1px solid rgb(152,158,164)
+    border-bottom: 1px solid rgb(113,125,133)
+
+
+ul li
+  small
+    color: #369
+    font: 17px Helvetica
+    text-align: right
+    text-overflow: ellipsis
+    white-space: nowrap
+    overflow: hidden
+    display: block
+    width: 23%
+    float: right
+    padding: 3px 0px
+
+  &.arrow small
+    padding: 0 15px
+
+  small.counter
+    font-size: 17px !important
+    line-height: 13px !important
+    font-weight: bold
+    background: rgb(154,159,170)
+    color: #fff
+    -webkit-border-radius: 11px
+    padding: 4px 10px 5px 10px
+    display: inline !important
+    width: auto
+    margin-top: -22px
+
+  &.arrow small.counter
+    margin-right: 15px
+
+
+#plastic ul li.arrow, #metal ul li.arrow
+  background-image: url("/images/jqtouch/apple/listArrow.png")
+  background-position: right center
+  background-repeat: no-repeat
+
+
+.edgetoedge ul, .metal ul, .plastic ul
+  -webkit-border-radius: 0
+  margin: 0
+  border-left: 0
+  border-right: 0
+  border-top: 0
+
+
+.metal ul li
+  border-top: 1px solid rgb(238,238,238)
+  border-bottom: 1px solid rgb(156,158,165)
+  background: url(../images/bgMetal.png) top left repeat-x
+  font-size: 26px
+  text-shadow: #fff 0 1px 0
+
+  a
+    line-height: 26px
+    margin: 0
+    padding: 13px 0
+
+    &:hover
+      color: rgb(0,0,0)
+
+  &:hover small
+    color: inherit
+
+  a em
+    display: block
+    font-size: 14px
+    font-style: normal
+    color: #444
+    width: 50%
+    line-height: 14px
+
+  small
+    float: right
+    position: relative
+    margin-top: 10px
+    font-weight: bold
+
+  &.arrow
+    background: url(../images/bgMetal.png) top left repeat-x,
+    url(../images/chevron_dg.png) right center no-repeat
+
+    a small
+      padding-right: 0
+      line-height: 17px
+
+
+.plastic
+  margin: 0
+  padding: 0
+  background: rgb(173,173,173)
+
+  ul
+    -webkit-border-radius: 0
+    margin: 0
+    border-left: 0
+    border-right: 0
+    border-top: 0
+    background-color: rgb(173,173,173)
+
+    li
+      -webkit-border-radius: 0
+      border-top: 1px solid rgb(191,191,191)
+      border-bottom: 1px solid rgb(157,157,157)
+
+      &:nth-child(odd)
+        background-color: rgb(152,152,152)
+        border-top: 1px solid rgb(181,181,181)
+        border-bottom: 1px solid rgb(138,138,138)
+
+    + p
+      font-size: 11px
+      color: #2f3237
+      text-shadow: none
+      padding: 10px 10px
+
+      strong
+        font-size: 14px
+        line-height: 18px
+        text-shadow: #fff 0 1px 0
+
+    li
+      a
+        text-shadow: rgb(211,211,211) 0 1px 0
+
+      &:nth-child(odd) a
+        text-shadow: rgb(191,191,191) 0 1px 0
+
+      small
+        color: #3C3C3C
+        text-shadow: rgb(211,211,211) 0 1px 0
+        font-size: 13px
+        font-weight: bold
+        text-transform: uppercase
+        line-height: 24px
+
+
+#plastic ul
+  &.minibanner
+    margin: 10px
+    border: 0
+    height: 81px
+    clear: both
+
+  &.bigbanner
+    margin: 10px
+    border: 0
+    height: 81px
+    clear: both
+    height: 140px !important
+
+  &.minibanner li
+    border: 1px solid rgb(138,138,138)
+    background-color: rgb(152,152,152)
+    width: 145px
+    height: 81px
+    float: left
+    -webkit-border-radius: 5px
+    padding: 0
+
+  &.bigbanner li
+    border: 1px solid rgb(138,138,138)
+    background-color: rgb(152,152,152)
+    width: 296px
+    height: 140px
+    float: left
+    -webkit-border-radius: 5px
+    padding: 0
+    margin-bottom: 4px
+
+  &.minibanner li
+    &:first-child
+      margin-right: 6px
+
+    a
+      color: transparent
+      text-shadow: none
+      display: block
+      width: 145px
+      height: 81px
+
+  &.bigbanner li a
+    color: transparent
+    text-shadow: none
+    display: block
+    width: 296px
+    height: 145px
+
+
+ul.individual
+  border: 0
+  background: none
+  clear: both
+  overflow: hidden
+
+  li
+    color: rgb(183,190,205)
+    background: white
+    border: 1px solid rgb(180,180,180)
+    font-size: 14px
+    text-align: center
+    -webkit-border-radius: 8px
+    -webkit-box-sizing: border-box
+    width: 48%
+    float: left
+    display: block
+    padding: 11px 10px 14px 10px
+
+    + li
+      float: right
+
+    a
+      color: rgb(50,79,133)
+      line-height: 16px
+      margin: -11px -10px -14px -10px
+      padding: 11px 10px 14px 10px
+      -webkit-border-radius: 8px
+
+      &:hover
+        color: #fff
+        background: #36c
+
+
+.toggle
+  width: 94px
+  position: relative
+  height: 27px
+  display: block
+  overflow: hidden
+  float: right
+
+  input[type="checkbox"]
+    -webkit-tap-highlight-color: rgba(0,0,0,0)
+    margin: 0
+    -webkit-border-radius: 5px
+    background: #fff url("/images/jqtouch/apple/on_off.png") 0 0 no-repeat
+    height: 27px
+    overflow: hidden
+    width: 149px
+    border: 0
+    -webkit-appearance: textarea
+    background-color: transparent
+    -webkit-transition: left .15s
+    position: absolute
+    top: 0
+    left: -55px
+
+    &:checked
+      left: 0px
+
+
+.info
+  background: #dce1eb
+  font-size: 12px
+  line-height: 16px
+  text-align: center
+  text-shadow: rgba(255,255,255,.8) 0 1px 0
+  color: rgb(76, 86, 108)
+  padding: 15px
+  border-top: 1px solid rgba(76, 86, 108, .3)
+  font-weight: bold

data/templates/jqtouch/jqtouch/iphone-emulator.sass

@@ -0,0 +1,17 @@
+// Generated by compass-jquery-plugin/gem-tasks/jqtouch.rake
+
+.iphone .emulator
+  background: url("/images/jqtouch/iphone_fullsize.png") no-repeat
+  width: 416px
+  height: 754px
+
+  .display-area
+    position: relative
+    top: 152px
+    width: 320px
+    height: 460px
+    max-height: 460px
+    color: #ffffff
+
+    a
+      color: #ff5500