bootstrap-bookingsync-sass 0.0.17 → 0.0.18

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.
@@ -1,116 +1,158 @@
1
- ## Menu
2
-
3
- ### Basic example
1
+ # Menu
4
2
 
5
3
  <div class="example">
6
- <nav class="menu flex-col">
7
- <header class="dropdown">
8
- <div class="bar">
9
- <img src="http://placehold.it/24x24" class="img-responsive img-circle brand" alt="Fullname">
10
- <p>
11
- Surf Office: Lisbon<br>
12
- <small>
13
- <a data-target="#menu-header-submenu" href="#" data-toggle="dropdown"
14
- aria-haspopup="true" aria-expanded="false" id="menu-switch-account">Switch account
15
- <span class="caret"></span></a>
16
- </small>
17
- </p>
18
- </div>
19
- <div id="menu-header-submenu" class="menu-dropdown" aria-labelledby="menu-switch-account">
4
+ <div class="sheet-header">
5
+ <h3 id="menu-example">Basic example</h3>
6
+ </div>
7
+ <div class="bs-example bs-sheet" data-example-id="menu-example">
8
+ <nav class="menu flex-col">
9
+ <header class="dropdown">
10
+ <div class="bar">
11
+ <img src="http://placehold.it/24x24" class="img-responsive img-circle brand"
12
+ alt="Fullname">
13
+ <p>
14
+ Vacation Rentals<br>
15
+ <small>
16
+ <a data-target="#menu-header-submenu" href="#"
17
+ data-toggle="dropdown"
18
+ aria-haspopup="true" aria-expanded="false"
19
+ id="menu-switch-account">Switch account
20
+ <span class="caret"></span></a>
21
+ </small>
22
+ </p>
23
+ </div>
24
+ <div id="menu-header-submenu" class="menu-dropdown"
25
+ aria-labelledby="menu-switch-account">
26
+ <ol>
27
+ <li role="presentation">
28
+ <a href="#">Bed and Breakfast</a>
29
+ </li>
30
+ <li role="presentation" class="active">
31
+ <a href="#">City Apartments</a>
32
+ </li>
33
+ </ol>
34
+ </div>
35
+ </header>
36
+ <div class="body flex-1">
20
37
  <ol>
38
+ <li role="presentation" class="active">
39
+ <a href="#">
40
+ <i class="fa fa-calendar fa-fw"></i>
41
+ <span>Bookings</span>
42
+ </a>
43
+ </li>
21
44
  <li role="presentation">
22
- <a href="#">SurfOffice: Grand Canaria</a>
45
+ <a href="#">
46
+ <i class="fa fa-users fa-fw"></i>
47
+ <span>Clients</span>
48
+ </a>
23
49
  </li>
24
- <li role="presentation" class="active">
25
- <a href="#">SurfOffice: Santa Cruz</a>
50
+ <li role="presentation">
51
+ <a href="#">
52
+ <i class="fa fa-envelope-o fa-fw"></i>
53
+ <span>Inquiries</span></a>
26
54
  </li>
