WrenchBoard/WrenchBoardIonic2023
2
0
Fork 0
Code Issues Pull Requests Releases Activity

home cards

Browse Source
This commit is contained in:
CHIEFSOFT\ameye
2024-01-13 13:00:23 -05:00
parent e3006da002
commit 233f809392
17 changed files with 226 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/components/familiy-dash/familiy-dash.component.html
+1
View File
@@ -2,4 +2,5 @@
<app-familiy-nokids></app-familiy-nokids>
<app-familiy-notask></app-familiy-notask>
<app-familiy-addfamily></app-familiy-addfamily>
<app-familiy-allowance></app-familiy-allowance>
</div>
src/app/components/familycards/familiy-addfamily/familiy-addfamily.component.html
+14 -3
View File
@@ -1,3 +1,14 @@
<p>
familiy-addfamily works!
</p>
<ion-card (click)="cardAction()">
<!-- <img alt="Silhouette of mountains" src="https://ionicframework.com/docs/img/demos/card-media.png" />-->
<ion-card-header>
<ion-card-title><span style="font-weight: bolder; color: #1880b0;">Add Relatives</span></ion-card-title>
<ion-card-subtitle><hr class="kid-line" /></ion-card-subtitle>
</ion-card-header>
<ion-card-content class="f-item">
<ion-item lines="none" style="background-color: lightyellow; font-weight: bold;">
Task, Goals completed, well done, or promised - Time to send a reward.
<ion-icon name="arrow-forward-circle-outline" slot="end"></ion-icon>
</ion-item>
</ion-card-content>
<!-- <ion-button fill="clear">Action 1</ion-button>-->
</ion-card>
src/app/components/familycards/familiy-addfamily/familiy-addfamily.component.scss
+25
View File
@@ -0,0 +1,25 @@
ion-card{
margin:20px 0px 0px 0px;
height: 150px;
padding: 0px;
--background: #f3f9fd;
ion-card-header{
--margin-bottom: 0px;
margin-bottom: 0px;
}
ion-card-content{
--margin-top: 0px;
--margin-bottom: 0px;
f-item, ion-item{
//--background-color: #3dc2ff;
font-size: 14px;
}
// background-color: #3dc2ff;
// font-weight: bolder;
// background-image: linear-gradient(to top, #3dc2ff, #ffffff);
}
.left-col{
background-color: yellow;
height: 100%;
}
}
src/app/components/familycards/familiy-addfamily/familiy-addfamily.component.ts
+4
View File
@@ -11,4 +11,8 @@ export class FamiliyAddfamilyComponent implements OnInit {
ngOnInit() {}
cardAction(){
alert('card-action');
}
}
src/app/components/familycards/familiy-allowance/familiy-allowance.component.html
+14
View File
@@ -0,0 +1,14 @@
<ion-card (click)="cardAction()">
<!-- <img alt="Silhouette of mountains" src="https://ionicframework.com/docs/img/demos/card-media.png" />-->
<ion-card-header>
<ion-card-title><span style="font-weight: bolder; color: #f3f4f4; margin-left: 200px">Add Allowance</span></ion-card-title>
<ion-card-subtitle><hr class="kid-line" /></ion-card-subtitle>
</ion-card-header>
<ion-card-content class="f-item">
<ion-item lines="none" style="background-color: lightyellow; font-weight: bold;">
Task, Goals completed, well done, or promised - Time to send a reward.
<ion-icon name="arrow-forward-circle-outline" slot="end"></ion-icon>
</ion-item>
</ion-card-content>
<!-- <ion-button fill="clear">Action 1</ion-button>-->
</ion-card>
src/app/components/familycards/familiy-allowance/familiy-allowance.component.scss
+25
View File
@@ -0,0 +1,25 @@
ion-card{
margin:20px 0px 0px 0px;
height: 150px;
padding: 0px;
--background: #f3f9fd;
ion-card-header{
--margin-bottom: 0px;
margin-bottom: 0px;
}
ion-card-content{
--margin-top: 0px;
--margin-bottom: 0px;
f-item, ion-item{
//--background-color: #3dc2ff;
font-size: 14px;
}
// background-color: #3dc2ff;
// font-weight: bolder;
// background-image: linear-gradient(to top, #3dc2ff, #ffffff);
}
.left-col{
background-color: yellow;
height: 100%;
}
}
src/app/components/familycards/familiy-allowance/familiy-allowance.component.spec.ts
+24
View File
@@ -0,0 +1,24 @@
import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
import { IonicModule } from '@ionic/angular';
import { FamiliyAllowanceComponent } from './familiy-allowance.component';
describe('FamiliyAllowanceComponent', () => {
let component: FamiliyAllowanceComponent;
let fixture: ComponentFixture<FamiliyAllowanceComponent>;
beforeEach(waitForAsync(() => {
TestBed.configureTestingModule({
declarations: [ FamiliyAllowanceComponent ],
imports: [IonicModule.forRoot()]
}).compileComponents();
fixture = TestBed.createComponent(FamiliyAllowanceComponent);
component = fixture.componentInstance;
fixture.detectChanges();
}));
it('should create', () => {
expect(component).toBeTruthy();
});
});
src/app/components/familycards/familiy-allowance/familiy-allowance.component.ts
+18
View File
@@ -0,0 +1,18 @@
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-familiy-allowance',
templateUrl: './familiy-allowance.component.html',
styleUrls: ['./familiy-allowance.component.scss'],
})
export class FamiliyAllowanceComponent implements OnInit {
constructor() { }
ngOnInit() {}
cardAction(){
alert('card-action');
}
}
src/app/components/familycards/familiy-nokids/familiy-nokids.component.html
+19 -3
View File
@@ -1,3 +1,19 @@
<p>
familiy-nokids works!
</p>
<ion-card (click)="cardAction()">
<ion-card-header>
<ion-card-title><span
style="margin-left: 100px;
font-weight: bolder;
color: white;">Add Kids</span>
</ion-card-title>
<ion-card-subtitle><hr class="kid-line" /></ion-card-subtitle>
</ion-card-header>
<ion-card-content class="f-item">
<ion-item lines="none"
style="background-color: lightyellow;
border-radius: 10px;
margin-left: 150px; font-weight: bold;">
Task, Goals .
<ion-icon name="arrow-forward-circle-outline" slot="end"></ion-icon>
</ion-item>
</ion-card-content>
</ion-card>
src/app/components/familycards/familiy-nokids/familiy-nokids.component.scss
+27
View File
@@ -0,0 +1,27 @@
ion-card{
margin:20px 0px 0px 0px;
height: 130px;
padding: 0px;
background-image: url("https://www.wrenchboard.com/assets/images/apps/dash-family-card-nokid.png");
background-size: cover;
--background: #240668;
ion-card-header{
--margin-bottom: 0px;
margin-bottom: 0px;
}
ion-card-content{
--margin-top: 0px;
--margin-bottom: 0px;
f-item, ion-item{
//--background-color: #3dc2ff;
font-size: 14px;
}
// background-color: #3dc2ff;
// font-weight: bolder;
// background-image: linear-gradient(to top, #3dc2ff, #ffffff);
}
.left-col{
background-color: yellow;
height: 100%;
}
}
src/app/components/familycards/familiy-nokids/familiy-nokids.component.ts
+4
View File
@@ -11,4 +11,8 @@ export class FamiliyNokidsComponent implements OnInit {
ngOnInit() {}
cardAction(){
alert('card-action');
}
}
src/app/components/familycards/familiy-notask/familiy-notask.component.html
+14 -3
View File
@@ -1,3 +1,14 @@
<p>
familiy-notask works!
</p>
<ion-card (click)="cardAction()">
<!-- <img alt="Silhouette of mountains" src="https://ionicframework.com/docs/img/demos/card-media.png" />-->
<ion-card-header>
<ion-card-title><span style="font-weight: bolder; color: #1880b0;">No Tasks</span></ion-card-title>
<ion-card-subtitle><hr class="kid-line" /></ion-card-subtitle>
</ion-card-header>
<ion-card-content class="f-item">
<ion-item lines="none" style="background-color: lightyellow; font-weight: bold;">
Task, Goals completed, well done, or promised - Time to send a reward.
<ion-icon name="arrow-forward-circle-outline" slot="end"></ion-icon>
</ion-item>
</ion-card-content>
<!-- <ion-button fill="clear">Action 1</ion-button>-->
</ion-card>
src/app/components/familycards/familiy-notask/familiy-notask.component.scss
+25
View File
@@ -0,0 +1,25 @@
ion-card{
margin:20px 0px 0px 0px;
height: 150px;
padding: 0px;
--background: #f3f9fd;
ion-card-header{
--margin-bottom: 0px;
margin-bottom: 0px;
}
ion-card-content{
--margin-top: 0px;
--margin-bottom: 0px;
f-item, ion-item{
//--background-color: #3dc2ff;
font-size: 14px;
}
// background-color: #3dc2ff;
// font-weight: bolder;
// background-image: linear-gradient(to top, #3dc2ff, #ffffff);
}
.left-col{
background-color: yellow;
height: 100%;
}
}
src/app/components/familycards/familiy-notask/familiy-notask.component.ts
+4
View File
@@ -11,4 +11,8 @@ export class FamiliyNotaskComponent implements OnInit {
ngOnInit() {}
cardAction(){
alert('card-action');
}
}
src/app/pages/home/home.module.ts
+3 -1
View File
@@ -18,6 +18,7 @@ import {FamiliyDashComponent} from "../../components/familiy-dash/familiy-dash.c
import { FamiliyNokidsComponent } from '../../components/familycards/familiy-nokids/familiy-nokids.component';
import {FamiliyNotaskComponent} from "../../components/familycards/familiy-notask/familiy-notask.component";
import {FamiliyAddfamilyComponent} from "../../components/familycards/familiy-addfamily/familiy-addfamily.component";
import {FamiliyAllowanceComponent} from "../../components/familycards/familiy-allowance/familiy-allowance.component";
// @NgModule({
// schemas: [CUSTOM_ELEMENTS_SCHEMA]
@@ -35,7 +36,8 @@ import {FamiliyAddfamilyComponent} from "../../components/familycards/familiy-ad
TrackingComponent,FastrewardComponent,
LatestMarketComponent,HelpListingComponent,
FamiliyDashComponent,FamiliyNokidsComponent,
FamiliyNotaskComponent,FamiliyAddfamilyComponent
FamiliyNotaskComponent,FamiliyAddfamilyComponent,
FamiliyAllowanceComponent
],
schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
src/app/pages/login/login.page.html
+1 -1
View File
@@ -20,7 +20,7 @@
<ion-col size="6">
<ion-button class="login-type22" (click)="familyLogin()">
<ion-icon name="people-circle-outline"></ion-icon>
Family Login</ion-button>
<span style="margin-left: 5px;">Kids Login</span></ion-button>
</ion-col>
</ion-row>
</ion-grid>
src/app/pages/login/login.page.scss
+4 -1
View File
@@ -2,7 +2,10 @@ ion-content {
.family_box{
margin-bottom: 20px;
}
.login-type22{
font-weight: bolder;
color:white;
}
.pending-buttom{
padding-top: 25px;
}