Framework css, torrents page (home)

This commit is contained in:
Simon Vieille 2015-05-03 18:53:56 +02:00
parent 0f0dbf580d
commit cf45a7e63b
9 changed files with 209 additions and 209 deletions

3
.bowerrc Normal file
View file

@ -0,0 +1,3 @@
{
"directory": "web/components/"
}

View file

@ -1,4 +1,5 @@
xbt-deblan-frontend
===================
XBT PHP Frontend.
XBT PHP Frontend.

17
bower.json Normal file
View file

@ -0,0 +1,17 @@
{
"name": "xbt-deblan-frontend",
"version": "0.0.1",
"authors": [
"Simon Vieille <simon@deblan.fr>"
],
"description": "BXT frontend",
"main": "web/index.php",
"keywords": [
"XBT"
],
"license": "BSD-2-Clause",
"homepage": "https://gitlab.deblan.org/deblan/xbt-deblan-frontend/",
"dependencies": {
"bootstrap": "3.3.4"
}
}

View file

@ -1,15 +0,0 @@
th.number {
width: 20px;
}
.number {
text-align: right;
}
.green {
color: #41B919;
}
.red {
color: #B9292B;
}

View file

@ -1 +0,0 @@
../../vendor/cascadeframework-master/assets/

View file

@ -1,89 +1,178 @@
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="assets/cascade/css/cascade/production/build-full.min.css">
<link rel="stylesheet" href="assets/cascade/css/site.css">
<link rel="stylesheet" href="assets/app.css">
<title>XBT DEBLAN FRONTEND</title>
</head>
<body>
<div class="site-header-fixture">
<div class="site-header-ghost">
<div class="col width-fit mobile-width-fit">
<div class="cell">
<a href="#" class="logo"></a>
</div>
</div>
<div class="col width-fill mobile-width-fill">
<div class="cell">
<ul class="col nav">
<li class="active"><a href="#">Homepage</a></li>
<li><a href="#">Torents</a></li>
<li><a href="#">Upload</a></li>
<li><a href="#">Profile</a></li>
</ul>
</div>
</div>
</div>
<div class="site-header">
<div class="col width-fit mobile-width-fit">
<div class="cell">
<a href="#" class="logo"></a>
</div>
</div>
<div class="col width-fill mobile-width-fill">
<div class="cell">
<ul class="col nav">
<li class="active"><a href="#">Homepage</a></li>
<li><a href="#">Torents</a></li>
<li><a href="#">Upload</a></li>
<li><a href="#">Profile</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="site-body centered-content">
<div class="cell">
<div class="col">
<div class="cell">
<div class="page-header">
<h1>Welcome!</h1>
</div>
</div>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="components/bootstrap/dist/css/bootstrap.min.css" />
<link rel="stylesheet" href="components/bootstrap/dist/css/bootstrap-theme.min.css" />
<link rel="stylesheet" href="xbt_components/default/css/app.css" />
<title>XBT DEBLAN FRONTEND</title>
</head>
<body>
<nav class="navbar navbar-inverse">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#main-menu">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">XBT</a>
</div>
<div class="col width-fill">
<div class="col">
<div class="cell">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec tincidunt nibh nec ipsum tincidunt mattis. Etiam a lectus sed dui eleifend pharetra ut sed elit. Fusce sagittis libero a nulla convallis nec porttitor purus mollis. Donec at risus metus. Vivamus id dui at sapien condimentum bibendum. Pellentesque ullamcorper convallis justo, sit amet vivera purus vehicula quis. Ut eget urna sit amet lorem sagittis pretium. Nulla luctus pretium neque, eget faucibus eros vehicula quis. Mauris venenatis, arcu eu vestibulum consectetur, enim ipsum porttitor mi, non iaculis nisi ipsum ut risus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed laoreet elit eu tortor vulputate sed dignissim orci auctor.
</p>
</div>
<div class="collapse navbar-collapse" id="main-menu">
<ul class="nav navbar-nav">
<li class="active">
<a href="#">
Home
<span class="sr-only">(current)</span>
</a>
</li>
<li>
<a href="#">Upload</a>
</li>
<li>
<a href="#">Profile</a>
</li>
</ul>
</div>
</div>
</nav>
<div class="container-fluid" id="container">
<div class="row">
<form action="" class="form-inline text-right">
<div class="form-group">
<input type="text" class="form-control" id="name" placeholder="Name">
</div>
</div>
</div>
</div>
<div class="site-footer-fixture">
<div class="site-footer">
<div class="col width-fit">
<div class="cell">
<a href="#" class="powered-by"></a>
</div>
</div>
<div class="col width-fill">
<div class="cell pipes">
<ul class="nav">
<li id="active"><a href="#">Item one</a></li>
<li><a href="#">Item two</a></li>
<li><a href="#">Item three</a></li>
<li><a href="#">Item four</a></li>
<li><a href="#">Item five</a></li>
</ul>
</div>
</div>
</div>
</div>
<script src="assets/cascade/js/app.js"></script>
</body>
</html>
<div class="form-group">
<select id="category" class="form-control">
<option value="">Operating system</option>
<option value="">Movie</option>
<option value="">Music</option>
</select>
</div>
<div class="form-group">
<input type="submit" class="btn btn-primary" value="Search" />
<input type="submit" class="btn btn-warning" value="Empty" />
</div>
</form>
</div>
<div class="row">
<nav class="pull-right">
<ul class="pagination">
<li>
<a href="#" aria-label="Previous">
<span aria-hidden="true">&laquo;</span>
</a>
</li>
<li>
<a href="#">1</a>
</li>
<li>
<a href="#">2</a>
</li>
<li>
<a href="#">3</a>
</li>
<li>
<a href="#">4</a>
</li>
<li>
<a href="#">5</a>
</li>
<li>
<a href="#" aria-label="Next">
<span aria-hidden="true">&raquo;</span>
</a>
</li>
</ul>
</nav>
</div>
<div class="row">
<div class="col-md-12">
<table class="table table-striped">
<thead>
<tr>
<th class="number">ID</th>
<th>Name</th>
<th>Category</th>
<th class="number">Seeders</th>
<th class="number">Leechers</th>
</tr>
</thead>
<tbody>
<tr>
<td class="number">1</td>
<td>Debian wheezy i386</td>
<td>Linux</td>
<td class="number success">10</td>
<td class="number danger">3</td>
</tr>
<tr>
<td class="number">1</td>
<td>Debian wheezy i386</td>
<td>Linux</td>
<td class="number success">10</td>
<td class="number danger">3</td>
</tr>
<tr>
<td class="number">1</td>
<td>Debian wheezy i386</td>
<td>Linux</td>
<td class="number success">10</td>
<td class="number danger">3</td>
</tr>
<tr>
<td class="number">1</td>
<td>Debian wheezy i386</td>
<td>Linux</td>
<td class="number success">10</td>
<td class="number danger">3</td>
</tr>
<tr>
<td class="number">1</td>
<td>Debian wheezy i386</td>
<td>Linux</td>
<td class="number success">10</td>
<td class="number danger">3</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="row">
<nav class="pull-right">
<ul class="pagination">
<li>
<a href="#" aria-label="Previous">
<span aria-hidden="true">&laquo;</span>
</a>
</li>
<li>
<a href="#">1</a>
</li>
<li>
<a href="#">2</a>
</li>
<li>
<a href="#">3</a>
</li>
<li>
<a href="#">4</a>
</li>
<li>
<a href="#">5</a>
</li>
<li>
<a href="#" aria-label="Next">
<span aria-hidden="true">&raquo;</span>
</a>
</li>
</ul>
</nav>
</div>
<script src="components/jquery/dist/jquery.min.js"></script>
<script src="components/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="components/select2-dist/dist/js/select2.full.min.js"></script>
<script src="xbt_components/default/js/app.js"></script>
</body>
</html>

