Mercurial > hg > dml-open-vis
comparison src/DML/MainVisBundle/Resources/assets/bem-blocks/notification.less @ 0:493bcb69166c
added public content
author | Daniel Wolff |
---|---|
date | Tue, 09 Feb 2016 20:54:02 +0100 |
parents | |
children |
comparison
equal
deleted
inserted
replaced
-1:000000000000 | 0:493bcb69166c |
---|---|
1 @import "../config.less"; | |
2 | |
3 .notification { | |
4 position: relative; | |
5 padding-top: 10px; | |
6 cursor: default; | |
7 z-index: @z-index_notifications + 1; | |
8 | |
9 | |
10 &_state_pre-shown { | |
11 } | |
12 | |
13 &_state_shown { | |
14 } | |
15 | |
16 &_state_pre-hidden { | |
17 | |
18 } | |
19 | |
20 &_state_hidden { | |
21 | |
22 } | |
23 | |
24 // ================================== | |
25 &__body { | |
26 .font_small(); | |
27 | |
28 position: absolute; | |
29 bottom: 0; | |
30 right: 0; | |
31 | |
32 background: #eee; | |
33 border: 1px solid #ccc; | |
34 border-top-left-radius: @--border-radius; | |
35 border-bottom-left-radius: @--border-radius; | |
36 width: @notification--width; | |
37 z-index: @z-index_notifications + 2; | |
38 } | |
39 | |
40 &_state_shown &__body { | |
41 } | |
42 | |
43 // ================================== | |
44 &__closer { | |
45 position: absolute; | |
46 right: 0; | |
47 top: 0; | |
48 bottom: 0; | |
49 width: @notification--closer-width; | |
50 | |
51 background: #F5F5F5; | |
52 color: #ccc; | |
53 cursor: default; | |
54 z-index: @z-index_notifications + 3; | |
55 } | |
56 &__closer::before { | |
57 content: "x"; | |
58 display: block; | |
59 margin-top: 6px; | |
60 text-align: center; | |
61 } | |
62 &__closer:hover { | |
63 color: #999; | |
64 background: #fff; | |
65 } | |
66 // ttl = time to live | |
67 &_ttl_5 &__closer::before {content: "5"} | |
68 &_ttl_4 &__closer::before {content: "4"} | |
69 &_ttl_3 &__closer::before {content: "3"} | |
70 &_ttl_2 &__closer::before {content: "2"} | |
71 &_ttl_1 &__closer::before {content: "1"} | |
72 &_ttl_0 &__closer::before {content: "0"} | |
73 | |
74 &_ttl-frozen:hover &__closer::before { | |
75 content: "x" !important; | |
76 } | |
77 | |
78 // Things look differently for warning messages | |
79 &_type_warning &__body { | |
80 background: #FFEED0; | |
81 } | |
82 &_type_warning &__closer { | |
83 background: #FFF8F5; | |
84 } | |
85 &_type_warning &__closer:hover { | |
86 color: #CA9; | |
87 } | |
88 | |
89 // Things look differently for error messages | |
90 &_type_error &__body { | |
91 background: #FFD5D5; | |
92 } | |
93 &_type_error &__closer { | |
94 background: #FFF5F5; | |
95 } | |
96 &_type_error &__closer:hover { | |
97 color: #C88; | |
98 } | |
99 | |
100 // ================================== | |
101 &__content { | |
102 padding: 6px 10px; | |
103 margin-right: @notification--closer-width; | |
104 } | |
105 | |
106 &_no-padding &__content { | |
107 padding: 0px; | |
108 } | |
109 | |
110 &__content b { | |
111 font-weight: bold; | |
112 } | |
113 } |