27
- </ol>
28
- </div>
29
- </header>
30
- <div class="body flex-1">
31
- <ol>
32
- <li role="presentation" class="active">
33
- <a href="#"><i class="fa fa-calendar fa-fw"></i> <span>Bookings</span></a>
34
- </li>
35
- <li role="presentation">
36
- <a href="#"><i class="fa fa-users fa-fw"></i> <span>Clients</span></a>
37
- </li>
38
- <li role="presentation">
39
- <a href="#"><i class="fa fa-envelope-o fa-fw"></i> <span>Inquiries</span></a>
40
- </li>
41
- <li role="presentation">
42
- <a href="#"><i class="fa fa-home fa-fw"></i> <span>Rentals</span></a>
43
- </li>
44
- <li role="presentation">
45
- <a href="#"><i class="fa fa-star fa-fw"></i> <span>Reviews</span></a>
46
- </li>
47
- <li role="presentation">
48
- <a href="#"><i class="fa fa-globe fa-fw"></i> <span>Website</span></a>
49
- </li>
50
- <li role="presentation">
51
- <a href="#"><i class="fa fa-cubes fa-fw"></i> <span>Apps</span></a>
52
- </li>
53
- </ol>
54
- </div>
55
- <footer>
56
- <div class="bar">
57
- <img src="https://s3-us-west-2.amazonaws.com/slack-files2/avatars/2015-06-11/6253926944_bd7ce3198dba69ac91be_24.jpg" class="img-responsive img-circle avatar" alt="Peter Fabor">
58
- <p>
59
- Peter Fabor<br>
60
- <small>
61
- <a data-target="#menu-footer-submenu" href="#" data-toggle="dropdown"
62
- aria-haspopup="true" aria-expanded="false" id="menu-manage-account">Manage Account
63
- <i class="fa fa-gear"></i></a>
64
- </small>
65
- </p>
66
- </div>
67
- <div id="menu-footer-submenu" class="menu-dropright flex-col" aria-labelledby="menu-manage-account">
68
- <ol class="flex-1">
69
- <li class="back text-center" role="presentation">
70
- <a data-target="#menu-footer-submenu" href="#" data-toggle="dropdown">
71
- <i class="fa fa-long-arrow-left fa-fw"></i> <span class="sr-only">Back</span></a>
55
+ <li role="presentation">
56
+ <a href="#">
57
+ <i class="fa fa-home fa-fw"></i>
58
+ <span>Rentals</span>
59
+ </a>
72
60
  </li>
73
61
  <li role="presentation">
74
- <a href="#"><i class="fa fa-user fa-fw"></i> <span>Personal Information</span></a>
62
+ <a href="#">
63
+ <i class="fa fa-star fa-fw"></i>
64
+ <span>Reviews</span>
65
+ </a>
75
66
  </li>
76
67
  <li role="presentation">
77
- <a href="#"><i class="fa fa-calendar-o fa-fw"></i> <span>Calendar Preferences</span></a>
68
+ <a href="#">
69
+ <i class="fa fa-globe fa-fw"></i>
70
+ <span>Website</span>
71
+ </a>
78
72
  </li>
79
73
  <li role="presentation">
80
- <a href="#"><i class="fa fa-clock-o fa-fw"></i> <span>Time Format</span></a>
74
+ <a href="#">
75
+ <i class="fa fa-cubes fa-fw"></i>
76
+ <span>Apps</span>
77
+ </a>
81
78
  </li>
82
79
  </ol>
83
80
  </div>
84
- </footer>
85
- </nav>
81
+ <footer>
82
+ <div class="bar">
83
+ <img src="http://placehold.it/24x24"
84
+ class="img-responsive img-circle avatar" alt="John Doe">
85
+ <p>
86
+ John Doe<br>
87
+ <small>
88
+ <a data-target="#menu-footer-submenu" href="#"
89
+ data-toggle="dropdown"
90
+ aria-haspopup="true" aria-expanded="false"
91
+ id="menu-manage-account">Manage Account
92
+ <i class="fa fa-gear"></i></a>
93
+ </small>
94
+ </p>
95
+ </div>
96
+ <div id="menu-footer-submenu" class="menu-dropright flex-col"
97
+ aria-labelledby="menu-manage-account">
98
+ <ol class="flex-1">
99
+ <li class="back text-center" role="presentation">
100
+ <a data-target="#menu-footer-submenu" href="#"
101
+ data-toggle="dropdown">
102
+ <i class="fa fa-long-arrow-left fa-fw"></i>
103
+ <span class="sr-only">Back</span>
104
+ </a>
105
+ </li>
106
+ <li role="presentation">
107
+ <a href="#">
108
+ <i class="fa fa-user fa-fw"></i>
109
+ <span>Personal Information</span>
110
+ </a>
111
+ </li>
112
+ <li role="presentation">
113
+ <a href="#">
114
+ <i class="fa fa-calendar-o fa-fw"></i>
115
+ <span>Calendar Preferences</span>
116
+ </a>
117
+ </li>
118
+ <li role="presentation">
119
+ <a href="#">
120
+ <i class="fa fa-clock-o fa-fw"></i>
121
+ <span>Time Format</span>
122
+ </a>
123
+ </li>
124
+ </ol>
125
+ </div>
126
+ </footer>
127
+ </nav>
128
+ </div>
86
129
  </div>
