Permalink
Ryan Bell
Action alignment (#125)
73dd7d7
Oct 24, 2019
Join GitHub today
GitHub is home to over 40 million developers working together to host and review code, manage projects, and build software together.
Sign up
Ryan Bell
Action alignment (#125)
73dd7d7
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset="utf-8"> | |
| <meta http-equiv="X-UA-Compatible" content="IE=edge"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |
| <title>Admin - Free Bulma template</title> | |
| <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css"> | |
| <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,700" rel="stylesheet"> | |
| <!-- Bulma Version 0.8.x--> | |
| <link rel="stylesheet" href="https://unpkg.com/bulma@0.8.0/css/bulma.min.css" /> | |
| <link rel="stylesheet" type="text/css" href="../css/admin.css"> | |
| </head> | |
| <body> | |
| <!-- START NAV --> | |
| <nav class="navbar is-white"> | |
| <div class="container"> | |
| <div class="navbar-brand"> | |
| <a class="navbar-item brand-text" href="../index.html"> | |
| Bulma Admin | |
| </a> | |
| <div class="navbar-burger burger" data-target="navMenu"> | |
| <span></span> | |
| <span></span> | |
| <span></span> | |
| </div> | |
| </div> | |
| <div id="navMenu" class="navbar-menu"> | |
| <div class="navbar-start"> | |
| <a class="navbar-item" href="admin.html"> | |
| Home | |
| </a> | |
| <a class="navbar-item" href="admin.html"> | |
| Orders | |
| </a> | |
| <a class="navbar-item" href="admin.html"> | |
| Payments | |
| </a> | |
| <a class="navbar-item" href="admin.html"> | |
| Exceptions | |
| </a> | |
| <a class="navbar-item" href="admin.html"> | |
| Reports | |
| </a> | |
| </div> | |
| </div> | |
| </div> | |
| </nav> | |
| <!-- END NAV --> | |
| <div class="container"> | |
| <div class="columns"> | |
| <div class="column is-3 "> | |
| <aside class="menu is-hidden-mobile"> | |
| <p class="menu-label"> | |
| General | |
| </p> | |
| <ul class="menu-list"> | |
| <li><a class="is-active">Dashboard</a></li> | |
| <li><a>Customers</a></li> | |
| <li><a>Other</a></li> | |
| </ul> | |
| <p class="menu-label"> | |
| Administration | |
| </p> | |
| <ul class="menu-list"> | |
| <li><a>Team Settings</a></li> | |
| <li> | |
| <a>Manage Your Team</a> | |
| <ul> | |
| <li><a>Members</a></li> | |
| <li><a>Plugins</a></li> | |
| <li><a>Add a member</a></li> | |
| <li><a>Remove a member</a></li> | |
| </ul> | |
| </li> | |
| <li><a>Invitations</a></li> | |
| <li><a>Cloud Storage Environment Settings</a></li> | |
| <li><a>Authentication</a></li> | |
| <li><a>Payments</a></li> | |
| </ul> | |
| <p class="menu-label"> | |
| Transactions | |
| </p> | |
| <ul class="menu-list"> | |
| <li><a>Payments</a></li> | |
| <li><a>Transfers</a></li> | |
| <li><a>Balance</a></li> | |
| <li><a>Reports</a></li> | |
| </ul> | |
| </aside> | |
| </div> | |
| <div class="column is-9"> | |
| <nav class="breadcrumb" aria-label="breadcrumbs"> | |
| <ul> | |
| <li><a href="../">Bulma</a></li> | |
| <li><a href="../">Templates</a></li> | |
| <li><a href="../">Examples</a></li> | |
| <li class="is-active"><a href="#" aria-current="page">Admin</a></li> | |
| </ul> | |
| </nav> | |
| <section class="hero is-info welcome is-small"> | |
| <div class="hero-body"> | |
| <div class="container"> | |
| <h1 class="title"> | |
| Hello, Admin. | |
| </h1> | |
| <h2 class="subtitle"> | |
| I hope you are having a great day! | |
| </h2> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="info-tiles"> | |
| <div class="tile is-ancestor has-text-centered"> | |
| <div class="tile is-parent"> | |
| <article class="tile is-child box"> | |
| <p class="title">439k</p> | |
| <p class="subtitle">Users</p> | |
| </article> | |
| </div> | |
| <div class="tile is-parent"> | |
| <article class="tile is-child box"> | |
| <p class="title">59k</p> | |
| <p class="subtitle">Products</p> | |
| </article> | |
| </div> | |
| <div class="tile is-parent"> | |
| <article class="tile is-child box"> | |
| <p class="title">3.4k</p> | |
| <p class="subtitle">Open Orders</p> | |
| </article> | |
| </div> | |
| <div class="tile is-parent"> | |
| <article class="tile is-child box"> | |
| <p class="title">19</p> | |
| <p class="subtitle">Exceptions</p> | |
| </article> | |
| </div> | |
| </div> | |
| </section> | |
| <div class="columns"> | |
| <div class="column is-6"> | |
| <div class="card events-card"> | |
| <header class="card-header"> | |
| <p class="card-header-title"> | |
| Events | |
| </p> | |
| <a href="#" class="card-header-icon" aria-label="more options"> | |
| <span class="icon"> | |
| <i class="fa fa-angle-down" aria-hidden="true"></i> | |
| </span> | |
| </a> | |
| </header> | |
| <div class="card-table"> | |
| <div class="content"> | |
| <table class="table is-fullwidth is-striped"> | |
| <tbody> | |
| <tr> | |
| <td width="5%"><i class="fa fa-bell-o"></i></td> | |
| <td>Lorum ipsum dolem aire</td> | |
| <td class="level-right"><a class="button is-small is-primary" href="#">Action</a></td> | |
| </tr> | |
| <tr> | |
| <td width="5%"><i class="fa fa-bell-o"></i></td> | |
| <td>Lorum ipsum dolem aire</td> | |
| <td class="level-right"><a class="button is-small is-primary" href="#">Action</a></td> | |
| </tr> | |
| <tr> | |
| <td width="5%"><i class="fa fa-bell-o"></i></td> | |
| <td>Lorum ipsum dolem aire</td> | |
| <td class="level-right"><a class="button is-small is-primary" href="#">Action</a></td> | |
| </tr> | |
| <tr> | |
| <td width="5%"><i class="fa fa-bell-o"></i></td> | |
| <td>Lorum ipsum dolem aire</td> | |
| <td class="level-right"><a class="button is-small is-primary" href="#">Action</a></td> | |
| </tr> | |
| <tr> | |
| <td width="5%"><i class="fa fa-bell-o"></i></td> | |
| <td>Lorum ipsum dolem aire</td> | |
| <td class="level-right"><a class="button is-small is-primary" href="#">Action</a></td> | |
| </tr> | |
| <tr> | |
| <td width="5%"><i class="fa fa-bell-o"></i></td> | |
| <td>Lorum ipsum dolem aire</td> | |
| <td class="level-right"><a class="button is-small is-primary" href="#">Action</a></td> | |
| </tr> | |
| <tr> | |
| <td width="5%"><i class="fa fa-bell-o"></i></td> | |
| <td>Lorum ipsum dolem aire</td> | |
| <td class="level-right"><a class="button is-small is-primary" href="#">Action</a></td> | |
| </tr> | |
| <tr> | |
| <td width="5%"><i class="fa fa-bell-o"></i></td> | |
| <td>Lorum ipsum dolem aire</td> | |
| <td class="level-right"><a class="button is-small is-primary" href="#">Action</a></td> | |
| </tr> | |
| <tr> | |
| <td width="5%"><i class="fa fa-bell-o"></i></td> | |
| <td>Lorum ipsum dolem aire</td> | |
| <td class="level-right"><a class="button is-small is-primary" href="#">Action</a></td> | |
| </tr> | |
| </tbody> | |
| </table> | |
| </div> | |
| </div> | |
| <footer class="card-footer"> | |
| <a href="#" class="card-footer-item">View All</a> | |
| </footer> | |
| </div> | |
| </div> | |
| <div class="column is-6"> | |
| <div class="card"> | |
| <header class="card-header"> | |
| <p class="card-header-title"> | |
| Inventory Search | |
| </p> | |
| <a href="#" class="card-header-icon" aria-label="more options"> | |
| <span class="icon"> | |
| <i class="fa fa-angle-down" aria-hidden="true"></i> | |
| </span> | |
| </a> | |
| </header> | |
| <div class="card-content"> | |
| <div class="content"> | |
| <div class="control has-icons-left has-icons-right"> | |
| <input class="input is-large" type="text" placeholder=""> | |
| <span class="icon is-medium is-left"> | |
| <i class="fa fa-search"></i> | |
| </span> | |
| <span class="icon is-medium is-right"> | |
| <i class="fa fa-check"></i> | |
| </span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="card"> | |
| <header class="card-header"> | |
| <p class="card-header-title"> | |
| User Search | |
| </p> | |
| <a href="#" class="card-header-icon" aria-label="more options"> | |
| <span class="icon"> | |
| <i class="fa fa-angle-down" aria-hidden="true"></i> | |
| </span> | |
| </a> | |
| </header> | |
| <div class="card-content"> | |
| <div class="content"> | |
| <div class="control has-icons-left has-icons-right"> | |
| <input class="input is-large" type="text" placeholder=""> | |
| <span class="icon is-medium is-left"> | |
| <i class="fa fa-search"></i> | |
| </span> | |
| <span class="icon is-medium is-right"> | |
| <i class="fa fa-check"></i> | |
| </span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <script async type="text/javascript" src="../js/bulma.js"></script> | |
| </body> | |
| </html> |