Statistics
| Branch: | Tag: | Revision:

root / snf-cyclades-app / synnefo / ui / new_ui / ui / sass / _forms.scss @ 97cd255d

History | View | Annotate | Download (2.3 kB)

1
/* Table of Contents
2

    
3
- editable
4
- universal form styles
5
- vm wizard styles
6
*/
7

    
8

    
9
/* editable (used for changing info asychronously) ------------------ */
10

    
11
.editable {
12
	.editbuttons {		
13
		a {
14
			&.save {
15
				display: none;
16
				span {
17
					font-size: 18px;
18
				}
19
			} 
20
			&.cancel {
21
				@extend a.save
22
			}
23
		}
24
	}
25
	input[type="text"] {
26
		display: none;
27
	}
28
}
29

    
30

    
31
/* universal form styles ------------------ */
32

    
33
.input {
34
	display: inline-block;
35
	padding-left:6px;
36
	input[type="text"] {
37
		width: 142px;
38
		padding:0 12px 0 6px;
39
		border:0 none;
40
		background-color: transparent;
41
		outline: 0;
42
		margin:0;
43
		@include box-shadow(none);
44
	}
45
}
46

    
47

    
48
.snf-color-picker {
49
    display: none;
50
	&>form {
51
		height:237px;
52
		width: 100%
53
	}
54

    
55
	#picker {
56
	    position: relative;
57
	    width: 207px;
58
	    margin: 25px 5px 30px;
59
	    display: inline-block;
60
	}
61
		.color-preview {
62
			@include circle(9px);
63
			// background-color: #16C1E9;
64
			position: relative;
65
			left: 10px;
66
			bottom: -5px;
67
			margin: 0 15px 0 10px;
68
			vertical-align: text-bottom;
69
			border-color: transparent;
70
			color: transparent;
71
		}
72
}
73

    
74
/* detailed view styles ------------------ */
75
.details {
76
	.input{
77
		background:url(../images/input-bg-lt-black.png) no-repeat left bottom;
78
		input[type="text"] {
79
			background:url(../images/input-bg-rt-black.png) no-repeat right bottom;
80
			color: $body-font-color;
81
			@include placeholder {
82
				color:$primary-color;
83
			}
84
		}
85
	}
86
}
87

    
88

    
89
/* vm wizard styles ------------------ */
90
.wizard {
91
	form.custom .custom.dropdown.medium {
92
		background:$overlay-bg-color;
93
		color:white;
94
	}
95
	form.custom .custom.dropdown .current {
96
		color:white;
97
	}
98
	form.custom .custom.dropdown .selector {
99
		border-left:1px solid white;
100
		height: 30px;
101
	}
102
	form.custom .custom.dropdown.open ul {
103
		background:$overlay-bg-color;
104
		color:white;
105
	}
106
	form.custom .custom.dropdown ul li {
107
		color:white;
108
	}
109
	form.custom .custom.dropdown ul li.selected {
110
		color:white;
111
		background:lighten($overlay-bg-color,10%);
112
	}
113
	form.custom .custom.dropdown ul li:hover {
114
		background:lighten($overlay-bg-color,20%);
115
		color:white;
116
	}
117

    
118
	.input {
119
		background:url(../images/input-bg-lt.png) no-repeat left bottom;
120
		input[type="text"] {
121
			background:url(../images/input-bg-rt.png) no-repeat right bottom;
122
			color: $wizard-base-font-color;
123
			@include placeholder {
124
			color:$body-font-color;
125
			}
126
		}
127
	}
128
}