87
130
 
88
131
  ~~~ html
89
132
  <nav class="menu flex-col">
90
133
  <header class="dropdown">
91
134
  <div class="bar">
92
- <img src="http://placehold.it/24x24" class="img-responsive img-circle brand" alt="Fullname">
135
+ <img src="http://placehold.it/24x24" class="img-responsive img-circle brand"
136
+ alt="Fullname">
93
137
  <p>
94
- Surf Office: Lisbon<br>
138
+ Vacation Rentals<br>
95
139
  <small>
96
- <a data-target="#menu-header-submenu" href="#" data-toggle="dropdown"
97
- aria-haspopup="true" aria-expanded="false" id="menu-switch-account">Switch account
140
+ <a data-target="#menu-header-submenu" href="#"
141
+ data-toggle="dropdown"
142
+ aria-haspopup="true" aria-expanded="false"
143
+ id="menu-switch-account">Switch account
98
144
  <span class="caret"></span></a>
99
145
  </small>
100
146
  </p>
101
147
  </div>
102
- <div id="menu-header-submenu" class="menu-dropdown" aria-labelledby="menu-switch-account">
148
+ <div id="menu-header-submenu" class="menu-dropdown"
149
+ aria-labelledby="menu-switch-account">
103
150
  <ol>
104
151
  <li role="presentation">
105
- <a href="#">SurfOffice: Lisbon
106
- <span class="label label-transparent pull-right">current</span>
107
- </a>
108
- </li>
109
- <li role="presentation">
110
- <a href="#">SurfOffice: Grand Canaria</a>
152
+ <a href="#">Bed and Breakfast</a>
111
153
  </li>
112
154
  <li role="presentation" class="active">
113
- <a href="#">SurfOffice: Santa Cruz</a>
155
+ <a href="#">City Apartments</a>
114
156
  </li>
115
157
  </ol>
116
158
  </div>
@@ -118,54 +160,90 @@
118
160
  <div class="body flex-1">
119
161
  <ol>
120
162
  <li role="presentation" class="active">
121
- <a href="#"><i class="fa fa-calendar fa-fw"></i> <span>Bookings</span></a>
163
+ <a href="#">
164
+ <i class="fa fa-calendar fa-fw"></i>
165
+ <span>Bookings</span>
166
+ </a>
122
167
  </li>
123
168
  <li role="presentation">
124
- <a href="#"><i class="fa fa-users fa-fw"></i> <span>Clients</span></a>
169
+ <a href="#">
170
+ <i class="fa fa-users fa-fw"></i>
171
+ <span>Clients</span>
172
+ </a>
125
173
  </li>
126
174
  <li role="presentation">
127
- <a href="#"><i class="fa fa-envelope-o fa-fw"></i> <span>Inquiries</span></a>
175
+ <a href="#">
176
+ <i class="fa fa-envelope-o fa-fw"></i>
177
+ <span>Inquiries</span></a>
128
178
  </li>
129
179
  <li role="presentation">
130
- <a href="#"><i class="fa fa-home fa-fw"></i> <span>Rentals</span></a>
180
+ <a href="#">
181
+ <i class="fa fa-home fa-fw"></i>
182
+ <span>Rentals</span>
183
+ </a>
131
184
  </li>
132
185
  <li role="presentation">
133
- <a href="#"><i class="fa fa-star fa-fw"></i> <span>Reviews</span></a>
186
+ <a href="#">
187
+ <i class="fa fa-star fa-fw"></i>
188
+ <span>Reviews</span>
189
+ </a>
134
190
  </li>
