joachim/koerseadmin
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

small improvements with respect to responsive design

Browse Source
This commit is contained in:
Thomas 2015-09-17 00:06:44 +02:00
parent 88a6a5147f
commit b3e8a5dc91
7 changed files with 394 additions and 309 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
index.html
View File

@ -8,8 +8,7 @@
<html ng-app="bananaraceApp" lang="nl"> <html ng-app="bananaraceApp" lang="nl">
<head> <head>
<!-- <meta http-equiv="content-type" content="text/html; charset=UTF-8"> --> <meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<!-- enable bootstrap --> <!-- enable bootstrap -->
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
@ -73,6 +72,12 @@
<div class="container-fluid"> <div class="container-fluid">
<!-- Brand and toggle get grouped for better mobile display --> <!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header"> <div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
<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="">Laaionhead Racing</a> <a class="navbar-brand" href="">Laaionhead Racing</a>
</div> </div>
@ -93,7 +98,9 @@
</nav> </nav>
<!-- the main view div... here's where the partials are served --> <!-- the main view div... here's where the partials are served -->
<div class="container-fluid">
<div ng-view></div> <div ng-view></div>
</div>
</body> </body>
</html> </html>

8
partials/championship-poule-races.html
View File

@ -14,7 +14,7 @@
<h3 class="panel-title">Races</h3> <h3 class="panel-title">Races</h3>
</div> </div>
<div class="panel-body"> <div class="panel-body">
<table class="table"> <table class="table table-condensed table-striped">
<tr><th>Team</th><th>Raceid</th><th>Totaaltijd</th><th>Ritten</th><th>Acties</th></tr> <tr><th>Team</th><th>Raceid</th><th>Totaaltijd</th><th>Ritten</th><th>Acties</th></tr>
<tr ng-repeat="race in racesInPoule"> <tr ng-repeat="race in racesInPoule">
<td>{{race.name}}</td> <td>{{race.name}}</td>
@ -56,16 +56,16 @@
<div class="panel-heading">Met een team uit de poule...</div> <div class="panel-heading">Met een team uit de poule...</div>
<div class="panel-body"> <div class="panel-body">
<div class="list-group"> <div class="list-group">
<a href="" class="list-group-item" ng-repeat="team in teamsInPoule" ng-click="setSelectedTeam(team)" ng-class="{active: selectedTeam==team}">{{team.name}}</a> <a href="" class="list-group-item list-group-item-sm" ng-repeat="team in teamsInPoule" ng-click="setSelectedTeam(team)" ng-class="{active: selectedTeam==team}">{{team.name}}</a>
</div> </div>
<button type="button" class="btn btn-default" ng-click="addRace(newrace);" ng-disabled="selectedTeam == null" title="Maak een nieuwe race aan voor het geselecteerde team.">Maak nieuwe race</button> <button type="button" class="btn btn-success" ng-click="addRace(newrace);" ng-disabled="selectedTeam == null" title="Maak een nieuwe race aan voor het geselecteerde team.">Maak nieuwe race</button>
</div> </div>
</div> </div>
<div class="panel panel-default"> <div class="panel panel-default">
<div class="panel-heading">Met alle teams...</div> <div class="panel-heading">Met alle teams...</div>
<div class="panel-body"> <div class="panel-body">
<button type="button" class="btn btn-default" ng-disabled="teamsInPoule.length == 0" ng-click="addRaceForAllteams();" title="Maak nieuwe races aan voor alle bovenstaande teams.">Maak race voor elk team</button> <button type="button" class="btn btn-success" ng-disabled="teamsInPoule.length == 0" ng-click="addRaceForAllteams();" title="Maak nieuwe races aan voor alle bovenstaande teams.">Maak race voor elk team</button>
</div> </div>
</div> </div>
</div><!-- end row --> </div><!-- end row -->

43
partials/championship-poules.html
View File

