Menues angepasst, Stylesheets mit Typen-Grafiken

This commit is contained in:
Hilmer, Carsten
2016-08-23 14:55:17 +02:00
parent 4a46dd2560
commit a3b9c29577
40 changed files with 9306 additions and 18 deletions

View File

@@ -3,17 +3,342 @@
height: 100px;
}
.chip {
.pokemontyp1 {
display: inline-block;
padding: 0 25px;
height: 50px;
font-size: 16px;
line-height: 50px;
border-radius: 25px;
background-color: #f1f1f1;
background-color: #D50000;
color: white;
}
.chip img {
.pokemontyp1 img {
float: left;
margin: 0 10px 0 -25px;
height: 50px;
width: 50px;
border-radius: 50%;
}
.pokemontyp2 {
display: inline-block;
padding: 0 25px;
height: 50px;
font-size: 16px;
line-height: 50px;
border-radius: 25px;
background-color: #C51162;
color: white;
}
.pokemontyp2 img {
float: left;
margin: 0 10px 0 -25px;
height: 50px;
width: 50px;
border-radius: 50%;
}
.pokemontyp3 {
display: inline-block;
padding: 0 25px;
height: 50px;
font-size: 16px;
line-height: 50px;
border-radius: 25px;
background-color: #AA00FF;
color: white;
}
.pokemontyp3 img {
float: left;
margin: 0 10px 0 -25px;
height: 50px;
width: 50px;
border-radius: 50%;
}
.pokemontyp4 {
display: inline-block;
padding: 0 25px;
height: 50px;
font-size: 16px;
line-height: 50px;
border-radius: 25px;
background-color: #6200EA;
color: white;
}
.pokemontyp4 img {
float: left;
margin: 0 10px 0 -25px;
height: 50px;
width: 50px;
border-radius: 50%;
}
.pokemontyp5 {
display: inline-block;
padding: 0 25px;
height: 50px;
font-size: 16px;
line-height: 50px;
border-radius: 25px;
background-color: #304FFE;
color: white;
}
.pokemontyp5 img {
float: left;
margin: 0 10px 0 -25px;
height: 50px;
width: 50px;
border-radius: 50%;
}
.pokemontyp6 {
display: inline-block;
padding: 0 25px;
height: 50px;
font-size: 16px;
line-height: 50px;
border-radius: 25px;
background-color: #2962FF;
color: white;
}
.pokemontyp6 img {
float: left;
margin: 0 10px 0 -25px;
height: 50px;
width: 50px;
border-radius: 50%;
}
.pokemontyp7 {
display: inline-block;
padding: 0 25px;
height: 50px;
font-size: 16px;
line-height: 50px;
border-radius: 25px;
background-color: #0091EA;
color: white;
}
.pokemontyp7 img {
float: left;
margin: 0 10px 0 -25px;
height: 50px;
width: 50px;
border-radius: 50%;
}
.pokemontyp8 {
display: inline-block;
padding: 0 25px;
height: 50px;
font-size: 16px;
line-height: 50px;
border-radius: 25px;
background-color: #00B8D4;
color: white;
}
.pokemontyp8 img {
float: left;
margin: 0 10px 0 -25px;
height: 50px;
width: 50px;
border-radius: 50%;
}
.pokemontyp9 {
display: inline-block;
padding: 0 25px;
height: 50px;
font-size: 16px;
line-height: 50px;
border-radius: 25px;
background-color: #00BFA5;
color: white;
}
.pokemontyp9 img {
float: left;
margin: 0 10px 0 -25px;
height: 50px;
width: 50px;
border-radius: 50%;
}
.pokemontyp10 {
display: inline-block;
padding: 0 25px;
height: 50px;
font-size: 16px;
line-height: 50px;
border-radius: 25px;
background-color: #1B5E20;
color: white;
}
.pokemontyp10 img {
float: left;
margin: 0 10px 0 -25px;
height: 50px;
width: 50px;
border-radius: 50%;
}
.pokemontyp11 {
display: inline-block;
padding: 0 25px;
height: 50px;
font-size: 16px;
line-height: 50px;
border-radius: 25px;
background-color: #33691E;
color: white;
}
.pokemontyp11 img {
float: left;
margin: 0 10px 0 -25px;
height: 50px;
width: 50px;
border-radius: 50%;
}
.pokemontyp12 {
display: inline-block;
padding: 0 25px;
height: 50px;
font-size: 16px;
line-height: 50px;
border-radius: 25px;
background-color: #827717;
color: white;
}
.pokemontyp12 img {
float: left;
margin: 0 10px 0 -25px;
height: 50px;
width: 50px;
border-radius: 50%;
}
.pokemontyp13 {
display: inline-block;
padding: 0 25px;
height: 50px;
font-size: 16px;
line-height: 50px;
border-radius: 25px;
background-color: #F57F17;
color: white;
}
.pokemontyp13 img {
float: left;
margin: 0 10px 0 -25px;
height: 50px;
width: 50px;
border-radius: 50%;
}
.pokemontyp14 {
display: inline-block;
padding: 0 25px;
height: 50px;
font-size: 16px;
line-height: 50px;
border-radius: 25px;
background-color: #FF6F00;
color: white;
}
.pokemontyp14 img {
float: left;
margin: 0 10px 0 -25px;
height: 50px;
width: 50px;
border-radius: 50%;
}
.pokemontyp15 {
display: inline-block;
padding: 0 25px;
height: 50px;
font-size: 16px;
line-height: 50px;
border-radius: 25px;
background-color: #E65100;
color: white;
}
.pokemontyp15 img {
float: left;
margin: 0 10px 0 -25px;
height: 50px;
width: 50px;
border-radius: 50%;
}
.pokemontyp16 {
display: inline-block;
padding: 0 25px;
height: 50px;
font-size: 16px;
line-height: 50px;
border-radius: 25px;
background-color: #BF360C;
color: white;
}
.pokemontyp16 img {
float: left;
margin: 0 10px 0 -25px;
height: 50px;
width: 50px;
border-radius: 50%;
}
.pokemontyp17 {
display: inline-block;
padding: 0 25px;
height: 50px;
font-size: 16px;
line-height: 50px;
border-radius: 25px;
background-color: #3E2723;
color: white;
}
.pokemontyp17 img {
float: left;
margin: 0 10px 0 -25px;
height: 50px;
width: 50px;
border-radius: 50%;
}
.pokemontyp18 {
display: inline-block;
padding: 0 25px;
height: 50px;
font-size: 16px;
line-height: 50px;
border-radius: 25px;
background-color: #212121;
color: white;
}
.pokemontyp18 img {
float: left;
margin: 0 10px 0 -25px;
height: 50px;

BIN
www/img/typbilder/1.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.3 KiB

BIN
www/img/typbilder/10.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.7 KiB

BIN
www/img/typbilder/11.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

BIN
www/img/typbilder/12.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

BIN
www/img/typbilder/13.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.7 KiB

BIN
www/img/typbilder/14.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

BIN
www/img/typbilder/15.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.6 KiB

BIN
www/img/typbilder/16.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.3 KiB

BIN
www/img/typbilder/17.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.8 KiB

BIN
www/img/typbilder/18.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.6 KiB

BIN
www/img/typbilder/2.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

BIN
www/img/typbilder/3.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.1 KiB

BIN
www/img/typbilder/4.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.4 KiB

BIN
www/img/typbilder/5.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.9 KiB

BIN
www/img/typbilder/6.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.3 KiB

BIN
www/img/typbilder/7.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.7 KiB

BIN
www/img/typbilder/8.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

BIN
www/img/typbilder/9.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 7.3 KiB

Binary file not shown.

View File

@@ -18,8 +18,12 @@
<md-toolbar class="bar-subheader md-tall md-primary toolbar-medium">
<div>
<h1>Pokedex Helper</h1>
<h2>Dein Trainertool deluxe</h2>
<md-list-item>
<md-input-container md-no-float="" class="md-list-item-full-width">
<input ng-model="filterText" placeholder="Finde Pokemon...">
</md-input-container>
</md-list-item>
</div>
<a class="md-button md-accent md-fab fab-toolbar-medium"
ng-click="navigateTo('app.contractdetail',contract)"
@@ -33,12 +37,6 @@
<!--list section-->
<md-list>
<md-list-item>
<md-input-container md-no-float="" class="md-list-item-full-width">
<input ng-model="filterText" placeholder="Finde Pokemon...">
</md-input-container>
</md-list-item>
<!--Below code it will disable animation to better performance-->
<div ng-if="!isAnimated" class="row contract-list-item"
ng-repeat="pokemon in pokemons | filter: filterText | orderBy: 'pokemonname'">
@@ -46,13 +44,14 @@
<img ng-src="{{ pokemon.pokemonimage }}" class="image-list-thumb"/>
</div>
<div class="col-50">
<h3>{{ pokemon.pokemonname }}</h3>
<div ng-if="pokemon.pokemontypa > 0" class="chip">
<img src="{{ pokemon.pokemonimage }}" alt="PokemonTyp" width="96" height="96">
<h2>{{ pokemon.pokemonname }}</h2>
<h3>Nr.: {{ pokemon.pokedexidString }}</h3>
<div ng-if="pokemon.pokemontypa > 0" class="pokemontyp{{ pokemon.pokemontypa }}">
<img src="img/typbilder/{{ pokemon.pokemontypa }}.png" alt="PokemonTyp" width="96" height="96">
{{ pokemon.pokemontypaString }}
</div>
<div ng-if="pokemon.pokemontypb > 0" class="chip">
<img src="{{ pokemon.pokemonimage }}" alt="PokemonTyp" width="96" height="96">
<div ng-if="pokemon.pokemontypb > 0" class="pokemontyp{{ pokemon.pokemontypb }}">
<img src="img/typbilder/{{ pokemon.pokemontypb }}.png" alt="PokemonTyp" width="96" height="96">
{{ pokemon.pokemontypbString }}
</div>
</div>
@@ -64,14 +63,55 @@
<md-menu-content width="1">
<md-menu-item>
<a class="md-button md-default-theme" ng-click="navigateTo('app.contractdetail',contract)">
<span class="menu-item-button">Edit</span>
<span class="menu-item-button">Details anzeigen</span>
</a>
</md-menu-item>
<md-menu-item>
<a class="md-button md-default-theme" ng-click="callTo(contract.telephone)">
<span class="menu-item-button" >Call {{pokemon.telephone}}</span>
<a class="md-button md-default-theme" ng-click="callTo(contract.pokemonname)">
<span class="menu-item-button" >{{pokemon.pokemonname}} zu Lesezeichen hinzufügen</span>
</a>
</md-menu-item>
<md-menu-item>
<a class="md-button md-default-theme" ng-click="navigateTo('app.contractdetail',contract)">
<span class="menu-item-button">{{pokemon.pokemonname}} zu Favoriten hinzufügen</span>
</a>
</md-menu-item>
<md-menu-item>
<a class="md-button md-default-theme" ng-click="navigateTo('app.contractdetail',contract)">
<span class="menu-item-button">{{pokemon.pokemonname}} zum Vergleich öffnen</span>
</a>
</md-menu-item>
<md-menu-item>
<a class="md-button md-default-theme" ng-click="navigateTo('app.contractdetail',contract)">
<span class="menu-item-button">Zeige alle vom gleichen Typ</span>
</a>
</md-menu-item>
<md-menu-item>
<a class="md-button md-default-theme" ng-click="navigateTo('app.contractdetail',contract)">
<span class="menu-item-button">Zeige alle vom gleichen Typ {{ pokemon.pokemontypaString }}</span>
</a>
</md-menu-item>
<md-menu-item ng-if="pokemon.pokemontypb > 0">
<a class="md-button md-default-theme" ng-click="navigateTo('app.contractdetail',contract)">
<span class="menu-item-button">Zeige alle vom gleichen Typ {{ pokemon.pokemontypbString }}</span>
</a>
</md-menu-item>
<md-menu-item>
<a class="md-button md-default-theme" ng-click="navigateTo('app.contractdetail',contract)">
<span class="menu-item-button">Zeige alle stärke Pokemon</span>
</a>
</md-menu-item>
<md-menu-item>
<a class="md-button md-default-theme" ng-click="navigateTo('app.contractdetail',contract)">
<span class="menu-item-button">Zeige alle schwächeren Pokemon</span>
</a>
</md-menu-item>
</md-menu-content>
</md-menu>
</div>

View File

@@ -68,9 +68,22 @@ appServices.factory('pokedexDB', function ($cordovaSQLite)
{
for (var i = 0; i < res.rows.length; i++)
{
var dummypokedexid='';
dummypokedexid=res.rows.item(i).POKEDEXID;
if (dummypokedexid.length==1){
dummypokedexid='00' + dummypokedexid;
}
if (dummypokedexid.length==2){
dummypokedexid='0' + dummypokedexid;
}
var dataItem = {
id : res.rows.item(i).ID ,
pokedexid : res.rows.item(i).POKEDEXID ,
pokedexidString : dummypokedexid ,
pokemonname : res.rows.item(i).POKEMONNAME ,
pokemontypa : res.rows.item(i).POKEMONTYPA ,
pokemontypb : res.rows.item(i).POKEMONTYPB ,