source: resources/assets/sass/components/accordion.scss@ 7304c7f

develop
Last change on this file since 7304c7f was 7304c7f, checked in by beratkjufliju <kufliju@…>, 3 years ago

added user authentication, create & forgot password methods and blades

  • Property mode set to 100644
File size: 4.1 KB
Line 
1.accordion {
2 .card {
3 margin-bottom: 0;
4 border: 1px solid #ebebeb;
5
6 .card-header {
7 display: flex;
8 height: 50px;
9 padding: 0 10px;
10 align-items: center;
11
12 button {
13 display: block;
14 }
15 }
16 }
17
18 &.custom-accordion {
19 border: 1px solid #ebebeb;
20 border-radius: 5px;
21 overflow: hidden;
22
23 .accordion-row {
24 a.accordion-header {
25 color: $color-dark;
26 border-bottom: 1px solid #ebebeb;
27 border-top: 1px solid #ebebeb;
28 padding: 10px 20px;
29 display: flex;
30 align-items: center;
31 justify-content: space-between;
32 margin-top: -1px;
33
34 .accordion-status-icon {
35 &.open {
36 display: none;
37 }
38 }
39
40 &:hover, &:focus {
41 color: $color-primary;
42 }
43 }
44
45 .accordion-body {
46 display: none;
47 padding: 10px 20px;
48 }
49
50 &.open {
51 a.accordion-header {
52 background: white;
53
54 .accordion-status-icon {
55 &.open {
56 display: block;
57 }
58
59 &.close {
60 display: none;
61 }
62 }
63 }
64
65 .accordion-body {
66 display: block;
67 }
68 }
69
70 &:first-child {
71 a.accordion-header {
72 border-top: none;
73 }
74 }
75 }
76
77 &.accordion-primary {
78 .accordion-row {
79 &:not(.open) {
80 a.accordion-header {
81 &:hover, &:focus {
82 color: $color-primary;
83 }
84 }
85 }
86
87 &.open {
88 a.accordion-header {
89 background: $color-primary;
90 color: white;
91 }
92 }
93 }
94 }
95
96 &.accordion-success {
97 .accordion-row {
98 &:not(.open) {
99 a.accordion-header {
100 &:hover, &:focus {
101 color: $color-success;
102 }
103 }
104 }
105
106 &.open {
107 a.accordion-header {
108 background: $color-success;
109 color: white;
110 }
111 }
112 }
113 }
114
115 &.accordion-danger {
116 .accordion-row {
117 &:not(.open) {
118 a.accordion-header {
119 &:hover, &:focus {
120 color: $color-danger;
121 }
122 }
123 }
124
125 &.open {
126 a.accordion-header {
127 background: $color-danger;
128 color: white;
129 }
130 }
131 }
132 }
133
134 &.accordion-secondary {
135 .accordion-row {
136 &:not(.open) {
137 a.accordion-header {
138 &:hover, &:focus {
139 color: $color-secondary;
140 }
141 }
142 }
143
144 &.open {
145 a.accordion-header {
146 background: $color-secondary;
147 color: white;
148 }
149 }
150 }
151 }
152
153 &.accordion-light {
154 .accordion-row {
155 &:not(.open) {
156 a.accordion-header {
157 &:hover, &:focus {
158 color: $color-dark;
159 }
160 }
161 }
162
163 &.open {
164 a.accordion-header {
165 background: $color-light;
166 color: $color-dark;
167 }
168 }
169 }
170 }
171
172 &.accordion-warning {
173 .accordion-row {
174 &:not(.open) {
175 a.accordion-header {
176 &:hover, &:focus {
177 color: $color-warning;
178 }
179 }
180 }
181
182 &.open {
183 a.accordion-header {
184 background: $color-warning;
185 color: $color-dark;
186 }
187 }
188 }
189 }
190
191 &.accordion-info {
192 .accordion-row {
193 &:not(.open) {
194 a.accordion-header {
195 &:hover, &:focus {
196 color: $color-info;
197 }
198 }
199 }
200
201 &.open {
202 a.accordion-header {
203 background: $color-info;
204 color: white;
205 }
206 }
207 }
208 }
209
210 &.accordion-dark {
211 .accordion-row {
212 &:not(.open) {
213 a.accordion-header {
214 &:hover, &:focus {
215 color: $color-dark;
216 }
217 }
218 }
219
220 &.open {
221 a.accordion-header {
222 background: $color-dark;
223 color: white;
224 }
225 }
226 }
227 }
228 }
229}
Note: See TracBrowser for help on using the repository browser.