135
191
  <li role="presentation">
136
- <a href="#"><i class="fa fa-globe fa-fw"></i> <span>Website</span></a>
192
+ <a href="#">
193
+ <i class="fa fa-globe fa-fw"></i>
194
+ <span>Website</span>
195
+ </a>
137
196
  </li>
138
197
  <li role="presentation">
139
- <a href="#"><i class="fa fa-cubes fa-fw"></i> <span>Apps</span></a>
198
+ <a href="#">
199
+ <i class="fa fa-cubes fa-fw"></i>
200
+ <span>Apps</span>
201
+ </a>
140
202
  </li>
141
203
  </ol>
142
204
  </div>
143
205
  <footer>
144
206
  <div class="bar">
145
- <img src="https://s3-us-west-2.amazonaws.com/slack-files2/avatars/2015-06-11/6253926944_bd7ce3198dba69ac91be_24.jpg" class="img-responsive img-circle avatar" alt="Peter Fabor">
207
+ <img src="http://placehold.it/24x24"
208
+ class="img-responsive img-circle avatar" alt="John Doe">
146
209
  <p>
147
- Peter Fabor<br>
210
+ John Doe<br>
148
211
  <small>
149
- <a data-target="#menu-footer-submenu" href="#" data-toggle="dropdown"
150
- aria-haspopup="true" aria-expanded="false" id="menu-manage-account">Manage Account
212
+ <a data-target="#menu-footer-submenu" href="#"
213
+ data-toggle="dropdown"
214
+ aria-haspopup="true" aria-expanded="false"
215
+ id="menu-manage-account">Manage Account
151
216
  <i class="fa fa-gear"></i></a>
152
217
  </small>
153
218
  </p>
154
219
  </div>
155
- <div id="menu-footer-submenu" class="menu-dropright flex-col" aria-labelledby="menu-manage-account">
220
+ <div id="menu-footer-submenu" class="menu-dropright flex-col"
221
+ aria-labelledby="menu-manage-account">
156
222
  <ol class="flex-1">
157
- <li role="presentation">
158
- <a data-target="#menu-footer-submenu" href="#" data-toggle="dropdown">
159
- <i class="fa fa-long-arrow-left fa-fw"></i> <span>Back</span></a>
223
+ <li class="back text-center" role="presentation">
224
+ <a data-target="#menu-footer-submenu" href="#"
225
+ data-toggle="dropdown">
226
+ <i class="fa fa-long-arrow-left fa-fw"></i>
227
+ <span class="sr-only">Back</span>
228
+ </a>
160
229
  </li>
161
230
  <li role="presentation">
162
- <a href="#"><i class="fa fa-user fa-fw"></i> <span>Personal Information</span></a>
231
+ <a href="#">
232
+ <i class="fa fa-user fa-fw"></i>
233
+ <span>Personal Information</span>
234
+ </a>
163
235
  </li>
164
236
  <li role="presentation">
165
- <a href="#"><i class="fa fa-calendar-o fa-fw"></i> <span>Calendar Preferences</span></a>
237
+ <a href="#">
238
+ <i class="fa fa-calendar-o fa-fw"></i>
239
+ <span>Calendar Preferences</span>
240
+ </a>
166
241
  </li>
167
242
  <li role="presentation">
168
- <a href="#"><i class="fa fa-clock-o fa-fw"></i> <span>Time Format</span></a>
243
+ <a href="#">
244
+ <i class="fa fa-clock-o fa-fw"></i>
245
+ <span>Time Format</span>
246
+ </a>
169
247
  </li>
170
248
  </ol>
171
249
  </div>
@@ -173,9 +251,14 @@
173
251
  </nav>
174
252
  ~~~
175
253
 
