form_buttons.html 34.3 KB
Newer Older
A
Anthony Mutisya 已提交
1 2
<!DOCTYPE html>
<html lang="en">
3 4 5 6 7 8 9
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <!-- Meta, title, CSS, favicons, etc. -->
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

10
    <title>Gentellela Alela! | </title>
11 12 13 14 15

    <!-- Bootstrap -->
    <link href="../vendors/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
    <!-- Font Awesome -->
    <link href="../vendors/font-awesome/css/font-awesome.min.css" rel="stylesheet">
C
christianesperar 已提交
16 17
    <!-- NProgress -->
    <link href="../vendors/nprogress/nprogress.css" rel="stylesheet">
18 19
    
    <!-- Custom Theme Style -->
C
christianesperar 已提交
20
    <link href="../build/css/custom.min.css" rel="stylesheet">
21 22 23 24 25 26 27 28 29 30
  </head>

  <body class="nav-md">
    <div class="container body">
      <div class="main_container">
        <div class="col-md-3 left_col">
          <div class="left_col scroll-view">
            <div class="navbar nav_title" style="border: 0;">
              <a href="index.html" class="site_title"><i class="fa fa-paw"></i> <span>Gentellela Alela!</span></a>
            </div>
A
Anthony Mutisya 已提交
31

32
            <div class="clearfix"></div>
A
Anthony Mutisya 已提交
33

34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53
            <!-- menu profile quick info -->
            <div class="profile">
              <div class="profile_pic">
                <img src="images/img.jpg" alt="..." class="img-circle profile_img">
              </div>
              <div class="profile_info">
                <span>Welcome,</span>
                <h2>John Doe</h2>
              </div>
            </div>
            <!-- /menu profile quick info -->

            <br />

            <!-- sidebar menu -->
            <div id="sidebar-menu" class="main_menu_side hidden-print main_menu">
              <div class="menu_section">
                <h3>General</h3>
                <ul class="nav side-menu">
                  <li><a><i class="fa fa-home"></i> Home <span class="fa fa-chevron-down"></span></a>
54
                    <ul class="nav child_menu">
55 56 57
                      <li><a href="index.html">Dashboard</a></li>
                      <li><a href="index2.html">Dashboard2</a></li>
                      <li><a href="index3.html">Dashboard3</a></li>
58 59 60
                    </ul>
                  </li>
                  <li><a><i class="fa fa-edit"></i> Forms <span class="fa fa-chevron-down"></span></a>
61
                    <ul class="nav child_menu">
62 63 64 65 66 67
                      <li><a href="form.html">General Form</a></li>
                      <li><a href="form_advanced.html">Advanced Components</a></li>
                      <li><a href="form_validation.html">Form Validation</a></li>
                      <li><a href="form_wizards.html">Form Wizard</a></li>
                      <li><a href="form_upload.html">Form Upload</a></li>
                      <li><a href="form_buttons.html">Form Buttons</a></li>
68 69 70
                    </ul>
                  </li>
                  <li><a><i class="fa fa-desktop"></i> UI Elements <span class="fa fa-chevron-down"></span></a>
71
                    <ul class="nav child_menu">
72 73 74 75 76 77 78 79 80
                      <li><a href="general_elements.html">General Elements</a></li>
                      <li><a href="media_gallery.html">Media Gallery</a></li>
                      <li><a href="typography.html">Typography</a></li>
                      <li><a href="icons.html">Icons</a></li>
                      <li><a href="glyphicons.html">Glyphicons</a></li>
                      <li><a href="widgets.html">Widgets</a></li>
                      <li><a href="invoice.html">Invoice</a></li>
                      <li><a href="inbox.html">Inbox</a></li>
                      <li><a href="calendar.html">Calendar</a></li>
81 82 83
                    </ul>
                  </li>
                  <li><a><i class="fa fa-table"></i> Tables <span class="fa fa-chevron-down"></span></a>
84
                    <ul class="nav child_menu">
85 86
                      <li><a href="tables.html">Tables</a></li>
                      <li><a href="tables_dynamic.html">Table Dynamic</a></li>
