compass-banners 0.0.1
Sign up to get free protection for your applications and to get access to all the features.
- data/README.markdown +150 -0
- data/lib/compass-banners.rb +1 -0
- data/stylesheets/_compass-banners.sass +78 -0
- metadata +87 -0
data/README.markdown
ADDED
|
@@ -0,0 +1,150 @@
|
|
|
1
|
+
# Compass Banners #
|
|
2
|
+
|
|
3
|
+
Compass Banners provides mixins for standard web banners.
|
|
4
|
+
|
|
5
|
+
## Installation ##
|
|
6
|
+
|
|
7
|
+
From the command line:
|
|
8
|
+
|
|
9
|
+
sudo gem install compass-banners
|
|
10
|
+
|
|
11
|
+
Add to a project (rails: compass.rb, other: config.rb):
|
|
12
|
+
|
|
13
|
+
require 'compass-banners'
|
|
14
|
+
|
|
15
|
+
Or create a new project:
|
|
16
|
+
|
|
17
|
+
compass create my_project -r compass-banners
|
|
18
|
+
|
|
19
|
+
## Banner Mixins ##
|
|
20
|
+
|
|
21
|
+
<table>
|
|
22
|
+
<tr>
|
|
23
|
+
<th>Name</th>
|
|
24
|
+
<th>Mixin</th>
|
|
25
|
+
<th>Dimensions (px)</th>
|
|
26
|
+
<th>Aspect Ratio</th>
|
|
27
|
+
</tr>
|
|
28
|
+
<tr>
|
|
29
|
+
<th colspan="4">Rectangles & Pop-Ups</th>
|
|
30
|
+
</tr>
|
|
31
|
+
<tr>
|
|
32
|
+
<td>Rectangle</td>
|
|
33
|
+
<td><code>+rectangle</code></td>
|
|
34
|
+
<td>180x150</td>
|
|
35
|
+
<td>1.2</td>
|
|
36
|
+
</tr>
|
|
37
|
+
<tr>
|
|
38
|
+
<td>Medium Rectangle</td>
|
|
39
|
+
<td><code>+medium-rectangle</code></td>
|
|
40
|
+
<td>300x250</td>
|
|
41
|
+
<td>1.2</td>
|
|
42
|
+
</tr>
|
|
43
|
+
<tr>
|
|
44
|
+
<td>Vertical Rectangle</td>
|
|
45
|
+
<td><code>+vertical-rectangle</code></td>
|
|
46
|
+
<td>240x400</td>
|
|
47
|
+
<td>1.67</td>
|
|
48
|
+
</tr>
|
|
49
|
+
<tr>
|
|
50
|
+
<td>Large Rectangle</td>
|
|
51
|
+
<td><code>+large-rectangle</code></td>
|
|
52
|
+
<td>336x280</td>
|
|
53
|
+
<td>1.2</td>
|
|
54
|
+
</tr>
|
|
55
|
+
<tr>
|
|
56
|
+
<td>3:1 Rectangle</td>
|
|
57
|
+
<td><code>+three-one-rectangle</code></td>
|
|
58
|
+
<td>300x100</td>
|
|
59
|
+
<td>3</td>
|
|
60
|
+
</tr>
|
|
61
|
+
<tr>
|
|
62
|
+
<td>Square Pop-Up</td>
|
|
63
|
+
<td><code>+square-pop-up</code></td>
|
|
64
|
+
<td>250x250</td>
|
|
65
|
+
<td>1</td>
|
|
66
|
+
</tr>
|
|
67
|
+
<tr>
|
|
68
|
+
<td>Pop-Under</td>
|
|
69
|
+
<td><code>+pop-under</code></td>
|
|
70
|
+
<td>720x300</td>
|
|
71
|
+
<td>2.4</td>
|
|
72
|
+
</tr>
|
|
73
|
+
<tr>
|
|
74
|
+
<th colspan="4">Banners & Buttons</th>
|
|
75
|
+
</tr>
|
|
76
|
+
<tr>
|
|
77
|
+
<td>Full Banner</td>
|
|
78
|
+
<td><code>+full-banner</code></td>
|
|
79
|
+
<td>468x60</td>
|
|
80
|
+
<td>7.8</td>
|
|
81
|
+
</tr>
|
|
82
|
+
<tr>
|
|
83
|
+
<td>Half Banner</td>
|
|
84
|
+
<td><code>+half-banner</code></td>
|
|
85
|
+
<td>234x60</td>
|
|
86
|
+
<td>3.9</td>
|
|
87
|
+
</tr>
|
|
88
|
+
<tr>
|
|
89
|
+
<td>Vertical Banner</td>
|
|
90
|
+
<td><code>+vertical-banner</code></td>
|
|
91
|
+
<td>120x240</td>
|
|
92
|
+
<td>2</td>
|
|
93
|
+
</tr>
|
|
94
|
+
<tr>
|
|
95
|
+
<td>Micro Bar</td>
|
|
96
|
+
<td><code>+micro-bar</code></td>
|
|
97
|
+
<td>88x31</td>
|
|
98
|
+
<td>2.84</td>
|
|
99
|
+
</tr>
|
|
100
|
+
<tr>
|
|
101
|
+
<td>Button 1</td>
|
|
102
|
+
<td><code>+button-one</code></td>
|
|
103
|
+
<td>120x90</td>
|
|
104
|
+
<td>1.33</td>
|
|
105
|
+
</tr>
|
|
106
|
+
<tr>
|
|
107
|
+
<td>Button 2</td>
|
|
108
|
+
<td><code>+button-two</code></td>
|
|
109
|
+
<td>120x60</td>
|
|
110
|
+
<td>2</td>
|
|
111
|
+
</tr>
|
|
112
|
+
<tr>
|
|
113
|
+
<td>Square Button</td>
|
|
114
|
+
<td><code>+square-button</code></td>
|
|
115
|
+
<td>125x125</td>
|
|
116
|
+
<td>1</td>
|
|
117
|
+
</tr>
|
|
118
|
+
<tr>
|
|
119
|
+
<td>Leaderboard</td>
|
|
120
|
+
<td><code>+leaderboard</code></td>
|
|
121
|
+
<td>728x90</td>
|
|
122
|
+
<td>8.09</td>
|
|
123
|
+
</tr>
|
|
124
|
+
<tr>
|
|
125
|
+
<th colspan="4">Skyscrapers</th>
|
|
126
|
+
</tr>
|
|
127
|
+
<tr>
|
|
128
|
+
<td>Skyscraper</td>
|
|
129
|
+
<td><code>+skyscraper</code></td>
|
|
130
|
+
<td>120x600</td>
|
|
131
|
+
<td>5</td>
|
|
132
|
+
</tr>
|
|
133
|
+
<tr>
|
|
134
|
+
<td>Wide Skyscraper</td>
|
|
135
|
+
<td><code>+wide-skyscraper</code></td>
|
|
136
|
+
<td>160x600</td>
|
|
137
|
+
<td>3.75</td>
|
|
138
|
+
</tr>
|
|
139
|
+
<tr>
|
|
140
|
+
<td>Half Page Ad</td>
|
|
141
|
+
<td><code>+half-page-ad</code></td>
|
|
142
|
+
<td>300x600</td>
|
|
143
|
+
<td>2</td>
|
|
144
|
+
</tr>
|
|
145
|
+
</table>
|
|
146
|
+
|
|
147
|
+
## Authors ##
|
|
148
|
+
|
|
149
|
+
[Sven Steinheißer](https://github.com/rockdog)<br>
|
|
150
|
+
[Tobias Adam](https://github.com/tow8ie)
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
Compass::Frameworks.register("compass-banners", :path => "#{File.dirname(__FILE__)}/..")
|
|
@@ -0,0 +1,78 @@
|
|
|
1
|
+
// http://en.wikipedia.org/wiki/Web_banner#Standard_sizes
|
|
2
|
+
|
|
3
|
+
=ad-dimension($width, $height)
|
|
4
|
+
width: $width
|
|
5
|
+
height: $height
|
|
6
|
+
&.placeholder
|
|
7
|
+
$placeholder-padding: 10px
|
|
8
|
+
$placeholder-background-color: #ccc
|
|
9
|
+
width: $width - (2 * $placeholder-padding)
|
|
10
|
+
height: $height - (2 * $placeholder-padding)
|
|
11
|
+
padding: $placeholder-padding
|
|
12
|
+
background-color: $placeholder-background-color
|
|
13
|
+
|
|
14
|
+
///////////////////////////
|
|
15
|
+
// Rectangles and Pop-Ups
|
|
16
|
+
///////////////////////////
|
|
17
|
+
|
|
18
|
+
=medium-rectangle
|
|
19
|
+
+ad-dimension(300px, 250px)
|
|
20
|
+
|
|
21
|
+
=square-pop-up
|
|
22
|
+
+ad-dimension(250px, 250px)
|
|
23
|
+
|
|
24
|
+
=vertical-rectangle
|
|
25
|
+
+ad-dimension(240px, 400px)
|
|
26
|
+
|
|
27
|
+
=large-rectangle
|
|
28
|
+
+ad-dimension(336px, 280px)
|
|
29
|
+
|
|
30
|
+
=rectangle
|
|
31
|
+
+ad-dimension(180px, 150px)
|
|
32
|
+
|
|
33
|
+
=three-one-rectangle
|
|
34
|
+
+ad-dimension(300px, 100px)
|
|
35
|
+
|
|
36
|
+
=pop-under
|
|
37
|
+
+ad-dimension(720px, 300px)
|
|
38
|
+
|
|
39
|
+
////////////////////////
|
|
40
|
+
// Banners and Buttons
|
|
41
|
+
////////////////////////
|
|
42
|
+
|
|
43
|
+
=full-banner
|
|
44
|
+
+ad-dimension(468px, 60px)
|
|
45
|
+
|
|
46
|
+
=half-banner
|
|
47
|
+
+ad-dimension(234px, 60px)
|
|
48
|
+
|
|
49
|
+
=micro-bar
|
|
50
|
+
+ad-dimension(88px, 31px)
|
|
51
|
+
|
|
52
|
+
=button-one
|
|
53
|
+
+ad-dimension(120px, 90px)
|
|
54
|
+
|
|
55
|
+
=button-two
|
|
56
|
+
+ad-dimension(120px, 60px)
|
|
57
|
+
|
|
58
|
+
=vertical-banner
|
|
59
|
+
+ad-dimension(120px, 240px)
|
|
60
|
+
|
|
61
|
+
=square-button
|
|
62
|
+
+ad-dimension(125px, 125px)
|
|
63
|
+
|
|
64
|
+
=leaderboard
|
|
65
|
+
+ad-dimension(728px, 90px)
|
|
66
|
+
|
|
67
|
+
////////////////
|
|
68
|
+
// Skyscrapers
|
|
69
|
+
////////////////
|
|
70
|
+
|
|
71
|
+
=wide-skyscraper
|
|
72
|
+
+ad-dimension(160px, 600px)
|
|
73
|
+
|
|
74
|
+
=skyscraper
|
|
75
|
+
+ad-dimension(120px, 600px)
|
|
76
|
+
|
|
77
|
+
=half-page-ad
|
|
78
|
+
+ad-dimension(300px, 600px)
|
metadata
ADDED
|
@@ -0,0 +1,87 @@
|
|
|
1
|
+
--- !ruby/object:Gem::Specification
|
|
2
|
+
name: compass-banners
|
|
3
|
+
version: !ruby/object:Gem::Version
|
|
4
|
+
hash: 29
|
|
5
|
+
prerelease:
|
|
6
|
+
segments:
|
|
7
|
+
- 0
|
|
8
|
+
- 0
|
|
9
|
+
- 1
|
|
10
|
+
version: 0.0.1
|
|
11
|
+
platform: ruby
|
|
12
|
+
authors:
|
|
13
|
+
- "Sven Steinhei\xC3\x9Fer"
|
|
14
|
+
- Tobias Adam
|
|
15
|
+
autorequire:
|
|
16
|
+
bindir: bin
|
|
17
|
+
cert_chain: []
|
|
18
|
+
|
|
19
|
+
date: 2011-02-05 00:00:00 +01:00
|
|
20
|
+
default_executable:
|
|
21
|
+
dependencies:
|
|
22
|
+
- !ruby/object:Gem::Dependency
|
|
23
|
+
name: compass
|
|
24
|
+
prerelease: false
|
|
25
|
+
requirement: &id001 !ruby/object:Gem::Requirement
|
|
26
|
+
none: false
|
|
27
|
+
requirements:
|
|
28
|
+
- - ">="
|
|
29
|
+
- !ruby/object:Gem::Version
|
|
30
|
+
hash: 49
|
|
31
|
+
segments:
|
|
32
|
+
- 0
|
|
33
|
+
- 10
|
|
34
|
+
- 3
|
|
35
|
+
version: 0.10.3
|
|
36
|
+
type: :runtime
|
|
37
|
+
version_requirements: *id001
|
|
38
|
+
description: provides mixins for standard web banners
|
|
39
|
+
email:
|
|
40
|
+
- sven.steinheisser@mindmatters.de
|
|
41
|
+
- tobias.adam@mindmatters.de
|
|
42
|
+
executables: []
|
|
43
|
+
|
|
44
|
+
extensions: []
|
|
45
|
+
|
|
46
|
+
extra_rdoc_files: []
|
|
47
|
+
|
|
48
|
+
files:
|
|
49
|
+
- README.markdown
|
|
50
|
+
- lib/compass-banners.rb
|
|
51
|
+
- stylesheets/_compass-banners.sass
|
|
52
|
+
has_rdoc: true
|
|
53
|
+
homepage: https://github.com/mindmatters/compass-banners
|
|
54
|
+
licenses: []
|
|
55
|
+
|
|
56
|
+
post_install_message:
|
|
57
|
+
rdoc_options: []
|
|
58
|
+
|
|
59
|
+
require_paths:
|
|
60
|
+
- lib
|
|
61
|
+
required_ruby_version: !ruby/object:Gem::Requirement
|
|
62
|
+
none: false
|
|
63
|
+
requirements:
|
|
64
|
+
- - ">="
|
|
65
|
+
- !ruby/object:Gem::Version
|
|
66
|
+
hash: 3
|
|
67
|
+
segments:
|
|
68
|
+
- 0
|
|
69
|
+
version: "0"
|
|
70
|
+
required_rubygems_version: !ruby/object:Gem::Requirement
|
|
71
|
+
none: false
|
|
72
|
+
requirements:
|
|
73
|
+
- - ">="
|
|
74
|
+
- !ruby/object:Gem::Version
|
|
75
|
+
hash: 3
|
|
76
|
+
segments:
|
|
77
|
+
- 0
|
|
78
|
+
version: "0"
|
|
79
|
+
requirements: []
|
|
80
|
+
|
|
81
|
+
rubyforge_project:
|
|
82
|
+
rubygems_version: 1.4.1
|
|
83
|
+
signing_key:
|
|
84
|
+
specification_version: 3
|
|
85
|
+
summary: provides mixins for standard web banners
|
|
86
|
+
test_files: []
|
|
87
|
+
|