Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit 15d92b3

Browse files
refactored
1 parent b446830 commit 15d92b3

File tree

5 files changed

+185
-1
lines changed

5 files changed

+185
-1
lines changed
Lines changed: 67 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
2+
3+
.quantity {
4+
float: left;
5+
margin-right: 15px;
6+
background-color: #eee;
7+
position: relative;
8+
width: 80px;
9+
overflow: hidden
10+
}
11+
12+
.quantity input {
13+
margin: 0;
14+
text-align: center;
15+
width: 15px;
16+
height: 15px;
17+
padding: 0;
18+
float: right;
19+
color: #000;
20+
font-size: 20px;
21+
border: 0;
22+
outline: 0;
23+
background-color: #F6F6F6
24+
}
25+
26+
.quantity input.qty {
27+
position: relative;
28+
border: 0;
29+
width: 100%;
30+
height: 40px;
31+
padding: 10px 25px 10px 10px;
32+
text-align: center;
33+
font-weight: 400;
34+
font-size: 15px;
35+
border-radius: 0;
36+
background-clip: padding-box
37+
}
38+
39+
.quantity .minus, .quantity .plus {
40+
line-height: 0;
41+
background-clip: padding-box;
42+
-webkit-border-radius: 0;
43+
-moz-border-radius: 0;
44+
border-radius: 0;
45+
-webkit-background-size: 6px 30px;
46+
-moz-background-size: 6px 30px;
47+
color: #bbb;
48+
font-size: 20px;
49+
position: absolute;
50+
height: 50%;
51+
border: 0;
52+
right: 0;
53+
padding: 0;
54+
width: 25px;
55+
z-index: 3
56+
}
57+
58+
.quantity .minus:hover, .quantity .plus:hover {
59+
background-color: #dad8da
60+
}
61+
62+
.quantity .minus {
63+
bottom: 0
64+
}
65+
.shopping-cart {
66+
margin-top: 20px;
67+
}
Lines changed: 99 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,99 @@
1+
<div class="container">
2+
<div class="card shopping-cart">
3+
<div class="card-header bg-dark text-light">
4+
<i class="fa fa-shopping-cart" aria-hidden="true"></i>
5+
Shipping cart
6+
<a href="" class="btn btn-outline-info btn-sm pull-right">Continiu shopping</a>
7+
<div class="clearfix"></div>
8+
</div>
9+
<div class="card-body">
10+
<!-- PRODUCT -->
11+
<div class="row">
12+
<div class="col-12 col-sm-12 col-md-2 text-center">
13+
<img class="img-responsive" src="http://placehold.it/120x80" alt="prewiew" width="120" height="80">
14+
</div>
15+
<div class="col-12 text-sm-center col-sm-12 text-md-left col-md-6">
16+
<h4 class="product-name"><strong>Product Name</strong></h4>
17+
<h4>
18+
<small>Product description</small>
19+
</h4>
20+
</div>
21+
<div class="col-12 col-sm-12 text-sm-center col-md-4 text-md-right row">
22+
<div class="col-3 col-sm-3 col-md-6 text-md-right" style="padding-top: 5px">
23+
<h6><strong>25.00 <span class="text-muted">x</span></strong></h6>
24+
</div>
25+
<div class="col-4 col-sm-4 col-md-4">
26+
<div class="quantity">
27+
<input type="button" value="+" class="plus">
28+
<input type="number" step="1" max="99" min="1" value="1" title="Qty" class="qty"
29+
size="4">
30+
<input type="button" value="-" class="minus">
31+
</div>
32+
</div>
33+
<div class="col-2 col-sm-2 col-md-2 text-right">
34+
<button type="button" class="btn btn-outline-danger btn-xs">
35+
<i class="fa fa-trash" aria-hidden="true"></i>
36+
</button>
37+
</div>
38+
</div>
39+
</div>
40+
<hr>
41+
<!-- END PRODUCT -->
42+
<!-- PRODUCT -->
43+
<div class="row">
44+
<div class="col-12 col-sm-12 col-md-2 text-center">
45+
<img class="img-responsive" src="http://placehold.it/120x80" alt="prewiew" width="120" height="80">
46+
</div>
47+
<div class="col-12 text-sm-center col-sm-12 text-md-left col-md-6">
48+
<h4 class="product-name"><strong>Product Name</strong></h4>
49+
<h4>
50+
<small>Product description</small>
51+
</h4>
52+
</div>
53+
<div class="col-12 col-sm-12 text-sm-center col-md-4 text-md-right row">
54+
<div class="col-3 col-sm-3 col-md-6 text-md-right" style="padding-top: 5px">
55+
<h6><strong>25.00 <span class="text-muted">x</span></strong></h6>
56+
</div>
57+
<div class="col-4 col-sm-4 col-md-4">
58+
<div class="quantity">
59+
<input type="button" value="+" class="plus">
60+
<input type="number" step="1" max="99" min="1" value="1" title="Qty" class="qty"
61+
size="4">
62+
<input type="button" value="-" class="minus">
63+
</div>
64+
</div>
65+
<div class="col-2 col-sm-2 col-md-2 text-right">
66+
<button type="button" class="btn btn-outline-danger btn-xs">
67+
<i class="fa fa-trash" aria-hidden="true"></i>
68+
</button>
69+
</div>
70+
</div>
71+
</div>
72+
<hr>
73+
<!-- END PRODUCT -->
74+
<div class="pull-right">
75+
<a href="" class="btn btn-outline-secondary pull-right">
76+
Update shopping cart
77+
</a>
78+
</div>
79+
</div>
80+
<div class="card-footer">
81+
<div class="coupon col-md-5 col-sm-5 no-padding-left pull-left">
82+
<div class="row">
83+
<div class="col-6">
84+
<input type="text" class="form-control" placeholder="cupone code">
85+
</div>
86+
<div class="col-6">
87+
<input type="submit" class="btn btn-default" value="Use cupone">
88+
</div>
89+
</div>
90+
</div>
91+
<div class="pull-right" style="margin: 10px">
92+
<a href="" class="btn btn-success pull-right">Checkout</a>
93+
<div class="pull-right" style="margin: 5px">
94+
Total price: <b>50.00€</b>
95+
</div>
96+
</div>
97+
</div>
98+
</div>
99+
</div>
Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import { Component, OnInit } from '@angular/core';
2+
3+
@Component({
4+
selector: 'app-customer-cart',
5+
templateUrl: './customer-cart.component.html',
6+
styleUrls: ['./customer-cart.component.css']
7+
})
8+
export class CustomerCartComponent implements OnInit {
9+
10+
constructor() { }
11+
12+
ngOnInit() {
13+
}
14+
15+
}