@ -4,8 +4,28 @@
</ol> </ol>
<div class="row"> <div class="row">
<div class="visible-sm-block visible-xs-block col-sm-12 col-xs-12">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Voeg poule toe</h3>
</div>
<div class="panel-body">
<form class="form-inline">
<div class="form-group form-group-sm">
<label for="tierInput">Tier</label>
<input type="text" class="form-control" id="tierInput" aria-describedby="sizing-addon2" ng-model="newpoule.tier" style="width:50px"/>
</div>
<div class="form-group form-group-sm">
<label for="pouleInput">Poule</label>
<input type="text" class="form-control" id="pouleInput" aria-describedby="sizing-addon2" ng-model="newpoule.poule" style="width:50px"/>
</div>
<button type="button" class="btn btn-sm btn-default btn-success" ng-click="addPoule(newpoule)">Toevoegen</button>
</form>
</div>
</div>
</div>
<div class="col-md-6"> <div class="col-md-7 col-xs-12">
<div class="panel panel-default" ng-show="poules.length > 0"> <div class="panel panel-default" ng-show="poules.length > 0">
<div class="panel-heading"> <div class="panel-heading">
<h3 class="panel-title">Poules</h3> <h3 class="panel-title">Poules</h3>
@ -33,24 +53,23 @@
</div> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-5 hidden-sm hidden-xs">
<div class="panel panel-default"> <div class="panel panel-default">
<div class="panel-heading"> <div class="panel-heading">
<h3 class="panel-title">Voeg poule toe</h3> <h3 class="panel-title">Voeg poule toe</h3>
</div> </div>
<div class="panel-body"> <div class="panel-body">
<div class="input-group"> <form class="form-inline">
<span class="input-group-addon" id="sizing-addon2">Tier</span> <div class="form-group form-group-sm">
<input type="text" class="form-control" aria-describedby="sizing-addon2" ng-model="newpoule.tier"> <label for="tierInput">Tier</label>
<input type="text" class="form-control" id="tierInput" aria-describedby="sizing-addon2" ng-model="newpoule.tier" style="width:50px">
</div> </div>
<div class="input-group"> <div class="form-group form-group-sm">
<span class="input-group-addon" id="sizing-addon2">Poule</span> <label for="pouleInput">Poule</label>
<input type="text" class="form-control" aria-describedby="sizing-addon2" ng-model="newpoule.poule"> <input type="text" class="form-control" id="pouleInput" aria-describedby="sizing-addon2" ng-model="newpoule.poule" style="width:50px"/>
</div> </div>
<button type="button" class="btn btn-sm btn-default btn-success" ng-click="addPoule(newpoule)">Toevoegen</button>
</form>
<button type="button" class="btn btn-default" ng-click="addPoule(newpoule);">Voeg toe!</button>
</div> </div>
</div> </div>
</div> </div>

40
partials/championship-team-drivers.html
View File

@ -7,19 +7,39 @@
<div class="row"> <div class="row">
<div class="col-md-6"> <div class="visible-sm-block visible-xs-block col-sm-12 col-xs-12">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Voeg chauffeur toe</h3>
</div>
<div class="panel-body">
<div class="input-group input-group-sm">
<span class="input-group-addon" id="sizing-addon2">Naam</span>
<input type="text" class="form-control" aria-describedby="sizing-addon2" ng-model="newdriver.name">
<span class="input-group-btn">
<button type="button" class="btn btn-success" ng-click="addDriver(newdriver);">Voeg toe!</button>
</span>
</div>
</div>
</div>
</div>
<div class="col-md-7 col-xs-12">
<div class="panel panel-default" ng-show="drivers.length > 0"> <div class="panel panel-default" ng-show="drivers.length > 0">
<div class="panel-heading"> <div class="panel-heading">
<h3 class="panel-title">Drivers</h3> <h3 class="panel-title">Drivers</h3>
</div> </div>
<div class="panel-body"> <div class="panel-body">
<table class="table"> <table class="table table-condensed table-striped">
<tr><th>Naam</th><th>Acties</th></tr> <tr>
<th>Naam</th>
<th>Acties</th>
</tr>
<tr ng-repeat="driver in drivers"> <tr ng-repeat="driver in drivers">
<td>{{driver.name}}</td> <td>{{driver.name}}</td>
<td> <td>
<a class="btn btn-danger btn-sm" ng-click="deleteDriver(driver);"> <a class="btn btn-danger btn-sm" ng-click="deleteDriver(driver);">
<span class="glyphicon glyphicon-remove" aria-hidden="true"></span> <span class="glyphicon glyphicon-remove" aria-hidden="true" tooltip="Verwijderen!"></span>
</a> </a>
</td> </td>
</tr> </tr>
@ -28,20 +48,20 @@
</div> </div>
</div> </div>
<div class="col-md-6"> <div class="col-md-5 hidden-sm hidden-xs">
<div class="panel panel-default"> <div class="panel panel-default">
<div class="panel-heading"> <div class="panel-heading">
<h3 class="panel-title">Voeg chauffeur toe</h3> <h3 class="panel-title">Voeg chauffeur toe</h3>
</div> </div>
<div class="panel-body"> <div class="panel-body">
<div class="input-group"> <div class="input-group input-group-sm">
<span class="input-group-addon" id="sizing-addon2">Naam</span> <span class="input-group-addon" id="sizing-addon2">Naam</span>
<input type="text" class="form-control" aria-describedby="sizing-addon2" ng-model="newdriver.name"> <input type="text" class="form-control" aria-describedby="sizing-addon2" ng-model="newdriver.name">
</div> <span class="input-group-btn">
<button type="button" class="btn btn-success" ng-click="addDriver(newdriver);">Voeg toe!</button>
<button type="button" class="btn btn-default" ng-click="addDriver(newdriver);">Voeg toe!</button> </span>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>