87 88 89
                    </ul>
                  </li>
                  <li><a><i class="fa fa-bar-chart-o"></i> Data Presentation <span class="fa fa-chevron-down"></span></a>
90
                    <ul class="nav child_menu">
91 92 93 94 95
                      <li><a href="chartjs.html">Chart JS</a></li>
                      <li><a href="chartjs2.html">Chart JS2</a></li>
                      <li><a href="morisjs.html">Moris JS</a></li>
                      <li><a href="echarts.html">ECharts</a></li>
                      <li><a href="other_charts.html">Other Charts</a></li>
96 97
                    </ul>
                  </li>
98 99
                  <li><a><i class="fa fa-clone"></i>Layouts <span class="fa fa-chevron-down"></span></a>
                    <ul class="nav child_menu">
100 101
                      <li><a href="fixed_sidebar.html">Fixed Sidebar</a></li>
                      <li><a href="fixed_footer.html">Fixed Footer</a></li>
102 103
                    </ul>
                  </li>
104 105 106 107 108 109
                </ul>
              </div>
              <div class="menu_section">
                <h3>Live On</h3>
                <ul class="nav side-menu">
                  <li><a><i class="fa fa-bug"></i> Additional Pages <span class="fa fa-chevron-down"></span></a>
110
                    <ul class="nav child_menu">
111 112 113 114 115
                      <li><a href="e_commerce.html">E-commerce</a></li>
                      <li><a href="projects.html">Projects</a></li>
                      <li><a href="project_detail.html">Project Detail</a></li>
                      <li><a href="contacts.html">Contacts</a></li>
                      <li><a href="profile.html">Profile</a></li>
116 117 118
                    </ul>
                  </li>
                  <li><a><i class="fa fa-windows"></i> Extras <span class="fa fa-chevron-down"></span></a>
119
                    <ul class="nav child_menu">
120 121 122 123 124 125
                      <li><a href="page_403.html">403 Error</a></li>
                      <li><a href="page_404.html">404 Error</a></li>
                      <li><a href="page_500.html">500 Error</a></li>
                      <li><a href="plain_page.html">Plain Page</a></li>
                      <li><a href="login.html">Login Page</a></li>
                      <li><a href="pricing_tables.html">Pricing Tables</a></li>
126 127 128
                    </ul>
                  </li>
                  <li><a><i class="fa fa-sitemap"></i> Multilevel Menu <span class="fa fa-chevron-down"></span></a>
129
                    <ul class="nav child_menu">
130 131
                        <li><a href="#level1_1">Level One</a>
                        <li><a>Level One<span class="fa fa-chevron-down"></span></a>
132
                          <ul class="nav child_menu">
133 134 135 136 137 138 139 140 141 142 143
                            <li class="sub_menu"><a href="level2.html">Level Two</a>
                            </li>
                            <li><a href="#level2_1">Level Two</a>
                            </li>
                            <li><a href="#level2_2">Level Two</a>
                            </li>
                          </ul>
                        </li>
                        <li><a href="#level1_2">Level One</a>
                        </li>
                    </ul>
144 145
                  </li>                  
                  <li><a href="javascript:void(0)"><i class="fa fa-laptop"></i> Landing Page <span class="label label-success pull-right">Coming Soon</span></a></li>
146 147
                </ul>
              </div>
A
Aigars Silkalns 已提交
148 149

            </div>
150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165
            <!-- /sidebar menu -->

            <!-- /menu footer buttons -->
            <div class="sidebar-footer hidden-small">
              <a data-toggle="tooltip" data-placement="top" title="Settings">
                <span class="glyphicon glyphicon-cog" aria-hidden="true"></span>
              </a>
              <a data-toggle="tooltip" data-placement="top" title="FullScreen">
                <span class="glyphicon glyphicon-fullscreen" aria-hidden="true"></span>
              </a>
              <a data-toggle="tooltip" data-placement="top" title="Lock">
                <span class="glyphicon glyphicon-eye-close" aria-hidden="true"></span>
              </a>
              <a data-toggle="tooltip" data-placement="top" title="Logout">
                <span class="glyphicon glyphicon-off" aria-hidden="true"></span>
              </a>
