E-commerce components

Angular Bootstrap e-commerce components

Angular Bootstrap e-commerce components is a set of components which are necessary to build online stores and any other e-commerce businesses.

Product card v.1 MDB Pro component

Card image with a picture of shoes
Shoes

Product name

Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates.

49$
Shoes

Product name

 Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates.
49$

Product card v.2 MDB Pro component

Card image with a picture of dance class.
Category

Product name

Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates.

49$
Category

Product name

 Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates.
49$

Product card v.3 MDB Pro component

Card image with a picture of a black belt.
Category

Product name

Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates.

49$ 199$
Category

Product name

 Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates.
49$ 199$

Product card v.4 MDB Pro component

Card image with a picture of casual outfit.
Category

Product name

Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates.

49$
Category

Product name
Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates.
49$

Product card v.5 MDB Pro component

Example photo
Shoes

Product name

Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates.

49$
Shoes

Product name
Temporibus autem quibusdam et aut officiis debitis aut rerum necessitatibus saepe eveniet ut et voluptates.
49$

Collection cards MDB Pro component

Light version

Example photo

Title

Title

Dark version

Example photo

Title

Title

Shopping Cart Table MDB Pro component

Product Color Price QTY Amount
iPhone

Apple

 White $800 $800
Headphones

Sony

 Red $200 $600
iPad Pro

Apple

 Gold $600 $1200

Total

$2600

Product Color Price QTY Amount
iPhone

Apple

 White $800 $800
Headphones

Sony

 Red $200 $600
iPad Pro

Apple

 Gold $600 $1200

Total

$2600

Checkout panel MDB Pro component

@
Please select a valid country.
Please provide a valid state.
Zip code required.
Second sample image
Additional premium support

Lorem ipsum dolor sit amet consectetur adipisicing elit. Veritatis, ea ut aperiam corrupti, dolorem.

Second sample image
MDB Membership

Lorem ipsum dolor sit amet consectetur adipisicing elit. Veritatis, ea ut aperiam corrupti, dolorem.

Full name as displayed on card
Name on card is required
Credit card number is required
Expiration date required
Security code required

Summary

MDBootstrap UI KIT (jQuery version) - License 6-10 poeple + unlimited projects
$ 2000
Premium support - 2 years
$ 2000
MDB Membership - 2 years
$ 2000
Total
$ 2000
@
I accept the terms and conditions Save this information for next time Subscribe to the newsletter
Second sample image
Additional premium support

Lorem ipsum dolor sit amet consectetur adipisicing elit. Veritatis, ea ut aperiam corrupti, dolorem.

Second sample image
MDB Membership

Lorem ipsum dolor sit amet consectetur adipisicing elit. Veritatis, ea ut aperiam corrupti, dolorem.
Full name as displayed on card

Summary

MDBootstrap UI KIT (jQuery version) - License 6-10 poeple + unlimited projects
$ 2000
Premium support - 2 years
$ 2000
MDB Membership - 2 years
$ 2000
Total
$ 2000
import { Component } from '@angular/core'; @Component({ selector: 'checkout-panel', templateUrl: './checkout-panel.component.html' }) export class CheckoutPanelComponent { optionsSelectCountry = [ { value: '1', label: 'United States' }, ]; optionsSelectState = [ { value: '1', label: 'California' }, ]; optionsSelectPeriod = [ { value: '1', label: '+6 months: 200$' }, { value: '2', label: '+12 months: 400$' }, { value: '3', label: '+18 months: 800$' }, { value: '4', label: '+24 months: 1200$' }, ]; }