static/src/css/pos.css

   1 /* NOTE: adapted from openerp/addons/point_of_sale/static/src/css/pos.css */
   2
   3 /*  ********* The partner list  ********* */
   4
   5 .point-of-sale .partner-list {
   6     padding:10px !important;
   7 }
   8
   9 .point-of-sale .partner-list-scroller{
  10     -webkit-box-sizing: border-box;
  11        -moz-box-sizing: border-box;
  12         -ms-box-sizing: border-box;
  13             box-sizing: border-box;
  14     width:100%;
  15     height:100%;
  16     overflow: hidden;
  17 }
  18 .point-of-sale .partner-list-container {
  19     position:absolute;
  20     top:0px;
  21     bottom:0px;
  22     left:0px;
  23     right:0px;
  24 }
  25
  26 /*  a) the search box */
  27
  28 .point-of-sale #partners-screen .searchbox {
  29     position: absolute;
  30     right: 2px;
  31 }
  32 .point-of-sale #partners-screen .searchbox input {
  33     width: 130px;
  34     border-radius: 11px;
  35     border: 1px solid #cecbcb;
  36     padding: 3px 19px;
  37     margin: 6px;
  38     background: url("../img/search.png") no-repeat 5px;
  39     background-color: white;
  40 }
  41 .point-of-sale #partners-screen .search-clear {
  42     position: absolute;
  43     top: 11px;
  44     right: 11px;
  45     cursor: pointer;
  46     display: none;
  47 }
  48
  49 .point-of-sale #partners-screen .search-create {
  50     position: absolute;
  51     top: 6px;
  52     right: 22px;
  53     cursor: pointer;
  54     display: none;
  55 }
  56
  57
  58 /*  b) the partner */
  59
  60 .point-of-sale .partner {
  61     position:relative;
  62     vertical-align: top;
  63     display: inline-block;
  64     line-height: 100px;
  65     font-size: 11px;
  66     margin: 5px !important;
  67     width: 120px;
  68     height:120px;
  69     background:#fff;
  70     border: 1px solid #fff;
  71     border-radius: 3px;
  72     -webkit-box-shadow: 0px 2px 0px #dad8e4, 0px 1px 8px #636480;
  73        -moz-box-shadow: 0px 2px 0px #dad8e4, 0px 1px 8px #636480;
  74             box-shadow: 0px 2px 0px #dad8e4, 0px 1px 8px #636480;
  75 }
  76
  77 .point-of-sale .partner .partner-img {
  78     position: relative;
  79     width: 120px;
  80     height: 100px;
  81     background: white;
  82     text-align: center;
  83 }
  84
  85 .point-of-sale .partner .partner-img img {
  86     max-height: 100px;
  87     max-width:  120px;
  88 }
  89
  90 .point-of-sale .partner .price-tag {
  91     position: absolute;
  92     top: 2px;
  93     right: 2px;
  94     vertical-align: top;
  95     color: white;
  96     line-height: 13px;
  97     background: #7f82ac;
  98     padding: 2px 5px;
  99     border-radius: 3px;
 100     box-shadow: 0px 1px 0px #9A9CC5, 0px 3px 0px #7E86AC, 0px 3px 3px rgba(12, 14, 68, 0.67);
 101 }
 102
 103 .point-of-sale .partner .partner-name {
 104     position: absolute;
 105     -webkit-box-sizing: border-box;
 106        -moz-box-sizing: border-box;
 107         -ms-box-sizing: border-box;
 108             box-sizing: border-box;
 109     bottom:0;
 110     top:auto;
 111     line-height: 14px;
 112     width:100%;
 113     background: -webkit-linear-gradient(-90deg,rgba(255,255,255,0),rgba(255,255,255,1), rgba(255,255,255,1));
 114     background:    -moz-linear-gradient(-90deg,rgba(255,255,255,0),rgba(255,255,255,1), rgba(255,255,255,1));
 115     background:     -ms-linear-gradient(-90deg,rgba(255,255,255,0),rgba(255,255,255,1), rgba(255,255,255,1));
 116     /* troublesome in latest webkit
 117     background:         linear-gradient(-90deg,rgba(255,255,255,0),rgba(255,255,255,1), rgba(255,255,255,1));
 118     */
 119     /*background:#FFF;*/
 120     padding: 3px;
 121     padding-top:15px;
 122 }
 123
 124 /*  c) the partner creation */
 125
 126 .point-of-sale .pos-step-container {
 127     display: inline-block;
 128     font-size: 1.5em;
 129 }
 130 .point-of-sale .greyed-out{
 131     color: #AAA;
 132 }
 133 .point-of-sale .pos-step-container input{
 134     font-size: 1em;
 135     outline: none;
 136     border: none;
 137     padding: 0px 8px;
 138     padding-top: 8px;
 139     margin-left: 16px;
 140     border-radius: 5px;
 141     background: white;
 142     box-shadow: 0px -1px 0px #E2E2E2 inset,0px 1px 0px white inset, 0px 4px 0px #DDD inset, 0px 4px 8px rgba(0, 0, 0, 0.55) inset;
 143     color: #4c4c4c;
 144     -webkit-animation: all 250ms linear;
 145 }
 146
 147 .point-of-sale .pos-step-container input:focus{
 148     box-shadow: 0px -1px 0px #C9CFFD inset,0px 1px 0px #B8C8FC inset, 0px 4px 0px #9FD5FF inset, 0px 4px 9px rgba(0, 31, 255, 0.55) inset;
 149     color: #5d7ad6;
 150     -webkit-animation: all 250ms linear;
 151 }
 152
 153 .point-of-sale .pos-partner-create-container {
 154     text-align: left;
 155     min-width: 500px;
 156     margin-top: 50px;
 157     padding: 40px;
 158     background-color: #f8f8f8;
 159     border-radius: 4px;
 160     box-shadow: 0px 1px 0px white,0px -1px 0px white, 0px 4px 0px #DFDFDF, 0px 10px 30px rgba(0, 0, 0, 0.21);
 161 }
 162 .point-of-sale .pos-partner-create-container .left-block{
 163     display: inline-block;
 164     width:49%;
 165     margin:0;
 166     padding:0;
 167     text-align:left;
 168 }
 169 .point-of-sale .pos-partner-create-container .header{
 170     margin-top: 0px;
 171     margin-bottom:20px;
 172     font-weight: bold;
 173 }
 174 .point-of-sale .pos-partner-create-container .infoline{
 175     margin-top:5px;
 176     margin-bottom:5px;
 177 }
 178 .point-of-sale .pos-partner-create-container .right-block{
 179     display: inline-block;
 180     width:49%;
 181     margin:0;
 182     padding:0;
 183     text-align:right;
 184 }
 185 .point-of-sale .pos-partner-create-container table {
 186     width: 100%;
 187     margin-bottom: 20px;
 188 }
 189 .point-of-sale .pos-partner-create-container td {
 190     vertical-align: middle;
 191 }
 192 .point-of-sale .pos-partner-create-container .partner-createline-type {
 193     font-size: 1em;
 194     font-weight: bold;
 195     margin-right:10px;
 196 }