176
- ### Full height fixed position menu
177
-
178
- Add `.menu-fixed` class to make the menu fixed to the left viewport edge.
254
+ <div class="example">
255
+ <div class="sheet-header">
256
+ <h3 id="menu-example">Full height fixed position menu</h3>
257
+ </div>
258
+ <div class="bs-example bs-sheet" data-example-id="menu-example">
259
+ <p>Add <code>.menu-fixed</code> class to make the menu fixed to the left viewport edge.</p>
260
+ </div>
261
+ </div>
179
262
 
180
263
  ~~~ html
181
264
  <nav class="menu menu-fixed flex-col">
@@ -1,7 +1,9 @@
1
- ##Sheet
1
+ # Sheet
2
2
 
3
3
  <div class="example">
4
- <h2 id="sheet-example">Basic example</h2>
4
+ <div class="sheet-header">
5
+ <h3 id="sheet-example">Basic example</h3>
6
+ </div>
5
7
  <p>Highly inspired from the <code>panel</code> component, the sheet will auto scale and have a relative position to ease children positioning.</p>
6
8
  <div class="bs-example bs-sheet" data-example-id="sheet-example">
7
9
  <div class="sheet">
@@ -16,8 +18,11 @@
16
18
  ~~~
17
19
 
18
20
  <div class="example">
19
- <h2 id="sheet-example-with-header">Example with header</h2>
20
- <div class="bs-example bs-sheet-with-header" data-example-id="sheet-example-with-header">
21
+ <div class="sheet-header">
22
+ <h3 id="sheet-example-with-header">Example with header</h3>
23
+ </div>
24
+ <div class="bs-example bs-sheet-with-header"
25
+ data-example-id="sheet-example-with-header">
21
26
  <div class="sheet">
22
27
  <div class="sheet-header">
23
28
  <h2>Header</h2>
@@ -34,3 +39,250 @@
34
39
  <p>Text...</p>
35
40
  </div>
36
41
  ~~~