A
Aigars Silkalns 已提交
166
            </div>
167
            <!-- /menu footer buttons -->
A
Aigars Silkalns 已提交
168
          </div>
169
        </div>
A
Aigars Silkalns 已提交
170

171 172 173
        <!-- top navigation -->
        <div class="top_nav">
          <div class="nav_menu">
174
            <nav>
175 176 177
              <div class="nav toggle">
                <a id="menu_toggle"><i class="fa fa-bars"></i></a>
              </div>
A
Aigars Silkalns 已提交
178

179 180 181 182 183 184 185
              <ul class="nav navbar-nav navbar-right">
                <li class="">
                  <a href="javascript:;" class="user-profile dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
                    <img src="images/img.jpg" alt="">John Doe
                    <span class=" fa fa-angle-down"></span>
                  </a>
                  <ul class="dropdown-menu dropdown-usermenu pull-right">
186
                    <li><a href="javascript:;"> Profile</a></li>
187 188 189 190 191
                    <li>
                      <a href="javascript:;">
                        <span class="badge bg-red pull-right">50%</span>
                        <span>Settings</span>
                      </a>
A
Aigars Silkalns 已提交
192
                    </li>
193 194
                    <li><a href="javascript:;">Help</a></li>
                    <li><a href="login.html"><i class="fa fa-sign-out pull-right"></i> Log Out</a></li>
A
Aigars Silkalns 已提交
195 196
                  </ul>
                </li>
197 198 199 200 201 202 203 204 205

                <li role="presentation" class="dropdown">
                  <a href="javascript:;" class="dropdown-toggle info-number" data-toggle="dropdown" aria-expanded="false">
                    <i class="fa fa-envelope-o"></i>
                    <span class="badge bg-green">6</span>
                  </a>
                  <ul id="menu1" class="dropdown-menu list-unstyled msg_list" role="menu">
                    <li>
                      <a>
206
                        <span class="image"><img src="images/img.jpg" alt="Profile Image" /></span>
207
                        <span>
208 209
                          <span>John Smith</span>
                          <span class="time">3 mins ago</span>
210 211
                        </span>
                        <span class="message">
212 213
                          Film festivals used to be do-or-die moments for movie makers. They were where...
                        </span>
214
                      </a>
A
Aigars Silkalns 已提交
215
                    </li>
216 217
                    <li>
                      <a>
218
                        <span class="image"><img src="images/img.jpg" alt="Profile Image" /></span>
219
                        <span>
220 221
                          <span>John Smith</span>
                          <span class="time">3 mins ago</span>
222 223
                        </span>
                        <span class="message">
224 225
                          Film festivals used to be do-or-die moments for movie makers. They were where...
                        </span>
226
                      </a>
A
Aigars Silkalns 已提交
227
                    </li>
228 229
                    <li>
                      <a>
230
                        <span class="image"><img src="images/img.jpg" alt="Profile Image" /></span>
231
                        <span>
232 233
                          <span>John Smith</span>
                          <span class="time">3 mins ago</span>
234 235
                        </span>
                        <span class="message">
236 237
                          Film festivals used to be do-or-die moments for movie makers. They were where...
                        </span>
238
                      </a>
A
Aigars Silkalns 已提交
239
                    </li>
240 241
                    <li>
                      <a>
242
                        <span class="image"><img src="images/img.jpg" alt="Profile Image" /></span>
243
                        <span>
244 245
                          <span>John Smith</span>
                          <span class="time">3 mins ago</span>
246 247
                        </span>
                        <span class="message">
248 249
                          Film festivals used to be do-or-die moments for movie makers. They were where...
                        </span>
250
                      </a>
A
Aigars Silkalns 已提交
251
                    </li>
252 253 254 255 256 257 258
                    <li>
                      <div class="text-center">
                        <a>
                          <strong>See All Alerts</strong>
                          <i class="fa fa-angle-right"></i>
                        </a>
                      </div>
