tilman/next-transactions
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

basic bootstrap styles

Browse Source
This commit is contained in:
tliero
2016-05-03 14:12:56 +02:00
parent 0d900605b4
commit 6ad9c2d186
9 changed files with 155 additions and 88 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/main/resources/static/background.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 96 KiB

src/main/resources/static/css/app.css
+23 -11
View File
@@ -1,12 +1,28 @@
body { body {
font-family: "Open Sans", sans-serif; font-family: "Open Sans", sans-serif;
padding-top: 20px; padding: 20px;
background: url(/background.png) no-repeat center center fixed;
background-size: cover;
} }
.inputTable { .row-margin {
margin: auto; padding: 5 ex;
margin-top: 2em; margin: 20 px;
border: none; }
.lastSubmission {
background-color: #eee;
text-align: center;
padding: 0.8ex;
margin-top: 2ex;
margin-bottom: 2ex;
}
.input-heading {
font-family: "Yanone Kaffeesatz", sans-serif;
font-weight: 400;
font-size: 120%;
color: #eee;
} }
.listing { .listing {
@@ -15,6 +31,7 @@ body {
font-size: 80%; font-size: 80%;
border: none; border: none;
border-collapse: collapse; border-collapse: collapse;
background-color: white;
} }
.listing td, th { .listing td, th {
@@ -23,18 +40,13 @@ body {
} }
.credit { .credit {
background-color: #ccddff; background-color: #D9DBC9;
} }
.clickable { .clickable {
cursor: pointer; cursor: pointer;
} }
#accountSelector {
text-align: right;
margin-right: 4em;
}
.color-red { .color-red {
color: red; color: red;
} }
src/main/resources/static/css/bootstrap-theme.min.css
Vendored
+5
View File
File diff suppressed because one or more lines are too long
src/main/resources/static/css/bootstrap.min.css
Vendored
+5
View File
File diff suppressed because one or more lines are too long
src/main/resources/static/index.html
+7 -6
View File
@@ -6,24 +6,25 @@
<title>Transactions</title> <title>Transactions</title>
<!-- link rel="stylesheet" href="css/bootstrap.min.css"> <link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/bootstrap-theme.min.css" --> <!-- link rel="stylesheet" href="css/bootstrap-theme.min.css" -->
<link rel="stylesheet" href="css/app.css"> <link rel="stylesheet" href="css/app.css">
<script src="js/angular.min.js"></script> <script src="js/angular.min.js"></script>
<script src="js/angular-route.min.js"></script> <script src="js/angular-route.min.js"></script>
<script src="js/angular-resource.min.js"></script> <script src="js/angular-resource.min.js"></script>
<!-- script src="js/jquery-2.1.4.min.js"></script> <!-- script src="js/jquery-2.1.4.min.js"></script -->
<script src="js/bootstrap.min.js"></script --> <script src="js/bootstrap.min.js"></script>
<script src="js/app.js"></script> <script src="js/app.js"></script>
<script src="js/controllers.js"></script> <script src="js/controllers.js"></script>
<!-- Google fonts --> <!-- Google fonts -->
<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'> <link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
<!-- link href='https://fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css'> <!-- link href='https://fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css' -->
<link href='http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:400,300,700' rel='stylesheet' type='text/css'--> <link href='http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:400' rel='stylesheet' type='text/css'>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head> </head>
<body> <body>
src/main/resources/static/js/bootstrap.min.js
Vendored
+7
View File
File diff suppressed because one or more lines are too long
src/main/resources/static/js/controllers.js
+2 -1
View File
@@ -90,7 +90,8 @@ transactionControllers.controller('TransactionListCtrl', [ '$scope', '$location'
// if this is selected to be a withdrawal, preselect the current user and lock the radio buttons // if this is selected to be a withdrawal, preselect the current user and lock the radio buttons
if ($scope.transaction.category.id == -1) { if ($scope.transaction.category.id == -1) {
for (i = 0; i < userLabels.length; i++) { for (i = 0; i < userLabels.length; i++) {
if (userLabels[i].innerHTML.substr(-$scope.userinfo.name.length) === $scope.userinfo.name) { console.log(userLabels[i].innerHTML.substr(-$scope.userinfo.name.length-6));
if (userLabels[i].innerHTML.indexOf($scope.userinfo.name) >= 0) {
userLabels[i].getElementsByTagName('INPUT')[0].checked = true; userLabels[i].getElementsByTagName('INPUT')[0].checked = true;
} }
} }
src/main/resources/static/js/jquery-2.1.4.min.js
Vendored
+4
View File
File diff suppressed because one or more lines are too long
src/main/resources/static/partials/transaction-list.html
+69 -37
View File
@@ -1,53 +1,85 @@
<div> <div class="container">
<div> <div class="row">
<div id="accountSelector"><select ng-model='account' ng-change='refreshList()' ng-options="account.name for account in accounts track by account.id"></select></div>
<div ng-show="lastSubmission" class='ui-state-highlight' style='text-align: center; padding: 0.5ex; width: 30em; margin:auto; margin-bottom: 2em;'> <div><select ng-model='account' ng-change='refreshList()' ng-options="account.name for account in accounts track by account.id"></select></div>
<div class="col-md-offset-1 col-md-10 col-xs-12">
<br />
<div ng-show="lastSubmission" class='ui-state-highlight lastSubmission col-xs-offset-1'>
{{lastSubmission.date | date:'dd.MM.yyyy'}} {{lastSubmission.date | date:'dd.MM.yyyy'}}
<span ng-class="{ 'color-green': lastSubmission.amount > 0, 'color-red': lastSubmission.amount < 0 }">{{lastSubmission.amount}}&nbsp;€</span> <span ng-class="{ 'color-green': lastSubmission.amount > 0, 'color-red': lastSubmission.amount < 0 }">{{lastSubmission.amount}}&nbsp;€</span>
&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;
<span style='color: red; font-weight: bold;'><a href='' ng-click='deleteLastSubmission()'>löschen</a></span> <span style='color: red; font-weight: bold;'><a href='' ng-click='deleteLastSubmission()'>löschen</a></span>
</div> </div>
<div class="row">
<form name="form" ng-submit="postTransaction()" class="col-md-offset-4 col-xs-offset-1">
<form name="form" ng-submit="postTransaction()"> <br />
<table border='0' cellpadding='1' style='margin: auto;'>
<tr> <div class="row">
<td align='right'>Betrag:</td> <div class="col-md-1 col-xs-2 input-heading">Betrag:</div>
<td><input name="amount" ng-model='transaction.amount' type='text' required autofocus="autofocus" <div class="col-md-11 col-xs-10">
<input name="amount" ng-model='transaction.amount' type='text' required autofocus="autofocus"
ng-pattern="/^[+-]?(?:\d+(?:[\.,]\d{0,2})?|[\.,]\d{1,2})$/" /><span ng-show="form.amount.$error.pattern"><br/>The value ng-pattern="/^[+-]?(?:\d+(?:[\.,]\d{0,2})?|[\.,]\d{1,2})$/" /><span ng-show="form.amount.$error.pattern"><br/>The value
is not valid!</span></td> is not valid!</span>
</tr> </div>
<tr> </div>
<td align='right'>Kategorie:</td>
<td><select ng-model='transaction.category' size='1' <br />
ng-options="category.name for category in categories track by category._links.self.href" ng-change='checkCategory()'>
</select></td> <div class="row">
</tr> <div class="col-md-1 col-xs-2 input-heading">Kategorie:</div>
<tr> <div class="col-md-11 col-xs-10">
<td align='right'>Datum:</td> <select ng-model='transaction.category' size='1' ng-options="category.name for category in categories track by category._links.self.href" ng-change='checkCategory()'></select>
<td><input ng-model='transaction.date' type='date' placeholder="yyyy-MM-dd" required /></td> </div>
</tr> </div>
<tr>
<td align='right'>Notiz:</td> <br />
<td><input ng-model='transaction.description' type='text' size='20' /></td>
</tr> <div class="row">
<tr> <div class="col-md-1 col-xs-2 input-heading">Datum:</div>
<td align='right'>Auslage:</td> <div class="col-md-11 col-xs-10">
<td> <input ng-model='transaction.date' type='date' placeholder="yyyy-MM-dd" required />
</div>
</div>
<br />
<div class="row">
<div class="col-md-1 col-xs-2 input-heading">Notiz:</div>
<div class="col-md-11 col-xs-10">
<input ng-model='transaction.description' type='text' size='20' />
</div>
</div>
<br />
<div class="row">
<div class="col-md-1 col-xs-2 input-heading">Auslage:</div>
<div class="col-md-11 col-xs-10">
<!-- label class='userLabel'><input name='expenseBy' ng-model='transaction.creditor' ng-value='none' type='radio' checked='checked' />Keine</label --> <!-- label class='userLabel'><input name='expenseBy' ng-model='transaction.creditor' ng-value='none' type='radio' checked='checked' />Keine</label -->
<!-- label ng-repeat="user in accountUsers" class='userLabel'><input name='expenseBy' ng-model='$parent.transaction.creditor' ng-value='{{user.name}}' type='radio' />{{user.name}}</label --> <!-- label ng-repeat="user in accountUsers" class='userLabel'><input name='expenseBy' ng-model='$parent.transaction.creditor' ng-value='{{user.name}}' type='radio' />{{user.name}}</label -->
<label class='userLabel'><input id='noCreditorRadioButton' name='expenseBy' ng-model='transaction.creditor' type='radio' value='' checked='checked' />Keine</label> <label class='userLabel'><input id='noCreditorRadioButton' name='expenseBy' ng-model='transaction.creditor' type='radio' value='' checked='checked' />Keine&nbsp;</label>
<label class='userLabel' ng-repeat="user in accountUsers"><input name='expenseBy' ng-model='$parent.transaction.creditor' type='radio' value="{{user._links.self.href}}" />{{user.name}}</label> <label class='userLabel' ng-repeat="user in accountUsers"><input name='expenseBy' ng-model='$parent.transaction.creditor' type='radio' value="{{user._links.self.href}}" />{{user.name}}&nbsp;</label>
</td> </div>
</div>
<br />
<div class="row">
<div class="col-md-6 text-center">
<input type="submit" ng-disabled="form.amount.$error.pattern" class="btn btn-primary" />
</div>
</div>
<br />
</tr>
<tr>
<td align='center' colspan='2'><input type="submit" ng-disabled="form.amount.$error.pattern" /></td>
</tr>
</table>
</form> </form>
</div>
<table class="listing"> <table class="listing">
<tr> <tr>
@@ -74,6 +106,6 @@
<!-- div> <!-- div>
<pre style="font-size: 75%; color: darkgray;">{{account | json}}</pre> <pre style="font-size: 75%; color: darkgray;">{{account | json}}</pre>
</div --> </div -->
</div>
</div> </div>
</div> </div>