Add Tipper by myCALC, PufferIcons Filled, WallCat and Tipper3
|
After Width: | Height: | Size: 112 KiB |
|
After Width: | Height: | Size: 8.0 KiB |
|
After Width: | Height: | Size: 316 KiB |
|
After Width: | Height: | Size: 316 KiB |
|
After Width: | Height: | Size: 947 KiB |
|
After Width: | Height: | Size: 219 KiB |
|
After Width: | Height: | Size: 170 KiB |
|
After Width: | Height: | Size: 489 KiB |
|
After Width: | Height: | Size: 693 KiB |
|
After Width: | Height: | Size: 249 KiB |
|
After Width: | Height: | Size: 251 KiB |
|
After Width: | Height: | Size: 660 KiB |
|
After Width: | Height: | Size: 505 KiB |
|
After Width: | Height: | Size: 238 KiB |
|
After Width: | Height: | Size: 209 KiB |
|
After Width: | Height: | Size: 546 KiB |
|
After Width: | Height: | Size: 196 KiB |
|
After Width: | Height: | Size: 168 KiB |
|
After Width: | Height: | Size: 505 KiB |
|
After Width: | Height: | Size: 343 KiB |
|
After Width: | Height: | Size: 393 KiB |
|
After Width: | Height: | Size: 444 KiB |
|
After Width: | Height: | Size: 250 KiB |
|
After Width: | Height: | Size: 249 KiB |
|
After Width: | Height: | Size: 678 KiB |
|
After Width: | Height: | Size: 413 KiB |
|
After Width: | Height: | Size: 124 KiB |
|
After Width: | Height: | Size: 250 KiB |
|
After Width: | Height: | Size: 271 KiB |
|
After Width: | Height: | Size: 196 KiB |
|
After Width: | Height: | Size: 382 KiB |
|
|
@ -6,6 +6,10 @@ import PufferIcons from '../views/PufferIcons.vue'
|
|||
import Puffercat_Apps from '../views/Puffercat_Apps.vue'
|
||||
import Shapes from '../views/Shapes.vue'
|
||||
import Blurry_Wallpapers from '../views/Blurry_Wallpapers.vue'
|
||||
import Tipper_by_myCALC from '../views/Tipper_by_myCALC.vue'
|
||||
import PufferIcons_Filled from '../views/PufferIcons_Filled.vue'
|
||||
import WallCat from '../views/WallCat.vue'
|
||||
import Tipper3 from '../views/Tipper3.vue'
|
||||
|
||||
const routes: Array<RouteRecordRaw> = [
|
||||
{
|
||||
|
|
@ -50,7 +54,26 @@ const routes: Array<RouteRecordRaw> = [
|
|||
name: 'Blurry Wallpapers',
|
||||
component: Blurry_Wallpapers,
|
||||
},
|
||||
|
||||
{
|
||||
path: '/details/Tipper_by_myCALC',
|
||||
name: 'Tipper by myCALC',
|
||||
component: Tipper_by_myCALC,
|
||||
},
|
||||
{
|
||||
path: '/details/PufferIcons_Filled',
|
||||
name: 'PufferIcons Filled',
|
||||
component: PufferIcons_Filled,
|
||||
},
|
||||
{
|
||||
path: '/details/WallCat',
|
||||
name: 'WallCat',
|
||||
component: WallCat,
|
||||
},
|
||||
{
|
||||
path: '/details/Tipper3',
|
||||
name: 'Tipper3',
|
||||
component: Tipper3,
|
||||
},
|
||||
]
|
||||
|
||||
const router = createRouter({
|
||||
|
|
|
|||
|
|
@ -184,18 +184,18 @@
|
|||
</ion-row>
|
||||
<ion-row class="column-bottom">
|
||||
<ion-col size="auto">
|
||||
<img src="../assets/Icon_Tipper.png" class="icon">
|
||||
<a href="/details/Tipper_by_myCALC" class="hidden-link"><img src="../assets/Icon_Tipper.png" class="icon"></a>
|
||||
</ion-col>
|
||||
<ion-col size="auto" class="description-column">
|
||||
<ion-row>
|
||||
<ion-column><h4 class="size-appname">Tipper by myCALC</h4></ion-column>
|
||||
<a href="/details/Tipper_by_myCALC" class="hidden-link"><ion-column><h4 class="size-appname">Tipper by myCALC</h4></ion-column></a>
|
||||
</ion-row>
|
||||
<ion-row>
|
||||
<ion-column><ion-icon :icon="logoAndroid" class="size-appname-icon"/></ion-column>
|
||||
<a href="/details/Tipper_by_myCALC" class="hidden-link"><ion-column><ion-icon :icon="logoAndroid" class="size-appname-icon"/></ion-column></a>
|
||||
</ion-row>
|
||||
</ion-col>
|
||||
<ion-col class="download-column">
|
||||
<ion-button shape="round"><ion-icon :icon="arrowDown" /></ion-button>
|
||||
<ion-button shape="round" href="https://cdn.puffercat.xyz/c/puffercat-apps/apks/Tipper_by_myCALC/tipper-by-mycalc-1.1-dev.apk"><ion-icon :icon="arrowDown" /></ion-button>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
|
|
|
|||
|
|
@ -38,7 +38,7 @@
|
|||
</ion-row>
|
||||
<ion-row class="column-standard2">
|
||||
<ion-col>
|
||||
<ion-button href="https://cdn.puffercat.xyz/c/puffercat-apps/apks/Blurry_Wallpapers/blurry-wallpapers-1.0.3.apk" expand="full" shape="round" style="margin: 0px;" download="Shapes-latest.apk">Download</ion-button>
|
||||
<ion-button href="https://cdn.puffercat.xyz/c/puffercat-apps/apks/Blurry_Wallpapers/blurry-wallpapers-1.0.3.apk" expand="full" shape="round" style="margin: 0px;" download="Blurry-wallpapers-latest.apk">Download</ion-button>
|
||||
</ion-col>
|
||||
<ion-col>
|
||||
<ion-button href="https://play.google.com/store/apps/details?id=xyz.puffercat.blurrywalls.android" expand="full" shape="round" style="margin: 0px;">Google Play</ion-button>
|
||||
|
|
|
|||
|
|
@ -91,14 +91,14 @@
|
|||
<ion-grid>
|
||||
<ion-row class="column-standard">
|
||||
<ion-col size="auto">
|
||||
<img src="../assets/Icon_PufferIcons_Filled.png" class="icon">
|
||||
<a href="/details/PufferIcons_Filled" class="hidden-link"><img src="../assets/Icon_PufferIcons_Filled.png" class="icon"></a>
|
||||
</ion-col>
|
||||
<ion-col size="auto" class="description-column">
|
||||
<ion-row>
|
||||
<ion-column><h4 class="size-appname">PufferIcons Filled</h4></ion-column>
|
||||
<a href="/details/PufferIcons_Filled" class="hidden-link"><ion-column><h4 class="size-appname">PufferIcons Filled</h4></ion-column></a>
|
||||
</ion-row>
|
||||
<ion-row>
|
||||
<ion-column><ion-icon :icon="logoAndroid" class="size-appname-icon"/></ion-column>
|
||||
<a href="/details/PufferIcons_Filled" class="hidden-link"><ion-column><ion-icon :icon="logoAndroid" class="size-appname-icon"/></ion-column></a>
|
||||
</ion-row>
|
||||
</ion-col>
|
||||
<ion-col class="download-column">
|
||||
|
|
@ -107,14 +107,14 @@
|
|||
</ion-row>
|
||||
<ion-row class="column-standard">
|
||||
<ion-col size="auto">
|
||||
<img src="../assets/Icon_WallCat.png" class="icon">
|
||||
<a href="/details/WallCat" class="hidden-link"><img src="../assets/Icon_WallCat.png" class="icon"></a>
|
||||
</ion-col>
|
||||
<ion-col size="auto" class="description-column">
|
||||
<ion-row>
|
||||
<ion-column><h4 class="size-appname">WallCat</h4></ion-column>
|
||||
<a href="/details/WallCat" class="hidden-link"><ion-column><h4 class="size-appname">WallCat</h4></ion-column></a>
|
||||
</ion-row>
|
||||
<ion-row>
|
||||
<ion-column><ion-icon :icon="logoAndroid" class="size-appname-icon"/></ion-column>
|
||||
<a href="/details/WallCat" class="hidden-link"><ion-column><ion-icon :icon="logoAndroid" class="size-appname-icon"/></ion-column></a>
|
||||
</ion-row>
|
||||
</ion-col>
|
||||
<ion-col class="download-column">
|
||||
|
|
@ -123,14 +123,14 @@
|
|||
</ion-row>
|
||||
<ion-row class="column-standard">
|
||||
<ion-col size="auto">
|
||||
<img src="../assets/Icon_Tipper3.png" class="icon">
|
||||
<a href="/details/Tipper3" class="hidden-link"><img src="../assets/Icon_Tipper3.png" class="icon"></a>
|
||||
</ion-col>
|
||||
<ion-col size="auto" class="description-column">
|
||||
<ion-row>
|
||||
<ion-column><h4 class="size-appname">Tipper3</h4></ion-column>
|
||||
<a href="/details/Tipper3" class="hidden-link"><ion-column><h4 class="size-appname">Tipper3</h4></ion-column></a>
|
||||
</ion-row>
|
||||
<ion-row>
|
||||
<ion-column><ion-icon :icon="logoAndroid" class="size-appname-icon"/></ion-column>
|
||||
<a href="/details/Tipper3" class="hidden-link"><ion-column><ion-icon :icon="logoAndroid" class="size-appname-icon"/></ion-column></a>
|
||||
</ion-row>
|
||||
</ion-col>
|
||||
<ion-col class="download-column">
|
||||
|
|
@ -222,5 +222,8 @@ export default defineComponent({
|
|||
}
|
||||
} .aboutFrameworkLogo {
|
||||
width: 175px;
|
||||
}
|
||||
} .hidden-link {
|
||||
text-decoration-line: none;
|
||||
color: var(--ion-color-light-contrast);
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,188 @@
|
|||
<template>
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-buttons slot="start">
|
||||
<ion-back-button default-href="/tabs/soon"></ion-back-button>
|
||||
</ion-buttons>
|
||||
<ion-title>PufferIcons Filled</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
<ion-content :fullscreen="true">
|
||||
<ion-header collapse="condense">
|
||||
<ion-toolbar>
|
||||
<ion-title size="large">PufferIcons Filled</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
<ion-grid>
|
||||
<ion-row class="column-standard2">
|
||||
<ion-col class="bannerColumn">
|
||||
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row class="column-standard">
|
||||
<ion-col size="auto">
|
||||
<img src="../assets/Icon_PufferIcons_Filled.png" class="icon">
|
||||
</ion-col>
|
||||
<ion-col size="auto" class="description-column">
|
||||
<ion-row style="padding: 0px; margin: 0px;">
|
||||
<ion-column style="padding: 0px; margin: 0px;"><p class="size-appname" style="padding: 0px; margin: 0px;"><strong>PufferIcons Filled</strong></p></ion-column>
|
||||
</ion-row>
|
||||
<ion-row style="padding: 0px;">
|
||||
<ion-column><p class="size-appname-icon"></p></ion-column>
|
||||
</ion-row>
|
||||
<ion-row style="padding: 0px;">
|
||||
<ion-column><ion-icon :icon="logoAndroid" class="size-appname-icon"/></ion-column>
|
||||
</ion-row>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row class="column-standard2">
|
||||
<ion-col>
|
||||
<ion-button disabled="true" expand="full" shape="round" style="margin: 0px;">Coming Soon</ion-button>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row class="column-standard">
|
||||
<ion-col>
|
||||
<h4><strong>Description</strong></h4>
|
||||
<strong>Notes:
|
||||
Ignore Google Play Protect, my signature is different than original Lawnicons, but I can't change the package name because then Lawnchair would stop recognizing this app as Lawnicons.</strong><br>
|
||||
PufferIcons is fork of Rkicons, a fork Lawnicons which is an add-on for adding themed icons to Lawnchair 12 Alpha 5 and above. This addon is now the source of all themed icons, for simplicity.<br>
|
||||
<br>
|
||||
PufferIcons Filled as well as Rkicons are filled while PufferIcons and Lawnicons are outlined.<br>
|
||||
<br>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row class="column-standard">
|
||||
<ion-col>
|
||||
<h4><strong>Screenshots (early development)</strong></h4>
|
||||
<div class="scrollScreenshots">
|
||||
<img src="../assets/Screenshot_PufferIcons_Filled_1.png" class="screenshot">
|
||||
<img src="../assets/Screenshot_PufferIcons_Filled_2.png" class="screenshot">
|
||||
<img src="../assets/Screenshot_PufferIcons_Filled_3.png" class="screenshot">
|
||||
</div>
|
||||
<br>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row class="column-standard">
|
||||
<ion-col>
|
||||
<h4><strong>Links</strong></h4>
|
||||
<a href="https://pufferrom.t.me" class="">Telegram channel (releases)</a>
|
||||
<br>
|
||||
<a href="https://puffercatchannel.t.me" class="">Telegram channel (general)</a>
|
||||
<br>
|
||||
<a href="https://puffercatrom.t.me" class="">Support group</a>
|
||||
<br>
|
||||
<a href="https://github.com/Puffercatt/PufferIcons-Filled" class="">GitHub repo</a>
|
||||
<br>
|
||||
<br>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
</ion-content>
|
||||
</ion-page>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { IonPage, IonHeader, IonToolbar, IonTitle, IonContent, IonCol, IonGrid, IonRow, IonBackButton, IonButton, IonButtons, IonIcon, IonMenuButton,
|
||||
IonModal,
|
||||
IonItem,
|
||||
IonList,
|
||||
IonAvatar,
|
||||
IonImg,
|
||||
IonLabel } from '@ionic/vue';
|
||||
import ExploreContainer from '@/components/ExploreContainer.vue';
|
||||
import { logoAndroid, arrowDown, logoPwa, ellipsisVertical } from 'ionicons/icons';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'Tab1Page',
|
||||
components: {IonHeader, IonToolbar, IonTitle, IonContent, IonPage, IonCol, IonGrid, IonRow, IonButton, IonIcon, IonButtons, IonBackButton},
|
||||
setup() {
|
||||
return {
|
||||
logoAndroid,
|
||||
arrowDown,
|
||||
logoPwa,
|
||||
ellipsisVertical
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.column-standard {
|
||||
background-color: var(--ion-color-light-shade);
|
||||
color: var(--ion-color-light-contrast);
|
||||
padding: 15px;
|
||||
border-radius: 25px;
|
||||
margin: 5px;
|
||||
margin-top: 15px;
|
||||
} .icon {
|
||||
width: 90px;
|
||||
margin-right: 5px;
|
||||
} ion-button {
|
||||
--box-shadow: 0px;
|
||||
} .download-column {
|
||||
text-align: right;
|
||||
display: flex;
|
||||
justify-content: right;
|
||||
align-items: center;
|
||||
} .description-column {
|
||||
align-items: center;
|
||||
} .size-appname {
|
||||
font-size: 20px;
|
||||
} .size-appname-icon {
|
||||
font-size: 15px;
|
||||
} .logoAbout {
|
||||
width: 125px;
|
||||
margin: 10px;
|
||||
margin-top: 20px;
|
||||
} .modalContent {
|
||||
text-align: center;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
} .tableLabel {
|
||||
text-align: left;
|
||||
} .vueLogoLight {
|
||||
display: inline;
|
||||
} .vueLogoDark {
|
||||
display: none;
|
||||
} @media (prefers-color-scheme: dark) {
|
||||
.vueLogoLight {
|
||||
display: none;
|
||||
} .vueLogoDark {
|
||||
display: inline;
|
||||
}
|
||||
} .aboutFrameworkLogo {
|
||||
width: 175px;
|
||||
} .bannerColumn {
|
||||
height: 200px;
|
||||
background-image: url("../assets/Banner_PufferIcons_Filled.png");
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
border-radius: 25px;
|
||||
} .column-standard2 {
|
||||
background-color: transparent;
|
||||
color: var(--ion-color-light-contrast);
|
||||
padding: 0px;
|
||||
border-radius: 25px;
|
||||
margin: 5px;
|
||||
margin-top: 15px;
|
||||
} ion-button {
|
||||
--box-shadow: 0px;
|
||||
} .screenshot {
|
||||
height: 600px;
|
||||
border-radius: 30px;
|
||||
} div.scrollScreenshots {
|
||||
overflow: auto;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
div.scrollScreenshots img {
|
||||
display: inline-block;
|
||||
padding: 10px;
|
||||
} .hidden-link {
|
||||
text-decoration-line: none;
|
||||
color: var(--ion-color-light-contrast);
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,187 @@
|
|||
<template>
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-buttons slot="start">
|
||||
<ion-back-button default-href="/tabs/soon"></ion-back-button>
|
||||
</ion-buttons>
|
||||
<ion-title>Tipper3</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
<ion-content :fullscreen="true">
|
||||
<ion-header collapse="condense">
|
||||
<ion-toolbar>
|
||||
<ion-title size="large">Tipper3</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
<ion-grid>
|
||||
<ion-row class="column-standard2">
|
||||
<ion-col class="bannerColumn">
|
||||
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row class="column-standard">
|
||||
<ion-col size="auto">
|
||||
<img src="../assets/Icon_Tipper3.png" class="icon">
|
||||
</ion-col>
|
||||
<ion-col size="auto" class="description-column">
|
||||
<ion-row style="padding: 0px; margin: 0px;">
|
||||
<ion-column style="padding: 0px; margin: 0px;"><p class="size-appname" style="padding: 0px; margin: 0px;"><strong>Tipper3</strong></p></ion-column>
|
||||
</ion-row>
|
||||
<ion-row style="padding: 0px;">
|
||||
<ion-column><p class="size-appname-icon"></p></ion-column>
|
||||
</ion-row>
|
||||
<ion-row style="padding: 0px;">
|
||||
<ion-column><ion-icon :icon="logoAndroid" class="size-appname-icon"/></ion-column>
|
||||
</ion-row>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row class="column-standard2">
|
||||
<ion-col>
|
||||
<ion-button disabled="true" expand="full" shape="round" style="margin: 0px;">Coming Soon</ion-button>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row class="column-standard">
|
||||
<ion-col>
|
||||
<h4><strong>Description</strong></h4>
|
||||
The replacement for Tipper by myCALC. A tip calculator designed with Google's Material Design 3 guidelines and Material you that feels native to Android.<br>
|
||||
<br>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<!-- <ion-row class="column-standard">
|
||||
<ion-col>
|
||||
<h4><strong>Screenshots (early development)</strong></h4>
|
||||
<div class="scrollScreenshots">
|
||||
<img src="../assets/Screenshot_WallCat_1.png" class="screenshot">
|
||||
<img src="../assets/Screenshot_WallCat_2.png" class="screenshot">
|
||||
<img src="../assets/Screenshot_WallCat_3.png" class="screenshot">
|
||||
<img src="../assets/Screenshot_WallCat_4.png" class="screenshot">
|
||||
<img src="../assets/Screenshot_WallCat_5.png" class="screenshot">
|
||||
<img src="../assets/Screenshot_WallCat_6.jpg" class="screenshot">
|
||||
</div>
|
||||
<br>
|
||||
</ion-col>
|
||||
</ion-row>-->
|
||||
<ion-row class="column-standard">
|
||||
<ion-col>
|
||||
<h4><strong>Links</strong></h4>
|
||||
<a href="mailto:puffercatt+tipper3@gmail.com" class="">E-mail</a>
|
||||
<br>
|
||||
<a href="https://pufferrom.t.me" class="">Telegram channel (releases)</a>
|
||||
<br>
|
||||
<a href="https://puffercatchannel.t.me" class="">Telegram channel (general)</a>
|
||||
<br>
|
||||
<a href="https://puffercatrom.t.me" class="">Support group</a>
|
||||
<br>
|
||||
<br>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
</ion-content>
|
||||
</ion-page>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { IonPage, IonHeader, IonToolbar, IonTitle, IonContent, IonCol, IonGrid, IonRow, IonBackButton, IonButton, IonButtons, IonIcon, IonMenuButton,
|
||||
IonModal,
|
||||
IonItem,
|
||||
IonList,
|
||||
IonAvatar,
|
||||
IonImg,
|
||||
IonLabel } from '@ionic/vue';
|
||||
import ExploreContainer from '@/components/ExploreContainer.vue';
|
||||
import { logoAndroid, arrowDown, logoPwa, ellipsisVertical } from 'ionicons/icons';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'Tab1Page',
|
||||
components: {IonHeader, IonToolbar, IonTitle, IonContent, IonPage, IonCol, IonGrid, IonRow, IonButton, IonIcon, IonButtons, IonBackButton},
|
||||
setup() {
|
||||
return {
|
||||
logoAndroid,
|
||||
arrowDown,
|
||||
logoPwa,
|
||||
ellipsisVertical
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.column-standard {
|
||||
background-color: var(--ion-color-light-shade);
|
||||
color: var(--ion-color-light-contrast);
|
||||
padding: 15px;
|
||||
border-radius: 25px;
|
||||
margin: 5px;
|
||||
margin-top: 15px;
|
||||
} .icon {
|
||||
width: 90px;
|
||||
margin-right: 5px;
|
||||
} ion-button {
|
||||
--box-shadow: 0px;
|
||||
} .download-column {
|
||||
text-align: right;
|
||||
display: flex;
|
||||
justify-content: right;
|
||||
align-items: center;
|
||||
} .description-column {
|
||||
align-items: center;
|
||||
} .size-appname {
|
||||
font-size: 20px;
|
||||
} .size-appname-icon {
|
||||
font-size: 15px;
|
||||
} .logoAbout {
|
||||
width: 125px;
|
||||
margin: 10px;
|
||||
margin-top: 20px;
|
||||
} .modalContent {
|
||||
text-align: center;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
} .tableLabel {
|
||||
text-align: left;
|
||||
} .vueLogoLight {
|
||||
display: inline;
|
||||
} .vueLogoDark {
|
||||
display: none;
|
||||
} @media (prefers-color-scheme: dark) {
|
||||
.vueLogoLight {
|
||||
display: none;
|
||||
} .vueLogoDark {
|
||||
display: inline;
|
||||
}
|
||||
} .aboutFrameworkLogo {
|
||||
width: 175px;
|
||||
} .bannerColumn {
|
||||
height: 200px;
|
||||
background-image: url("../assets/Banner_Tipper3.png");
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
border-radius: 25px;
|
||||
} .column-standard2 {
|
||||
background-color: transparent;
|
||||
color: var(--ion-color-light-contrast);
|
||||
padding: 0px;
|
||||
border-radius: 25px;
|
||||
margin: 5px;
|
||||
margin-top: 15px;
|
||||
} ion-button {
|
||||
--box-shadow: 0px;
|
||||
} .screenshot {
|
||||
height: 600px;
|
||||
border-radius: 30px;
|
||||
} div.scrollScreenshots {
|
||||
overflow: auto;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
div.scrollScreenshots img {
|
||||
display: inline-block;
|
||||
padding: 10px;
|
||||
} .hidden-link {
|
||||
text-decoration-line: none;
|
||||
color: var(--ion-color-light-contrast);
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,200 @@
|
|||
<template>
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-buttons slot="start">
|
||||
<ion-back-button default-href="/"></ion-back-button>
|
||||
</ion-buttons>
|
||||
<ion-title>Tipper by myCALC</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
<ion-content :fullscreen="true">
|
||||
<ion-header collapse="condense">
|
||||
<ion-toolbar>
|
||||
<ion-title size="large">Tipper by myCALC</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
<ion-grid>
|
||||
<ion-row class="column-standard2">
|
||||
<ion-col class="bannerColumn">
|
||||
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row class="column-standard">
|
||||
<ion-col size="auto">
|
||||
<img src="../assets/Icon_Tipper.png" class="icon">
|
||||
</ion-col>
|
||||
<ion-col size="auto" class="description-column">
|
||||
<ion-row style="padding: 0px; margin: 0px;">
|
||||
<ion-column style="padding: 0px; margin: 0px;"><p class="size-appname" style="padding: 0px; margin: 0px;"><strong>Tipper by myCALC</strong></p></ion-column>
|
||||
</ion-row>
|
||||
<ion-row style="padding: 0px;">
|
||||
<ion-column><p class="size-appname-icon">version 1.1-dev</p></ion-column>
|
||||
</ion-row>
|
||||
<ion-row style="padding: 0px;">
|
||||
<ion-column><ion-icon :icon="logoAndroid" class="size-appname-icon"/></ion-column>
|
||||
</ion-row>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row class="column-standard2">
|
||||
<ion-col>
|
||||
<ion-button href="https://cdn.puffercat.xyz/c/puffercat-apps/apks/Tipper_by_myCALC/tipper-by-mycalc-1.1-dev.apk" expand="full" shape="round" style="margin: 0px;" download="Tipper-latest.apk">Download</ion-button>
|
||||
</ion-col>
|
||||
<ion-col>
|
||||
<ion-button href="https://play.google.com/store/apps/details?id=pl.kacperzacharski.puffercat.tipper" expand="full" shape="round" style="margin: 0px;">Google Play</ion-button>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row class="column-standard">
|
||||
<ion-col>
|
||||
<h4><strong>Changelog - 1.1-dev</strong></h4>
|
||||
<ul>
|
||||
<li>Added Material Design 3 support</li>
|
||||
</ul>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row class="column-standard">
|
||||
<ion-col>
|
||||
<h4><strong>Description</strong></h4>
|
||||
Minimal and easy to use open-source tip calculator.<br>
|
||||
Tipper by myCALC is a modern and simple tip calculating app.<br>
|
||||
Works with a lot of currencies.<br>
|
||||
<br>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row class="column-standard">
|
||||
<ion-col>
|
||||
<h4><strong>Screenshots</strong></h4>
|
||||
<div class="scrollScreenshots">
|
||||
<img src="../assets/Screenshot_Tipper_1.webp" class="screenshot">
|
||||
<img src="../assets/Screenshot_Tipper_2.webp" class="screenshot">
|
||||
<img src="../assets/Screenshot_Tipper_3.webp" class="screenshot">
|
||||
<img src="../assets/Screenshot_Tipper_4.webp" class="screenshot">
|
||||
<img src="../assets/Screenshot_Tipper_5.webp" class="screenshot">
|
||||
<img src="../assets/Screenshot_Tipper_6.webp" class="screenshot">
|
||||
</div>
|
||||
<br>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row class="column-standard">
|
||||
<ion-col>
|
||||
<h4><strong>Links</strong></h4>
|
||||
<a href="mailto:puffercatt+mycalc@gmail.com" class="">E-mail</a>
|
||||
<br>
|
||||
<a href="https://cdn.puffercat.xyz/c/mycalc/tipper-privacy/" class="">Privacy policy</a>
|
||||
<br>
|
||||
<a href="https://github.com/KZacharski/tipperbymycalc" class="">GitHub repo</a>
|
||||
<br>
|
||||
<br>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
</ion-content>
|
||||
</ion-page>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { IonPage, IonHeader, IonToolbar, IonTitle, IonContent, IonCol, IonGrid, IonRow, IonBackButton, IonButton, IonButtons, IonIcon, IonMenuButton,
|
||||
IonModal,
|
||||
IonItem,
|
||||
IonList,
|
||||
IonAvatar,
|
||||
IonImg,
|
||||
IonLabel } from '@ionic/vue';
|
||||
import ExploreContainer from '@/components/ExploreContainer.vue';
|
||||
import { logoAndroid, arrowDown, logoPwa, ellipsisVertical } from 'ionicons/icons';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'Tab1Page',
|
||||
components: {IonHeader, IonToolbar, IonTitle, IonContent, IonPage, IonCol, IonGrid, IonRow, IonButton, IonIcon, IonButtons, IonBackButton},
|
||||
setup() {
|
||||
return {
|
||||
logoAndroid,
|
||||
arrowDown,
|
||||
logoPwa,
|
||||
ellipsisVertical
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.column-standard {
|
||||
background-color: var(--ion-color-light-shade);
|
||||
color: var(--ion-color-light-contrast);
|
||||
padding: 15px;
|
||||
border-radius: 25px;
|
||||
margin: 5px;
|
||||
margin-top: 15px;
|
||||
} .icon {
|
||||
width: 90px;
|
||||
margin-right: 5px;
|
||||
} ion-button {
|
||||
--box-shadow: 0px;
|
||||
} .download-column {
|
||||
text-align: right;
|
||||
display: flex;
|
||||
justify-content: right;
|
||||
align-items: center;
|
||||
} .description-column {
|
||||
align-items: center;
|
||||
} .size-appname {
|
||||
font-size: 20px;
|
||||
} .size-appname-icon {
|
||||
font-size: 15px;
|
||||
} .logoAbout {
|
||||
width: 125px;
|
||||
margin: 10px;
|
||||
margin-top: 20px;
|
||||
} .modalContent {
|
||||
text-align: center;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
} .tableLabel {
|
||||
text-align: left;
|
||||
} .vueLogoLight {
|
||||
display: inline;
|
||||
} .vueLogoDark {
|
||||
display: none;
|
||||
} @media (prefers-color-scheme: dark) {
|
||||
.vueLogoLight {
|
||||
display: none;
|
||||
} .vueLogoDark {
|
||||
display: inline;
|
||||
}
|
||||
} .aboutFrameworkLogo {
|
||||
width: 175px;
|
||||
} .bannerColumn {
|
||||
height: 200px;
|
||||
background-image: url("../assets/Banner_Tipper.png");
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
border-radius: 25px;
|
||||
} .column-standard2 {
|
||||
background-color: transparent;
|
||||
color: var(--ion-color-light-contrast);
|
||||
padding: 0px;
|
||||
border-radius: 25px;
|
||||
margin: 5px;
|
||||
margin-top: 15px;
|
||||
} ion-button {
|
||||
--box-shadow: 0px;
|
||||
} .screenshot {
|
||||
height: 600px;
|
||||
width: auto;
|
||||
border-radius: 30px;
|
||||
} div.scrollScreenshots {
|
||||
overflow: auto;
|
||||
white-space: nowrap;
|
||||
object-fit: none;
|
||||
}
|
||||
|
||||
div.scrollScreenshots img {
|
||||
display: inline-block;
|
||||
padding: 10px;
|
||||
} .hidden-link {
|
||||
text-decoration-line: none;
|
||||
color: var(--ion-color-light-contrast);
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,200 @@
|
|||
<template>
|
||||
<ion-page>
|
||||
<ion-header>
|
||||
<ion-toolbar>
|
||||
<ion-buttons slot="start">
|
||||
<ion-back-button default-href="/tabs/soon"></ion-back-button>
|
||||
</ion-buttons>
|
||||
<ion-title>WallCat</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
<ion-content :fullscreen="true">
|
||||
<ion-header collapse="condense">
|
||||
<ion-toolbar>
|
||||
<ion-title size="large">WallCat</ion-title>
|
||||
</ion-toolbar>
|
||||
</ion-header>
|
||||
<ion-grid>
|
||||
<ion-row class="column-standard2">
|
||||
<ion-col class="bannerColumn">
|
||||
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row class="column-standard">
|
||||
<ion-col size="auto">
|
||||
<img src="../assets/Icon_WallCat.png" class="icon">
|
||||
</ion-col>
|
||||
<ion-col size="auto" class="description-column">
|
||||
<ion-row style="padding: 0px; margin: 0px;">
|
||||
<ion-column style="padding: 0px; margin: 0px;"><p class="size-appname" style="padding: 0px; margin: 0px;"><strong>WallCat</strong></p></ion-column>
|
||||
</ion-row>
|
||||
<ion-row style="padding: 0px;">
|
||||
<ion-column><p class="size-appname-icon"></p></ion-column>
|
||||
</ion-row>
|
||||
<ion-row style="padding: 0px;">
|
||||
<ion-column><ion-icon :icon="logoAndroid" class="size-appname-icon"/></ion-column>
|
||||
</ion-row>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row class="column-standard2">
|
||||
<ion-col>
|
||||
<ion-button disabled="true" expand="full" shape="round" style="margin: 0px;">Coming Soon</ion-button>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row class="column-standard">
|
||||
<ion-col>
|
||||
<h4><strong>Description</strong></h4>
|
||||
A wallpaper app by Puffercat<br>
|
||||
<br>
|
||||
Includes collections:<br>
|
||||
• Waves<br>
|
||||
• Landscapes<br>
|
||||
• Glass<br>
|
||||
• Depth<br>
|
||||
• Flat shapes<br>
|
||||
• Aurora<br>
|
||||
• Glow<br>
|
||||
<br>
|
||||
More coming soon<br>
|
||||
<br>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row class="column-standard">
|
||||
<ion-col>
|
||||
<h4><strong>Screenshots (early development)</strong></h4>
|
||||
<div class="scrollScreenshots">
|
||||
<img src="../assets/Screenshot_WallCat_1.png" class="screenshot">
|
||||
<img src="../assets/Screenshot_WallCat_2.png" class="screenshot">
|
||||
<img src="../assets/Screenshot_WallCat_3.png" class="screenshot">
|
||||
<img src="../assets/Screenshot_WallCat_4.png" class="screenshot">
|
||||
<img src="../assets/Screenshot_WallCat_5.png" class="screenshot">
|
||||
<img src="../assets/Screenshot_WallCat_6.jpg" class="screenshot">
|
||||
</div>
|
||||
<br>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
<ion-row class="column-standard">
|
||||
<ion-col>
|
||||
<h4><strong>Links</strong></h4>
|
||||
<a href="https://puffercat.gumroad.com" class="">Wallpapers</a>
|
||||
<br>
|
||||
<a href="mailto:puffercatt+wallcat@gmail.com" class="">E-mail</a>
|
||||
<br>
|
||||
<a href="https://pufferrom.t.me" class="">Telegram channel (releases)</a>
|
||||
<br>
|
||||
<a href="https://puffercatchannel.t.me" class="">Telegram channel (general)</a>
|
||||
<br>
|
||||
<a href="https://puffercatrom.t.me" class="">Support group</a>
|
||||
<br>
|
||||
<br>
|
||||
</ion-col>
|
||||
</ion-row>
|
||||
</ion-grid>
|
||||
</ion-content>
|
||||
</ion-page>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { IonPage, IonHeader, IonToolbar, IonTitle, IonContent, IonCol, IonGrid, IonRow, IonBackButton, IonButton, IonButtons, IonIcon, IonMenuButton,
|
||||
IonModal,
|
||||
IonItem,
|
||||
IonList,
|
||||
IonAvatar,
|
||||
IonImg,
|
||||
IonLabel } from '@ionic/vue';
|
||||
import ExploreContainer from '@/components/ExploreContainer.vue';
|
||||
import { logoAndroid, arrowDown, logoPwa, ellipsisVertical } from 'ionicons/icons';
|
||||
|
||||
export default defineComponent({
|
||||
name: 'Tab1Page',
|
||||
components: {IonHeader, IonToolbar, IonTitle, IonContent, IonPage, IonCol, IonGrid, IonRow, IonButton, IonIcon, IonButtons, IonBackButton},
|
||||
setup() {
|
||||
return {
|
||||
logoAndroid,
|
||||
arrowDown,
|
||||
logoPwa,
|
||||
ellipsisVertical
|
||||
}
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.column-standard {
|
||||
background-color: var(--ion-color-light-shade);
|
||||
color: var(--ion-color-light-contrast);
|
||||
padding: 15px;
|
||||
border-radius: 25px;
|
||||
margin: 5px;
|
||||
margin-top: 15px;
|
||||
} .icon {
|
||||
width: 90px;
|
||||
margin-right: 5px;
|
||||
} ion-button {
|
||||
--box-shadow: 0px;
|
||||
} .download-column {
|
||||
text-align: right;
|
||||
display: flex;
|
||||
justify-content: right;
|
||||
align-items: center;
|
||||
} .description-column {
|
||||
align-items: center;
|
||||
} .size-appname {
|
||||
font-size: 20px;
|
||||
} .size-appname-icon {
|
||||
font-size: 15px;
|
||||
} .logoAbout {
|
||||
width: 125px;
|
||||
margin: 10px;
|
||||
margin-top: 20px;
|
||||
} .modalContent {
|
||||
text-align: center;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
} .tableLabel {
|
||||
text-align: left;
|
||||
} .vueLogoLight {
|
||||
display: inline;
|
||||
} .vueLogoDark {
|
||||
display: none;
|
||||
} @media (prefers-color-scheme: dark) {
|
||||
.vueLogoLight {
|
||||
display: none;
|
||||
} .vueLogoDark {
|
||||
display: inline;
|
||||
}
|
||||
} .aboutFrameworkLogo {
|
||||
width: 175px;
|
||||
} .bannerColumn {
|
||||
height: 200px;
|
||||
background-image: url("../assets/Banner_WallCat.png");
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
border-radius: 25px;
|
||||
} .column-standard2 {
|
||||
background-color: transparent;
|
||||
color: var(--ion-color-light-contrast);
|
||||
padding: 0px;
|
||||
border-radius: 25px;
|
||||
margin: 5px;
|
||||
margin-top: 15px;
|
||||
} ion-button {
|
||||
--box-shadow: 0px;
|
||||
} .screenshot {
|
||||
height: 600px;
|
||||
border-radius: 30px;
|
||||
} div.scrollScreenshots {
|
||||
overflow: auto;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
div.scrollScreenshots img {
|
||||
display: inline-block;
|
||||
padding: 10px;
|
||||
} .hidden-link {
|
||||
text-decoration-line: none;
|
||||
color: var(--ion-color-light-contrast);
|
||||
}
|
||||
</style>
|
||||