src/themes/tizen/common/jquery.mobile.tizen.notification.less

   1 @import "config.less";
   2
   3 /* tickernoti */
   4
   5 @ticker-height: 100px;
   6
   7 @-webkit-keyframes ui-ticker-show {
   8         from {
   9                 opacity: 0;
  10                 -webkit-transform: translateY(-@ticker-height);
  11                 top: -@ticker-height;
  12         } to {
  13                 opacity: 1;
  14                 -webkit-transform: translateY(0);
  15                 top: 0;
  16         }
  17 }
  18
  19 @-webkit-keyframes ui-ticker-hide {
  20         from {
  21                 opacity: 1;
  22                 -webkit-transform: translateY(0);
  23                 top: 0;
  24         } to {
  25                 opacity: 0;
  26                 -webkit-transform: translateY(-@ticker-height);
  27                 top: -@ticker-height;
  28         }
  29 }
  30
  31 .ui-ticker {
  32         position: fixed;
  33         display: none;
  34         left: 0;
  35         width: 100%;
  36         height: @ticker-height;
  37         z-index: @z_base_tickernoti;
  38         background: @color_ticker_bg;
  39 }
  40
  41 .ui-ticker.fix{
  42         display: block;
  43 }
  44
  45 .ui-ticker.show {
  46         display: block;
  47         -webkit-animation: ui-ticker-show 0.8s 1 ease;
  48         top: 0px;
  49 }
  50
  51 .ui-ticker.hide {
  52         display: block;
  53         -webkit-animation: ui-ticker-hide 0.8s 1 ease;
  54         top: -@ticker-height;
  55 }
  56
  57 .ui-ticker-btn {
  58         position: relative;
  59         height: 54px;
  60         margin-top: 23px;
  61         margin-left: 16px;
  62         margin-right: 16px;
  63         vertical-align: middle;
  64         float: right;
  65
  66         .ui-btn-inner {
  67                 padding: 0.3em 0.7em;
  68         }
  69 }
  70
  71 .ui-ticker-icon {
  72         position: absolute;
  73         top: 0;
  74         height: 64px;
  75         width: 64px;
  76         margin-top: 18px;
  77         margin-bottom: 18px;
  78         margin-left: 16px;
  79         margin-right: 16px;
  80         vertical-align: middle;
  81
  82         /* FIXME: please fix this image file */
  83         background: url(images/00_button_call.png) no-repeat;
  84 }
  85
  86 .ui-ticker-text1-bg {
  87         position: absolute;
  88         top: 0;
  89         height: 28px;
  90         left: 96px;
  91         margin-top: 20px;
  92         font-size: 0.8em;
  93         color: @color_ticker_text1;
  94 }
  95
  96 .ui-ticker-text2-bg {
  97         position: absolute;
  98         top: 0;
  99         height: 32px;
 100         left: 96px;
 101         margin-top: 48px;
 102         color: @color_ticker_text2;
 103 }
 104
 105 /* smallpopup */
 106
 107 @smallpopup-height: 48px;
 108
 109 @-webkit-keyframes ui-smallpopup-show {
 110         from {
 111                 opacity: 0;
 112                 -webkit-transform: scaleY(0);
 113         } to {
 114                 opacity: 1;
 115                 -webkit-transform: scaleY(1);
 116         }
 117 }
 118
 119 @-webkit-keyframes ui-smallpopup-hide {
 120         from {
 121                 opacity: 1;
 122                 height: @smallpopup-height;
 123                 left: 0;
 124                 -webkit-transform: scaleY(1);
 125         } to {
 126                 opacity: 0;
 127                 height: 0;
 128                 left: 0;
 129                 -webkit-transform: scaleY(0);
 130         }
 131 }
 132
 133 .ui-smallpopup {
 134         position: fixed;
 135         display: none;
 136         top: 0;
 137         left: 0;
 138         width: 100%;
 139         height: @smallpopup-height;
 140         z-index: @z_base_smallpopup;
 141         background: @color_smallpopup_bg;
 142         vertical-align: middle;
 143 }
 144
 145 .ui-smallpopup.fix {
 146         display: block;
 147 }
 148
 149 .ui-smallpopup.show {
 150         display: block;
 151
 152         -webkit-animation: ui-smallpopup-show 0.5s 1 ease;
 153 }
 154
 155 .ui-smallpopup.hide {
 156         display: block;
 157         left: -100%;
 158
 159         -webkit-animation: ui-smallpopup-hide 0.5s 1 ease;
 160 }
 161
 162 .ui-smallpopup-text-bg {
 163         position: relative;
 164         margin-top: 6px;
 165         margin-left: 16px;
 166         color: @color_smallpopup_text;
 167 }