A
Aigars Silkalns 已提交
259 260 261
                    </li>
                  </ul>
                </li>
262 263
              </ul>
            </nav>
A
Aigars Silkalns 已提交
264 265
          </div>
        </div>
266
        <!-- /top navigation -->
A
Anthony Mutisya 已提交
267

268 269 270 271 272 273 274
        <!-- page content -->
        <div class="right_col" role="main">
          <div class="">
            <div class="page-title">
              <div class="title_left">
                <h3>Form Buttons</h3>
              </div>
A
Anthony Mutisya 已提交
275

276 277 278 279 280
              <div class="title_right">
                <div class="col-md-5 col-sm-5 col-xs-12 form-group pull-right top_search">
                  <div class="input-group">
                    <input type="text" class="form-control" placeholder="Search for...">
                    <span class="input-group-btn">
281 282
                      <button class="btn btn-default" type="button">Go!</button>
                    </span>
283
                  </div>
A
Anthony Mutisya 已提交
284
                </div>
A
Aigars Silkalns 已提交
285 286
              </div>
            </div>
287

288
            <div class="clearfix"></div>
A
Aigars Silkalns 已提交
289

290 291 292 293 294 295 296 297 298 299 300 301 302 303 304 305 306 307 308 309 310 311 312 313
            <div class="row">
              <div class="col-md-6">
                <div class="x_panel">
                  <div class="x_title">
                    <h2>Default Buttons </h2>
                    <ul class="nav navbar-right panel_toolbox">
                      <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
                      </li>
                      <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-wrench"></i></a>
                        <ul class="dropdown-menu" role="menu">
                          <li><a href="#">Settings 1</a>
                          </li>
                          <li><a href="#">Settings 2</a>
                          </li>
                        </ul>
                      </li>
                      <li><a class="close-link"><i class="fa fa-close"></i></a>
                      </li>
                    </ul>
                    <div class="clearfix"></div>
                  </div>
                  <div class="x_content">
                    <button type="button" class="btn btn-default">Default</button>
A
Aigars Silkalns 已提交
314

315
                    <button type="button" class="btn btn-primary">Primary</button>
A
Aigars Silkalns 已提交
316

317
                    <button type="button" class="btn btn-success">Success</button>
A
Aigars Silkalns 已提交
318

319
                    <button type="button" class="btn btn-info">Info</button>
A
Anthony Mutisya 已提交
320

321
                    <button type="button" class="btn btn-warning">Warning</button>
A
Aigars Silkalns 已提交
322

323
                    <button type="button" class="btn btn-danger">Danger</button>
A
Aigars Silkalns 已提交
324

325
                    <button type="button" class="btn btn-dark">Dark</button>
A
Aigars Silkalns 已提交
326

327 328
                    <button type="button" class="btn btn-link">Link</button>
                  </div>
A
Aigars Silkalns 已提交
329 330 331
                </div>


332 333 334 335 336 337 338 339 340 341 342 343 344 345 346 347 348 349 350 351 352 353 354 355 356 357 358 359
                <div class="x_panel">
                  <div class="x_title">
                    <h2>Rounded Button</h2>
                    <ul class="nav navbar-right panel_toolbox">
                      <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
                      </li>
                      <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-wrench"></i></a>
                        <ul class="dropdown-menu" role="menu">
                          <li><a href="#">Settings 1</a>
                          </li>
                          <li><a href="#">Settings 2</a>
                          </li>
                        </ul>
                      </li>
                      <li><a class="close-link"><i class="fa fa-close"></i></a>
                      </li>
                    </ul>
                    <div class="clearfix"></div>
                  </div>
                  <div class="x_content">
                    <button type="button" class="btn btn-round btn-default">Default</button>
                    <button type="button" class="btn btn-round btn-primary">Primary</button>
                    <button type="button" class="btn btn-round btn-success">Success</button>
                    <button type="button" class="btn btn-round btn-info">Info</button>
                    <button type="button" class="btn btn-round btn-warning">Warning</button>
                    <button type="button" class="btn btn-round btn-danger">Danger</button>
                  </div>