‎src/AspnetRun.Web/src/app/views/customer/customer-routing.module.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import { CustomerListComponent } from './customer-list/customer-list.component';
55
import { CustomerDetailComponent } from './customer-detail/customer-detail.component';
66
import { CustomerEditComponent } from './customer-edit/customer-edit.component';
77
import { CustomerOrderComponent } from './customer-order/customer-order.component';
8+
import { CustomerCartComponent } from './customer-cart/customer-cart.component';
89

910
const routes: Routes = [
1011
{
@@ -13,6 +14,7 @@ const routes: Routes = [
1314
children: [
1415
{ path: '', redirectTo: 'customer-list' },
1516
{ path: 'customer-list', component: CustomerListComponent, data: { title: 'List' } },
17+
{ path: 'customer-cart', component: CustomerCartComponent, data: { title: 'List' } },
1618
{ path: 'customer-detail/:id', component: CustomerDetailComponent, data: { title: 'Detail' } },
1719
{ path: 'customer-edit', component: CustomerEditComponent, data: { title: 'New' } },
1820
{ path: 'customer-edit/:id', component: CustomerEditComponent, data: { title: 'Edit' } },

‎src/AspnetRun.Web/src/app/views/customer/customer.module.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,13 +5,14 @@ import { CustomerRoutingModule } from './customer-routing.module';
55
import { FilterTextboxComponent } from './customer-list/filter-textbox/filter-textbox.component';
66
import { CustomerGridComponent } from './customer-list/customer-grid/customer-grid.component';
77
import { CustomerOrderComponent } from './customer-order/customer-order.component';
8+
import { CustomerCartComponent } from './customer-cart/customer-cart.component';
89

910
@NgModule({
1011
imports: [
1112
CustomerRoutingModule,
1213
SharedModule,
1314
],
14-
declarations: [CustomerRoutingModule.components, FilterTextboxComponent, CustomerGridComponent, CustomerOrderComponent]
15+
declarations: [CustomerRoutingModule.components, FilterTextboxComponent, CustomerGridComponent, CustomerOrderComponent,CustomerCartComponent]
1516
})
1617
export class CustomerModule {
1718

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /