html5input.css
1.99 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
/*!
* @package yii2-krajee-base
* @subpackage yii2-widget-activeform
* @author Kartik Visweswaran <kartikv2@gmail.com>
* @copyright Copyright © Kartik Visweswaran, Krajee.com, 2014 - 2015
* @version 1.7.7
*
* HTML 5 input styling for Twitter Bootstrap 3.0
* Covers color and range inputs
* Built for Yii Framework 2.0
* Author: Kartik Visweswaran
* Year: 2015
* For more Yii related demos visit http://demos.krajee.com
*/
.input-group-html5 {
width: 100% !important;
}
.input-group-html5 .input-group-addon {
width: auto;
padding: 5px 6px;
}
.input-group-html5 input[type="color"], .input-group-html5 input[type="range"] {
display: block;
padding: 0;
margin: 0;
border: none;
box-shadow: none;
background: none;
width: 100%;;
}
.input-group .addon-color {
padding: 2px;
}
.input-group-lg input[type="color"] {
height: 24px !important;
}
.input-group-sm input[type="color"] {
height: 14px !important;
}
.input-group-html5 .addon-range {
min-width: 50%;
}
.input-group-html5 .input-group-addon + .input-group-addon {
border-left: 0 !important;
}
.input-group-html5 .input-group-addon + .form-control {
border-left: 0 !important;
}
.input-group-html5 .input-group-addon:first-child {
border-right: 1px solid #ccc !important;
}
.input-group-html5 input[disabled] {
opacity: .65;
cursor: not-allowed;
}
.input-group-html5.kv-range-vertical {
float: left;
height: 200px;
width: 50px !important;
margin-right: 5px;
}
.input-group-html5.kv-range-vertical input.form-control {
height: 214px;
width: 40px;
padding: 0 3px;
line-height: 0;
text-align: center;
}
.input-group-html5.kv-range-vertical input[type=range] {
writing-mode: bt-lr; /* IE */
-webkit-appearance: slider-vertical; /* WebKit */
width: 8px !important;
height: 200px;
}
.input-group-html5.kv-range-vertical .input-group-addon,
.input-group-html5.input-group-sm .input-group-addon {
padding: 2px 10px;
}