View file

@ -1,107 +0,0 @@
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" href="assets/cascade/css/cascade/production/build-full.min.css">
<link rel="stylesheet" href="assets/cascade/css/site.css">
<link rel="stylesheet" href="assets/app.css">
<title>XBT DEBLAN FRONTEND</title>
</head>
<body>
<div class="site-header-fixture">
<div class="site-header-ghost">
<div class="col width-fit mobile-width-fit">
<div class="cell">
<a href="#" class="logo"></a>
</div>
</div>
<div class="col width-fill mobile-width-fill">
<div class="cell">
<ul class="col nav">
<li><a href="#">Homepage</a></li>
<li class="active"><a href="#">Torents</a></li>
<li><a href="#">Upload</a></li>
<li><a href="#">Profile</a></li>
</ul>
</div>
</div>
</div>
<div class="site-header">
<div class="col width-fit mobile-width-fit">
<div class="cell">
<a href="#" class="logo"></a>
</div>
</div>
<div class="col width-fill mobile-width-fill">
<div class="cell">
<ul class="col nav">
<li><a href="#">Homepage</a></li>
<li class="active"><a href="#">Torents</a></li>
<li><a href="#">Upload</a></li>
<li><a href="#">Profile</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="site-body centered-content">
<div class="cell">
<div class="col">
<div class="cell">
<div class="page-header">
<h1>Torrents</h1>
</div>
</div>
</div>
<div class="col width-fill">
<div class="col">
<div class="cell">
<table class="border">
<thead>
<tr>
<th class="number">ID</th>
<th>Name</th>
<th>Category</th>
<th class="number">Seeders</th>
<th class="number">Leechers</th>
</tr>
</thead>
<tbody>
<tr>
<td class="number">1</td>
<td>Debian wheezy i386</td>
<td>Linux</td>
<td class="number green">10</td>
<td class="number red">3</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
<div class="site-footer-fixture">
<div class="site-footer">
<div class="col width-fit">
<div class="cell">
<a href="#" class="powered-by"></a>
</div>
</div>
<div class="col width-fill">
<div class="cell pipes">
<ul class="nav">
<li id="active"><a href="#">Item one</a></li>
<li><a href="#">Item two</a></li>
<li><a href="#">Item three</a></li>
<li><a href="#">Item four</a></li>
<li><a href="#">Item five</a></li>
</ul>
</div>
</div>
</div>
</div>
<script src="assets/cascade/js/app.js"></script>
</body>
</html>

View file

@ -0,0 +1,12 @@
#container {
padding: 0 20px;
}
.navbar {
border-radius: 0;
}
.number {
width: 50px;
text-align: right;
}

View file

@ -0,0 +1 @@
$('.select2').select2();