├── Part 01 - Intro & Installation ├── css │ ├── bootstrap-theme.css │ ├── bootstrap-theme.css.map │ ├── bootstrap-theme.min.css │ ├── bootstrap.css │ ├── bootstrap.css.map │ └── bootstrap.min.css ├── fonts │ ├── glyphicons-halflings-regular.eot │ ├── glyphicons-halflings-regular.svg │ ├── glyphicons-halflings-regular.ttf │ └── glyphicons-halflings-regular.woff ├── index.html └── js │ ├── bootstrap.js │ └── bootstrap.min.js ├── Part 02 - Navbar with Dropdowns ├── css │ └── bootstrap.min.css ├── fonts │ ├── glyphicons-halflings-regular.eot │ ├── glyphicons-halflings-regular.svg │ ├── glyphicons-halflings-regular.ttf │ └── glyphicons-halflings-regular.woff ├── index.html └── js │ └── bootstrap.min.js ├── Part 03 - Fixed Footer ├── css │ └── bootstrap.min.css ├── fonts │ ├── glyphicons-halflings-regular.eot │ ├── glyphicons-halflings-regular.svg │ ├── glyphicons-halflings-regular.ttf │ └── glyphicons-halflings-regular.woff ├── index.html └── js │ └── bootstrap.min.js ├── Part 04 - Font Awesome & Social Icons ├── css │ ├── bootstrap.min.css │ └── custom.css ├── fonts │ ├── glyphicons-halflings-regular.eot │ ├── glyphicons-halflings-regular.svg │ ├── glyphicons-halflings-regular.ttf │ └── glyphicons-halflings-regular.woff ├── index.html └── js │ └── bootstrap.min.js ├── Part 05 - Jumbotron ├── css │ ├── bootstrap.min.css │ └── custom.css ├── fonts │ ├── glyphicons-halflings-regular.eot │ ├── glyphicons-halflings-regular.svg │ ├── glyphicons-halflings-regular.ttf │ └── glyphicons-halflings-regular.woff ├── index.html └── js │ └── bootstrap.min.js ├── Part 06 - Grid System ├── css │ ├── bootstrap.min.css │ └── custom.css ├── fonts │ ├── glyphicons-halflings-regular.eot │ ├── glyphicons-halflings-regular.svg │ ├── glyphicons-halflings-regular.ttf │ └── glyphicons-halflings-regular.woff ├── index.html └── js │ └── bootstrap.min.js ├── Part 07 - Modal ├── css │ ├── bootstrap.min.css │ └── custom.css ├── fonts │ ├── glyphicons-halflings-regular.eot │ ├── glyphicons-halflings-regular.svg │ ├── glyphicons-halflings-regular.ttf │ └── glyphicons-halflings-regular.woff ├── index.html └── js │ └── bootstrap.min.js ├── Part 08 - Thumbnails ├── css │ ├── bootstrap.min.css │ └── custom.css ├── fonts │ ├── glyphicons-halflings-regular.eot │ ├── glyphicons-halflings-regular.svg │ ├── glyphicons-halflings-regular.ttf │ └── glyphicons-halflings-regular.woff ├── img │ ├── appi.jpg │ ├── jiggy.jpg │ └── slate.jpg ├── index.html └── js │ └── bootstrap.min.js ├── Part 09 - Google Web Fonts ├── css │ ├── bootstrap.min.css │ └── custom.css ├── fonts │ ├── glyphicons-halflings-regular.eot │ ├── glyphicons-halflings-regular.svg │ ├── glyphicons-halflings-regular.ttf │ └── glyphicons-halflings-regular.woff ├── img │ ├── appi.jpg │ ├── jiggy.jpg │ └── slate.jpg ├── index.html └── js │ └── bootstrap.min.js ├── Part 10 - Contact Form ├── css │ ├── bootstrap.min.css │ └── custom.css ├── fonts │ ├── glyphicons-halflings-regular.eot │ ├── glyphicons-halflings-regular.svg │ ├── glyphicons-halflings-regular.ttf │ └── glyphicons-halflings-regular.woff ├── img │ ├── appi.jpg │ ├── jiggy.jpg │ └── slate.jpg ├── index.html └── js │ └── bootstrap.min.js ├── Part 11 - CSS Modifications ├── css │ ├── bootstrap.min.css │ └── custom.css ├── fonts │ ├── glyphicons-halflings-regular.eot │ ├── glyphicons-halflings-regular.svg │ ├── glyphicons-halflings-regular.ttf │ └── glyphicons-halflings-regular.woff ├── img │ ├── appi.jpg │ ├── jiggy.jpg │ └── slate.jpg ├── index.html └── js │ └── bootstrap.min.js ├── Part 12 - CSS Transform and Transition ├── css │ ├── bootstrap.min.css │ └── custom.css ├── fonts │ ├── glyphicons-halflings-regular.eot │ ├── glyphicons-halflings-regular.svg │ ├── glyphicons-halflings-regular.ttf │ └── glyphicons-halflings-regular.woff ├── img │ ├── appi.jpg │ ├── jiggy.jpg │ └── slate.jpg ├── index.html └── js │ └── bootstrap.min.js ├── Part 13 - Add a New Page ├── css │ ├── bootstrap.min.css │ └── custom.css ├── fonts │ ├── glyphicons-halflings-regular.eot │ ├── glyphicons-halflings-regular.svg │ ├── glyphicons-halflings-regular.ttf │ └── glyphicons-halflings-regular.woff ├── img │ ├── appi.jpg │ ├── jiggy.jpg │ └── slate.jpg ├── index.html ├── jiggy.html └── js │ └── bootstrap.min.js ├── Part 14 - Building the Theme Page ├── css │ ├── bootstrap.min.css │ └── custom.css ├── fonts │ ├── glyphicons-halflings-regular.eot │ ├── glyphicons-halflings-regular.svg │ ├── glyphicons-halflings-regular.ttf │ └── glyphicons-halflings-regular.woff ├── img │ ├── appi.jpg │ ├── jiggy.jpg │ └── slate.jpg ├── index.html ├── jiggy.html └── js │ └── bootstrap.min.js ├── Part 15 - Sidebar, Panels and Table ├── css │ ├── bootstrap.min.css │ └── custom.css ├── fonts │ ├── glyphicons-halflings-regular.eot │ ├── glyphicons-halflings-regular.svg │ ├── glyphicons-halflings-regular.ttf │ └── glyphicons-halflings-regular.woff ├── img │ ├── appi.jpg │ ├── jiggy.jpg │ ├── slate.jpg │ └── swoopthemes.jpg ├── index.html ├── jiggy.html └── js │ └── bootstrap.min.js ├── Part 16 - Carousel ├── css │ ├── bootstrap.min.css │ └── custom.css ├── fonts │ ├── glyphicons-halflings-regular.eot │ ├── glyphicons-halflings-regular.svg │ ├── glyphicons-halflings-regular.ttf │ └── glyphicons-halflings-regular.woff ├── img │ ├── appi.jpg │ ├── bblogo.jpg │ ├── jiggy.jpg │ ├── slate.jpg │ └── swoopthemes.jpg ├── index.html ├── jiggy.html └── js │ └── bootstrap.min.js └── README.md /Part 01 - Intro & Installation/css/bootstrap-theme.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * Bootstrap v3.1.1 (http://getbootstrap.com) 3 | * Copyright 2011-2014 Twitter, Inc. 4 | * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) 5 | */ 6 | 7 | .btn-default, 8 | .btn-primary, 9 | .btn-success, 10 | .btn-info, 11 | .btn-warning, 12 | .btn-danger { 13 | text-shadow: 0 -1px 0 rgba(0, 0, 0, .2); 14 | -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 1px rgba(0, 0, 0, .075); 15 | box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 1px rgba(0, 0, 0, .075); 16 | } 17 | .btn-default:active, 18 | .btn-primary:active, 19 | .btn-success:active, 20 | .btn-info:active, 21 | .btn-warning:active, 22 | .btn-danger:active, 23 | .btn-default.active, 24 | .btn-primary.active, 25 | .btn-success.active, 26 | .btn-info.active, 27 | .btn-warning.active, 28 | .btn-danger.active { 29 | -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125); 30 | box-shadow: inset 0 3px 5px rgba(0, 0, 0, .125); 31 | } 32 | .btn:active, 33 | .btn.active { 34 | background-image: none; 35 | } 36 | .btn-default { 37 | text-shadow: 0 1px 0 #fff; 38 | background-image: -webkit-linear-gradient(top, #fff 0%, #e0e0e0 100%); 39 | background-image: linear-gradient(to bottom, #fff 0%, #e0e0e0 100%); 40 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe0e0e0', GradientType=0); 41 | filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); 42 | background-repeat: repeat-x; 43 | border-color: #dbdbdb; 44 | border-color: #ccc; 45 | } 46 | .btn-default:hover, 47 | .btn-default:focus { 48 | background-color: #e0e0e0; 49 | background-position: 0 -15px; 50 | } 51 | .btn-default:active, 52 | .btn-default.active { 53 | background-color: #e0e0e0; 54 | border-color: #dbdbdb; 55 | } 56 | .btn-primary { 57 | background-image: -webkit-linear-gradient(top, #428bca 0%, #2d6ca2 100%); 58 | background-image: linear-gradient(to bottom, #428bca 0%, #2d6ca2 100%); 59 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff2d6ca2', GradientType=0); 60 | filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); 61 | background-repeat: repeat-x; 62 | border-color: #2b669a; 63 | } 64 | .btn-primary:hover, 65 | .btn-primary:focus { 66 | background-color: #2d6ca2; 67 | background-position: 0 -15px; 68 | } 69 | .btn-primary:active, 70 | .btn-primary.active { 71 | background-color: #2d6ca2; 72 | border-color: #2b669a; 73 | } 74 | .btn-success { 75 | background-image: -webkit-linear-gradient(top, #5cb85c 0%, #419641 100%); 76 | background-image: linear-gradient(to bottom, #5cb85c 0%, #419641 100%); 77 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff419641', GradientType=0); 78 | filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); 79 | background-repeat: repeat-x; 80 | border-color: #3e8f3e; 81 | } 82 | .btn-success:hover, 83 | .btn-success:focus { 84 | background-color: #419641; 85 | background-position: 0 -15px; 86 | } 87 | .btn-success:active, 88 | .btn-success.active { 89 | background-color: #419641; 90 | border-color: #3e8f3e; 91 | } 92 | .btn-info { 93 | background-image: -webkit-linear-gradient(top, #5bc0de 0%, #2aabd2 100%); 94 | background-image: linear-gradient(to bottom, #5bc0de 0%, #2aabd2 100%); 95 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff2aabd2', GradientType=0); 96 | filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); 97 | background-repeat: repeat-x; 98 | border-color: #28a4c9; 99 | } 100 | .btn-info:hover, 101 | .btn-info:focus { 102 | background-color: #2aabd2; 103 | background-position: 0 -15px; 104 | } 105 | .btn-info:active, 106 | .btn-info.active { 107 | background-color: #2aabd2; 108 | border-color: #28a4c9; 109 | } 110 | .btn-warning { 111 | background-image: -webkit-linear-gradient(top, #f0ad4e 0%, #eb9316 100%); 112 | background-image: linear-gradient(to bottom, #f0ad4e 0%, #eb9316 100%); 113 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0ad4e', endColorstr='#ffeb9316', GradientType=0); 114 | filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); 115 | background-repeat: repeat-x; 116 | border-color: #e38d13; 117 | } 118 | .btn-warning:hover, 119 | .btn-warning:focus { 120 | background-color: #eb9316; 121 | background-position: 0 -15px; 122 | } 123 | .btn-warning:active, 124 | .btn-warning.active { 125 | background-color: #eb9316; 126 | border-color: #e38d13; 127 | } 128 | .btn-danger { 129 | background-image: -webkit-linear-gradient(top, #d9534f 0%, #c12e2a 100%); 130 | background-image: linear-gradient(to bottom, #d9534f 0%, #c12e2a 100%); 131 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc12e2a', GradientType=0); 132 | filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); 133 | background-repeat: repeat-x; 134 | border-color: #b92c28; 135 | } 136 | .btn-danger:hover, 137 | .btn-danger:focus { 138 | background-color: #c12e2a; 139 | background-position: 0 -15px; 140 | } 141 | .btn-danger:active, 142 | .btn-danger.active { 143 | background-color: #c12e2a; 144 | border-color: #b92c28; 145 | } 146 | .thumbnail, 147 | .img-thumbnail { 148 | -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .075); 149 | box-shadow: 0 1px 2px rgba(0, 0, 0, .075); 150 | } 151 | .dropdown-menu > li > a:hover, 152 | .dropdown-menu > li > a:focus { 153 | background-color: #e8e8e8; 154 | background-image: -webkit-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%); 155 | background-image: linear-gradient(to bottom, #f5f5f5 0%, #e8e8e8 100%); 156 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0); 157 | background-repeat: repeat-x; 158 | } 159 | .dropdown-menu > .active > a, 160 | .dropdown-menu > .active > a:hover, 161 | .dropdown-menu > .active > a:focus { 162 | background-color: #357ebd; 163 | background-image: -webkit-linear-gradient(top, #428bca 0%, #357ebd 100%); 164 | background-image: linear-gradient(to bottom, #428bca 0%, #357ebd 100%); 165 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff357ebd', GradientType=0); 166 | background-repeat: repeat-x; 167 | } 168 | .navbar-default { 169 | background-image: -webkit-linear-gradient(top, #fff 0%, #f8f8f8 100%); 170 | background-image: linear-gradient(to bottom, #fff 0%, #f8f8f8 100%); 171 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff8f8f8', GradientType=0); 172 | filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); 173 | background-repeat: repeat-x; 174 | border-radius: 4px; 175 | -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 5px rgba(0, 0, 0, .075); 176 | box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 5px rgba(0, 0, 0, .075); 177 | } 178 | .navbar-default .navbar-nav > .active > a { 179 | background-image: -webkit-linear-gradient(top, #ebebeb 0%, #f3f3f3 100%); 180 | background-image: linear-gradient(to bottom, #ebebeb 0%, #f3f3f3 100%); 181 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffebebeb', endColorstr='#fff3f3f3', GradientType=0); 182 | background-repeat: repeat-x; 183 | -webkit-box-shadow: inset 0 3px 9px rgba(0, 0, 0, .075); 184 | box-shadow: inset 0 3px 9px rgba(0, 0, 0, .075); 185 | } 186 | .navbar-brand, 187 | .navbar-nav > li > a { 188 | text-shadow: 0 1px 0 rgba(255, 255, 255, .25); 189 | } 190 | .navbar-inverse { 191 | background-image: -webkit-linear-gradient(top, #3c3c3c 0%, #222 100%); 192 | background-image: linear-gradient(to bottom, #3c3c3c 0%, #222 100%); 193 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff3c3c3c', endColorstr='#ff222222', GradientType=0); 194 | filter: progid:DXImageTransform.Microsoft.gradient(enabled = false); 195 | background-repeat: repeat-x; 196 | } 197 | .navbar-inverse .navbar-nav > .active > a { 198 | background-image: -webkit-linear-gradient(top, #222 0%, #282828 100%); 199 | background-image: linear-gradient(to bottom, #222 0%, #282828 100%); 200 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff222222', endColorstr='#ff282828', GradientType=0); 201 | background-repeat: repeat-x; 202 | -webkit-box-shadow: inset 0 3px 9px rgba(0, 0, 0, .25); 203 | box-shadow: inset 0 3px 9px rgba(0, 0, 0, .25); 204 | } 205 | .navbar-inverse .navbar-brand, 206 | .navbar-inverse .navbar-nav > li > a { 207 | text-shadow: 0 -1px 0 rgba(0, 0, 0, .25); 208 | } 209 | .navbar-static-top, 210 | .navbar-fixed-top, 211 | .navbar-fixed-bottom { 212 | border-radius: 0; 213 | } 214 | .alert { 215 | text-shadow: 0 1px 0 rgba(255, 255, 255, .2); 216 | -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 1px 2px rgba(0, 0, 0, .05); 217 | box-shadow: inset 0 1px 0 rgba(255, 255, 255, .25), 0 1px 2px rgba(0, 0, 0, .05); 218 | } 219 | .alert-success { 220 | background-image: -webkit-linear-gradient(top, #dff0d8 0%, #c8e5bc 100%); 221 | background-image: linear-gradient(to bottom, #dff0d8 0%, #c8e5bc 100%); 222 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffc8e5bc', GradientType=0); 223 | background-repeat: repeat-x; 224 | border-color: #b2dba1; 225 | } 226 | .alert-info { 227 | background-image: -webkit-linear-gradient(top, #d9edf7 0%, #b9def0 100%); 228 | background-image: linear-gradient(to bottom, #d9edf7 0%, #b9def0 100%); 229 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffb9def0', GradientType=0); 230 | background-repeat: repeat-x; 231 | border-color: #9acfea; 232 | } 233 | .alert-warning { 234 | background-image: -webkit-linear-gradient(top, #fcf8e3 0%, #f8efc0 100%); 235 | background-image: linear-gradient(to bottom, #fcf8e3 0%, #f8efc0 100%); 236 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fff8efc0', GradientType=0); 237 | background-repeat: repeat-x; 238 | border-color: #f5e79e; 239 | } 240 | .alert-danger { 241 | background-image: -webkit-linear-gradient(top, #f2dede 0%, #e7c3c3 100%); 242 | background-image: linear-gradient(to bottom, #f2dede 0%, #e7c3c3 100%); 243 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffe7c3c3', GradientType=0); 244 | background-repeat: repeat-x; 245 | border-color: #dca7a7; 246 | } 247 | .progress { 248 | background-image: -webkit-linear-gradient(top, #ebebeb 0%, #f5f5f5 100%); 249 | background-image: linear-gradient(to bottom, #ebebeb 0%, #f5f5f5 100%); 250 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffebebeb', endColorstr='#fff5f5f5', GradientType=0); 251 | background-repeat: repeat-x; 252 | } 253 | .progress-bar { 254 | background-image: -webkit-linear-gradient(top, #428bca 0%, #3071a9 100%); 255 | background-image: linear-gradient(to bottom, #428bca 0%, #3071a9 100%); 256 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff3071a9', GradientType=0); 257 | background-repeat: repeat-x; 258 | } 259 | .progress-bar-success { 260 | background-image: -webkit-linear-gradient(top, #5cb85c 0%, #449d44 100%); 261 | background-image: linear-gradient(to bottom, #5cb85c 0%, #449d44 100%); 262 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff449d44', GradientType=0); 263 | background-repeat: repeat-x; 264 | } 265 | .progress-bar-info { 266 | background-image: -webkit-linear-gradient(top, #5bc0de 0%, #31b0d5 100%); 267 | background-image: linear-gradient(to bottom, #5bc0de 0%, #31b0d5 100%); 268 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff31b0d5', GradientType=0); 269 | background-repeat: repeat-x; 270 | } 271 | .progress-bar-warning { 272 | background-image: -webkit-linear-gradient(top, #f0ad4e 0%, #ec971f 100%); 273 | background-image: linear-gradient(to bottom, #f0ad4e 0%, #ec971f 100%); 274 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0ad4e', endColorstr='#ffec971f', GradientType=0); 275 | background-repeat: repeat-x; 276 | } 277 | .progress-bar-danger { 278 | background-image: -webkit-linear-gradient(top, #d9534f 0%, #c9302c 100%); 279 | background-image: linear-gradient(to bottom, #d9534f 0%, #c9302c 100%); 280 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc9302c', GradientType=0); 281 | background-repeat: repeat-x; 282 | } 283 | .list-group { 284 | border-radius: 4px; 285 | -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .075); 286 | box-shadow: 0 1px 2px rgba(0, 0, 0, .075); 287 | } 288 | .list-group-item.active, 289 | .list-group-item.active:hover, 290 | .list-group-item.active:focus { 291 | text-shadow: 0 -1px 0 #3071a9; 292 | background-image: -webkit-linear-gradient(top, #428bca 0%, #3278b3 100%); 293 | background-image: linear-gradient(to bottom, #428bca 0%, #3278b3 100%); 294 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff3278b3', GradientType=0); 295 | background-repeat: repeat-x; 296 | border-color: #3278b3; 297 | } 298 | .panel { 299 | -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .05); 300 | box-shadow: 0 1px 2px rgba(0, 0, 0, .05); 301 | } 302 | .panel-default > .panel-heading { 303 | background-image: -webkit-linear-gradient(top, #f5f5f5 0%, #e8e8e8 100%); 304 | background-image: linear-gradient(to bottom, #f5f5f5 0%, #e8e8e8 100%); 305 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0); 306 | background-repeat: repeat-x; 307 | } 308 | .panel-primary > .panel-heading { 309 | background-image: -webkit-linear-gradient(top, #428bca 0%, #357ebd 100%); 310 | background-image: linear-gradient(to bottom, #428bca 0%, #357ebd 100%); 311 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff357ebd', GradientType=0); 312 | background-repeat: repeat-x; 313 | } 314 | .panel-success > .panel-heading { 315 | background-image: -webkit-linear-gradient(top, #dff0d8 0%, #d0e9c6 100%); 316 | background-image: linear-gradient(to bottom, #dff0d8 0%, #d0e9c6 100%); 317 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffd0e9c6', GradientType=0); 318 | background-repeat: repeat-x; 319 | } 320 | .panel-info > .panel-heading { 321 | background-image: -webkit-linear-gradient(top, #d9edf7 0%, #c4e3f3 100%); 322 | background-image: linear-gradient(to bottom, #d9edf7 0%, #c4e3f3 100%); 323 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffc4e3f3', GradientType=0); 324 | background-repeat: repeat-x; 325 | } 326 | .panel-warning > .panel-heading { 327 | background-image: -webkit-linear-gradient(top, #fcf8e3 0%, #faf2cc 100%); 328 | background-image: linear-gradient(to bottom, #fcf8e3 0%, #faf2cc 100%); 329 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fffaf2cc', GradientType=0); 330 | background-repeat: repeat-x; 331 | } 332 | .panel-danger > .panel-heading { 333 | background-image: -webkit-linear-gradient(top, #f2dede 0%, #ebcccc 100%); 334 | background-image: linear-gradient(to bottom, #f2dede 0%, #ebcccc 100%); 335 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffebcccc', GradientType=0); 336 | background-repeat: repeat-x; 337 | } 338 | .well { 339 | background-image: -webkit-linear-gradient(top, #e8e8e8 0%, #f5f5f5 100%); 340 | background-image: linear-gradient(to bottom, #e8e8e8 0%, #f5f5f5 100%); 341 | filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe8e8e8', endColorstr='#fff5f5f5', GradientType=0); 342 | background-repeat: repeat-x; 343 | border-color: #dcdcdc; 344 | -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, .05), 0 1px 0 rgba(255, 255, 255, .1); 345 | box-shadow: inset 0 1px 3px rgba(0, 0, 0, .05), 0 1px 0 rgba(255, 255, 255, .1); 346 | } 347 | /*# sourceMappingURL=bootstrap-theme.css.map */ 348 | -------------------------------------------------------------------------------- /Part 01 - Intro & Installation/css/bootstrap-theme.min.css: -------------------------------------------------------------------------------- 1 | /*! 2 | * Bootstrap v3.1.1 (http://getbootstrap.com) 3 | * Copyright 2011-2014 Twitter, Inc. 4 | * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) 5 | */ 6 | 7 | .btn-default,.btn-primary,.btn-success,.btn-info,.btn-warning,.btn-danger{text-shadow:0 -1px 0 rgba(0,0,0,.2);-webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 1px 1px rgba(0,0,0,.075);box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 1px 1px rgba(0,0,0,.075)}.btn-default:active,.btn-primary:active,.btn-success:active,.btn-info:active,.btn-warning:active,.btn-danger:active,.btn-default.active,.btn-primary.active,.btn-success.active,.btn-info.active,.btn-warning.active,.btn-danger.active{-webkit-box-shadow:inset 0 3px 5px rgba(0,0,0,.125);box-shadow:inset 0 3px 5px rgba(0,0,0,.125)}.btn:active,.btn.active{background-image:none}.btn-default{background-image:-webkit-linear-gradient(top,#fff 0,#e0e0e0 100%);background-image:linear-gradient(to bottom,#fff 0,#e0e0e0 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe0e0e0', GradientType=0);filter:progid:DXImageTransform.Microsoft.gradient(enabled=false);background-repeat:repeat-x;border-color:#dbdbdb;text-shadow:0 1px 0 #fff;border-color:#ccc}.btn-default:hover,.btn-default:focus{background-color:#e0e0e0;background-position:0 -15px}.btn-default:active,.btn-default.active{background-color:#e0e0e0;border-color:#dbdbdb}.btn-primary{background-image:-webkit-linear-gradient(top,#428bca 0,#2d6ca2 100%);background-image:linear-gradient(to bottom,#428bca 0,#2d6ca2 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff2d6ca2', GradientType=0);filter:progid:DXImageTransform.Microsoft.gradient(enabled=false);background-repeat:repeat-x;border-color:#2b669a}.btn-primary:hover,.btn-primary:focus{background-color:#2d6ca2;background-position:0 -15px}.btn-primary:active,.btn-primary.active{background-color:#2d6ca2;border-color:#2b669a}.btn-success{background-image:-webkit-linear-gradient(top,#5cb85c 0,#419641 100%);background-image:linear-gradient(to bottom,#5cb85c 0,#419641 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff419641', GradientType=0);filter:progid:DXImageTransform.Microsoft.gradient(enabled=false);background-repeat:repeat-x;border-color:#3e8f3e}.btn-success:hover,.btn-success:focus{background-color:#419641;background-position:0 -15px}.btn-success:active,.btn-success.active{background-color:#419641;border-color:#3e8f3e}.btn-info{background-image:-webkit-linear-gradient(top,#5bc0de 0,#2aabd2 100%);background-image:linear-gradient(to bottom,#5bc0de 0,#2aabd2 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff2aabd2', GradientType=0);filter:progid:DXImageTransform.Microsoft.gradient(enabled=false);background-repeat:repeat-x;border-color:#28a4c9}.btn-info:hover,.btn-info:focus{background-color:#2aabd2;background-position:0 -15px}.btn-info:active,.btn-info.active{background-color:#2aabd2;border-color:#28a4c9}.btn-warning{background-image:-webkit-linear-gradient(top,#f0ad4e 0,#eb9316 100%);background-image:linear-gradient(to bottom,#f0ad4e 0,#eb9316 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0ad4e', endColorstr='#ffeb9316', GradientType=0);filter:progid:DXImageTransform.Microsoft.gradient(enabled=false);background-repeat:repeat-x;border-color:#e38d13}.btn-warning:hover,.btn-warning:focus{background-color:#eb9316;background-position:0 -15px}.btn-warning:active,.btn-warning.active{background-color:#eb9316;border-color:#e38d13}.btn-danger{background-image:-webkit-linear-gradient(top,#d9534f 0,#c12e2a 100%);background-image:linear-gradient(to bottom,#d9534f 0,#c12e2a 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc12e2a', GradientType=0);filter:progid:DXImageTransform.Microsoft.gradient(enabled=false);background-repeat:repeat-x;border-color:#b92c28}.btn-danger:hover,.btn-danger:focus{background-color:#c12e2a;background-position:0 -15px}.btn-danger:active,.btn-danger.active{background-color:#c12e2a;border-color:#b92c28}.thumbnail,.img-thumbnail{-webkit-box-shadow:0 1px 2px rgba(0,0,0,.075);box-shadow:0 1px 2px rgba(0,0,0,.075)}.dropdown-menu>li>a:hover,.dropdown-menu>li>a:focus{background-image:-webkit-linear-gradient(top,#f5f5f5 0,#e8e8e8 100%);background-image:linear-gradient(to bottom,#f5f5f5 0,#e8e8e8 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0);background-color:#e8e8e8}.dropdown-menu>.active>a,.dropdown-menu>.active>a:hover,.dropdown-menu>.active>a:focus{background-image:-webkit-linear-gradient(top,#428bca 0,#357ebd 100%);background-image:linear-gradient(to bottom,#428bca 0,#357ebd 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff357ebd', GradientType=0);background-color:#357ebd}.navbar-default{background-image:-webkit-linear-gradient(top,#fff 0,#f8f8f8 100%);background-image:linear-gradient(to bottom,#fff 0,#f8f8f8 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#fff8f8f8', GradientType=0);filter:progid:DXImageTransform.Microsoft.gradient(enabled=false);border-radius:4px;-webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 1px 5px rgba(0,0,0,.075);box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 1px 5px rgba(0,0,0,.075)}.navbar-default .navbar-nav>.active>a{background-image:-webkit-linear-gradient(top,#ebebeb 0,#f3f3f3 100%);background-image:linear-gradient(to bottom,#ebebeb 0,#f3f3f3 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffebebeb', endColorstr='#fff3f3f3', GradientType=0);-webkit-box-shadow:inset 0 3px 9px rgba(0,0,0,.075);box-shadow:inset 0 3px 9px rgba(0,0,0,.075)}.navbar-brand,.navbar-nav>li>a{text-shadow:0 1px 0 rgba(255,255,255,.25)}.navbar-inverse{background-image:-webkit-linear-gradient(top,#3c3c3c 0,#222 100%);background-image:linear-gradient(to bottom,#3c3c3c 0,#222 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff3c3c3c', endColorstr='#ff222222', GradientType=0);filter:progid:DXImageTransform.Microsoft.gradient(enabled=false)}.navbar-inverse .navbar-nav>.active>a{background-image:-webkit-linear-gradient(top,#222 0,#282828 100%);background-image:linear-gradient(to bottom,#222 0,#282828 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff222222', endColorstr='#ff282828', GradientType=0);-webkit-box-shadow:inset 0 3px 9px rgba(0,0,0,.25);box-shadow:inset 0 3px 9px rgba(0,0,0,.25)}.navbar-inverse .navbar-brand,.navbar-inverse .navbar-nav>li>a{text-shadow:0 -1px 0 rgba(0,0,0,.25)}.navbar-static-top,.navbar-fixed-top,.navbar-fixed-bottom{border-radius:0}.alert{text-shadow:0 1px 0 rgba(255,255,255,.2);-webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 1px 2px rgba(0,0,0,.05);box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 1px 2px rgba(0,0,0,.05)}.alert-success{background-image:-webkit-linear-gradient(top,#dff0d8 0,#c8e5bc 100%);background-image:linear-gradient(to bottom,#dff0d8 0,#c8e5bc 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffc8e5bc', GradientType=0);border-color:#b2dba1}.alert-info{background-image:-webkit-linear-gradient(top,#d9edf7 0,#b9def0 100%);background-image:linear-gradient(to bottom,#d9edf7 0,#b9def0 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffb9def0', GradientType=0);border-color:#9acfea}.alert-warning{background-image:-webkit-linear-gradient(top,#fcf8e3 0,#f8efc0 100%);background-image:linear-gradient(to bottom,#fcf8e3 0,#f8efc0 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fff8efc0', GradientType=0);border-color:#f5e79e}.alert-danger{background-image:-webkit-linear-gradient(top,#f2dede 0,#e7c3c3 100%);background-image:linear-gradient(to bottom,#f2dede 0,#e7c3c3 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffe7c3c3', GradientType=0);border-color:#dca7a7}.progress{background-image:-webkit-linear-gradient(top,#ebebeb 0,#f5f5f5 100%);background-image:linear-gradient(to bottom,#ebebeb 0,#f5f5f5 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffebebeb', endColorstr='#fff5f5f5', GradientType=0)}.progress-bar{background-image:-webkit-linear-gradient(top,#428bca 0,#3071a9 100%);background-image:linear-gradient(to bottom,#428bca 0,#3071a9 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff3071a9', GradientType=0)}.progress-bar-success{background-image:-webkit-linear-gradient(top,#5cb85c 0,#449d44 100%);background-image:linear-gradient(to bottom,#5cb85c 0,#449d44 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5cb85c', endColorstr='#ff449d44', GradientType=0)}.progress-bar-info{background-image:-webkit-linear-gradient(top,#5bc0de 0,#31b0d5 100%);background-image:linear-gradient(to bottom,#5bc0de 0,#31b0d5 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff5bc0de', endColorstr='#ff31b0d5', GradientType=0)}.progress-bar-warning{background-image:-webkit-linear-gradient(top,#f0ad4e 0,#ec971f 100%);background-image:linear-gradient(to bottom,#f0ad4e 0,#ec971f 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff0ad4e', endColorstr='#ffec971f', GradientType=0)}.progress-bar-danger{background-image:-webkit-linear-gradient(top,#d9534f 0,#c9302c 100%);background-image:linear-gradient(to bottom,#d9534f 0,#c9302c 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9534f', endColorstr='#ffc9302c', GradientType=0)}.list-group{border-radius:4px;-webkit-box-shadow:0 1px 2px rgba(0,0,0,.075);box-shadow:0 1px 2px rgba(0,0,0,.075)}.list-group-item.active,.list-group-item.active:hover,.list-group-item.active:focus{text-shadow:0 -1px 0 #3071a9;background-image:-webkit-linear-gradient(top,#428bca 0,#3278b3 100%);background-image:linear-gradient(to bottom,#428bca 0,#3278b3 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff3278b3', GradientType=0);border-color:#3278b3}.panel{-webkit-box-shadow:0 1px 2px rgba(0,0,0,.05);box-shadow:0 1px 2px rgba(0,0,0,.05)}.panel-default>.panel-heading{background-image:-webkit-linear-gradient(top,#f5f5f5 0,#e8e8e8 100%);background-image:linear-gradient(to bottom,#f5f5f5 0,#e8e8e8 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff5f5f5', endColorstr='#ffe8e8e8', GradientType=0)}.panel-primary>.panel-heading{background-image:-webkit-linear-gradient(top,#428bca 0,#357ebd 100%);background-image:linear-gradient(to bottom,#428bca 0,#357ebd 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff428bca', endColorstr='#ff357ebd', GradientType=0)}.panel-success>.panel-heading{background-image:-webkit-linear-gradient(top,#dff0d8 0,#d0e9c6 100%);background-image:linear-gradient(to bottom,#dff0d8 0,#d0e9c6 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffdff0d8', endColorstr='#ffd0e9c6', GradientType=0)}.panel-info>.panel-heading{background-image:-webkit-linear-gradient(top,#d9edf7 0,#c4e3f3 100%);background-image:linear-gradient(to bottom,#d9edf7 0,#c4e3f3 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd9edf7', endColorstr='#ffc4e3f3', GradientType=0)}.panel-warning>.panel-heading{background-image:-webkit-linear-gradient(top,#fcf8e3 0,#faf2cc 100%);background-image:linear-gradient(to bottom,#fcf8e3 0,#faf2cc 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fffcf8e3', endColorstr='#fffaf2cc', GradientType=0)}.panel-danger>.panel-heading{background-image:-webkit-linear-gradient(top,#f2dede 0,#ebcccc 100%);background-image:linear-gradient(to bottom,#f2dede 0,#ebcccc 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff2dede', endColorstr='#ffebcccc', GradientType=0)}.well{background-image:-webkit-linear-gradient(top,#e8e8e8 0,#f5f5f5 100%);background-image:linear-gradient(to bottom,#e8e8e8 0,#f5f5f5 100%);background-repeat:repeat-x;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffe8e8e8', endColorstr='#fff5f5f5', GradientType=0);border-color:#dcdcdc;-webkit-box-shadow:inset 0 1px 3px rgba(0,0,0,.05),0 1px 0 rgba(255,255,255,.1);box-shadow:inset 0 1px 3px rgba(0,0,0,.05),0 1px 0 rgba(255,255,255,.1)} -------------------------------------------------------------------------------- /Part 01 - Intro & Installation/fonts/glyphicons-halflings-regular.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 01 - Intro & Installation/fonts/glyphicons-halflings-regular.eot -------------------------------------------------------------------------------- /Part 01 - Intro & Installation/fonts/glyphicons-halflings-regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 01 - Intro & Installation/fonts/glyphicons-halflings-regular.ttf -------------------------------------------------------------------------------- /Part 01 - Intro & Installation/fonts/glyphicons-halflings-regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 01 - Intro & Installation/fonts/glyphicons-halflings-regular.woff -------------------------------------------------------------------------------- /Part 01 - Intro & Installation/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Bootstrap 101 Template 8 | 9 | 10 | 11 | 12 | 13 | 14 | 18 | 19 | 20 |

Hello, world!

21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | -------------------------------------------------------------------------------- /Part 02 - Navbar with Dropdowns/fonts/glyphicons-halflings-regular.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 02 - Navbar with Dropdowns/fonts/glyphicons-halflings-regular.eot -------------------------------------------------------------------------------- /Part 02 - Navbar with Dropdowns/fonts/glyphicons-halflings-regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 02 - Navbar with Dropdowns/fonts/glyphicons-halflings-regular.ttf -------------------------------------------------------------------------------- /Part 02 - Navbar with Dropdowns/fonts/glyphicons-halflings-regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 02 - Navbar with Dropdowns/fonts/glyphicons-halflings-regular.woff -------------------------------------------------------------------------------- /Part 02 - Navbar with Dropdowns/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Fixed NavBar Example for Bootstrap 10 | 11 | 12 | 13 | 14 | 46 | 48 | 49 | 50 | 51 | 52 | -------------------------------------------------------------------------------- /Part 03 - Fixed Footer/fonts/glyphicons-halflings-regular.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 03 - Fixed Footer/fonts/glyphicons-halflings-regular.eot -------------------------------------------------------------------------------- /Part 03 - Fixed Footer/fonts/glyphicons-halflings-regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 03 - Fixed Footer/fonts/glyphicons-halflings-regular.ttf -------------------------------------------------------------------------------- /Part 03 - Fixed Footer/fonts/glyphicons-halflings-regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 03 - Fixed Footer/fonts/glyphicons-halflings-regular.woff -------------------------------------------------------------------------------- /Part 03 - Fixed Footer/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | BootstrapBay Tutorial 10 | 11 | 12 | 13 | 14 | 46 | 47 | 54 | 55 | 56 | 58 | 59 | 60 | 61 | 62 | -------------------------------------------------------------------------------- /Part 04 - Font Awesome & Social Icons/css/custom.css: -------------------------------------------------------------------------------- 1 | .navbar-text > a { 2 | color: inherit; 3 | text-decoration: none; 4 | } 5 | 6 | body { 7 | padding: 70px; 8 | } -------------------------------------------------------------------------------- /Part 04 - Font Awesome & Social Icons/fonts/glyphicons-halflings-regular.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 04 - Font Awesome & Social Icons/fonts/glyphicons-halflings-regular.eot -------------------------------------------------------------------------------- /Part 04 - Font Awesome & Social Icons/fonts/glyphicons-halflings-regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 04 - Font Awesome & Social Icons/fonts/glyphicons-halflings-regular.ttf -------------------------------------------------------------------------------- /Part 04 - Font Awesome & Social Icons/fonts/glyphicons-halflings-regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 04 - Font Awesome & Social Icons/fonts/glyphicons-halflings-regular.woff -------------------------------------------------------------------------------- /Part 04 - Font Awesome & Social Icons/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | BootstrapBay Tutorial 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 50 | 51 | 63 | 64 | 65 | 67 | 68 | 69 | 70 | 71 | -------------------------------------------------------------------------------- /Part 05 - Jumbotron/css/custom.css: -------------------------------------------------------------------------------- 1 | .navbar-text > a { 2 | color: inherit; 3 | text-decoration: none; 4 | } 5 | 6 | body { 7 | padding-top: 70px; 8 | } -------------------------------------------------------------------------------- /Part 05 - Jumbotron/fonts/glyphicons-halflings-regular.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 05 - Jumbotron/fonts/glyphicons-halflings-regular.eot -------------------------------------------------------------------------------- /Part 05 - Jumbotron/fonts/glyphicons-halflings-regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 05 - Jumbotron/fonts/glyphicons-halflings-regular.ttf -------------------------------------------------------------------------------- /Part 05 - Jumbotron/fonts/glyphicons-halflings-regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 05 - Jumbotron/fonts/glyphicons-halflings-regular.woff -------------------------------------------------------------------------------- /Part 05 - Jumbotron/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | BootstrapBay Tutorial 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 50 | 51 |
52 |
53 |

Bootstrap Themes

54 |

BootstrapBay is your #1 source for premium Bootstrap themes & templates

55 | Buy Themes 56 | Sell Themes 57 |
58 |
59 | 60 | 61 | 73 | 74 | 75 | 77 | 78 | 79 | 80 | 81 | -------------------------------------------------------------------------------- /Part 06 - Grid System/css/custom.css: -------------------------------------------------------------------------------- 1 | .navbar-text > a { 2 | color: inherit; 3 | text-decoration: none; 4 | } 5 | 6 | body { 7 | padding-top: 70px; 8 | padding-bottom: 100px; 9 | 10 | } -------------------------------------------------------------------------------- /Part 06 - Grid System/fonts/glyphicons-halflings-regular.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 06 - Grid System/fonts/glyphicons-halflings-regular.eot -------------------------------------------------------------------------------- /Part 06 - Grid System/fonts/glyphicons-halflings-regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 06 - Grid System/fonts/glyphicons-halflings-regular.ttf -------------------------------------------------------------------------------- /Part 06 - Grid System/fonts/glyphicons-halflings-regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 06 - Grid System/fonts/glyphicons-halflings-regular.woff -------------------------------------------------------------------------------- /Part 06 - Grid System/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | BootstrapBay Tutorial 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 50 | 51 |
52 |
53 |

Bootstrap Themes

54 |

BootstrapBay is your #1 source for premium Bootstrap themes & templates

55 | Buy Themes 56 | Sell Themes 57 |
58 |
59 |
60 |

Theme 1

61 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

62 | View 63 |
64 |
65 |

Theme 1

66 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

67 | View 68 |
69 |
70 |

Theme 1

71 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

72 | View 73 |
74 |
75 |
76 | 77 | 78 | 79 | 80 | 92 | 93 | 94 | 96 | 97 | 98 | 99 | 100 | -------------------------------------------------------------------------------- /Part 07 - Modal/css/custom.css: -------------------------------------------------------------------------------- 1 | .navbar-text > a { 2 | color: inherit; 3 | text-decoration: none; 4 | } 5 | 6 | body { 7 | padding-top: 70px; 8 | padding-bottom: 100px; 9 | 10 | } -------------------------------------------------------------------------------- /Part 07 - Modal/fonts/glyphicons-halflings-regular.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 07 - Modal/fonts/glyphicons-halflings-regular.eot -------------------------------------------------------------------------------- /Part 07 - Modal/fonts/glyphicons-halflings-regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 07 - Modal/fonts/glyphicons-halflings-regular.ttf -------------------------------------------------------------------------------- /Part 07 - Modal/fonts/glyphicons-halflings-regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 07 - Modal/fonts/glyphicons-halflings-regular.woff -------------------------------------------------------------------------------- /Part 07 - Modal/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | BootstrapBay Tutorial 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 50 | 51 |
52 |
53 |

Bootstrap Themes

54 |

BootstrapBay is your #1 source for premium Bootstrap themes & templates

55 | Buy Themes 56 | Sell Themes 57 |
58 |
59 |
60 |

Theme 1

61 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

62 | View 63 |
64 |
65 |

Theme 2

66 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

67 | View 68 |
69 |
70 |

Theme 3

71 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

72 | View 73 |
74 |
75 |
76 | 77 | 78 | 79 | 80 | 92 | 93 | 95 | 96 | 111 | 112 | 113 | 114 | 115 | -------------------------------------------------------------------------------- /Part 07 - Modal/js/bootstrap.min.js: -------------------------------------------------------------------------------- 1 | /*! 2 | * Bootstrap v3.1.1 (http://getbootstrap.com) 3 | * Copyright 2011-2014 Twitter, Inc. 4 | * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) 5 | */ 6 | if("undefined"==typeof jQuery)throw new Error("Bootstrap's JavaScript requires jQuery");+function(a){"use strict";function b(){var a=document.createElement("bootstrap"),b={WebkitTransition:"webkitTransitionEnd",MozTransition:"transitionend",OTransition:"oTransitionEnd otransitionend",transition:"transitionend"};for(var c in b)if(void 0!==a.style[c])return{end:b[c]};return!1}a.fn.emulateTransitionEnd=function(b){var c=!1,d=this;a(this).one(a.support.transition.end,function(){c=!0});var e=function(){c||a(d).trigger(a.support.transition.end)};return setTimeout(e,b),this},a(function(){a.support.transition=b()})}(jQuery),+function(a){"use strict";var b='[data-dismiss="alert"]',c=function(c){a(c).on("click",b,this.close)};c.prototype.close=function(b){function c(){f.trigger("closed.bs.alert").remove()}var d=a(this),e=d.attr("data-target");e||(e=d.attr("href"),e=e&&e.replace(/.*(?=#[^\s]*$)/,""));var f=a(e);b&&b.preventDefault(),f.length||(f=d.hasClass("alert")?d:d.parent()),f.trigger(b=a.Event("close.bs.alert")),b.isDefaultPrevented()||(f.removeClass("in"),a.support.transition&&f.hasClass("fade")?f.one(a.support.transition.end,c).emulateTransitionEnd(150):c())};var d=a.fn.alert;a.fn.alert=function(b){return this.each(function(){var d=a(this),e=d.data("bs.alert");e||d.data("bs.alert",e=new c(this)),"string"==typeof b&&e[b].call(d)})},a.fn.alert.Constructor=c,a.fn.alert.noConflict=function(){return a.fn.alert=d,this},a(document).on("click.bs.alert.data-api",b,c.prototype.close)}(jQuery),+function(a){"use strict";var b=function(c,d){this.$element=a(c),this.options=a.extend({},b.DEFAULTS,d),this.isLoading=!1};b.DEFAULTS={loadingText:"loading..."},b.prototype.setState=function(b){var c="disabled",d=this.$element,e=d.is("input")?"val":"html",f=d.data();b+="Text",f.resetText||d.data("resetText",d[e]()),d[e](f[b]||this.options[b]),setTimeout(a.proxy(function(){"loadingText"==b?(this.isLoading=!0,d.addClass(c).attr(c,c)):this.isLoading&&(this.isLoading=!1,d.removeClass(c).removeAttr(c))},this),0)},b.prototype.toggle=function(){var a=!0,b=this.$element.closest('[data-toggle="buttons"]');if(b.length){var c=this.$element.find("input");"radio"==c.prop("type")&&(c.prop("checked")&&this.$element.hasClass("active")?a=!1:b.find(".active").removeClass("active")),a&&c.prop("checked",!this.$element.hasClass("active")).trigger("change")}a&&this.$element.toggleClass("active")};var c=a.fn.button;a.fn.button=function(c){return this.each(function(){var d=a(this),e=d.data("bs.button"),f="object"==typeof c&&c;e||d.data("bs.button",e=new b(this,f)),"toggle"==c?e.toggle():c&&e.setState(c)})},a.fn.button.Constructor=b,a.fn.button.noConflict=function(){return a.fn.button=c,this},a(document).on("click.bs.button.data-api","[data-toggle^=button]",function(b){var c=a(b.target);c.hasClass("btn")||(c=c.closest(".btn")),c.button("toggle"),b.preventDefault()})}(jQuery),+function(a){"use strict";var b=function(b,c){this.$element=a(b),this.$indicators=this.$element.find(".carousel-indicators"),this.options=c,this.paused=this.sliding=this.interval=this.$active=this.$items=null,"hover"==this.options.pause&&this.$element.on("mouseenter",a.proxy(this.pause,this)).on("mouseleave",a.proxy(this.cycle,this))};b.DEFAULTS={interval:5e3,pause:"hover",wrap:!0},b.prototype.cycle=function(b){return b||(this.paused=!1),this.interval&&clearInterval(this.interval),this.options.interval&&!this.paused&&(this.interval=setInterval(a.proxy(this.next,this),this.options.interval)),this},b.prototype.getActiveIndex=function(){return this.$active=this.$element.find(".item.active"),this.$items=this.$active.parent().children(),this.$items.index(this.$active)},b.prototype.to=function(b){var c=this,d=this.getActiveIndex();return b>this.$items.length-1||0>b?void 0:this.sliding?this.$element.one("slid.bs.carousel",function(){c.to(b)}):d==b?this.pause().cycle():this.slide(b>d?"next":"prev",a(this.$items[b]))},b.prototype.pause=function(b){return b||(this.paused=!0),this.$element.find(".next, .prev").length&&a.support.transition&&(this.$element.trigger(a.support.transition.end),this.cycle(!0)),this.interval=clearInterval(this.interval),this},b.prototype.next=function(){return this.sliding?void 0:this.slide("next")},b.prototype.prev=function(){return this.sliding?void 0:this.slide("prev")},b.prototype.slide=function(b,c){var d=this.$element.find(".item.active"),e=c||d[b](),f=this.interval,g="next"==b?"left":"right",h="next"==b?"first":"last",i=this;if(!e.length){if(!this.options.wrap)return;e=this.$element.find(".item")[h]()}if(e.hasClass("active"))return this.sliding=!1;var j=a.Event("slide.bs.carousel",{relatedTarget:e[0],direction:g});return this.$element.trigger(j),j.isDefaultPrevented()?void 0:(this.sliding=!0,f&&this.pause(),this.$indicators.length&&(this.$indicators.find(".active").removeClass("active"),this.$element.one("slid.bs.carousel",function(){var b=a(i.$indicators.children()[i.getActiveIndex()]);b&&b.addClass("active")})),a.support.transition&&this.$element.hasClass("slide")?(e.addClass(b),e[0].offsetWidth,d.addClass(g),e.addClass(g),d.one(a.support.transition.end,function(){e.removeClass([b,g].join(" ")).addClass("active"),d.removeClass(["active",g].join(" ")),i.sliding=!1,setTimeout(function(){i.$element.trigger("slid.bs.carousel")},0)}).emulateTransitionEnd(1e3*d.css("transition-duration").slice(0,-1))):(d.removeClass("active"),e.addClass("active"),this.sliding=!1,this.$element.trigger("slid.bs.carousel")),f&&this.cycle(),this)};var c=a.fn.carousel;a.fn.carousel=function(c){return this.each(function(){var d=a(this),e=d.data("bs.carousel"),f=a.extend({},b.DEFAULTS,d.data(),"object"==typeof c&&c),g="string"==typeof c?c:f.slide;e||d.data("bs.carousel",e=new b(this,f)),"number"==typeof c?e.to(c):g?e[g]():f.interval&&e.pause().cycle()})},a.fn.carousel.Constructor=b,a.fn.carousel.noConflict=function(){return a.fn.carousel=c,this},a(document).on("click.bs.carousel.data-api","[data-slide], [data-slide-to]",function(b){var c,d=a(this),e=a(d.attr("data-target")||(c=d.attr("href"))&&c.replace(/.*(?=#[^\s]+$)/,"")),f=a.extend({},e.data(),d.data()),g=d.attr("data-slide-to");g&&(f.interval=!1),e.carousel(f),(g=d.attr("data-slide-to"))&&e.data("bs.carousel").to(g),b.preventDefault()}),a(window).on("load",function(){a('[data-ride="carousel"]').each(function(){var b=a(this);b.carousel(b.data())})})}(jQuery),+function(a){"use strict";var b=function(c,d){this.$element=a(c),this.options=a.extend({},b.DEFAULTS,d),this.transitioning=null,this.options.parent&&(this.$parent=a(this.options.parent)),this.options.toggle&&this.toggle()};b.DEFAULTS={toggle:!0},b.prototype.dimension=function(){var a=this.$element.hasClass("width");return a?"width":"height"},b.prototype.show=function(){if(!this.transitioning&&!this.$element.hasClass("in")){var b=a.Event("show.bs.collapse");if(this.$element.trigger(b),!b.isDefaultPrevented()){var c=this.$parent&&this.$parent.find("> .panel > .in");if(c&&c.length){var d=c.data("bs.collapse");if(d&&d.transitioning)return;c.collapse("hide"),d||c.data("bs.collapse",null)}var e=this.dimension();this.$element.removeClass("collapse").addClass("collapsing")[e](0),this.transitioning=1;var f=function(){this.$element.removeClass("collapsing").addClass("collapse in")[e]("auto"),this.transitioning=0,this.$element.trigger("shown.bs.collapse")};if(!a.support.transition)return f.call(this);var g=a.camelCase(["scroll",e].join("-"));this.$element.one(a.support.transition.end,a.proxy(f,this)).emulateTransitionEnd(350)[e](this.$element[0][g])}}},b.prototype.hide=function(){if(!this.transitioning&&this.$element.hasClass("in")){var b=a.Event("hide.bs.collapse");if(this.$element.trigger(b),!b.isDefaultPrevented()){var c=this.dimension();this.$element[c](this.$element[c]())[0].offsetHeight,this.$element.addClass("collapsing").removeClass("collapse").removeClass("in"),this.transitioning=1;var d=function(){this.transitioning=0,this.$element.trigger("hidden.bs.collapse").removeClass("collapsing").addClass("collapse")};return a.support.transition?void this.$element[c](0).one(a.support.transition.end,a.proxy(d,this)).emulateTransitionEnd(350):d.call(this)}}},b.prototype.toggle=function(){this[this.$element.hasClass("in")?"hide":"show"]()};var c=a.fn.collapse;a.fn.collapse=function(c){return this.each(function(){var d=a(this),e=d.data("bs.collapse"),f=a.extend({},b.DEFAULTS,d.data(),"object"==typeof c&&c);!e&&f.toggle&&"show"==c&&(c=!c),e||d.data("bs.collapse",e=new b(this,f)),"string"==typeof c&&e[c]()})},a.fn.collapse.Constructor=b,a.fn.collapse.noConflict=function(){return a.fn.collapse=c,this},a(document).on("click.bs.collapse.data-api","[data-toggle=collapse]",function(b){var c,d=a(this),e=d.attr("data-target")||b.preventDefault()||(c=d.attr("href"))&&c.replace(/.*(?=#[^\s]+$)/,""),f=a(e),g=f.data("bs.collapse"),h=g?"toggle":d.data(),i=d.attr("data-parent"),j=i&&a(i);g&&g.transitioning||(j&&j.find('[data-toggle=collapse][data-parent="'+i+'"]').not(d).addClass("collapsed"),d[f.hasClass("in")?"addClass":"removeClass"]("collapsed")),f.collapse(h)})}(jQuery),+function(a){"use strict";function b(b){a(d).remove(),a(e).each(function(){var d=c(a(this)),e={relatedTarget:this};d.hasClass("open")&&(d.trigger(b=a.Event("hide.bs.dropdown",e)),b.isDefaultPrevented()||d.removeClass("open").trigger("hidden.bs.dropdown",e))})}function c(b){var c=b.attr("data-target");c||(c=b.attr("href"),c=c&&/#[A-Za-z]/.test(c)&&c.replace(/.*(?=#[^\s]*$)/,""));var d=c&&a(c);return d&&d.length?d:b.parent()}var d=".dropdown-backdrop",e="[data-toggle=dropdown]",f=function(b){a(b).on("click.bs.dropdown",this.toggle)};f.prototype.toggle=function(d){var e=a(this);if(!e.is(".disabled, :disabled")){var f=c(e),g=f.hasClass("open");if(b(),!g){"ontouchstart"in document.documentElement&&!f.closest(".navbar-nav").length&&a(''}),b.prototype=a.extend({},a.fn.tooltip.Constructor.prototype),b.prototype.constructor=b,b.prototype.getDefaults=function(){return b.DEFAULTS},b.prototype.setContent=function(){var a=this.tip(),b=this.getTitle(),c=this.getContent();a.find(".popover-title")[this.options.html?"html":"text"](b),a.find(".popover-content")[this.options.html?"string"==typeof c?"html":"append":"text"](c),a.removeClass("fade top bottom left right in"),a.find(".popover-title").html()||a.find(".popover-title").hide()},b.prototype.hasContent=function(){return this.getTitle()||this.getContent()},b.prototype.getContent=function(){var a=this.$element,b=this.options;return a.attr("data-content")||("function"==typeof b.content?b.content.call(a[0]):b.content)},b.prototype.arrow=function(){return this.$arrow=this.$arrow||this.tip().find(".arrow")},b.prototype.tip=function(){return this.$tip||(this.$tip=a(this.options.template)),this.$tip};var c=a.fn.popover;a.fn.popover=function(c){return this.each(function(){var d=a(this),e=d.data("bs.popover"),f="object"==typeof c&&c;(e||"destroy"!=c)&&(e||d.data("bs.popover",e=new b(this,f)),"string"==typeof c&&e[c]())})},a.fn.popover.Constructor=b,a.fn.popover.noConflict=function(){return a.fn.popover=c,this}}(jQuery),+function(a){"use strict";function b(c,d){var e,f=a.proxy(this.process,this);this.$element=a(a(c).is("body")?window:c),this.$body=a("body"),this.$scrollElement=this.$element.on("scroll.bs.scroll-spy.data-api",f),this.options=a.extend({},b.DEFAULTS,d),this.selector=(this.options.target||(e=a(c).attr("href"))&&e.replace(/.*(?=#[^\s]+$)/,"")||"")+" .nav li > a",this.offsets=a([]),this.targets=a([]),this.activeTarget=null,this.refresh(),this.process()}b.DEFAULTS={offset:10},b.prototype.refresh=function(){var b=this.$element[0]==window?"offset":"position";this.offsets=a([]),this.targets=a([]);{var c=this;this.$body.find(this.selector).map(function(){var d=a(this),e=d.data("target")||d.attr("href"),f=/^#./.test(e)&&a(e);return f&&f.length&&f.is(":visible")&&[[f[b]().top+(!a.isWindow(c.$scrollElement.get(0))&&c.$scrollElement.scrollTop()),e]]||null}).sort(function(a,b){return a[0]-b[0]}).each(function(){c.offsets.push(this[0]),c.targets.push(this[1])})}},b.prototype.process=function(){var a,b=this.$scrollElement.scrollTop()+this.options.offset,c=this.$scrollElement[0].scrollHeight||this.$body[0].scrollHeight,d=c-this.$scrollElement.height(),e=this.offsets,f=this.targets,g=this.activeTarget;if(b>=d)return g!=(a=f.last()[0])&&this.activate(a);if(g&&b<=e[0])return g!=(a=f[0])&&this.activate(a);for(a=e.length;a--;)g!=f[a]&&b>=e[a]&&(!e[a+1]||b<=e[a+1])&&this.activate(f[a])},b.prototype.activate=function(b){this.activeTarget=b,a(this.selector).parentsUntil(this.options.target,".active").removeClass("active");var c=this.selector+'[data-target="'+b+'"],'+this.selector+'[href="'+b+'"]',d=a(c).parents("li").addClass("active");d.parent(".dropdown-menu").length&&(d=d.closest("li.dropdown").addClass("active")),d.trigger("activate.bs.scrollspy")};var c=a.fn.scrollspy;a.fn.scrollspy=function(c){return this.each(function(){var d=a(this),e=d.data("bs.scrollspy"),f="object"==typeof c&&c;e||d.data("bs.scrollspy",e=new b(this,f)),"string"==typeof c&&e[c]()})},a.fn.scrollspy.Constructor=b,a.fn.scrollspy.noConflict=function(){return a.fn.scrollspy=c,this},a(window).on("load",function(){a('[data-spy="scroll"]').each(function(){var b=a(this);b.scrollspy(b.data())})})}(jQuery),+function(a){"use strict";var b=function(b){this.element=a(b)};b.prototype.show=function(){var b=this.element,c=b.closest("ul:not(.dropdown-menu)"),d=b.data("target");if(d||(d=b.attr("href"),d=d&&d.replace(/.*(?=#[^\s]*$)/,"")),!b.parent("li").hasClass("active")){var e=c.find(".active:last a")[0],f=a.Event("show.bs.tab",{relatedTarget:e});if(b.trigger(f),!f.isDefaultPrevented()){var g=a(d);this.activate(b.parent("li"),c),this.activate(g,g.parent(),function(){b.trigger({type:"shown.bs.tab",relatedTarget:e})})}}},b.prototype.activate=function(b,c,d){function e(){f.removeClass("active").find("> .dropdown-menu > .active").removeClass("active"),b.addClass("active"),g?(b[0].offsetWidth,b.addClass("in")):b.removeClass("fade"),b.parent(".dropdown-menu")&&b.closest("li.dropdown").addClass("active"),d&&d()}var f=c.find("> .active"),g=d&&a.support.transition&&f.hasClass("fade");g?f.one(a.support.transition.end,e).emulateTransitionEnd(150):e(),f.removeClass("in")};var c=a.fn.tab;a.fn.tab=function(c){return this.each(function(){var d=a(this),e=d.data("bs.tab");e||d.data("bs.tab",e=new b(this)),"string"==typeof c&&e[c]()})},a.fn.tab.Constructor=b,a.fn.tab.noConflict=function(){return a.fn.tab=c,this},a(document).on("click.bs.tab.data-api",'[data-toggle="tab"], [data-toggle="pill"]',function(b){b.preventDefault(),a(this).tab("show")})}(jQuery),+function(a){"use strict";var b=function(c,d){this.options=a.extend({},b.DEFAULTS,d),this.$window=a(window).on("scroll.bs.affix.data-api",a.proxy(this.checkPosition,this)).on("click.bs.affix.data-api",a.proxy(this.checkPositionWithEventLoop,this)),this.$element=a(c),this.affixed=this.unpin=this.pinnedOffset=null,this.checkPosition()};b.RESET="affix affix-top affix-bottom",b.DEFAULTS={offset:0},b.prototype.getPinnedOffset=function(){if(this.pinnedOffset)return this.pinnedOffset;this.$element.removeClass(b.RESET).addClass("affix");var a=this.$window.scrollTop(),c=this.$element.offset();return this.pinnedOffset=c.top-a},b.prototype.checkPositionWithEventLoop=function(){setTimeout(a.proxy(this.checkPosition,this),1)},b.prototype.checkPosition=function(){if(this.$element.is(":visible")){var c=a(document).height(),d=this.$window.scrollTop(),e=this.$element.offset(),f=this.options.offset,g=f.top,h=f.bottom;"top"==this.affixed&&(e.top+=d),"object"!=typeof f&&(h=g=f),"function"==typeof g&&(g=f.top(this.$element)),"function"==typeof h&&(h=f.bottom(this.$element));var i=null!=this.unpin&&d+this.unpin<=e.top?!1:null!=h&&e.top+this.$element.height()>=c-h?"bottom":null!=g&&g>=d?"top":!1;if(this.affixed!==i){this.unpin&&this.$element.css("top","");var j="affix"+(i?"-"+i:""),k=a.Event(j+".bs.affix");this.$element.trigger(k),k.isDefaultPrevented()||(this.affixed=i,this.unpin="bottom"==i?this.getPinnedOffset():null,this.$element.removeClass(b.RESET).addClass(j).trigger(a.Event(j.replace("affix","affixed"))),"bottom"==i&&this.$element.offset({top:c-h-this.$element.height()}))}}};var c=a.fn.affix;a.fn.affix=function(c){return this.each(function(){var d=a(this),e=d.data("bs.affix"),f="object"==typeof c&&c;e||d.data("bs.affix",e=new b(this,f)),"string"==typeof c&&e[c]()})},a.fn.affix.Constructor=b,a.fn.affix.noConflict=function(){return a.fn.affix=c,this},a(window).on("load",function(){a('[data-spy="affix"]').each(function(){var b=a(this),c=b.data();c.offset=c.offset||{},c.offsetBottom&&(c.offset.bottom=c.offsetBottom),c.offsetTop&&(c.offset.top=c.offsetTop),b.affix(c)})})}(jQuery); -------------------------------------------------------------------------------- /Part 08 - Thumbnails/css/custom.css: -------------------------------------------------------------------------------- 1 | .navbar-text > a { 2 | color: inherit; 3 | text-decoration: none; 4 | } 5 | 6 | body { 7 | padding-top: 70px; 8 | padding-bottom: 100px; 9 | 10 | } -------------------------------------------------------------------------------- /Part 08 - Thumbnails/fonts/glyphicons-halflings-regular.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 08 - Thumbnails/fonts/glyphicons-halflings-regular.eot -------------------------------------------------------------------------------- /Part 08 - Thumbnails/fonts/glyphicons-halflings-regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 08 - Thumbnails/fonts/glyphicons-halflings-regular.ttf -------------------------------------------------------------------------------- /Part 08 - Thumbnails/fonts/glyphicons-halflings-regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 08 - Thumbnails/fonts/glyphicons-halflings-regular.woff -------------------------------------------------------------------------------- /Part 08 - Thumbnails/img/appi.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 08 - Thumbnails/img/appi.jpg -------------------------------------------------------------------------------- /Part 08 - Thumbnails/img/jiggy.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 08 - Thumbnails/img/jiggy.jpg -------------------------------------------------------------------------------- /Part 08 - Thumbnails/img/slate.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 08 - Thumbnails/img/slate.jpg -------------------------------------------------------------------------------- /Part 08 - Thumbnails/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | BootstrapBay Tutorial 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 50 | 51 |
52 |
53 |

Bootstrap Themes

54 |

BootstrapBay is your #1 source for premium Bootstrap themes & templates

55 | Buy Themes 56 | Sell Themes 57 |
58 |
59 |
60 | 61 | Slate Bootstrap Admin Theme 62 | 63 |

Slate

64 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

65 | View 66 |
67 |
68 | 69 | Appi Landing Page Template 70 | 71 |

Appi

72 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

73 | View 74 |
75 |
76 | 77 | Jiggy Portfolio Theme 78 | 79 |

Jiggy

80 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

81 | View 82 |
83 |
84 |
85 | 86 | 87 | 88 | 89 | 101 | 102 | 104 | 105 | 120 | 121 | 122 | 123 | 124 | -------------------------------------------------------------------------------- /Part 09 - Google Web Fonts/css/custom.css: -------------------------------------------------------------------------------- 1 | .navbar-text > a { 2 | color: inherit; 3 | text-decoration: none; 4 | } 5 | 6 | body { 7 | padding-top: 70px; 8 | padding-bottom: 100px; 9 | } 10 | 11 | p { 12 | font-family: 'Open Sans', sans-serif; 13 | } 14 | 15 | h1, h2, h3, h4, h5, h6 { 16 | font-family: 'Oswald', sans-serif; 17 | } -------------------------------------------------------------------------------- /Part 09 - Google Web Fonts/fonts/glyphicons-halflings-regular.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 09 - Google Web Fonts/fonts/glyphicons-halflings-regular.eot -------------------------------------------------------------------------------- /Part 09 - Google Web Fonts/fonts/glyphicons-halflings-regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 09 - Google Web Fonts/fonts/glyphicons-halflings-regular.ttf -------------------------------------------------------------------------------- /Part 09 - Google Web Fonts/fonts/glyphicons-halflings-regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 09 - Google Web Fonts/fonts/glyphicons-halflings-regular.woff -------------------------------------------------------------------------------- /Part 09 - Google Web Fonts/img/appi.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 09 - Google Web Fonts/img/appi.jpg -------------------------------------------------------------------------------- /Part 09 - Google Web Fonts/img/jiggy.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 09 - Google Web Fonts/img/jiggy.jpg -------------------------------------------------------------------------------- /Part 09 - Google Web Fonts/img/slate.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 09 - Google Web Fonts/img/slate.jpg -------------------------------------------------------------------------------- /Part 09 - Google Web Fonts/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | BootstrapBay Tutorial 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 50 | 51 |
52 |
53 |

Bootstrap Themes

54 |

BootstrapBay is your #1 source for premium Bootstrap themes & templates

55 | Buy Themes 56 | Sell Themes 57 |
58 |
59 |
60 | 61 | Slate Bootstrap Admin Theme 62 | 63 |

Slate

64 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

65 | View 66 |
67 |
68 | 69 | Appi Landing Page Template 70 | 71 |

Appi

72 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

73 | View 74 |
75 |
76 | 77 | Jiggy Portfolio Theme 78 | 79 |

Jiggy

80 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

81 | View 82 |
83 |
84 |
85 | 86 | 87 | 88 | 89 | 101 | 102 | 104 | 105 | 120 | 121 | 122 | 123 | 124 | -------------------------------------------------------------------------------- /Part 10 - Contact Form/css/custom.css: -------------------------------------------------------------------------------- 1 | .navbar-text > a { 2 | color: inherit; 3 | text-decoration: none; 4 | } 5 | 6 | body { 7 | padding-top: 70px; 8 | padding-bottom: 100px; 9 | } 10 | 11 | p { 12 | font-family: 'Open Sans', sans-serif; 13 | } 14 | 15 | h1, h2, h3, h4, h5, h6 { 16 | font-family: 'Oswald', sans-serif; 17 | } -------------------------------------------------------------------------------- /Part 10 - Contact Form/fonts/glyphicons-halflings-regular.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 10 - Contact Form/fonts/glyphicons-halflings-regular.eot -------------------------------------------------------------------------------- /Part 10 - Contact Form/fonts/glyphicons-halflings-regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 10 - Contact Form/fonts/glyphicons-halflings-regular.ttf -------------------------------------------------------------------------------- /Part 10 - Contact Form/fonts/glyphicons-halflings-regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 10 - Contact Form/fonts/glyphicons-halflings-regular.woff -------------------------------------------------------------------------------- /Part 10 - Contact Form/img/appi.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 10 - Contact Form/img/appi.jpg -------------------------------------------------------------------------------- /Part 10 - Contact Form/img/jiggy.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 10 - Contact Form/img/jiggy.jpg -------------------------------------------------------------------------------- /Part 10 - Contact Form/img/slate.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 10 - Contact Form/img/slate.jpg -------------------------------------------------------------------------------- /Part 10 - Contact Form/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | BootstrapBay Tutorial 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 50 | 51 |
52 |
53 |

Bootstrap Themes

54 |

BootstrapBay is your #1 source for premium Bootstrap themes & templates

55 | Buy Themes 56 | Sell Themes 57 |
58 |
59 |
60 | 61 | Slate Bootstrap Admin Theme 62 | 63 |

Slate

64 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

65 | View 66 |
67 |
68 | 69 | Appi Landing Page Template 70 | 71 |

Appi

72 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

73 | View 74 |
75 |
76 | 77 | Jiggy Portfolio Theme 78 | 79 |

Jiggy

80 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

81 | View 82 |
83 |
84 |
85 | 86 | 87 | 88 | 89 | 101 | 102 | 104 | 105 | 140 | 141 | 142 | 143 | 144 | -------------------------------------------------------------------------------- /Part 11 - CSS Modifications/css/custom.css: -------------------------------------------------------------------------------- 1 | .navbar-text > a { 2 | color: inherit; 3 | text-decoration: none; 4 | } 5 | 6 | body { 7 | padding-top: 70px; 8 | padding-bottom: 100px; 9 | } 10 | 11 | p { 12 | font-family: 'Open Sans', sans-serif; 13 | } 14 | 15 | h1, h2, h3, h4, h5, h6 { 16 | font-family: 'Oswald', sans-serif; 17 | } 18 | 19 | 20 | 21 | 22 | 23 | 24 | /* 25 | 26 | Navy Blue: #2C3E50; 27 | Navy Blue Active: #1A242F; 28 | Turquoise: #18BC9C; 29 | White: #FFFFFF; 30 | 31 | BTN Primary: #2C3E50 32 | BTN Primary Hover: #1E2A36; 33 | BTN Primary Hover Boarder: #161F29; 34 | 35 | BTN Success: #18BC9C; 36 | BTN Success Hover: #13987E; 37 | BTN Success Hover Boarder: #11866F; 38 | 39 | BTN Default: #95A5A6; 40 | BTN Default Hover: #7F9293; 41 | BTN Default Hover Background: #74898A; 42 | 43 | */ -------------------------------------------------------------------------------- /Part 11 - CSS Modifications/fonts/glyphicons-halflings-regular.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 11 - CSS Modifications/fonts/glyphicons-halflings-regular.eot -------------------------------------------------------------------------------- /Part 11 - CSS Modifications/fonts/glyphicons-halflings-regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 11 - CSS Modifications/fonts/glyphicons-halflings-regular.ttf -------------------------------------------------------------------------------- /Part 11 - CSS Modifications/fonts/glyphicons-halflings-regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 11 - CSS Modifications/fonts/glyphicons-halflings-regular.woff -------------------------------------------------------------------------------- /Part 11 - CSS Modifications/img/appi.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 11 - CSS Modifications/img/appi.jpg -------------------------------------------------------------------------------- /Part 11 - CSS Modifications/img/jiggy.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 11 - CSS Modifications/img/jiggy.jpg -------------------------------------------------------------------------------- /Part 11 - CSS Modifications/img/slate.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 11 - CSS Modifications/img/slate.jpg -------------------------------------------------------------------------------- /Part 11 - CSS Modifications/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | BootstrapBay Tutorial 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 50 | 51 |
52 |
53 |

Bootstrap Themes

54 |

BootstrapBay is your #1 source for premium Bootstrap themes & templates

55 | Buy Themes 56 | Sell Themes 57 |
58 |
59 |
60 | 61 | Slate Bootstrap Admin Theme 62 | 63 |

Slate

64 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

65 | View 66 |
67 |
68 | 69 | Appi Landing Page Template 70 | 71 |

Appi

72 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

73 | View 74 |
75 |
76 | 77 | Jiggy Portfolio Theme 78 | 79 |

Jiggy

80 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

81 | View 82 |
83 |
84 |
85 | 86 | 87 | 88 | 89 | 101 | 102 | 104 | 105 | 140 | 141 | 142 | 143 | 144 | -------------------------------------------------------------------------------- /Part 12 - CSS Transform and Transition/css/custom.css: -------------------------------------------------------------------------------- 1 | .navbar-text > a { 2 | color: inherit; 3 | text-decoration: none; 4 | } 5 | 6 | body { 7 | padding-top: 70px; 8 | padding-bottom: 100px; 9 | } 10 | 11 | p { 12 | font-family: 'Open Sans', sans-serif; 13 | } 14 | 15 | h1, h2, h3, h4, h5, h6 { 16 | font-family: 'Oswald', sans-serif; 17 | } 18 | 19 | .navbar-default { 20 | background-color: #2C3E50; 21 | border-color: #FFFFFF; 22 | color: #FFFFFF; 23 | } 24 | 25 | .navbar-default .navbar-brand { 26 | color: #FFFFFF; 27 | } 28 | 29 | .navbar-default .navbar-brand:hover, 30 | .navbar-default .navbar-brand:focus { 31 | color: #18BC9C; 32 | background-color: transparent; 33 | } 34 | 35 | .navbar-default .navbar-nav > li > a { 36 | color: #FFFFFF; 37 | } 38 | 39 | .navbar-default .navbar-nav > .active > a, 40 | .navbar-default .navbar-nav > .active > a:hover, 41 | .navbar-default .navbar-nav > .active > a:focus { 42 | color: #FFFFFF; 43 | background-color: #1A242F; 44 | } 45 | 46 | .navbar-default .navbar-nav > li > a:hover, 47 | .navbar-default .navbar-nav > li > a:focus { 48 | color: #18BC9C; 49 | background-color: transparent; 50 | } 51 | 52 | .navbar-default .navbar-nav > .open > a, 53 | .navbar-default .navbar-nav > .open > a:hover, 54 | .navbar-default .navbar-nav > .open > a:focus { 55 | background-color: #1A242F; 56 | color: #FFFFFF; 57 | } 58 | 59 | .btn-primary { 60 | background-color: #2C3E50; 61 | border-color: #2C3E50; 62 | color: #FFFFFF; 63 | } 64 | 65 | .btn-primary:hover, 66 | .btn-primary:focus, 67 | .btn-primary:active, 68 | .btn-primary.active, 69 | .open .dropdown-toggle.btn-primary { 70 | color: #FFFFFF; 71 | background-color: #1E2A36; 72 | border-color: #161F29; 73 | } 74 | 75 | .btn-success { 76 | background-color: #18BC9C; 77 | border-color: #18BC9C; 78 | color: #FFFFFF; 79 | } 80 | 81 | .btn-success:hover, 82 | .btn-success:focus, 83 | .btn-success:active, 84 | .btn-success.active, 85 | .open .dropdown-toggle.btn-success { 86 | color: #FFFFFF; 87 | background-color: #13987E; 88 | border-color: #13987E; 89 | } 90 | 91 | .btn-default { 92 | background-color: #95A5A6; 93 | border-color: #95A5A6; 94 | color: #FFFFFF; 95 | } 96 | 97 | .btn-default:hover, 98 | .btn-default:focus, 99 | .btn-default:active, 100 | .btn-default.active, 101 | .open .dropdown-toggle.btn-success { 102 | color: #FFFFFF; 103 | background-color: #7F9293; 104 | border-color: #74898A; 105 | } 106 | 107 | .thumbnail img:hover { 108 | transform: scale(1.1); 109 | } 110 | 111 | .thumbnail img { 112 | transition: all 0.3s ease 0s; 113 | width: 100%; 114 | } 115 | 116 | .thumbnail { 117 | overflow: hidden; 118 | } 119 | -------------------------------------------------------------------------------- /Part 12 - CSS Transform and Transition/fonts/glyphicons-halflings-regular.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 12 - CSS Transform and Transition/fonts/glyphicons-halflings-regular.eot -------------------------------------------------------------------------------- /Part 12 - CSS Transform and Transition/fonts/glyphicons-halflings-regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 12 - CSS Transform and Transition/fonts/glyphicons-halflings-regular.ttf -------------------------------------------------------------------------------- /Part 12 - CSS Transform and Transition/fonts/glyphicons-halflings-regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 12 - CSS Transform and Transition/fonts/glyphicons-halflings-regular.woff -------------------------------------------------------------------------------- /Part 12 - CSS Transform and Transition/img/appi.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 12 - CSS Transform and Transition/img/appi.jpg -------------------------------------------------------------------------------- /Part 12 - CSS Transform and Transition/img/jiggy.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 12 - CSS Transform and Transition/img/jiggy.jpg -------------------------------------------------------------------------------- /Part 12 - CSS Transform and Transition/img/slate.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 12 - CSS Transform and Transition/img/slate.jpg -------------------------------------------------------------------------------- /Part 12 - CSS Transform and Transition/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | BootstrapBay Tutorial 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 50 | 51 |
52 |
53 |

Bootstrap Themes

54 |

BootstrapBay is your #1 source for premium Bootstrap themes & templates

55 | Buy Themes 56 | Sell Themes 57 |
58 |
59 |
60 | 61 | Slate Bootstrap Admin Theme 62 | 63 |

Slate

64 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

65 | View 66 |
67 |
68 | 69 | Appi Landing Page Template 70 | 71 |

Appi

72 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

73 | View 74 |
75 |
76 | 77 | Jiggy Portfolio Theme 78 | 79 |

Jiggy

80 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

81 | View 82 |
83 |
84 |
85 | 86 | 87 | 88 | 89 | 101 | 102 | 104 | 105 | 140 | 141 | 142 | 143 | 144 | -------------------------------------------------------------------------------- /Part 13 - Add a New Page/css/custom.css: -------------------------------------------------------------------------------- 1 | .navbar-text > a { 2 | color: inherit; 3 | text-decoration: none; 4 | } 5 | 6 | body { 7 | padding-top: 70px; 8 | padding-bottom: 100px; 9 | } 10 | 11 | p { 12 | font-family: 'Open Sans', sans-serif; 13 | } 14 | 15 | h1, h2, h3, h4, h5, h6 { 16 | font-family: 'Oswald', sans-serif; 17 | } 18 | 19 | .navbar-default { 20 | background-color: #2C3E50; 21 | border-color: #FFFFFF; 22 | color: #FFFFFF; 23 | } 24 | 25 | .navbar-default .navbar-brand { 26 | color: #FFFFFF; 27 | } 28 | 29 | .navbar-default .navbar-brand:hover, 30 | .navbar-default .navbar-brand:focus { 31 | color: #18BC9C; 32 | background-color: transparent; 33 | } 34 | 35 | .navbar-default .navbar-nav > li > a { 36 | color: #FFFFFF; 37 | } 38 | 39 | .navbar-default .navbar-nav > .active > a, 40 | .navbar-default .navbar-nav > .active > a:hover, 41 | .navbar-default .navbar-nav > .active > a:focus { 42 | color: #FFFFFF; 43 | background-color: #1A242F; 44 | } 45 | 46 | .navbar-default .navbar-nav > li > a:hover, 47 | .navbar-default .navbar-nav > li > a:focus { 48 | color: #18BC9C; 49 | background-color: transparent; 50 | } 51 | 52 | .navbar-default .navbar-nav > .open > a, 53 | .navbar-default .navbar-nav > .open > a:hover, 54 | .navbar-default .navbar-nav > .open > a:focus { 55 | background-color: #1A242F; 56 | color: #FFFFFF; 57 | } 58 | 59 | .btn-primary { 60 | background-color: #2C3E50; 61 | border-color: #2C3E50; 62 | color: #FFFFFF; 63 | } 64 | 65 | .btn-primary:hover, 66 | .btn-primary:focus, 67 | .btn-primary:active, 68 | .btn-primary.active, 69 | .open .dropdown-toggle.btn-primary { 70 | color: #FFFFFF; 71 | background-color: #1E2A36; 72 | border-color: #161F29; 73 | } 74 | 75 | .btn-success { 76 | background-color: #18BC9C; 77 | border-color: #18BC9C; 78 | color: #FFFFFF; 79 | } 80 | 81 | .btn-success:hover, 82 | .btn-success:focus, 83 | .btn-success:active, 84 | .btn-success.active, 85 | .open .dropdown-toggle.btn-success { 86 | color: #FFFFFF; 87 | background-color: #13987E; 88 | border-color: #13987E; 89 | } 90 | 91 | .btn-default { 92 | background-color: #95A5A6; 93 | border-color: #95A5A6; 94 | color: #FFFFFF; 95 | } 96 | 97 | .btn-default:hover, 98 | .btn-default:focus, 99 | .btn-default:active, 100 | .btn-default.active, 101 | .open .dropdown-toggle.btn-success { 102 | color: #FFFFFF; 103 | background-color: #7F9293; 104 | border-color: #74898A; 105 | } 106 | 107 | .thumbnail img:hover { 108 | transform: scale(1.1); 109 | } 110 | 111 | .thumbnail img { 112 | transition: all 0.3s ease 0s; 113 | width: 100%; 114 | } 115 | 116 | .thumbnail { 117 | overflow: hidden; 118 | } 119 | -------------------------------------------------------------------------------- /Part 13 - Add a New Page/fonts/glyphicons-halflings-regular.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 13 - Add a New Page/fonts/glyphicons-halflings-regular.eot -------------------------------------------------------------------------------- /Part 13 - Add a New Page/fonts/glyphicons-halflings-regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 13 - Add a New Page/fonts/glyphicons-halflings-regular.ttf -------------------------------------------------------------------------------- /Part 13 - Add a New Page/fonts/glyphicons-halflings-regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 13 - Add a New Page/fonts/glyphicons-halflings-regular.woff -------------------------------------------------------------------------------- /Part 13 - Add a New Page/img/appi.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 13 - Add a New Page/img/appi.jpg -------------------------------------------------------------------------------- /Part 13 - Add a New Page/img/jiggy.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 13 - Add a New Page/img/jiggy.jpg -------------------------------------------------------------------------------- /Part 13 - Add a New Page/img/slate.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 13 - Add a New Page/img/slate.jpg -------------------------------------------------------------------------------- /Part 13 - Add a New Page/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | BootstrapBay Tutorial 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 50 | 51 |
52 |
53 |

Bootstrap Themes

54 |

BootstrapBay is your #1 source for premium Bootstrap themes & templates

55 | Buy Themes 56 | Sell Themes 57 |
58 |
59 |
60 | 61 | Slate Bootstrap Admin Theme 62 | 63 |

Slate

64 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

65 | View 66 |
67 |
68 | 69 | Appi Landing Page Template 70 | 71 |

Appi

72 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

73 | View 74 |
75 |
76 | 77 | Jiggy Portfolio Theme 78 | 79 |

Jiggy

80 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

81 | View 82 |
83 |
84 |
85 | 86 | 87 | 88 | 89 | 101 | 102 | 104 | 105 | 140 | 141 | 142 | 143 | 144 | -------------------------------------------------------------------------------- /Part 13 - Add a New Page/jiggy.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | BootstrapBay Tutorial 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 50 | 51 | 52 | 53 | 65 | 66 | 68 | 69 | 104 | 105 | 106 | 107 | 108 | -------------------------------------------------------------------------------- /Part 14 - Building the Theme Page/css/custom.css: -------------------------------------------------------------------------------- 1 | .navbar-text > a { 2 | color: inherit; 3 | text-decoration: none; 4 | } 5 | 6 | body { 7 | padding-top: 70px; 8 | padding-bottom: 100px; 9 | } 10 | 11 | p { 12 | font-family: 'Open Sans', sans-serif; 13 | } 14 | 15 | h1, h2, h3, h4, h5, h6 { 16 | font-family: 'Oswald', sans-serif; 17 | } 18 | 19 | .navbar-default { 20 | background-color: #2C3E50; 21 | border-color: #FFFFFF; 22 | color: #FFFFFF; 23 | } 24 | 25 | .navbar-default .navbar-brand { 26 | color: #FFFFFF; 27 | } 28 | 29 | .navbar-default .navbar-brand:hover, 30 | .navbar-default .navbar-brand:focus { 31 | color: #18BC9C; 32 | background-color: transparent; 33 | } 34 | 35 | .navbar-default .navbar-nav > li > a { 36 | color: #FFFFFF; 37 | } 38 | 39 | .navbar-default .navbar-nav > .active > a, 40 | .navbar-default .navbar-nav > .active > a:hover, 41 | .navbar-default .navbar-nav > .active > a:focus { 42 | color: #FFFFFF; 43 | background-color: #1A242F; 44 | } 45 | 46 | .navbar-default .navbar-nav > li > a:hover, 47 | .navbar-default .navbar-nav > li > a:focus { 48 | color: #18BC9C; 49 | background-color: transparent; 50 | } 51 | 52 | .navbar-default .navbar-nav > .open > a, 53 | .navbar-default .navbar-nav > .open > a:hover, 54 | .navbar-default .navbar-nav > .open > a:focus { 55 | background-color: #1A242F; 56 | color: #FFFFFF; 57 | } 58 | 59 | .btn-primary { 60 | background-color: #2C3E50; 61 | border-color: #2C3E50; 62 | color: #FFFFFF; 63 | } 64 | 65 | .btn-primary:hover, 66 | .btn-primary:focus, 67 | .btn-primary:active, 68 | .btn-primary.active, 69 | .open .dropdown-toggle.btn-primary { 70 | color: #FFFFFF; 71 | background-color: #1E2A36; 72 | border-color: #161F29; 73 | } 74 | 75 | .btn-success { 76 | background-color: #18BC9C; 77 | border-color: #18BC9C; 78 | color: #FFFFFF; 79 | } 80 | 81 | .btn-success:hover, 82 | .btn-success:focus, 83 | .btn-success:active, 84 | .btn-success.active, 85 | .open .dropdown-toggle.btn-success { 86 | color: #FFFFFF; 87 | background-color: #13987E; 88 | border-color: #13987E; 89 | } 90 | 91 | .btn-default { 92 | background-color: #95A5A6; 93 | border-color: #95A5A6; 94 | color: #FFFFFF; 95 | } 96 | 97 | .btn-default:hover, 98 | .btn-default:focus, 99 | .btn-default:active, 100 | .btn-default.active, 101 | .open .dropdown-toggle.btn-success { 102 | color: #FFFFFF; 103 | background-color: #7F9293; 104 | border-color: #74898A; 105 | } 106 | 107 | .home-thumb img:hover { 108 | transform: scale(1.1); 109 | } 110 | 111 | .thumbnail img { 112 | transition: all 0.3s ease 0s; 113 | width: 100%; 114 | } 115 | 116 | .thumbnail { 117 | overflow: hidden; 118 | } 119 | -------------------------------------------------------------------------------- /Part 14 - Building the Theme Page/fonts/glyphicons-halflings-regular.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 14 - Building the Theme Page/fonts/glyphicons-halflings-regular.eot -------------------------------------------------------------------------------- /Part 14 - Building the Theme Page/fonts/glyphicons-halflings-regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 14 - Building the Theme Page/fonts/glyphicons-halflings-regular.ttf -------------------------------------------------------------------------------- /Part 14 - Building the Theme Page/fonts/glyphicons-halflings-regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 14 - Building the Theme Page/fonts/glyphicons-halflings-regular.woff -------------------------------------------------------------------------------- /Part 14 - Building the Theme Page/img/appi.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 14 - Building the Theme Page/img/appi.jpg -------------------------------------------------------------------------------- /Part 14 - Building the Theme Page/img/jiggy.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 14 - Building the Theme Page/img/jiggy.jpg -------------------------------------------------------------------------------- /Part 14 - Building the Theme Page/img/slate.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 14 - Building the Theme Page/img/slate.jpg -------------------------------------------------------------------------------- /Part 14 - Building the Theme Page/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | BootstrapBay Tutorial 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 50 | 51 |
52 |
53 |

Bootstrap Themes

54 |

BootstrapBay is your #1 source for premium Bootstrap themes & templates

55 | Buy Themes 56 | Sell Themes 57 |
58 |
59 |
60 | 61 | Slate Bootstrap Admin Theme 62 | 63 |

Slate

64 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

65 | View 66 |
67 |
68 | 69 | Appi Landing Page Template 70 | 71 |

Appi

72 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

73 | View 74 |
75 |
76 | 77 | Jiggy Portfolio Theme 78 | 79 |

Jiggy

80 |

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

81 | View 82 |
83 |
84 |
85 | 86 | 87 | 88 | 89 | 101 | 102 | 104 | 105 | 140 | 141 | 142 | 143 | 144 | -------------------------------------------------------------------------------- /Part 14 - Building the Theme Page/jiggy.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | BootstrapBay Tutorial 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 50 | 51 |
52 | 55 |
56 |
57 | Jiggy Single Page Portfolio 58 |
59 | Live Preview 60 |
61 |
62 |

Jiggy is a beautiful and fully responsive one page HTML template. It is intended for websites that are showcasing a creative portfolio. It includes sections for portfolio items, testimonials, about, and contact.

63 |

Features

64 |
  • Bootstrap 3
  • 65 |
  • Fully responsive
  • 66 |
  • One page scroll design
  • 67 |
  • HTML5 and CSS3
  • 68 |
  • Font Awesome Icons
  • 69 |
  • Google Web Fonts
  • 70 |
    71 |
    72 | 73 | 74 | 75 | 87 | 88 | 90 | 91 | 126 | 127 | 128 | 129 | 130 | -------------------------------------------------------------------------------- /Part 15 - Sidebar, Panels and Table/css/custom.css: -------------------------------------------------------------------------------- 1 | .navbar-text > a { 2 | color: inherit; 3 | text-decoration: none; 4 | } 5 | 6 | body { 7 | padding-top: 70px; 8 | padding-bottom: 100px; 9 | } 10 | 11 | p { 12 | font-family: 'Open Sans', sans-serif; 13 | } 14 | 15 | h1, h2, h3, h4, h5, h6 { 16 | font-family: 'Oswald', sans-serif; 17 | } 18 | 19 | .navbar-default { 20 | background-color: #2C3E50; 21 | border-color: #FFFFFF; 22 | color: #FFFFFF; 23 | } 24 | 25 | .navbar-default .navbar-brand { 26 | color: #FFFFFF; 27 | } 28 | 29 | .navbar-default .navbar-brand:hover, 30 | .navbar-default .navbar-brand:focus { 31 | color: #18BC9C; 32 | background-color: transparent; 33 | } 34 | 35 | .navbar-default .navbar-nav > li > a { 36 | color: #FFFFFF; 37 | } 38 | 39 | .navbar-default .navbar-nav > .active > a, 40 | .navbar-default .navbar-nav > .active > a:hover, 41 | .navbar-default .navbar-nav > .active > a:focus { 42 | color: #FFFFFF; 43 | background-color: #1A242F; 44 | } 45 | 46 | .navbar-default .navbar-nav > li > a:hover, 47 | .navbar-default .navbar-nav > li > a:focus { 48 | color: #18BC9C; 49 | background-color: transparent; 50 | } 51 | 52 | .navbar-default .navbar-nav > .open > a, 53 | .navbar-default .navbar-nav > .open > a:hover, 54 | .navbar-default .navbar-nav > .open > a:focus { 55 | background-color: #1A242F; 56 | color: #FFFFFF; 57 | } 58 | 59 | .btn-primary { 60 | background-color: #2C3E50; 61 | border-color: #2C3E50; 62 | color: #FFFFFF; 63 | } 64 | 65 | .btn-primary:hover, 66 | .btn-primary:focus, 67 | .btn-primary:active, 68 | .btn-primary.active, 69 | .open .dropdown-toggle.btn-primary { 70 | color: #FFFFFF; 71 | background-color: #1E2A36; 72 | border-color: #161F29; 73 | } 74 | 75 | .btn-success { 76 | background-color: #18BC9C; 77 | border-color: #18BC9C; 78 | color: #FFFFFF; 79 | } 80 | 81 | .btn-success:hover, 82 | .btn-success:focus, 83 | .btn-success:active, 84 | .btn-success.active, 85 | .open .dropdown-toggle.btn-success { 86 | color: #FFFFFF; 87 | background-color: #13987E; 88 | border-color: #13987E; 89 | } 90 | 91 | .btn-default { 92 | background-color: #95A5A6; 93 | border-color: #95A5A6; 94 | color: #FFFFFF; 95 | } 96 | 97 | .btn-default:hover, 98 | .btn-default:focus, 99 | .btn-default:active, 100 | .btn-default.active, 101 | .open .dropdown-toggle.btn-success { 102 | color: #FFFFFF; 103 | background-color: #7F9293; 104 | border-color: #74898A; 105 | } 106 | 107 | .home-thumb img:hover { 108 | transform: scale(1.1); 109 | } 110 | 111 | .thumbnail img { 112 | transition: all 0.3s ease 0s; 113 | width: 100%; 114 | } 115 | 116 | .thumbnail { 117 | overflow: hidden; 118 | } 119 | 120 | .bg-grey { 121 | background-color: #f9f9f9; 122 | } 123 | -------------------------------------------------------------------------------- /Part 15 - Sidebar, Panels and Table/fonts/glyphicons-halflings-regular.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 15 - Sidebar, Panels and Table/fonts/glyphicons-halflings-regular.eot -------------------------------------------------------------------------------- /Part 15 - Sidebar, Panels and Table/fonts/glyphicons-halflings-regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 15 - Sidebar, Panels and Table/fonts/glyphicons-halflings-regular.ttf -------------------------------------------------------------------------------- /Part 15 - Sidebar, Panels and Table/fonts/glyphicons-halflings-regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 15 - Sidebar, Panels and Table/fonts/glyphicons-halflings-regular.woff -------------------------------------------------------------------------------- /Part 15 - Sidebar, Panels and Table/img/appi.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 15 - Sidebar, Panels and Table/img/appi.jpg -------------------------------------------------------------------------------- /Part 15 - Sidebar, Panels and Table/img/jiggy.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 15 - Sidebar, Panels and Table/img/jiggy.jpg -------------------------------------------------------------------------------- /Part 15 - Sidebar, Panels and Table/img/slate.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 15 - Sidebar, Panels and Table/img/slate.jpg -------------------------------------------------------------------------------- /Part 15 - Sidebar, Panels and Table/img/swoopthemes.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 15 - Sidebar, Panels and Table/img/swoopthemes.jpg -------------------------------------------------------------------------------- /Part 15 - Sidebar, Panels and Table/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | BootstrapBay Tutorial 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 50 | 51 |
    52 |
    53 |

    Bootstrap Themes

    54 |

    BootstrapBay is your #1 source for premium Bootstrap themes & templates

    55 | Buy Themes 56 | Sell Themes 57 |
    58 |
    59 |
    60 | 61 | Slate Bootstrap Admin Theme 62 | 63 |

    Slate

    64 |

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

    65 | View 66 |
    67 |
    68 | 69 | Appi Landing Page Template 70 | 71 |

    Appi

    72 |

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

    73 | View 74 |
    75 |
    76 | 77 | Jiggy Portfolio Theme 78 | 79 |

    Jiggy

    80 |

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

    81 | View 82 |
    83 |
    84 |
    85 | 86 | 87 | 88 | 89 | 101 | 102 | 104 | 105 | 140 | 141 | 142 | 143 | 144 | -------------------------------------------------------------------------------- /Part 15 - Sidebar, Panels and Table/jiggy.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | BootstrapBay Tutorial 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 50 | 51 |
    52 | 55 |
    56 |
    57 |
    58 | Jiggy Single Page Portfolio 59 |
    60 | Live Preview 61 |
    62 |
    63 |

    Jiggy is a beautiful and fully responsive one page HTML template. It is intended for websites that are showcasing a creative portfolio. It includes sections for portfolio items, testimonials, about and contact.

    64 |

    Features

    65 |
  • Bootstrap 3
  • 66 |
  • Fully responsive
  • 67 |
  • One page scroll design
  • 68 |
  • Alternate sections
  • 69 |
  • HTML5 and CSS3
  • 70 |
  • Google Fonts
  • 71 |
  • Font Awesome Icons
  • 72 |
    73 |
    74 |
    75 |

    $14

    76 |

    Basic License

    77 | Buy Now 78 |
    79 |
    80 |
    81 |

    Theme Author

    82 |
    83 |
    84 | Swoop Themes 85 |

    Swoop Themes

    86 |
    87 |
    88 |
    89 |
    90 |

    Theme Attributes

    91 |
    92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | 108 | 109 | 110 | 111 | 112 | 113 | 114 | 115 |
    CategoryPortfolio
    Version1
    Bootstrap3.1.1
    Tagsportfolio, responsive, clean, showcase, single page
    Release DateJun 20, 2014
    116 |
    117 |
    118 |
    119 |
    120 | 121 | 122 | 134 | 135 | 137 | 138 | 173 | 174 | 175 | 176 | 177 | -------------------------------------------------------------------------------- /Part 16 - Carousel/css/custom.css: -------------------------------------------------------------------------------- 1 | .navbar-text > a { 2 | color: inherit; 3 | text-decoration: none; 4 | } 5 | 6 | body { 7 | padding-top: 70px; 8 | padding-bottom: 100px; 9 | } 10 | 11 | p { 12 | font-family: 'Open Sans', sans-serif; 13 | } 14 | 15 | h1, h2, h3, h4, h5, h6 { 16 | font-family: 'Oswald', sans-serif; 17 | } 18 | 19 | .navbar-default { 20 | background-color: #2C3E50; 21 | border-color: #FFFFFF; 22 | color: #FFFFFF; 23 | } 24 | 25 | .navbar-default .navbar-brand { 26 | color: #FFFFFF; 27 | } 28 | 29 | .navbar-default .navbar-brand:hover, 30 | .navbar-default .navbar-brand:focus { 31 | color: #18BC9C; 32 | background-color: transparent; 33 | } 34 | 35 | .navbar-default .navbar-nav > li > a { 36 | color: #FFFFFF; 37 | } 38 | 39 | .navbar-default .navbar-nav > .active > a, 40 | .navbar-default .navbar-nav > .active > a:hover, 41 | .navbar-default .navbar-nav > .active > a:focus { 42 | color: #FFFFFF; 43 | background-color: #1A242F; 44 | } 45 | 46 | .navbar-default .navbar-nav > li > a:hover, 47 | .navbar-default .navbar-nav > li > a:focus { 48 | color: #18BC9C; 49 | background-color: transparent; 50 | } 51 | 52 | .navbar-default .navbar-nav > .open > a, 53 | .navbar-default .navbar-nav > .open > a:hover, 54 | .navbar-default .navbar-nav > .open > a:focus { 55 | background-color: #1A242F; 56 | color: #FFFFFF; 57 | } 58 | 59 | .btn-primary { 60 | background-color: #2C3E50; 61 | border-color: #2C3E50; 62 | color: #FFFFFF; 63 | } 64 | 65 | .btn-primary:hover, 66 | .btn-primary:focus, 67 | .btn-primary:active, 68 | .btn-primary.active, 69 | .open .dropdown-toggle.btn-primary { 70 | color: #FFFFFF; 71 | background-color: #1E2A36; 72 | border-color: #161F29; 73 | } 74 | 75 | .btn-success { 76 | background-color: #18BC9C; 77 | border-color: #18BC9C; 78 | color: #FFFFFF; 79 | } 80 | 81 | .btn-success:hover, 82 | .btn-success:focus, 83 | .btn-success:active, 84 | .btn-success.active, 85 | .open .dropdown-toggle.btn-success { 86 | color: #FFFFFF; 87 | background-color: #13987E; 88 | border-color: #13987E; 89 | } 90 | 91 | .btn-default { 92 | background-color: #95A5A6; 93 | border-color: #95A5A6; 94 | color: #FFFFFF; 95 | } 96 | 97 | .btn-default:hover, 98 | .btn-default:focus, 99 | .btn-default:active, 100 | .btn-default.active, 101 | .open .dropdown-toggle.btn-success { 102 | color: #FFFFFF; 103 | background-color: #7F9293; 104 | border-color: #74898A; 105 | } 106 | 107 | 108 | .home-thumb img:hover { 109 | transform: scale(1.1); 110 | } 111 | 112 | .thumbnail img { 113 | transition: all 0.3s ease 0s; 114 | width: 100%; 115 | } 116 | 117 | .thumbnail { 118 | overflow: hidden; 119 | } 120 | 121 | .bg-grey { 122 | background-color: #f9f9f9; 123 | } 124 | 125 | .carousel { 126 | padding-bottom: 20px; 127 | } -------------------------------------------------------------------------------- /Part 16 - Carousel/fonts/glyphicons-halflings-regular.eot: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 16 - Carousel/fonts/glyphicons-halflings-regular.eot -------------------------------------------------------------------------------- /Part 16 - Carousel/fonts/glyphicons-halflings-regular.ttf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 16 - Carousel/fonts/glyphicons-halflings-regular.ttf -------------------------------------------------------------------------------- /Part 16 - Carousel/fonts/glyphicons-halflings-regular.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 16 - Carousel/fonts/glyphicons-halflings-regular.woff -------------------------------------------------------------------------------- /Part 16 - Carousel/img/appi.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 16 - Carousel/img/appi.jpg -------------------------------------------------------------------------------- /Part 16 - Carousel/img/bblogo.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 16 - Carousel/img/bblogo.jpg -------------------------------------------------------------------------------- /Part 16 - Carousel/img/jiggy.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 16 - Carousel/img/jiggy.jpg -------------------------------------------------------------------------------- /Part 16 - Carousel/img/slate.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 16 - Carousel/img/slate.jpg -------------------------------------------------------------------------------- /Part 16 - Carousel/img/swoopthemes.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/bootstrapbay/tutorials/9bd35694f9b5436e9be4ff392495c2d8987ff2fe/Part 16 - Carousel/img/swoopthemes.jpg -------------------------------------------------------------------------------- /Part 16 - Carousel/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | BootstrapBay Tutorial 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 50 | 51 |
    52 | 90 |
    91 |
    92 | 93 | Slate Bootstrap Admin Theme 94 | 95 |

    Slate

    96 |

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

    97 | View 98 |
    99 |
    100 | 101 | Appi Landing Page Template 102 | 103 |

    Appi

    104 |

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

    105 | View 106 |
    107 |
    108 | 109 | Jiggy Portfolio Theme 110 | 111 |

    Jiggy

    112 |

    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc suscipit convallis nisl, eget rutrum lectus commodo at. Pellentesque mattis justo vel augue pretium euismod. Interdum et malesuada fames ac ante ipsum primis in faucibus. Fusce eu turpis eros.

    113 | View 114 |
    115 |
    116 |
    117 | 118 | 119 | 120 | 121 | 133 | 134 | 136 | 137 | 172 | 173 | 174 | 175 | 176 | -------------------------------------------------------------------------------- /Part 16 - Carousel/jiggy.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | BootstrapBay Tutorial 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 50 | 51 |
    52 | 55 |
    56 |
    57 |
    58 | Jiggy Single Page Portfolio 59 |
    60 | Live Preview 61 |
    62 |
    63 |

    Jiggy is a beautiful and fully responsive one page HTML template. It is intended for websites that are showcasing a creative portfolio. It includes sections for portfolio items, testimonials, about and contact.

    64 |

    Features

    65 |
      66 |
    • Bootstrap 3
    • 67 |
    • Fully responsive
    • 68 |
    • One page scroll design
    • 69 |
    • Alternate sections
    • 70 |
    • HTML5 and CSS3
    • 71 |
    • Google Fonts
    • 72 |
    • Font Awesome Icons
    • 73 |
    74 |
    75 |
    76 |
    77 |

    $14

    78 |

    Basic License

    79 | Buy Now 80 |
    81 |
    82 |
    83 |

    Theme Author

    84 |
    85 |
    86 | Swoop Themes 87 |

    Swoop Themes

    88 |
    89 |
    90 |
    91 |
    92 |

    Theme Attributes

    93 |
    94 | 95 | 96 | 97 | 98 | 99 | 100 | 101 | 102 | 103 | 104 | 105 | 106 | 107 | 108 | 109 | 110 | 111 | 112 | 113 | 114 | 115 | 116 | 117 |
    CategoryPortfolio
    Version1
    Bootstrap3.1.1
    Tagsportfolio, responsive, clean, showcase, single page
    Release DateJun 20, 2014
    118 |
    119 |
    120 |
    121 |
    122 | 123 | 124 | 136 | 137 | 139 | 140 | 175 | 176 | 177 | 178 | 179 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | BootstrapBay Tutorial Source Files 2 | ========= 3 | 4 | This page will be used to host the source files for our Bootstrap tutorials on YouTube. Each folder represents a separate tutorial. 5 | 6 |

    Links

    7 | Home Page: http://bootstrapbay.com
    8 | Blog: http://bootstrapbay.com/blog
    9 | YouTube Channel: https://www.youtube.com/channel/UCQ7erinMCeODr6XdPknmj7w 10 | 11 |

    Tutorial Descriptions

    12 | 13 |

    Part 1 - Introduction and Installation

    14 |

    Bootstrap is the most popular front-end framework for developing responsive, mobile first projects on the web. In our first tutorial, we show you how to install Bootstrap.

    15 | 16 |

    Part 2 - Responsive NavBar with Dropdown Menus

    17 |

    We build a responsive navbar with dropdown menus that is optimized for mobile devices. Navbars are responsive meta components that serve as navigation headers for your application or site. They begin collapsed (and are toggleable) in mobile views and become horizontal as the available viewport width increases.

    18 | 19 |

    Part 3 - Fixed Footer

    20 |

    We build a fixed footer navbar. Navbars are responsive meta components that serve as navigation headers for your application or site. They begin collapsed (and are toggleable) in mobile views and become horizontal as the available viewport width increases.

    21 | 22 |

    Part 4 - Font Awesome & Social Icons

    23 |

    We show you how to install Font Awesome and how to add social icons to your website's footer. Font Awesome gives you scalable vector icons that can instantly be customized — size, color, drop shadow, and anything that can be done with the power of CSS.

    24 | 25 |

    Part 5 - Jumbotron

    26 |

    We show you how to build a jumbotron and make important content on your website really standout. A jumbotron is a A lightweight, flexible component that can optionally extend the entire viewport to showcase key content on your site.

    27 | 28 |

    Part 6 - Grid System

    29 |

    We explain the Bootstrap grid system and show you how to add columns of text to your website that collapse appropriately. Bootstrap includes a responsive, mobile first fluid grid system that appropriately scales up to 12 columns as the device or viewport size increases. It includes predefined classes for easy layout options, as well as powerful mixins for generating more semantic layouts.

    30 | 31 |

    Part 7 - Modal

    32 |

    We build a modal (pop-up box) for the website. Modals are streamlined, but flexible, dialog prompts with the minimum required functionality and smart defaults.

    33 | 34 |

    Part 8 - Thumbnails

    35 |

    We extend Bootstrap's grid system with the thumbnail component to easily display grids of images for our themes. 36 | 37 |

    Part 9 - Google Web Fonts

    38 |

    We add Google web fonts to our Bootstrap website. Google web fonts are free, open-source fonts optimized for the web. The API service runs on Google's servers which are fast, reliable and tested. Google provides this service free of charge.

    39 | 40 |

    Part 10 - Contact Form

    41 |

    We built a contact form within our modal. We use Bootstrap's predefined grid classes to align labels and groups of form controls in a horizontal layout by adding .form-horizontal to the form. Doing so changes .form-groups to behave as grid rows, so no need for .row.

    42 | 43 |

    Part 11 - CSS Modifications

    44 |

    In this installment of our Bootstrap 3 tutorial, we add some custom CSS modifications to the common Bootstrap elements including the navbar, navbar links and buttons.

    45 | 46 |

    Part 12 - CSS Modifications

    47 |

    In this part of our Bootstrap 3 tutorial, we apply the CSS transform and transition effects to our thumbnail images to spice up the website. We use a transform scale of 1.1 and we use an ease transition of 0.3 seconds.

    48 | 49 |

    Part 13 - Adding a New Page

    50 |

    In this part of our Bootstrap 3 tutorial, we add a new page to our Bootstrap site to showcase the themes. We then link the page to our homepage and vice versa.

    51 | 52 |

    Part 14 - Building the Theme Page

    53 |

    In this part of our Bootstrap 3 tutorial, we start building the theme page. The page contains a page header, a thumbnail with an image preview and caption, a description of the theme and a features list using an unordered list.

    54 | 55 |

    Part 15 - Sidebar, Panels & Tables

    56 |

    In this part of our Bootstrap 3 tutorial, we build a sidebar for the theme page. The sidebar uses default panel classes with custom background colors as well as a bordered and lined table.

    57 | --------------------------------------------------------------------------------