A
Aigars Silkalns 已提交
360 361
                </div>

362 363 364 365 366 367 368 369 370 371 372 373 374 375 376 377 378 379 380 381 382
                <div class="x_panel">
                  <div class="x_title">
                    <h2>Button Dropdown</h2>
                    <ul class="nav navbar-right panel_toolbox">
                      <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
                      </li>
                      <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-wrench"></i></a>
                        <ul class="dropdown-menu" role="menu">
                          <li><a href="#">Settings 1</a>
                          </li>
                          <li><a href="#">Settings 2</a>
                          </li>
                        </ul>
                      </li>
                      <li><a class="close-link"><i class="fa fa-close"></i></a>
                      </li>
                    </ul>
                    <div class="clearfix"></div>
                  </div>
                  <div class="x_content">
A
Aigars Silkalns 已提交
383

384
                    <button data-toggle="dropdown" class="btn btn-default dropdown-toggle" type="button" aria-expanded="false">Default <span class="caret"></span>
A
Aigars Silkalns 已提交
385
                    </button>
386
                    <ul role="menu" class="dropdown-menu">
A
Aigars Silkalns 已提交
387 388 389 390 391 392 393 394 395 396 397
                      <li><a href="#">Action</a>
                      </li>
                      <li><a href="#">Another action</a>
                      </li>
                      <li><a href="#">Something else here</a>
                      </li>
                      <li class="divider"></li>
                      <li><a href="#">Separated link</a>
                      </li>
                    </ul>

398
                    <button data-toggle="dropdown" class="btn btn-primary dropdown-toggle btn-sm" type="button" aria-expanded="false">Primary <span class="caret"></span>
A
Aigars Silkalns 已提交
399
                    </button>
400
                    <ul role="menu" class="dropdown-menu">
A
Aigars Silkalns 已提交
401 402 403 404 405 406 407 408 409 410 411
                      <li><a href="#">Action</a>
                      </li>
                      <li><a href="#">Another action</a>
                      </li>
                      <li><a href="#">Something else here</a>
                      </li>
                      <li class="divider"></li>
                      <li><a href="#">Separated link</a>
                      </li>
                    </ul>

412
                    <button data-toggle="dropdown" class="btn btn-success dropdown-toggle btn-xs" type="button">Success <span class="caret"></span>
A
Aigars Silkalns 已提交
413
                    </button>
414
                    <ul role="menu" class="dropdown-menu">
A
Aigars Silkalns 已提交
415 416 417 418 419 420 421 422 423 424 425 426
                      <li><a href="#">Action</a>
                      </li>
                      <li><a href="#">Another action</a>
                      </li>
                      <li><a href="#">Something else here</a>
                      </li>
                      <li class="divider"></li>
                      <li><a href="#">Separated link</a>
                      </li>
                    </ul>


427
                  </div>
A
Aigars Silkalns 已提交
428 429 430
                </div>


431 432 433 434 435 436 437 438 439 440 441 442 443 444 445 446 447 448 449 450 451 452 453 454 455 456 457 458 459
                <div class="x_panel">
                  <div class="x_title">
                    <h2>Split Button Dropdown</h2>
                    <ul class="nav navbar-right panel_toolbox">
                      <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
                      </li>
                      <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-wrench"></i></a>
                        <ul class="dropdown-menu" role="menu">
                          <li><a href="#">Settings 1</a>
                          </li>
                          <li><a href="#">Settings 2</a>
                          </li>
                        </ul>
                      </li>
                      <li><a class="close-link"><i class="fa fa-close"></i></a>
                      </li>
                    </ul>
                    <div class="clearfix"></div>
                  </div>
                  <div class="x_content">

                    <!-- Split button -->
                    <div class="btn-group">
                      <button type="button" class="btn btn-danger">Action</button>
                      <button type="button" class="btn btn-danger dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
                        <span class="caret"></span>
                        <span class="sr-only">Toggle Dropdown</span>
                      </button>