62
partials/championship-teams.html
View File

@ -3,33 +3,57 @@
<li class="active">Overzicht kampioenschap {{currentChampionship}}</li> <li class="active">Overzicht kampioenschap {{currentChampionship}}</li>
</ol> </ol>
<div class="panel panel-default"> <div class="row">
<div class="panel-heading"> <div class="visible-sm-block visible-xs-block col-sm-12 col-xs-12">
<h3 class="panel-title">Teams</h3>
</div>
<div class="panel-body">
<table class="table">
<tr><th>Naam</th><th>Acties</th></tr>
<tr ng-repeat="team in teams">
<td>{{team.name}}</td>
<td>
<a class="btn btn-sm" ng-class="{'btn-warning':team.drivercount>0 && team.drivercount!=2, 'btn-success':team.drivercount==2, 'btn-danger':team.drivercount==0}" href="#/championship/{{team.idchampionship}}/team/{{team.idteam}}/drivers">Bekijk chauffeurs <span class="badge">{{team.drivercount}}</span></a>
<a class="btn btn-danger btn-sm" ng-click="deleteTeam(team)"><span class="glyphicon glyphicon-remove" aria-hidden="true"></span></a></td>
</tr>
</table>
</div>
</div>
<div class="panel panel-default"> <div class="panel panel-default">
<div class="panel-heading"> <div class="panel-heading">
<h3 class="panel-title">Voeg team toe</h3> <h3 class="panel-title">Voeg team toe</h3>
</div> </div>
<div class="panel-body"> <div class="panel-body">
<div class="input-group"> <div class="input-group input-group-sm">
<span class="input-group-addon" id="sizing-addon2">Naam</span> <span class="input-group-addon" id="sizing-addon2">Naam</span>
<input type="text" class="form-control" aria-describedby="sizing-addon2" ng-model="newteam.name"> <input type="text" class="form-control" aria-describedby="sizing-addon2" ng-model="newteam.name">
<span class="input-group-btn">
<button type="button" class="btn btn-success" ng-click="addTeam(newteam);">Toevoegen</button>
</span>
</div>
</div>
</div>
</div> </div>
<button type="button" class="btn btn-default" ng-click="addTeam(newteam);">Voeg toe!</button> <div class="col-md-7 col-xs-12">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Teams</h3>
</div>
<div class="panel-body">
<table class="table table-condensed table-striped">
<tr><th>Naam</th><th>Acties</th></tr>
<tr ng-repeat="team in teams">
<td>{{team.name}}</td>
<td>
<a class="btn btn-sm" ng-class="{'btn-warning':team.drivercount>0 && team.drivercount!=2, 'btn-info':team.drivercount==2, 'btn-danger':team.drivercount==0}" href="#/championship/{{team.idchampionship}}/team/{{team.idteam}}/drivers">Bekijk chauffeurs <span class="badge">{{team.drivercount}}</span></a>
<a class="btn btn-danger btn-sm" ng-click="deleteTeam(team)"><span class="glyphicon glyphicon-remove" aria-hidden="true" tooltip="Verwijderen!"></span></a></td>
</tr>
</table>
</div>
</div>
</div>
<div class="col-md-5 hidden-sm hidden-xs">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Voeg team toe</h3>
</div>
<div class="panel-body">
<div class="input-group input-group-sm">
<span class="input-group-addon" id="sizing-addon2">Naam</span>
<input type="text" class="form-control" aria-describedby="sizing-addon2" ng-model="newteam.name">
<span class="input-group-btn">
<button type="button" class="btn btn-success" ng-click="addTeam(newteam);">Toevoegen</button>
</span>
</div>
</div>
</div>
</div> </div>
</div> </div>

