|
|
@@ -7,8 +7,13 @@
|
|
|
<meta name="mobile-web-app-capable" content="yes">
|
|
|
<meta name="theme-color" content="#dddddd">
|
|
|
<link rel="icon" sizes="128x128" href="icon.png">
|
|
|
+ <link rel="apple-touch-icon" sizes="128x128" href="icon.png">
|
|
|
+ <meta name="theme-color" content="#216e51">
|
|
|
+ <meta name="apple-mobile-web-app-status-bar-style" content="#216e51">
|
|
|
+ <link rel="manifest" href="manifest.json">
|
|
|
|
|
|
-
|
|
|
+ <!-- <meta name="theme-color" content="#f7d723">
|
|
|
+ <meta name="apple-mobile-web-app-status-bar-style" content="#f7d723"> -->
|
|
|
|
|
|
<style>
|
|
|
* {
|
|
|
@@ -17,7 +22,7 @@
|
|
|
}
|
|
|
|
|
|
#splash {
|
|
|
- background-color: rgb(50, 75, 55);
|
|
|
+ background-color: #216e51;
|
|
|
color: rgb(207, 207, 207);
|
|
|
padding: 10%;
|
|
|
margin: 0%;
|
|
|
@@ -55,18 +60,19 @@
|
|
|
<div class="content">
|
|
|
|
|
|
|
|
|
-
|
|
|
|
|
|
|
|
|
|
|
|
- <div v-for="auction in ordered_auctions()" v-if="auction.price != null && !auction.is_price_final && !search_visible">
|
|
|
+
|
|
|
+ <div v-for="auction in ordered_auctions()"
|
|
|
+ v-if="auction.price != null && !auction.is_price_final && !search_visible">
|
|
|
|
|
|
<div class="auction">
|
|
|
- <div class="thumb" >
|
|
|
- <div class="blurredthumb" v-bind:style="{ 'background-image': 'url(' + auction.thumb+ ')' }"></div>
|
|
|
- <img class="thumbimg" :src="auction.thumb">
|
|
|
- </div>
|
|
|
-
|
|
|
+ <div class="thumb">
|
|
|
+ <div class="blurredthumb" v-bind:style="{ 'background-image': 'url(' + auction.thumb+ ')' }"></div>
|
|
|
+ <img class="thumbimg" :src="auction.thumb">
|
|
|
+ </div>
|
|
|
+
|
|
|
<div style="overflow: hidden">
|
|
|
<a :href="auction.url" target="_">{{auction.desc}}</a>
|
|
|
<div class="currency">€ {{auction.price}}</div>
|
|
|
@@ -78,37 +84,35 @@
|
|
|
</div>
|
|
|
|
|
|
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- <div v-for="auction in ordered_auctions()" v-if="auction.price != null && auction.is_price_final && !search_visible">
|
|
|
-
|
|
|
-
|
|
|
+ <div v-if="account" class="panel">
|
|
|
+ <h3>Deine Suchen:</h3>
|
|
|
+ <div v-for="(query, url) in queries">
|
|
|
+ Suche <i>"{{display_query(url)}}"</i>: {{Math.round(query.avg_price)}} EUR im Schnitt
|
|
|
+ </div>
|
|
|
+ <button @click="search_visible = !search_visible">Sucheinstellungen</button>
|
|
|
+
|
|
|
+ <h3>Abgelaufene Suchen:</h3>
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+ <div v-for="auction in ordered_auctions()"
|
|
|
+ v-if="auction.price != null && auction.is_price_final && !search_visible">
|
|
|
<div class="auction">
|
|
|
-
|
|
|
- <div class="thumb" >
|
|
|
+ <div class="thumb">
|
|
|
<div class="blurredthumb" v-bind:style="{ 'background-image': 'url(' + auction.thumb+ ')' }"></div>
|
|
|
<img class="thumbimg" :src="auction.thumb">
|
|
|
- </div>
|
|
|
- <div style="overflow: hidden">
|
|
|
- <a :href="auction.url" target="_">{{auction.desc}}</a>
|
|
|
- <div class="currency">€ {{auction.price}}</div>
|
|
|
- </div>
|
|
|
</div>
|
|
|
- <hr>
|
|
|
- </div>
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- <div v-if="account" class="panel">
|
|
|
- <h3>
|
|
|
- Deine Suchen:
|
|
|
- </h3>
|
|
|
- <div v-for="(query, url) in queries">
|
|
|
- Suche <i>"{{display_query(url)}}"</i>: {{Math.round(query.avg_price)}} EUR im Schnitt
|
|
|
+ <div style="overflow: hidden">
|
|
|
+ <a :href="auction.url" target="_">{{auction.desc}}</a>
|
|
|
+ <div class="currency">€ {{auction.price}}</div>
|
|
|
</div>
|
|
|
- <button @click="search_visible = !search_visible">Sucheinstellungen</button>
|
|
|
</div>
|
|
|
+ <hr>
|
|
|
+ </div>
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
|
|
|
<template>
|
|
|
<div class="panel" v-if="!account">
|
|
|
@@ -126,66 +130,69 @@
|
|
|
|
|
|
|
|
|
<div class="panel" v-if="search_visible">
|
|
|
- <div align="right">
|
|
|
- <button @click="search_visible = !search_visible">X</button>
|
|
|
-
|
|
|
+ <div align="right">
|
|
|
+ <button @click="search_visible = !search_visible">X</button>
|
|
|
+
|
|
|
+ </div>
|
|
|
+ <h1>Neue Suche</h1>
|
|
|
+ Suchen sind das Herzstueck dieser Anwendung. Suchen laufen immer, auch wenn Du nicht online bist. Erstelle eine
|
|
|
+ Suche die moeglichst nur das liefert was Dich interessiert. Das Ausschliessen von Sofortkauf-Artikeln, ein
|
|
|
+ Mindestpreis sowie nur Artikel die eine WBK erfordern kann sinnvoll sein. Vergiss nicht am Ende alle zu
|
|
|
+ speichern!
|
|
|
+ <br>
|
|
|
+ <br>
|
|
|
+ <form>
|
|
|
+ <div class="form-group">
|
|
|
+ <label>Suchbegriff(e), durch Leerzeichen getrennt</label>
|
|
|
+ <input autocapitalize="none" v-model="query.search">
|
|
|
</div>
|
|
|
- <h1>Neue Suche</h1>
|
|
|
- Suchen sind das Herzstueck dieser Anwendung. Suchen laufen immer, auch wenn Du nicht online bist. Erstelle eine Suche die moeglichst nur das liefert was Dich interessiert. Das Ausschliessen von Sofortkauf-Artikeln, ein Mindestpreis sowie nur Artikel die eine WBK erfordern kann sinnvoll sein. Vergiss nicht am Ende alle zu speichern!
|
|
|
- <br>
|
|
|
- <br>
|
|
|
- <form>
|
|
|
- <div class="form-group">
|
|
|
- <label>Suchbegriff(e), durch Leerzeichen getrennt</label>
|
|
|
- <input autocapitalize="none" v-model="query.search">
|
|
|
- </div>
|
|
|
- <div class="form-group">
|
|
|
- <label>Maximalpreis</label>
|
|
|
- <input type="number" v-model="query.maxprice">
|
|
|
- </div>
|
|
|
- <div class="form-group">
|
|
|
- <label>Mindestpreis</label>
|
|
|
- <input type="number" v-model="query.minprice">
|
|
|
- </div>
|
|
|
- <div class="form-group">
|
|
|
- <input type="checkbox" v-model="query.restricted">
|
|
|
- <label>WBK noetig?</label>
|
|
|
- </div>
|
|
|
- <label>Auktionstyp</label>
|
|
|
- <div class="form-group">
|
|
|
- <select v-model="query.type">
|
|
|
- <option v-bind:value="1">Nur Auktionen</option>
|
|
|
- <option v-bind:value="2">Nur Sofortkauf</option>
|
|
|
- <option v-bind:value="3">Alles</option>
|
|
|
- </select>
|
|
|
- </div>
|
|
|
- <div class="form-group">
|
|
|
- <label>Such-URL (Kann man alternativ von eGun-Suche kopieren)</label>
|
|
|
- <input autocapitalize="none" v-model="query_url">
|
|
|
- </div>
|
|
|
- </form>
|
|
|
- <div>
|
|
|
- <a v-if="query_url" v-bind:href="query_url" target="_">Suche testen</a>
|
|
|
+ <div class="form-group">
|
|
|
+ <label>Maximalpreis</label>
|
|
|
+ <input type="number" v-model="query.maxprice">
|
|
|
</div>
|
|
|
-
|
|
|
- <div align="right">
|
|
|
- <button @click="add_query()">Suche hinzufuegen</button>
|
|
|
+ <div class="form-group">
|
|
|
+ <label>Mindestpreis</label>
|
|
|
+ <input type="number" v-model="query.minprice">
|
|
|
</div>
|
|
|
-
|
|
|
- Bestehende Suchen:
|
|
|
- <div v-for="(query, url) in queries" style="font-size: 0.8em">
|
|
|
- <button @click="delete_query(url)">X</button> <i>
|
|
|
- "{{display_query(url)}}"
|
|
|
-
|
|
|
- </i>
|
|
|
+ <div class="form-group">
|
|
|
+ <input type="checkbox" v-model="query.restricted">
|
|
|
+ <label>WBK noetig?</label>
|
|
|
</div>
|
|
|
-
|
|
|
- <div align="right">
|
|
|
-
|
|
|
- <button @click="save_account()">Alle Suchen permanent speichern</button>
|
|
|
+ <label>Auktionstyp</label>
|
|
|
+ <div class="form-group">
|
|
|
+ <select v-model="query.type">
|
|
|
+ <option v-bind:value="1">Nur Auktionen</option>
|
|
|
+ <option v-bind:value="2">Nur Sofortkauf</option>
|
|
|
+ <option v-bind:value="3">Alles</option>
|
|
|
+ </select>
|
|
|
</div>
|
|
|
+ <div class="form-group">
|
|
|
+ <label>Such-URL (Kann man alternativ von eGun-Suche kopieren)</label>
|
|
|
+ <input autocapitalize="none" v-model="query_url">
|
|
|
+ </div>
|
|
|
+ </form>
|
|
|
+ <div>
|
|
|
+ <a v-if="query_url" v-bind:href="query_url" target="_">Suche testen</a>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div align="right">
|
|
|
+ <button @click="add_query()">Suche hinzufuegen</button>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ Bestehende Suchen:
|
|
|
+ <div v-for="(query, url) in queries" style="font-size: 0.8em">
|
|
|
+ <button @click="delete_query(url)">X</button> <i>
|
|
|
+ "{{display_query(url)}}"
|
|
|
+
|
|
|
+ </i>
|
|
|
</div>
|
|
|
|
|
|
+ <div align="right">
|
|
|
+
|
|
|
+ <button @click="save_account()">Alle Suchen permanent speichern</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
|
|
|
</div>
|
|
|
</div>
|
|
|
@@ -203,7 +210,7 @@
|
|
|
|
|
|
<style>
|
|
|
:root {
|
|
|
- --main-color: #2e442f;
|
|
|
+ --main-color: rgb(33, 110, 81);
|
|
|
}
|
|
|
|
|
|
.nav-items {
|
|
|
@@ -237,7 +244,7 @@
|
|
|
|
|
|
width: 100px;
|
|
|
height: 100px;
|
|
|
- float:left;
|
|
|
+ float: left;
|
|
|
margin-right: 30px;
|
|
|
position: relative;
|
|
|
background-color: #ccc;
|
|
|
@@ -251,6 +258,14 @@
|
|
|
margin: auto;
|
|
|
}
|
|
|
|
|
|
+ @media screen and (max-width:600px) {
|
|
|
+ #nav-items {
|
|
|
+ width: 50%;
|
|
|
+ box-shadow: 0px 8px 8px rgba(0, 0, 0, 0.404);
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
hr {
|
|
|
display: block;
|
|
|
height: 1px;
|
|
|
@@ -260,5 +275,5 @@
|
|
|
margin-left: 10px;
|
|
|
margin-right: 10px;
|
|
|
padding: 0;
|
|
|
-}
|
|
|
+ }
|
|
|
</style>
|