42
+
43
+ <div class="example">
44
+ <div class="sheet-header">
45
+ <h3 id="sheet-example-with-tabs">Example with tabs</h3>
46
+ </div>
47
+ <div class="bs-example bs-sheet" data-example-id="sheet-example-with-tabs">
48
+ <div class="sheet">
49
+ <ul class="nav nav-tabs">
50
+ <li class="active"><a href="#">Tab 1</a></li>
51
+ <li><a href="#">Tab 2</a></li>
52
+ <li><a href="#">Tab 3</a></li>
53
+ </ul>
54
+ <div>
55
+ <p>Text...</p>
56
+ </div>
57
+ </div>
58
+ </div>
59
+ </div>
60
+ ~~~ html
61
+ <div class="sheet">
62
+ <ul class="nav nav-tabs">
63
+ <li class="active"><a href="#">Tab 1</a></li>
64
+ <li><a href="#">Tab 2</a></li>
65
+ <li><a href="#">Tab 3</a></li>
66
+ </ul>
67
+ <div>
68
+ <p>Text...</p>
69
+ </div>
70
+ </div>
71
+ ~~~
72
+
73
+ <div class="example">
74
+ <div class="sheet-header">
75
+ <h3 id="sheet-example-with-stacked-tabs">Example with stacked tabs</h3>
76
+ </div>
77
+ <div class="bs-example bs-sheet"
78
+ data-example-id="sheet-example-with-stacked-tabs">
79
+ <div class="sheet">
80
+ <ul class="nav nav-tabs">
81
+ <li><a href="#">Tab 1</a></li>
82
+ <li class="active"><a href="#">Tab 2</a></li>
83
+ <li><a href="#">Tab 3</a></li>
84
+ <li class="dropdown pull-right">
85
+ <a class="dropdown-toggle" data-toggle="dropdown" href="#">
86
+ More <span class="caret"></span>
87
+ </a>
88
+ <ul class="dropdown-menu">
89
+ <li><a href="#">Tab 4</a></li>
90
+ <li><a href="#">Tab 5</a></li>
91
+ </ul>
92
+ </li>
93
+ </ul>
94
+ <div>
95
+ <p>Text...</p>
96
+ </div>
97
+ </div>
98
+ </div>
99
+ </div>
100
+ ~~~ html
101
+ <div class="sheet">
102
+ <ul class="nav nav-tabs">
103
+ <li><a href="#">Tab 1</a></li>
104
+ <li class="active"><a href="#">Tab 2</a></li>
105
+ <li><a href="#">Tab 3</a></li>
106
+ <li class="dropdown pull-right">
107
+ <a class="dropdown-toggle" data-toggle="dropdown" href="#">
108
+ More <span class="caret"></span>
109
+ </a>
110
+ <ul class="dropdown-menu">
111
+ <li><a href="#">Tab 4</a></li>
112
+ <li><a href="#">Tab 5</a></li>
113
+ </ul>
114
+ </li>
115
+ </ul>
116
+ <div>
117
+ <p>Text...</p>
118
+ </div>
119
+ </div>
120
+ ~~~
121
+
122
+ <div class="example">
123
+ <div class="sheet-header">
124
+ <h3 id="sheet-example-with-auto-stackable-tabs">
125
+ Example with auto-stackable tabs
126
+ </h3>
127
+ </div>
128
+
129
+ <div class="bs-callout bs-callout-danger">
130
+ <h4>Plugin dependency</h4>
131
+ <p>
132
+ This component requires customized bootstrapStackable JS plugin provided by the bootstrap-bookingsync-sass gem.
133
+ </p>
134
+ </div>
135
+
136
+ <div class="bs-example bs-sheet"
137
+ data-example-id="sheet-example-with-auto-stackable-tabs">
138
+ <div class="sheet">
139
+ <ul class="nav nav-tabs" data-toggle="stackable"
140
+ data-target=".stackable-dropdown">
141
+ <li><a href="#">Tab 1</a></li>
142
+ <li class="active"><a href="#">Tab 2</a></li>
143
+ <li><a href="#">Tab 3</a></li>
144
+ <li><a href="#">Tab 4</a></li>
145
+ <li><a href="#">Tab 5</a></li>
146
+ <li><a href="#">Tab 6</a></li>
147
+ <li><a href="#">Tab 7</a></li>
148
+ <li><a href="#">Tab 8</a></li>
149
+ <li><a href="#">Tab 9</a></li>
150
+ <li><a href="#">Tab 10</a></li>
151
+ <li><a href="#">Tab 11</a></li>
152
+ <li><a href="#">Tab 12</a></li>
153
+ <li><a href="#">Tab Last</a></li>
154
+ <li class="dropdown pull-right stackable-dropdown">
155
+ <a class="dropdown-toggle" data-toggle="dropdown" href="#">
156
+ More <span class="caret"></span>
157
+ </a>
158
+ <ul class="dropdown-menu">
159
+ </ul>
160
+ </li>
161
+ </ul>
162
+ <div>
163
+ <p>Text...</p>
164
+ </div>
165
+ </div>
166
+
167
+ <div class="sheet">
168
+ <ul class="nav nav-tabs" data-toggle="stackable"
169
+ data-target=".stackable-dropdown">
170
+ <li><a href="#">Tab 1</a></li>
171
+ <li class="active"><a href="#">Tab 2</a></li>
172
+ <li><a href="#">Tab 3</a></li>
173
+ <li><a href="#">Tab 4</a></li>
174
+ <li><a href="#">Tab 5</a></li>
175
+ <li><a href="#">Tab 6</a></li>
176
+ <li><a href="#">Tab 7</a></li>
177
+ <li><a href="#">Tab 8</a></li>
178
+ <li><a href="#">Tab Last</a></li>
179
+ <li class="dropdown pull-right stackable-dropdown">
180
+ <a class="dropdown-toggle" data-toggle="dropdown" href="#">
181
+ More <span class="caret"></span>
182
+ </a>
183
+ <ul class="dropdown-menu">
184
+ </ul>
185
+ </li>
186
+ </ul>
187
+ <div>
188
+ <p>Text...</p>
189
+ </div>
190
+ </div>
191
+
192
+ <div class="sheet">
193
+ <ul class="nav nav-tabs" data-toggle="stackable"
194
+ data-target=".stackable-dropdown">
195
+ <li><a href="#">Tab 1</a></li>
196
+ <li class="active"><a href="#">Tab 2</a></li>
197
+ <li><a href="#">Tab Last</a></li>
198
+ <li class="dropdown pull-right stackable-dropdown">
199
+ <a class="dropdown-toggle" data-toggle="dropdown" href="#">
200
+ More <span class="caret"></span>
201
+ </a>
202
+ <ul class="dropdown-menu">
203
+ </ul>
204
+ </li>
205
+ </ul>
206
+ <div>
207
+ <p>Text...</p>
208
+ </div>
209
+ </div>
210
+ </div>
211
+ </div>
212
+ ~~~ html
213
+ <div class="sheet">
214
+ <ul class="nav nav-tabs" data-toggle="stackable"
215
+ data-target=".stackable-dropdown">
216
+ <li><a href="#">Tab 1</a></li>
217
+ <li class="active"><a href="#">Tab 2</a></li>
218
+ <li><a href="#">Tab 3</a></li>
219
+ <li><a href="#">Tab 4</a></li>
220
+ <li><a href="#">Tab 5</a></li>
221
+ <li><a href="#">Tab 6</a></li>
222
+ <li><a href="#">Tab 7</a></li>
223
+ <li><a href="#">Tab 8</a></li>
224
+ <li><a href="#">Tab 9</a></li>
225
+ <li><a href="#">Tab 10</a></li>
226
+ <li><a href="#">Tab 11</a></li>
227
+ <li><a href="#">Tab 12</a></li>
228
+ <li><a href="#">Tab Last</a></li>
229
+ <li class="dropdown pull-right stackable-dropdown">
230
+ <a class="dropdown-toggle" data-toggle="dropdown" href="#">
231
+ More <span class="caret"></span>
232
+ </a>
233
+ <ul class="dropdown-menu">
234
+ </ul>
235
+ </li>
236
+ </ul>
237
+ <div>
238
+ <p>Text...</p>
239
+ </div>
240
+ </div>
241
+ ~~~
242
+
243
+ <div class="example">
244
+ <div class="sheet-header">
245
+ <h3 id="sheet-example-with-nested-tabs">Example with nested tabs</h3>
246
+ </div>
247
+ <div class="bs-example bs-sheet"
248
+ data-example-id="sheet-example-with-nested-tab">
249
+ <div class="sheet">
250
+ <ul class="nav nav-tabs">
251
+ <li class="active"><a href="#">Tab 1</a></li>
252
+ <li><a href="#">Tab 2</a></li>
253
+ <li><a href="#">Tab 3</a></li>
254
+ </ul>
255
+ <div>
256
+ <p>Text...</p>
257
+ <ul class="nav nav-tabs">
258
+ <li class="active"><a href="#">Tab 1</a></li>
259
+ <li><a href="#">Tab 2</a></li>
260
+ <li><a href="#">Tab 3</a></li>
261
+ </ul>
262
+ <div>
263
+ <p>Text...</p>
264
+ </div>
265
+ </div>
266
+ </div>
267
+ </div>
268
+ </div>
269
+ ~~~ html
270
+ <div class="sheet">
271
+ <ul class="nav nav-tabs">
272
+ <li class="active"><a href="#">Tab 1</a></li>
273
+ <li><a href="#">Tab 2</a></li>
274
+ <li><a href="#">Tab 3</a></li>
275
+ </ul>
276
+ <div>
277
+ <p>Text...</p>
278
+ <ul class="nav nav-tabs">
279
+ <li class="active"><a href="#">Tab 1</a></li>
280
+ <li><a href="#">Tab 2</a></li>
281
+ <li><a href="#">Tab 3</a></li>
282
+ </ul>
283
+ <div>
284
+ <p>Text...</p>
285
+ </div>
286
+ </div>
287
+ </div>
288
+ ~~~