atlas_assets 0.1.13 → 0.1.14
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/Gemfile +1 -0
- data/Procfile.dev +2 -0
- data/docs/_posts/2013-05-30-tabs.md +46 -0
- data/lib/assets/javascripts/atlas_assets.js +2 -1
- data/lib/assets/javascripts/tabs.js +21 -0
- data/lib/assets/stylesheets/atlas_assets.scss +1 -0
- data/lib/assets/stylesheets/atlas_assets/_tabs.scss +54 -0
- data/lib/atlas_assets/version.rb +1 -1
- metadata +6 -2
data/Gemfile
CHANGED
data/Procfile.dev
ADDED
@@ -0,0 +1,46 @@
|
|
1
|
+
---
|
2
|
+
layout: default
|
3
|
+
title: "Tabs"
|
4
|
+
date: 2013-06-30 23:24:04
|
5
|
+
---
|
6
|
+
|
7
|
+
Tabs
|
8
|
+
====
|
9
|
+
|
10
|
+
<div class="tabs-container row-fluid">
|
11
|
+
<ul class="tabs span4">
|
12
|
+
<li data-target="#home" class="tab-anchor active">
|
13
|
+
Home<i class="icon-arrow-right-2"></i></li>
|
14
|
+
<li data-target="#tab2" class="tab-anchor">Tab 1<i class="icon-arrow-right-2"></i></li>
|
15
|
+
<li data-target="#tab3" class="tab-anchor">Tab 2<i class="icon-arrow-right-2"></i></li>
|
16
|
+
<li data-target="#this-tab" class="tab-anchor">Tab 3<i class="icon-arrow-right-2"></i></li>
|
17
|
+
</ul>
|
18
|
+
|
19
|
+
<div class="tab-content span8">
|
20
|
+
<div class="tab-pane active" id="home"><p>Content 1</p></div>
|
21
|
+
<div class="tab-pane" id="tab2"><p>Content 2</p></div>
|
22
|
+
<div class="tab-pane" id="tab3"><p>Content 3</p></div>
|
23
|
+
<div class="tab-pane" id="this-tab"><p>Content 4</p></div>
|
24
|
+
</div>
|
25
|
+
</div>
|
26
|
+
|
27
|
+
<br />
|
28
|
+
|
29
|
+
~~~html
|
30
|
+
<div class="tabs-container row-fluid">
|
31
|
+
<ul class="tabs span4">
|
32
|
+
<li data-target="#home" class="tab-anchor active">
|
33
|
+
Home<i class="icon-arrow-right-2"></i></li>
|
34
|
+
<li data-target="#tab2" class="tab-anchor">Tab 1<i class="icon-arrow-right-2"></i></li>
|
35
|
+
<li data-target="#tab3" class="tab-anchor">Tab 2<i class="icon-arrow-right-2"></i></li>
|
36
|
+
<li data-target="#this-tab" class="tab-anchor">Tab 3<i class="icon-arrow-right-2"></i></li>
|
37
|
+
</ul>
|
38
|
+
|
39
|
+
<div class="tab-content span8">
|
40
|
+
<div class="tab-pane active" id="home"><p>Content 1</p></div>
|
41
|
+
<div class="tab-pane" id="tab2"><p>Content 2</p></div>
|
42
|
+
<div class="tab-pane" id="tab3"><p>Content 3</p></div>
|
43
|
+
<div class="tab-pane" id="this-tab"><p>Content 4</p></div>
|
44
|
+
</div>
|
45
|
+
</div>
|
46
|
+
~~~
|
@@ -0,0 +1,21 @@
|
|
1
|
+
$(function() {
|
2
|
+
var makeActive = function ($el) {
|
3
|
+
$el.addClass('active').siblings().removeClass('active');
|
4
|
+
}
|
5
|
+
|
6
|
+
var showTab = function ($el) {
|
7
|
+
target = $($el.data().target);
|
8
|
+
makeActive($el);
|
9
|
+
makeActive(target);
|
10
|
+
}
|
11
|
+
|
12
|
+
$('.tabs .tab-anchor').click(function (e) {
|
13
|
+
// don't do anything if the click was in an input
|
14
|
+
if (e.target.tagName === "INPUT") {
|
15
|
+
e.stopPropagation();
|
16
|
+
} else {
|
17
|
+
e.preventDefault();
|
18
|
+
showTab($(this));
|
19
|
+
}
|
20
|
+
});
|
21
|
+
});
|
@@ -0,0 +1,54 @@
|
|
1
|
+
.tabs-container {
|
2
|
+
@include clearfix();
|
3
|
+
|
4
|
+
.tabs {
|
5
|
+
list-style: none;
|
6
|
+
margin: 0;
|
7
|
+
padding: 0;
|
8
|
+
}
|
9
|
+
|
10
|
+
.tabs li {
|
11
|
+
@include box-sizing(border-box);
|
12
|
+
background: $lightest_gray;
|
13
|
+
list-style: none;
|
14
|
+
font-weight: bold;
|
15
|
+
margin: 0;
|
16
|
+
padding: 0;
|
17
|
+
padding: 1em;
|
18
|
+
width: 100%;
|
19
|
+
border-left: 2px solid $lighter_gray;
|
20
|
+
border-right: 2px solid $lighter_gray;
|
21
|
+
border-top: 2px solid $lighter_gray;
|
22
|
+
|
23
|
+
.icon-arrow-right-2 {
|
24
|
+
display: none;
|
25
|
+
}
|
26
|
+
|
27
|
+
&:last-child {
|
28
|
+
border-bottom: 2px solid $lighter_gray;
|
29
|
+
}
|
30
|
+
|
31
|
+
&:hover {
|
32
|
+
color: $blue;
|
33
|
+
cursor: pointer;
|
34
|
+
}
|
35
|
+
|
36
|
+
&.active .icon-arrow-right-2 {
|
37
|
+
display: block;
|
38
|
+
|
39
|
+
float: right;
|
40
|
+
}
|
41
|
+
}
|
42
|
+
|
43
|
+
.tab-pane {
|
44
|
+
@include box-sizing(border-box);
|
45
|
+
padding: 1em;
|
46
|
+
@extend .box.box-white;
|
47
|
+
display: none;
|
48
|
+
|
49
|
+
&.active {
|
50
|
+
display: block;
|
51
|
+
}
|
52
|
+
}
|
53
|
+
}
|
54
|
+
|
data/lib/atlas_assets/version.rb
CHANGED
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: atlas_assets
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 0.1.
|
4
|
+
version: 0.1.14
|
5
5
|
prerelease:
|
6
6
|
platform: ruby
|
7
7
|
authors:
|
@@ -9,7 +9,7 @@ authors:
|
|
9
9
|
autorequire:
|
10
10
|
bindir: bin
|
11
11
|
cert_chain: []
|
12
|
-
date: 2013-08-
|
12
|
+
date: 2013-08-21 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: handlebars_assets
|
@@ -39,6 +39,7 @@ files:
|
|
39
39
|
- Gemfile.lock
|
40
40
|
- LICENSE
|
41
41
|
- Procfile
|
42
|
+
- Procfile.dev
|
42
43
|
- README.md
|
43
44
|
- Rakefile
|
44
45
|
- _config.yml
|
@@ -58,6 +59,7 @@ files:
|
|
58
59
|
- docs/_posts/2013-05-21-forms.md
|
59
60
|
- docs/_posts/2013-05-22-boxes.md
|
60
61
|
- docs/_posts/2013-05-29-modals.md
|
62
|
+
- docs/_posts/2013-05-30-tabs.md
|
61
63
|
- docs/index.html
|
62
64
|
- lib/assets/fonts/atlas.eot
|
63
65
|
- lib/assets/fonts/atlas.svg
|
@@ -74,6 +76,7 @@ files:
|
|
74
76
|
- lib/assets/javascripts/keypress.js
|
75
77
|
- lib/assets/javascripts/pusher.js
|
76
78
|
- lib/assets/javascripts/string.js
|
79
|
+
- lib/assets/javascripts/tabs.js
|
77
80
|
- lib/assets/javascripts/underscore.js
|
78
81
|
- lib/assets/stylesheets/atlas_assets.scss
|
79
82
|
- lib/assets/stylesheets/atlas_assets/_boxes.scss
|
@@ -94,6 +97,7 @@ files:
|
|
94
97
|
- lib/assets/stylesheets/atlas_assets/_responsive-767.scss
|
95
98
|
- lib/assets/stylesheets/atlas_assets/_responsive-768-979.scss
|
96
99
|
- lib/assets/stylesheets/atlas_assets/_responsive-utilities.scss
|
100
|
+
- lib/assets/stylesheets/atlas_assets/_tabs.scss
|
97
101
|
- lib/assets/stylesheets/atlas_assets/_utilities.scss
|
98
102
|
- lib/assets/stylesheets/atlas_assets/_variables.scss
|
99
103
|
- lib/atlas_assets.rb
|