A
Aigars Silkalns 已提交
460
                      <ul class="dropdown-menu" role="menu">
461
                        <li><a href="#">Action</a>
A
Aigars Silkalns 已提交
462
                        </li>
463 464 465 466 467 468
                        <li><a href="#">Another action</a>
                        </li>
                        <li><a href="#">Something else here</a>
                        </li>
                        <li class="divider"></li>
                        <li><a href="#">Separated link</a>
A
Aigars Silkalns 已提交
469 470
                        </li>
                      </ul>
471
                    </div>
A
Aigars Silkalns 已提交
472

473 474 475 476 477 478 479 480 481 482 483 484 485 486 487 488 489 490 491
                    <!-- Split button -->
                    <div class="btn-group">
                      <button type="button" class="btn btn-danger">Action</button>
                      <button type="button" class="btn btn-danger dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
                        <span class="caret"></span>
                        <span class="sr-only">Toggle Dropdown</span>
                      </button>
                      <ul class="dropdown-menu" role="menu">
                        <li><a href="#">Action</a>
                        </li>
                        <li><a href="#">Another action</a>
                        </li>
                        <li><a href="#">Something else here</a>
                        </li>
                        <li class="divider"></li>
                        <li><a href="#">Separated link</a>
                        </li>
                      </ul>
                    </div>
A
Aigars Silkalns 已提交
492

493 494 495 496 497 498 499
                    <!-- Split button -->
                    <div class="btn-group">
                      <button type="button" class="btn btn-danger">Action</button>
                      <button type="button" class="btn btn-danger dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
                        <span class="caret"></span>
                        <span class="sr-only">Toggle Dropdown</span>
                      </button>
A
Aigars Silkalns 已提交
500
                      <ul class="dropdown-menu" role="menu">
501
                        <li><a href="#">Action</a>
A
Aigars Silkalns 已提交
502
                        </li>
503 504 505 506 507 508
                        <li><a href="#">Another action</a>
                        </li>
                        <li><a href="#">Something else here</a>
                        </li>
                        <li class="divider"></li>
                        <li><a href="#">Separated link</a>
A
Aigars Silkalns 已提交
509 510
                        </li>
                      </ul>
511 512 513 514
                    </div>


                  </div>
A
Aigars Silkalns 已提交
515
                </div>
516 517 518 519 520 521 522 523 524 525 526 527 528 529 530 531 532 533 534 535 536 537 538 539 540 541 542 543 544 545 546 547 548 549 550 551 552 553 554 555 556 557 558 559 560 561 562 563 564 565 566 567 568 569 570 571 572 573 574


                <div class="x_panel">
                  <div class="x_title">
                    <h2>Button App Design</h2>
                    <ul class="nav navbar-right panel_toolbox">
                      <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
                      </li>
                      <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-wrench"></i></a>
                        <ul class="dropdown-menu" role="menu">
                          <li><a href="#">Settings 1</a>
                          </li>
                          <li><a href="#">Settings 2</a>
                          </li>
                        </ul>
                      </li>
                      <li><a class="close-link"><i class="fa fa-close"></i></a>
                      </li>
                    </ul>
                    <div class="clearfix"></div>
                  </div>
                  <div class="x_content">
                    <p>Add the class <code>.btn .btn-app</code> tag</p>
                    <a class="btn btn-app">
                      <i class="fa fa-edit"></i> Edit
                    </a>
                    <a class="btn btn-app">
                      <i class="fa fa-play"></i> Play
                    </a>
                    <a class="btn btn-app">
                      <i class="fa fa-pause"></i> Pause
                    </a>
                    <a class="btn btn-app">
                      <i class="fa fa-save"></i> Save
                    </a>
                    <a class="btn btn-app">
                      <span class="badge bg-red">6</span>
                      <i class="fa fa-bullhorn"></i> Notifications
                    </a>
                    <a class="btn btn-app">
                      <i class="fa fa-repeat"></i> Repeat
                    </a>
                    <a class="btn btn-app">
                      <span class="badge bg-green">211</span>
                      <i class="fa fa-users"></i> Users
                    </a>
                    <a class="btn btn-app">
                      <span class="badge bg-orange">32</span>
                      <i class="fa fa-inbox"></i> Orders
                    </a>
                    <a class="btn btn-app">
                      <span class="badge bg-orange">12</span>
                      <i class="fa fa-envelope"></i> Inbox
                    </a>
                    <a class="btn btn-app">
                      <span class="badge bg-blue">102</span>
                      <i class="fa fa-heart-o"></i> Likes
                    </a>
