forked from AndrewRayCode/Bash-Prompt-Builder
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathFunForms.css
106 lines (95 loc) · 6.62 KB
/
FunForms.css
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
93
94
95
96
97
98
99
100
101
102
103
104
105
106
.fun-checkbox {display:inline-block; width:12px; height:12px; border:1px solid #9e9fa1; border-bottom:1px solid #888; border-top:1px solid #bbb; border-radius:3px; -webkit-box-shadow:2px 2px 2px #ddd, inset 0 0 2px #686c77box-shadow:2px 2px 2px #ddd, inset 0 0 2px #686c77; cursor:pointer;
background:-moz-linear-gradient(top, #bbc0ca 0%, #d2d5dc 100%);
background:-webkit-linear-gradient(top, #bbc0ca 0%,#d2d5dc 100%);
background:linear-gradient(top, #bbc0ca 0%,#d2d5dc 100%);}
.fun-checkbox.checked:after {content:'✓'; text-shadow:0 0 1px #fff; opacity:0.8; color:#aa3037; position:absolute; top:-4px; left:2px; cursor:pointer;}
.fun-checkbox.checked {position:relative;
background:-webkit-radial-gradient(circle, #feddd7, #fec3cd);
background:-moz-radial-gradient(circle, #feddd7, #fec3cd);
-webkit-box-shadow:0 0 5px #FFA2A2, 1px 1px 2px #daaac3, inset 0 0 2px red;
box-shadow:0 0 5px #FFA2A2, 1px 1px 2px #daaac3, inset 0 0 2px red; }
input[type="text"] {border:1px solid #aaa; padding:4px; font-family:serif; font-size:12pt; color:#666; -webkit-box-shadow:2px 2px 3px #ccc; box-shadow:2px 2px 3px #ccc;
background:-moz-linear-gradient(top, #e0e0e0 0%, #fff 40%);
background:-webkit-linear-gradient(top, #e0e0e0 10%,#fff 100%);
background:linear-gradient(top, #e0e0e0 10%,#fff 100%);}
input[type="text"]:focus {border:1px solid #dd8888; color:#444; -webkit-box-shadow:inset 0 0 2px #eed2d2, 2px 2px 4px #ffcccc; box-shadow:inset 0 0 2px #eed2d2, 2px 2px 4px #ffcccc;}
input[disabled] {color:#555;
background:-moz-linear-gradient(top, #aaa 0%, #eee 40%);
background:-webkit-linear-gradient(top, #aaa 10%,#eee 100%);
background:linear-gradient(top, #aaa 10%,#eee 100%);}
.fun-picker {position:absolute; z-index:999999; background:#fff; border-radius:12px; -webkit-box-shadow:2px 2px 10px #666; box-shadow:2px 2px 10px #666; display:none;}
.fun-picker ul {border:1px solid #999; -webkit-box-shadow:1px 1px 3px #ccc; box-shadow:1px 1px 3px #ccc; border-radius:6px; float:left; margin:8px; padding:0; overflow:hidden; max-width:150px; border-right:0 none; border-bottom:0 none;}
.fun-picker ul li {float:left; display:block; padding:3px; border-right:1px solid #999; border-left:1px solid #fff; width:17px; height:17px; text-shadow:-1px -1px 1px #666, 1px 1px 1px #fff; text-align:center; border-bottom:1px solid #aaa;
background:-moz-linear-gradient(top, #eee 0%, #fff 18%, #ddd 100%);
background:-webkit-linear-gradient(top, #eee 0%,#fff 18%,#ddd 100%);
background:linear-gradient(top, #eee 0%,#fff 18%,#ddd 100%);
}
.fun-picker ul li:hover {cursor:pointer; text-shadow:0 0 0 transparent; border-left:1px solid #dd4242; border-top:1px solid #FFA2A2; padding-top:2px; color:#fff;
background:-moz-linear-gradient(top, #dd4242 0%, #aa2222 100%);
background:-webkit-linear-gradient(top, #dd4242 0%,#aa2222 100%);
background:linear-gradient(top, #dd4242 0%,#aa2222 100%); }
/* http://lab.simurai.com/css/buttons/ */
button {text-decoration:none; font-weight:bold; text-shadow:rgba(255,255,255,.5) 0 1px 0; -webkit-user-select:none; -moz-user-select:none; user-select:none; padding:5px 10px; display:inline-block; position:relative; border-radius:8px; margin:10px; border-left:none; border-right:none;
border-top:1px solid rgba(255,255,255,0.8); border-bottom:1px solid rgba(0,0,0,0.1);
background-image:-webkit-gradient(radial, 50% 0, 100, 50% 0, 0, from( rgba(255,255,255,0) ), to( rgba(255,255,255,0.7) ));
background-image:-moz-radial-gradient(top, ellipse cover, rgba(255,255,255,0.7) 0%, rgba(255,255,255,0) 100%);
background-image:gradient(radial, 50% 0, 100, 50% 0, 0, from( rgba(255,255,255,0) ), to( rgba(255,255,255,0.7) ));
-webkit-transition:background .2s ease-in-out;
-moz-transition:background .2s ease-in-out;
transition:background .2s ease-in-out;
color:#444 !important;
background-color:hsl(0, 0%, 75%);
-webkit-box-shadow:inset rgba(255,254,255,0.6) 0 0.3em .3em, inset rgba(0,0,0,0.15) 0 -0.1em .3em, /* inner shadow */
hsl(0, 0%, 60%) 0 .1em 3px, hsl(0, 0%, 45%) 0 .3em 1px, /* color border */
rgba(0,0,0,0.2) 0 .5em 5px; /* drop shadow */
-moz-box-shadow:inset rgba(255,254,255,0.6) 0 0.3em .3em, inset rgba(0,0,0,0.15) 0 -0.1em .3em, /* inner shadow */
hsl(0, 0%, 60%) 0 .1em 3px, hsl(0, 0%, 45%) 0 .3em 1px, /* color border */
rgba(0,0,0,0.2) 0 .5em 5px; /* drop shadow */
box-shadow:inset rgba(255,254,255,0.6) 0 0.3em .3em, inset rgba(0,0,0,0.15) 0 -0.1em .3em, /* inner shadow */
hsl(0, 0%, 60%) 0 .1em 3px, hsl(0, 0%, 45%) 0 .3em 1px, /* color border */
rgba(0,0,0,0.2) 0 .5em 5px; /* drop shadow */
}
button:hover {cursor:pointer;}
button:hover {background-color:hsl(0, 0%, 83%);}
button:active, button.toggled {
background-image:-webkit-gradient(radial, 50% 0, 100, 50% 0, 0, from( rgba(255,255,255,0) ), to( rgba(255,255,255,0) ));
background-image:-moz-gradient(radial, 50% 0, 100, 50% 0, 0, from( rgba(255,255,255,0) ), to( rgba(255,255,255,0) ));
background-image:gradient(radial, 50% 0, 100, 50% 0, 0, from( rgba(255,255,255,0) ), to( rgba(255,255,255,0) ));
-webkit-box-shadow:inset rgba(255,255,255,0.6) 0 0.3em .3em, inset rgba(0,0,0,0.2) 0 -0.1em .3em, /* inner shadow */
rgba(0,0,0,0.4) 0 .1em 1px, /* border */
rgba(0,0,0,0.2) 0 .2em 6px; /* drop shadow */
-moz-box-shadow:inset rgba(255,255,255,0.6) 0 0.3em .3em, inset rgba(0,0,0,0.2) 0 -0.1em .3em, /* inner shadow */
rgba(0,0,0,0.4) 0 .1em 1px, /* border */
rgba(0,0,0,0.2) 0 .2em 6px; /* drop shadow */
box-shadow:inset rgba(255,255,255,0.6) 0 0.3em .3em, inset rgba(0,0,0,0.2) 0 -0.1em .3em, /* inner shadow */
rgba(0,0,0,0.4) 0 .1em 1px, /* border */
rgba(0,0,0,0.2) 0 .2em 6px; /* drop shadow */
-webkit-transform:translateY(.2em);
-moz-transform:translateY(.2em);
transform:translateY(.2em);
}
button:focus { outline:none; color:rgba(254,255,255,0.9) !important; text-shadow:rgba(0,0,0,0.2) 0 1px 2px; }
/* Created by Arian Stolwijk <http://www.aryweb.nl> */
.MooDialog {width:300px; height:30px; position:fixed; margin:-150px 0 0 -150px; top:50%; left:50%; z-index:9999999; background:#fff; color:black; padding:10px;
border-radius:7px;
-moz-border-radius:7px;
-webkit-border-radius:7px;
border-radius:7px;
-webkit-box-shadow:1px 1px 0 #777,
2px 2px 0 #999,
3px 3px 0 #9a9a9a,
4px 4px 0 #aaa,
5px 5px 0 #a9a9a9,
3px 3px 10px #2c2c2c;
box-shadow:1px 1px 0 #777,
2px 2px 0 #999,
3px 3px 0 #9a9a9a,
4px 4px 0 #aaa,
5px 5px 0 #a9a9a9,
3px 3px 10px #2c2c2c;}
.MooDialogTitle { padding-top:30px; }
.MooDialog .content input {width:43%;}
.MooDialog p {float:left; display:block; font-size:15pt; color:#555; margin:6px 0 0;}
.MooDialog .buttons {float:right; text-align:right; margin:0; padding:0; border:0; background:none; position:relative; top:-6px;}
.MooDialog .textInput { width:200px; float:left; }
.MooDialog .MooDialogAlert{padding-left:40px; min-height:40px; }