respondsass 0.0.9 → 1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- data/lib/respondsass.rb +29 -3
- metadata +27 -38
- data/README.md +0 -179
- data/stylesheets/_respondsass.scss +0 -8
- data/stylesheets/respondsass/_baseline.scss +0 -56
- data/stylesheets/respondsass/_buttons.scss +0 -32
- data/stylesheets/respondsass/_col-generator.scss +0 -11
- data/stylesheets/respondsass/_create-grid.scss +0 -40
- data/stylesheets/respondsass/_easy-nav.scss +0 -44
- data/stylesheets/respondsass/_rem-sizing.scss +0 -9
- data/stylesheets/respondsass/_respond-to.scss +0 -14
- data/templates/project/_base.scss +0 -12
- data/templates/project/examples.html +0 -130
- data/templates/project/index.html +0 -44
- data/templates/project/manifest.rb +0 -27
- data/templates/project/screen.scss +0 -38
- data/templates/project/scripts/boxsizing.htc +0 -501
- data/templates/project/scripts/html5shiv.js +0 -8
- data/templates/project/scripts/modernizr.custom.js +0 -4
- data/templates/project/scripts/respond.min.js +0 -6
|
@@ -1,130 +0,0 @@
|
|
|
1
|
-
<!doctype html>
|
|
2
|
-
<!--[if lt IE 7 ]><html lang="en" class="no-js ie6"><![endif]-->
|
|
3
|
-
<!--[if IE 7 ]><html lang="en" class="no-js ie7><![endif]-->
|
|
4
|
-
<!--[if IE 8 ]><html lang="en" class="no-js ie8"><![endif]-->
|
|
5
|
-
<!--[if IE 9 ]><html lang="en" class="no-js ie9"><![endif]-->
|
|
6
|
-
<!--[if (gt IE 9)|!(IE)]><!-->
|
|
7
|
-
<html lang="en" class="no-js"><!--<![endif]-->
|
|
8
|
-
<head>
|
|
9
|
-
<meta charset="utf-8">
|
|
10
|
-
<title>Title here</title>
|
|
11
|
-
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
12
|
-
<meta name="description" content="Page description here">
|
|
13
|
-
<meta name="keywords" content="keywords, here">
|
|
14
|
-
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
|
|
15
|
-
<link rel="stylesheet" href="stylesheets/screen.css">
|
|
16
|
-
<script type="text/javascript" async src="javascripts/modernizr.custom.js"></script>
|
|
17
|
-
<script type="text/javascript" async src="javascripts/respond.min.js"></script>
|
|
18
|
-
</head>
|
|
19
|
-
|
|
20
|
-
<body>
|
|
21
|
-
<div class="container">
|
|
22
|
-
<section class="row">
|
|
23
|
-
<div class="span-1">
|
|
24
|
-
<p>Column 1</p>
|
|
25
|
-
</div>
|
|
26
|
-
<div class="span-1">
|
|
27
|
-
<p>Column 2</p>
|
|
28
|
-
</div>
|
|
29
|
-
<div class="span-1">
|
|
30
|
-
<p>Column 3</p>
|
|
31
|
-
</div>
|
|
32
|
-
<div class="span-1">
|
|
33
|
-
<p>Column 4</p>
|
|
34
|
-
</div>
|
|
35
|
-
<div class="span-1">
|
|
36
|
-
<p>Column 5</p>
|
|
37
|
-
</div>
|
|
38
|
-
<div class="span-1">
|
|
39
|
-
<p>Column 6</p>
|
|
40
|
-
</div>
|
|
41
|
-
<div class="span-1">
|
|
42
|
-
<p>Column 7</p>
|
|
43
|
-
</div>
|
|
44
|
-
<div class="span-1">
|
|
45
|
-
<p>Column 8</p>
|
|
46
|
-
</div>
|
|
47
|
-
<div class="span-1">
|
|
48
|
-
<p>Column 9</p>
|
|
49
|
-
</div>
|
|
50
|
-
<div class="span-1">
|
|
51
|
-
<p>Column 10</p>
|
|
52
|
-
</div>
|
|
53
|
-
<div class="span-1">
|
|
54
|
-
<p>Column 11</p>
|
|
55
|
-
</div>
|
|
56
|
-
<div class="span-1">
|
|
57
|
-
<p>Column 12</p>
|
|
58
|
-
</div>
|
|
59
|
-
<div class="span-1">
|
|
60
|
-
<p>Column 13</p>
|
|
61
|
-
</div>
|
|
62
|
-
<div class="span-1">
|
|
63
|
-
<p>Column 14</p>
|
|
64
|
-
</div>
|
|
65
|
-
<div class="span-1">
|
|
66
|
-
<p>Column 15</p>
|
|
67
|
-
</div>
|
|
68
|
-
<div class="span-1">
|
|
69
|
-
<p>Column 16</p>
|
|
70
|
-
</div>
|
|
71
|
-
</section>
|
|
72
|
-
<section class="row">
|
|
73
|
-
<div class="thirds-1">
|
|
74
|
-
<p>One Third</p>
|
|
75
|
-
</div>
|
|
76
|
-
<div class="thirds-2">
|
|
77
|
-
<p>Two Thirds</p>
|
|
78
|
-
</div>
|
|
79
|
-
</section>
|
|
80
|
-
<section class="row">
|
|
81
|
-
<div class="fifths-3">
|
|
82
|
-
<p>3 Fifths</p>
|
|
83
|
-
</div>
|
|
84
|
-
<div class="fifths-2">
|
|
85
|
-
<p>2 Fifths</p>
|
|
86
|
-
</div>
|
|
87
|
-
</section>
|
|
88
|
-
<section class="row">
|
|
89
|
-
<div class="fifths-4">
|
|
90
|
-
<p>4 Fifths</p>
|
|
91
|
-
</div>
|
|
92
|
-
<div class="fifths-1">
|
|
93
|
-
<p>1 Fifth</p>
|
|
94
|
-
</div>
|
|
95
|
-
</section>
|
|
96
|
-
|
|
97
|
-
<section class="row">
|
|
98
|
-
<div class="cols-2">
|
|
99
|
-
<p>Cols span 2</p>
|
|
100
|
-
</div>
|
|
101
|
-
<div class="cols-3">
|
|
102
|
-
<p>Cols span 3</p>
|
|
103
|
-
</div>
|
|
104
|
-
<div class="cols-6">
|
|
105
|
-
<p>Cols span 6</p>
|
|
106
|
-
</div>
|
|
107
|
-
<div class="cols-1">
|
|
108
|
-
<p>Cols span 1</p>
|
|
109
|
-
</div>
|
|
110
|
-
</section>
|
|
111
|
-
<!-- End .row -->
|
|
112
|
-
</div>
|
|
113
|
-
<!-- End .container.row -->
|
|
114
|
-
|
|
115
|
-
<script type="text/javascript">
|
|
116
|
-
// Your Google analytics here
|
|
117
|
-
var _gaq = _gaq || [];
|
|
118
|
-
_gaq.push(['_setAccount', 'UA-xxxxxx-x']);
|
|
119
|
-
_gaq.push(['_trackPageview']);
|
|
120
|
-
|
|
121
|
-
(function() {
|
|
122
|
-
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
|
|
123
|
-
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
|
|
124
|
-
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
|
|
125
|
-
})();
|
|
126
|
-
|
|
127
|
-
</script>
|
|
128
|
-
</body>
|
|
129
|
-
|
|
130
|
-
</html>
|
|
@@ -1,44 +0,0 @@
|
|
|
1
|
-
<!doctype html>
|
|
2
|
-
<!--[if lt IE 7 ]><html lang="en" class="no-js ie6"><![endif]-->
|
|
3
|
-
<!--[if IE 7 ]><html lang="en" class="no-js ie7><![endif]-->
|
|
4
|
-
<!--[if IE 8 ]><html lang="en" class="no-js ie8"><![endif]-->
|
|
5
|
-
<!--[if IE 9 ]><html lang="en" class="no-js ie9"><![endif]-->
|
|
6
|
-
<!--[if (gt IE 9)|!(IE)]><!-->
|
|
7
|
-
<html lang="en" class="no-js"><!--<![endif]-->
|
|
8
|
-
<head>
|
|
9
|
-
<meta charset="utf-8">
|
|
10
|
-
<title>Title here</title>
|
|
11
|
-
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
12
|
-
<meta name="description" content="Page description here">
|
|
13
|
-
<meta name="keywords" content="keywords, here">
|
|
14
|
-
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
|
|
15
|
-
<link rel="stylesheet" href="stylesheets/screen.css">
|
|
16
|
-
<script type="text/javascript" async src="javascripts/modernizr.custom.js"></script>
|
|
17
|
-
<script type="text/javascript" async src="javascripts/respond.min.js"></script>
|
|
18
|
-
</head>
|
|
19
|
-
|
|
20
|
-
<body>
|
|
21
|
-
<div class="container">
|
|
22
|
-
<section class="row">
|
|
23
|
-
|
|
24
|
-
</section>
|
|
25
|
-
<!-- End .row -->
|
|
26
|
-
</div>
|
|
27
|
-
<!-- End .container.row -->
|
|
28
|
-
|
|
29
|
-
<script type="text/javascript">
|
|
30
|
-
// Your Google analytics here
|
|
31
|
-
var _gaq = _gaq || [];
|
|
32
|
-
_gaq.push(['_setAccount', 'UA-xxxxxx-x']);
|
|
33
|
-
_gaq.push(['_trackPageview']);
|
|
34
|
-
|
|
35
|
-
(function() {
|
|
36
|
-
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
|
|
37
|
-
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
|
|
38
|
-
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
|
|
39
|
-
})();
|
|
40
|
-
|
|
41
|
-
</script>
|
|
42
|
-
</body>
|
|
43
|
-
|
|
44
|
-
</html>
|
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
# Make sure you list all the project template files here in the manifest.
|
|
2
|
-
stylesheet 'screen.scss', :media => 'screen, projection'
|
|
3
|
-
stylesheet '_base.scss'
|
|
4
|
-
|
|
5
|
-
file 'scripts/boxsizing.htc', :like => :javascript, :to => 'boxsizing.htc'
|
|
6
|
-
file 'scripts/html5shiv.js', :like => :javascript, :to => 'html5shiv.js'
|
|
7
|
-
file 'scripts/modernizr.custom.js', :like => :javascript, :to => 'modernizr.custom.js'
|
|
8
|
-
file 'scripts/respond.min.js', :like => :javascript, :to => 'respond.min.js'
|
|
9
|
-
|
|
10
|
-
html 'index.html'
|
|
11
|
-
html 'examples.html'
|
|
12
|
-
|
|
13
|
-
description "Respondsass: a fully configurable grid system native to Compass."
|
|
14
|
-
|
|
15
|
-
help %Q{
|
|
16
|
-
Please see the Respondsass website for all documentation and tutorials:
|
|
17
|
-
|
|
18
|
-
http://ww.my-html-codes.com/respondsass
|
|
19
|
-
}
|
|
20
|
-
|
|
21
|
-
welcome_message %Q{
|
|
22
|
-
Please see the Respondsass website for all documentation and tutorials:
|
|
23
|
-
|
|
24
|
-
http://ww.my-html-codes.com/respondsass
|
|
25
|
-
|
|
26
|
-
To get started, set up your grid in the base partial by following the inline instructions.
|
|
27
|
-
}
|
|
@@ -1,38 +0,0 @@
|
|
|
1
|
-
//import compass css3 mixins for use in your project.
|
|
2
|
-
@import "compass/css3";
|
|
3
|
-
//import compass reset for use in your project.
|
|
4
|
-
@import "compass/reset";
|
|
5
|
-
|
|
6
|
-
//DO NOT DELETE
|
|
7
|
-
//set boxing sizing to border-box for all browsers.
|
|
8
|
-
*{
|
|
9
|
-
@include box-sizing(border-box);
|
|
10
|
-
*behavior: url(scripts/boxsizing.htc);
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
//Imports the _base.scss file into the main css file.
|
|
14
|
-
@import "base";
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
// ***** JUST FOR EXAMPLES DELETE AS NECESSARY ******
|
|
18
|
-
body {
|
|
19
|
-
font-family: $fontFamily;
|
|
20
|
-
@include rem-sizing(font-size, 0.8);
|
|
21
|
-
line-height:1.5;
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
@include create-grid(thirds, 3); // The thirds argument is your own column name and will create class name of thirds suffixed with a number, number of columns
|
|
25
|
-
|
|
26
|
-
@include create-grid(); // This is the default and will create a 16 column grid with class names of span suffixed with a number
|
|
27
|
-
|
|
28
|
-
@include create-grid(fifths, 5); // 5 columns with class name of fifths
|
|
29
|
-
|
|
30
|
-
@include create-grid(cols, 12); // 12 columns with class name of cols
|
|
31
|
-
|
|
32
|
-
.span-1, .thirds-1, .thirds-2, .fifths-1, .fifths-2, .fifths-3, .fifths-4, .cols-1, .cols-2, .cols-3, .cols-4, .cols-5, .cols-6 {
|
|
33
|
-
background-color: #ccc;
|
|
34
|
-
border:3px solid #fff;
|
|
35
|
-
height: 50px;
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
// ******* END OF EXAMPLE CSS ********
|