A
Aigars Silkalns 已提交
575 576 577 578 579
                  </div>
                </div>

              </div>

580
              <div class="col-md-6">
A
Aigars Silkalns 已提交
581

582 583 584 585 586 587 588 589 590 591 592 593 594 595 596 597 598 599 600
                <div class="x_panel">
                  <div class="x_title">
                    <h2>Button Sizes</h2>
                    <ul class="nav navbar-right panel_toolbox">
                      <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
                      </li>
                      <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-wrench"></i></a>
                        <ul class="dropdown-menu" role="menu">
                          <li><a href="#">Settings 1</a>
                          </li>
                          <li><a href="#">Settings 2</a>
                          </li>
                        </ul>
                      </li>
                      <li><a class="close-link"><i class="fa fa-close"></i></a>
                      </li>
                    </ul>
                    <div class="clearfix"></div>
A
Aigars Silkalns 已提交
601
                  </div>
602 603 604 605 606 607 608 609 610 611 612 613 614 615 616 617 618
                  <div class="x_content">
                    <div class="buttons">
                      <!-- Standard button -->
                      <button type="button" class="btn btn-default btn-lg">Large Button</button>
                      <button type="button" class="btn btn-default btn-sm">Medium Button</button>
                      <button type="button" class="btn btn-default btn-xs">Small Button</button>
                      <br>

                      <button type="button" class="btn btn-success btn-lg">Large Button</button>
                      <button type="button" class="btn btn-success btn-sm">Medium Button</button>
                      <button type="button" class="btn btn-success btn-xs">Small Button</button>
                      <br>

                      <button type="button" class="btn btn-info btn-lg">Large Button</button>
                      <button type="button" class="btn btn-info btn-sm">Medium Button</button>
                      <button type="button" class="btn btn-info btn-xs">Small Button</button>
                      <br>
A
Anthony Mutisya 已提交
619
                    </div>
A
Aigars Silkalns 已提交
620
                  </div>
621 622 623 624 625 626 627 628 629 630 631 632 633 634

                </div>


                <div class="x_panel">
                  <div class="x_title">
                    <h2>Button Groups</h2>
                    <ul class="nav navbar-right panel_toolbox">
                      <li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>
                      </li>
                      <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-wrench"></i></a>
                        <ul class="dropdown-menu" role="menu">
                          <li><a href="#">Settings 1</a>
A
Aigars Silkalns 已提交
635
                          </li>
636
                          <li><a href="#">Settings 2</a>
A
Aigars Silkalns 已提交
637 638
                          </li>
                        </ul>
639 640 641 642 643
                      </li>
                      <li><a class="close-link"><i class="fa fa-close"></i></a>
                      </li>
                    </ul>
                    <div class="clearfix"></div>
A
Aigars Silkalns 已提交
644
                  </div>
645 646
                  <div class="x_content">
                    <div class="row">
A
Aigars Silkalns 已提交
647
                      <div class="btn-group">
648 649 650
                        <button class="btn btn-default" type="button">Left</button>
                        <button class="btn btn-default" type="button">Middle</button>
                        <button class="btn btn-default" type="button">Right</button>
A
Aigars Silkalns 已提交
651
                      </div>