31
partials/championships.html
View File

@ -2,9 +2,24 @@
<li class="active">Kampioenschappen</li> <li class="active">Kampioenschappen</li>
</ol> </ol>
<div class="container-fluid">
<div class="row"> <div class="row">
<div class="col-md-8 col-xs-6"> <div class="visible-sm-block visible-xs-block col-sm-12 col-xs-12">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">Voeg kampioenschap toe</h3>
</div>
<div class="panel-body">
<div class="input-group input-group-sm">
<span class="input-group-addon" id="sizing-addon2">Naam</span>
<input type="text" class="form-control" aria-describedby="sizing-addon2" ng-model="newchampionship.name">
<span class="input-group-btn">
<button type="button" class="btn btn-default btn-success" ng-click="addChampionship(newchampionship);">Toevoegen</button>
</span>
</div>
</div>
</div>
</div>
<div class="col-md-7 col-xs-12">
<div class="panel panel-default"> <div class="panel panel-default">
<div class="panel-heading"> <div class="panel-heading">
<h3 class="panel-title">Kampioenschappen</h3> <h3 class="panel-title">Kampioenschappen</h3>
@ -18,7 +33,7 @@
<a class="btn btn-info btn-sm" href="#/championship/{{championship.idchampionship}}/poules">Bekijk poules</a> <a class="btn btn-info btn-sm" href="#/championship/{{championship.idchampionship}}/poules">Bekijk poules</a>
<a class="btn btn-info btn-sm" href="#/championship/{{championship.idchampionship}}/teams">Bekijk teams</a> <a class="btn btn-info btn-sm" href="#/championship/{{championship.idchampionship}}/teams">Bekijk teams</a>
<a class="btn btn-info btn-sm" href="#/championship/{{championship.idchampionship}}/overview">Overzicht</a> <a class="btn btn-info btn-sm" href="#/championship/{{championship.idchampionship}}/overview">Overzicht</a>
<button class="btn btn-danger btn-sm" ng-click="deleteChampionship(championship);"> <button class="btn btn-danger btn-sm" ng-click="deleteChampionship(championship);" tooltip="Verwijderen!">
<span class="glyphicon glyphicon-remove" aria-hidden="true"></span> <span class="glyphicon glyphicon-remove" aria-hidden="true"></span>
</button> </button>
</td> </td>
@ -27,18 +42,18 @@
</div> </div>
</div> </div>
</div> </div>
<div class="col-md-4 col-xs-6"> <div class="col-md-5 hidden-sm hidden-xs">
<div class="panel panel-default"> <div class="panel panel-default">
<div class="panel-heading"> <div class="panel-heading">
<h3 class="panel-title">Voeg kampioenschap toe</h3> <h3 class="panel-title">Voeg kampioenschap toe</h3>
</div> </div>
<div class="panel-body"> <div class="panel-body">
<div class="input-group"> <div class="input-group input-group-sm">
<span class="input-group-addon" id="sizing-addon2">Naam</span> <span class="input-group-addon" id="sizing-addon2">Naam</span>
<input type="text" class="form-control" aria-describedby="sizing-addon2" ng-model="newchampionship.name"> <input type="text" class="form-control" aria-describedby="sizing-addon2" ng-model="newchampionship.name">
</div> <span class="input-group-btn">
<button type="button" class="btn btn-success" ng-click="addChampionship(newchampionship)">Toevoegen</button>
<button type="button" class="btn btn-default" ng-click="addChampionship(newchampionship);">Voeg toe!</button> </span>
</div> </div>
</div> </div>
</div> </div>