Small refactor in messaging.
[wolnelektury.git] / src / wolnelektury / static / scss / widget.scss
1 html, body {
2     padding: 0;
3     margin: 0;
4     overflow: hidden;
5 }
6
7
8 #wl {
9     background-color: #191919;
10     position:relative;
11
12     a, a:visited, a:hover {
13         display: block;
14         line-height: 5.94rem;
15         border: 0;
16
17         img {
18             border: 0;
19             max-width: 100%;
20             margin: 0;
21             vertical-align: middle;
22         }
23     }
24
25     #wl-form {
26         background: #444;
27         color: white;
28         height: 2.8125rem;
29         position: relative;
30     }
31     #wl-search {
32         position: absolute;
33         left: .3125rem;
34         right: 2.9rem;
35         right: 22%;
36         top: .3125rem;
37     }
38
39     #id_qq {
40         font-family: Georgia;
41         font-size: 0.8125rem;
42         
43         background-color: #FFFFFF;
44         border: medium none;
45         border-radius: 0.3125rem;
46         box-shadow: 0 0 0.40625rem #444444 inset;
47         color: #000000;
48         height: 2.0625rem;
49         width: 100%;
50
51         line-height: 2.03125rem;
52         padding: 0 0 0 .8125rem;
53         position: relative;
54         box-sizing: border-box;
55         z-index: 200;
56
57         &::-moz-placeholder {
58             color: #767676;
59             font-family: Georgia;
60             font-style: italic;
61         }
62     }
63
64     button {
65         background: #018189;
66         border: none;
67         color: white;
68         display: inline-block;
69         font-size: .6875rem;
70         position: absolute;
71         right: 0;
72         top: 0;
73         width: 2rem;
74
75         width: 20%;
76         height: 2.8125rem;
77         margin: 0;
78         padding: 0;
79
80         img {
81             max-width: 100%;
82         }
83     }
84
85 }
86
87 .ui-menu {
88     width: 100%;
89     font-size: 0.7rem;
90     list-style-type: none;
91     padding: 0;
92     margin: 0;
93     border-style: solid;
94     border-color: #ddd;
95     border-width: 1px 0;
96
97     li {
98         clear: right;
99
100         &:nth-child(odd) {
101             background-color: rgba(255,255,255,.95);
102         }
103
104         &:nth-child(even){
105             background-color: rgba(238,238,238,.95);
106         }
107
108         &:hover{
109             background-color: #053469;
110             color:white;
111         }
112
113         .ui-state-hover {
114             background-color: #fdf5ce;
115         }
116
117         .search-hint-label {
118             line-height: 1.636em;
119             display: inline-block;
120             max-width: 80%;
121             white-space: nowrap;
122             overflow: hidden;
123             text-overflow: ellipsis;
124         }
125
126         .search-hint-category {
127             display: none;
128             @media screen and (min-width: 10em) {
129                 display: block;
130             }
131             float: right;
132             font-size: .9em;
133         }
134     }
135
136     a:hover {
137         text-decoration: none;
138     }
139 }
140
141 .ui-corner-all {
142     cursor: pointer;
143     display:block;
144
145     a {
146         text-decoration: none;
147         color: #0D7E85;
148         padding: 5px;
149     }
150 }