]> git.proxmox.com Git - extjs.git/blame - extjs/modern/theme-cupertino/sass/src/field/Field.scss
add extjs 6.0.1 sources
[extjs.git] / extjs / modern / theme-cupertino / sass / src / field / Field.scss
CommitLineData
6527f429
DM
1/**\r
2 * @class Ext.field.Field\r
3 */\r
4\r
5// Private variables\r
6$form-clear-size: 2.2em;\r
7\r
8@mixin checkmark($color: $ios7-blue) {\r
9 @extend .x-checkmark-base;\r
10 color: $color;\r
11}\r
12\r
13.x-checkmark-base {\r
14 position: absolute;\r
15 top: 0;\r
16 right: 12px;\r
17 bottom: 0;\r
18 content: '3';\r
19 // TODO: Use FontAwesome\r
20 font-family: 'Pictos';\r
21 font-size: 1.3em;\r
22 text-align: right;\r
23 line-height: 2.1em;\r
24}\r
25\r
26.x-field {\r
27 min-height: $form-field-height;\r
28 background: #fff;\r
29\r
30 &:last-child {\r
31 border-bottom: 0;\r
32 }\r
33}\r
34\r
35.x-field-input {\r
36 .x-clear-icon {\r
37 background: get-image-url('clear_icon') no-repeat;\r
38 background-position: center center;\r
39 background-size: 55% 55%;\r
40 width: $form-clear-size;\r
41 height: $form-clear-size;\r
42 margin: .5em;\r
43 margin-top: -($form-clear-size/2);\r
44 right: -.5em;\r
45 }\r
46\r
47 border: 1px solid #cccccc;\r
48 border-radius: 5px;\r
49 background-color: #fff;\r
50}\r
51\r
52.x-field-clearable {\r
53 .x-field-input {\r
54 padding-right: $form-clear-size;\r
55 }\r
56}\r
57\r
58.x-input-el {\r
59 background: transparent;\r
60 padding: .7em .4em .4em .4em;\r
61 min-height: $form-field-height;\r
62 border-width: 0;\r
63 -webkit-appearance: none;\r
64}\r
65\r
66.x-ie .x-input-el {\r
67 background: transparent;\r
68}\r
69\r
70.x-item-disabled {\r
71 .x-form-label,\r
72 input,\r
73 .x-input-el,\r
74 .x-spinner-body,\r
75 select,\r
76 textarea,\r
77 .x-field-clear-container {\r
78 color: #b3b3b3;\r
79 pointer-events: none;\r
80 }\r
81}\r
82\r
83.x-item-disabled .x-form-label {\r
84 color: #aaa;\r
85}\r
86\r
87.x-item-disabled .x-form-label:after {\r
88 color: #666 !important;\r
89}\r
90\r
91.x-toolbar {\r
92 .x-field {\r
93 background: transparent;\r
94\r
95 .x-component-outer {\r
96 padding: .4em .6em 0;\r
97 }\r
98\r
99 .x-input-el {\r
100 padding: .3em .6em;\r
101 min-height: 1.4em;\r
102 background: transparent;\r
103 }\r
104 }\r
105\r
106 .x-field-input {\r
107 position: relative;\r
108 background: #fff;\r
109 }\r
110\r
111 .x-field-clearable .x-field-input {\r
112 padding-right: 0;\r
113 }\r
114\r
115 .x-clear-icon {\r
116 position: absolute;\r
117 top: .9em;\r
118 right: -.7em;\r
119 }\r
120}