652 653 654 655 656 657 658 659 660 661 662 663
                      <div class="btn-group  btn-group-sm">
                        <button class="btn btn-default" type="button">Left</button>
                        <button class="btn btn-default" type="button">Middle</button>
                        <button class="btn btn-default" type="button">Right</button>
                      </div>
                    </div>
                    <p class="text-muted">Vertical button groups</p>
                    <div class="row">
                      <div class="btn-group-vertical">
                        <button class="btn btn-default" type="button">Top</button>
                        <button class="btn btn-default" type="button">Middle</button>
                        <button class="btn btn-default" type="button">Bottom</button>
A
Aigars Silkalns 已提交
664
                      </div>
665 666 667
                    </div>
                    <p class="text-muted">Nested button groups</p>
                    <div class="row">
A
Aigars Silkalns 已提交
668
                      <div class="btn-group">
669 670 671 672 673 674 675 676 677 678 679 680 681 682 683 684 685 686 687 688 689 690 691 692 693 694 695 696 697 698 699 700 701 702
                        <button class="btn btn-default" type="button">1</button>
                        <button class="btn btn-danger" type="button">2</button>
                        <button class="btn btn-default" type="button">3</button>
                        <div class="btn-group">
                          <button data-toggle="dropdown" class="btn btn-default dropdown-toggle" type="button"> Dropdown <span class="caret"></span> </button>
                          <ul class="dropdown-menu">
                            <li><a href="#">Dropdown link 1</a>
                            </li>
                            <li><a href="#">Dropdown link 2</a>
                            </li>
                            <li><a href="#">Dropdown link 3</a>
                            </li>
                          </ul>
                        </div>
                      </div>
                    </div>

                    <p class="text-muted">Multiple button groups</p>
                    <div class="row">
                      <div class="btn-toolbar">
                        <div class="btn-group">
                          <button class="btn btn-info" type="button">1</button>
                          <button class="btn btn-info active" type="button">2</button>
                          <button class="btn btn-info" type="button">3</button>
                          <button class="btn btn-info" type="button">4</button>
                        </div>
                        <div class="btn-group">
                          <button class="btn btn-success" type="button">5</button>
                          <button class="btn btn-success" type="button">6</button>
                          <button class="btn btn-success" type="button">7</button>
                        </div>
                        <div class="btn-group">
                          <button class="btn btn-warning" type="button">8</button>
                        </div>
A
Aigars Silkalns 已提交
703 704 705
                      </div>
                    </div>

706 707 708 709 710 711 712 713 714 715 716 717 718
                    <p class="text-muted">Group Radio</p>
                    <div class="row">
                      <div class="btn-group" data-toggle="buttons">
                        <label class="btn btn-default">
                          <input type="radio" name="options" id="option1"> Option 1
                        </label>
                        <label class="btn btn-default">
                          <input type="radio" name="options" id="option2"> Option 2
                        </label>
                        <label class="btn btn-default">
                          <input type="radio" name="options" id="option3"> Option 3
                        </label>
                      </div>
A
Aigars Silkalns 已提交
719 720 721 722
                    </div>
                  </div>
                </div>
              </div>
A
Anthony Mutisya 已提交
723
            </div>
A
Aigars Silkalns 已提交
724
          </div>
A
Anthony Mutisya 已提交
725
        </div>
726
        <!-- /page content -->
A
Anthony Mutisya 已提交
727

728 729 730 731 732 733 734 735 736
        <!-- footer content -->
        <footer>
          <div class="pull-right">
            Gentelella - Bootstrap Admin Template by <a href="https://colorlib.com">Colorlib</a>
          </div>
          <div class="clearfix"></div>
        </footer>
        <!-- /footer content -->
      </div>
C
christianesperar 已提交
737
    </div>
A
Anthony Mutisya 已提交
738

739 740 741 742 743 744 745 746
    <!-- jQuery -->
    <script src="../vendors/jquery/dist/jquery.min.js"></script>
    <!-- Bootstrap -->
    <script src="../vendors/bootstrap/dist/js/bootstrap.min.js"></script>
    <!-- FastClick -->
    <script src="../vendors/fastclick/lib/fastclick.js"></script>

    <!-- Custom Theme Scripts -->
C
christianesperar 已提交
747
    <script src="../build/js/custom.min.js"></script>
748 749
  </body>
</html>