Thunderfoot Global Components

note that up to version 0.97 should be consider beta, now working on 0.1.0 verison

Use

Install package

npm i @teamthunderfoot/ui

Vue/nuxt

Import all mixins before any global component

@import '@/node_modules/@teamthunderfoot/ui/src/mixins';

Wordpress

Create one SCSS entry for each JS entry and import global mixins before any global component

@import '@/node_modules/@teamthunderfoot/ui/src/mixins';

UI with our most used components

404

• g--404-01

Accordion

• g--accordion-01
• g--accordion-02

Back-top

• g--back-top-01

Banner

• g--banner-01
• g--banner-02

Btn

• g--btn-01
• g--btn-02
• g--btn-03
• g--btn-04
• g--btn-05

Card

• g--card-01
• g--card-02
• g--card-03
• g--card-04
• g--card-05
• g--card-06
• g--card-07
• g--card-08
• g--card-09
• g--card-10
• g--card-11
• g--card-12
• g--card-13
• g--card-14
• g--card-15
• g--card-16
• g--card-17
• g--card-18
• g--card-19
• g--card-20
• g--card-21
• g--card-22
• g--card-23
• g--card-24
• g--card-25
• g--card-26
• g--card-27
• g--card-28
• g--card-29
• g--card-30
• g--card-31
• g--card-32
• g--card-33
• g--card-34
• g--card-35
• g--card-36
• g--card-37
• g--card-38
• g--card-39
• g--card-40
• g--card-41
• g--card-42
• g--card-43
• g--card-44
• g--card-45
• g--card-46
• g--card-47
• g--card-48
• g--card-49
• g--card-50
• g--card-51
• g--card-52
• g--card-53
• g--card-54

Cta

• g--cta-01
• g--cta-02
• g--cta-03
• g--cta-04
• g--cta-05
• g--cta-06
• g--cta-07

Form fields

• g--form-checkbox-01
• g--form-error-01
• g--form-file-01
• g--form-group-01
• g--form-input-01
• g--form-label-01
• g--form-radio-01
• g--form-select-01
• g--form-textarea-01
• g--form-input-02
• g--form-label-02
• g--form-textarea-02

Hero

• g--hero-01
• g--hero-02
• g--hero-03
• g--hero-04
• g--hero-05
• g--hero-06
• g--hero-07

Icon

• g--icon-01

Layout

• g--layout-01
• g--layout-02
• g--layout-03
• g--layout-04
• g--layout-05
• g--layout-06
• g--layout-07
• g--layout-08
• g--layout-09
• g--layout-10

Lazy

• g--lazy-01

Link

• g--link-01
• g--link-02
• g--link-03
• g--link-04

List

• g--list-01
• g--list-02

Message

• g--message-01

Modal

• g--modal-01

Pill

• g--pill-01

Search

• g--search-01

Social

• g--social-01

Spinner

• g--spinner-01

Subscribe

• g--subscribe-01
• g--subscribe-02
• g--subscribe-03

Video

• g--video-01