source: branches/2.4/prototype/plugins/freeow/style/freeow/freeow.css @ 6754

Revision 6754, 4.6 KB checked in by niltonneto, 12 years ago (diff)

Ticket #0000 - Copiadas as alterações do Trunk. Versão final da 2.4.1.

  • Property svn:executable set to *
Line 
1/*
2
3This stylesheet provides some sample styles to use with Freeow! You may use
4these in your project or create your own!
5
6For my samples, I'm assuming that you will call freeow() on a container with
7the class .freeow applied to it.
8
9The default template function produces markup matching this outline:
10
11        div (classes passed in options get applied here)
12                div.background
13                        div.content
14                                h2
15                                p
16                span.icon
17                span.close
18
19Don't forget: You can make your own template function if this markup doesn't work for your project. The function must accept the title and message as arguments and return a DOM element (the message box).
20
21Update $.fn.freeow.defaults.template or pass the function as the template
22member of the options object when calling freeow().
23
24*/
25
26
27/* Boilerplate -------------------------------------------------------------- */
28
29/* Outermost Container */
30.freeow {
31    position: fixed;
32    width: 300px;
33    z-index: 9999;
34}
35.freeow-top-right {
36    top: 10px;
37    right: 10px;
38}
39.freeow-bottom-right {
40    bottom: 10px;
41    right: 10px;
42}
43
44/* Message */
45.freeow > div {
46    position: relative;
47    margin-bottom: 5px;
48        cursor: pointer;
49}
50.freeow .content {
51    margin: 5px 5px 5px 69px;
52}
53.freeow h2,
54.freeow p {
55    margin: 0;
56    padding: 0;
57
58}
59.freeow .icon {
60    position: absolute;
61    display: block;
62    width: 48px;
63    height: 48px;
64    top: 5px;
65    left: 10px;
66    background: transparent url(images/notice.png) no-repeat 0 0;
67    z-index: 1;
68}
69.freeow .close {
70    position: absolute;
71    display: block;
72    width: 24px;
73    height: 24px;
74    top: 8px;
75    left: 8px;
76    background: none;
77    z-index: 2;
78}
79.freeow div:hover .close {
80    background: transparent url(images/close.png) no-repeat 0 0;
81}
82
83
84/* Icons -------------------------------------------------------------------- */
85
86.freeow .slide .icon   { background-image: url(images/slide.png); }
87.freeow .pushpin .icon { background-image: url(images/pushpin.png); }
88.freeow .error .icon   { background-image: url(images/error.png); }
89
90
91/* Specific Styles ---------------------------------------------------------- */
92
93/* Smokey */
94.freeow .smokey {
95        color: white;
96}
97.freeow .smokey .background {
98    border: 3px solid #000;
99    -moz-border-radius: 12px;
100        border-radius: 12px;
101    background: #000;
102    opacity: .65;
103    -moz-box-shadow: 2px 2px 3px #888;
104    -webkit-box-shadow: 2px 2px 3px #888;
105    box-shadow: 2px 2px 3px #888;
106}
107.freeow .smokey:hover .background {
108    border-color: #fff;
109}
110.freeow .smokey .content {
111    margin: 5px 5px 5px 69px;
112}
113.freeow .smokey h2 {
114    font-family: "Lucida Grande", Helvetica, arial, sans-serif;
115    font-weight: normal;
116    font-size: 14px;
117    line-height: 16px;
118}
119.freeow .smokey p {
120    padding-top: 8px;
121    font-family: Helvetica, arial, sans-serif;
122    font-weight: normal;
123    font-size: 11px;
124    line-height: 16px;
125}
126
127/* Gray */
128.freeow .gray {
129        color: black;
130}
131.freeow .gray .background {
132        border: 3px solid #eee;
133    -moz-border-radius: 12px;
134        border-radius: 12px;
135    background: #eee;
136    -moz-box-shadow: 2px 2px 3px #888;
137    -webkit-box-shadow: 2px 2px 3px #888;
138    box-shadow: 2px 2px 3px #888;
139}
140.freeow .gray:hover .background {
141    border-color: #009bc5;
142}
143.freeow .gray .content {
144    margin: 5px 5px 5px 69px;
145}
146.freeow .gray h2 {
147    font-family: "Lucida Grande", Helvetica, arial, sans-serif;
148    font-weight: normal;
149    font-size: 14px;
150    line-height: 16px;
151}
152.freeow .gray p {
153    padding-top: 8px;
154    font-family: Helvetica, arial, sans-serif;
155    font-weight: normal;
156    font-size: 11px;
157    line-height: 16px;
158}
159
160/* OSX */
161.freeow .osx .background {
162        border: 1px solid #939393;
163        background: #eee url(images/osx/background.png) repeat-y top left;
164    -moz-box-shadow: 2px 2px 3px #888;
165    -webkit-box-shadow: 2px 2px 3px #888;
166    box-shadow: 2px 2px 3px #888;
167}
168.freeow .osx .content {
169    margin: 5px 5px 5px 87px;
170}
171.freeow .osx .icon {
172        left: 28px;
173}
174.freeow .osx .close {
175    position: absolute;
176    display: block;
177    width: 16px;
178    height: 16px;
179    top: 1px;
180    left: 1px;
181    background: transparent url(images/osx/close.png) no-repeat 0 0;
182    z-index: 2;
183}
184.freeow .osx:hover .close {
185    background: transparent url(images/osx/close.png) no-repeat -16px 0;
186}
187.freeow .osx h2 {
188    font-family: "Lucida Grande", Helvetica, arial, sans-serif;
189    font-weight: normal;
190    font-size: 14px;
191    line-height: 16px;
192}
193.freeow .osx p {
194    font-family: Helvetica, arial, sans-serif;
195    font-weight: normal;
196    font-size: 11px;
197    line-height: 16px;
198}
199
200/* Simple */
201.freeow .simple .background {
202        border: 2px solid #ccc;
203        background: #eee;
204}
205.freeow .simple .content {
206    margin: 5px 5px 5px 69px;
207}
Note: See TracBrowser for help on using the repository browser.