Font Face
Teva Sans Latin
Drafts & Templates
-
-
Templates
- Homepage
- Lobby Page - Mood header
- Lobby Page - Intro header
- Story Overview
- Story Detail
- News Overview
- News Detail
- Article Page
- Contact
- Country detail page
- Product country switch
- Search result
- FAQ
- FAQ (new)
- Organization Overview
- Organization Detail
- Pipeline
- R&D Pipeline Refresh
- R&D Pipeline Refresh with Filters
- Popup
- Timeline
- Tag filters - Slider
- Tag filters - Grid
-
Templates New Header
- Homepage
- Lobby Page - Mood header
- Lobby Page - Intro header
- Story Overview
- Story Detail
- News Overview
- News Detail
- News Detail -- not fixed
- Article Page
- Contact
- Country detail page
- Product country switch
- Search result
- FAQ
- FAQ (new)
- Organization Overview
- Organization Detail
- Pipeline
- R&D Pipeline Refresh
- R&D Pipeline Refresh with Filters
- Popup
- Timeline
- Tag filters - Slider
- Tag filters - Grid
- Drafts
-
Templates
-
-
Templates - TWS
- Bulk Order
- Impersonate User Page
- Switch Pharmacy
- Catalog Page
- Top bars
- Homepage With Strips and Cards
- MyTevaLab Registration Page
- Logged In Home
- Onboarding Personal Area
- Page Loader
- Table Row Product
- Events Directory
- Order History
- Claims History
- Claims Detail Page
- Order Details Page
- Upload my profile
- Side Panel
- Side Panel Shopping Cart
- Articles Directory
- Article Gated
- Article
- Article (corrected according master)
- Events Landing
- Strip Visual Slider
- Search Results
- My Invoices
- Contact Page
- Tabs with Table
- Templates - TWS new header
-
Templates - None Editable
- Strip Split Two
- Strip Split Three
- Strip Split Two
- Strip Split Two Double
- Strip Split Three
- Strip Split Three Double
- Strip Visual
- Careers Lobby (fragment)
- News Media Lobby
- News Overview
- Article News
- Search Results
- Contact
- HCP Popup
- Marketing Popup
- Organization Overview
- Organization Detail
- Doctor discussion guide result page
- Sitemap
- Fixed Banner
- Templates - Standard SCS
- Templates - Extra SCS
- Templates - Life Effects
- Templates - Products SCS
- Templates - Minimal Layout SCS
- Templates - ID-hub
- Drafts
- Drafts - Video Testing
- Drafts - Infographic
-
Drafts - Example
- Bentobox Color Issue
- Table Pagination Issue
- Teva 2025 Background
- New header overlapping issue
- Table in Accordion Issue
- Target Accordion Issue
- Image with text using grid examples
- Fixed Header Stacking 1
- Fixed Header Stacking 2
- Fixed Header Stacking 3
- Fixed Header Stacking 4
- Aligning Card Contents
- Article with grid
- Numeric stepper issue
- Slider item test
- Modal form reset issue
- Form in split card
- Leaflet
- Iframe with GWD Banner
- Empty Layout
- Logo replacement
- Epic Slider
- Visual Slider
-
Templates - TWS
PBS Templates
-
- Examples
- Minimal layout
- Landing layout
- Products
- Collections
-
- Examples
- Minimal layout
- Landing layout
- Products
- Collections
-
- Examples
- Minimal layout
- Landing layout
- Products
- Collections
-
- Examples
- Minimal layout
- Landing layout
- Products
- Collections
-
- Examples
- Minimal layout
- Landing layout
- Products
- Collections
-
- Examples
- Minimal layout
- Landing layout
- Products
- Collections
-
- Examples
- Minimal layout
- Landing layout
- Products
- Collections
-
- Examples
- Minimal layout
- Landing layout
- Products
- Collections
-
- Examples
- Minimal layout
- Landing layout
- Products
- Collections
-
- Examples
- Minimal layout
- Landing layout
- Products
- Collections
-
- Examples
- Minimal layout
- Landing layout
- Products
- Collections
-
- Examples
- Minimal layout
- Landing layout
- Products
- Collections
-
- Examples
- Minimal layout
- Landing layout
- Products
- Collections
-
- Examples
- Minimal layout
- Landing layout
- Products
- Collections
-
- Examples
- Minimal layout
- Landing layout
- Products
- Collections
-
- Examples
- Minimal layout
- Landing layout
- Products
- Collections
-
- Examples
- Minimal layout
- Landing layout
- Products
- Collections
-
- Examples
- Minimal layout
- Landing layout
- Products
- Collections
-
- Examples
- Minimal layout
- Landing layout
- Products
- Collections
-
- Examples
- Minimal layout
- Landing layout
- Products
- Collections
-
- Examples
- Minimal layout
- Landing layout
- Products
- Collections
-
- Examples
- Minimal layout
- Landing layout
- Products
- Collections
Primitives & components context
Teva Global
Primitives & components: Teva Global
-
- Colors
- Typography
- Iconography
-
- Intro
- TWS ONLY
- Image Components
- Accordion
- Alert
- Article Meta Data
- Badge
- Banner
- Breadcrumb
- Button
- Card
- Card Badge v2
- Clickable Images
- Combobox
- Component Loader
- Contact Decision Tree
- Content Layout
- Content Rating
- Container
- Country Select
- Details
- Display Header
- Drill Down
- FAQ
- Figure
- Fixed Banner
- Flexbox
- Floating Alert v2
- Footnote
- Form
- Glossary
- Grid
- Icon List
- Image Carousel
- Infographic
- Input Extend
- Loading Indicator
- Map Local
- Map Global
- Media Object
- Modal
- Modal Layout
- Multiple Select V3
- Numeric Stepper
- Page
- Pagination
- Pipeline Cards
- Pop Button
- Pop Navigation
- Read out loud
- R&D Pipeline filtering
- R&D Pipeline legend
- Safety Instruction
- Search Box
- Scrollpane
- Search Result
- Separator
- Share Buttons
- Share Quote
- Sidebar Section
- Signature Field
- Site Split
- Sitemap
- Slider
- Store Locator
- Strip
- Table
- Tab Panel
- Taxonomy
- Timeline Components
- Toast
- Tooltip
- Video
- Video Hero
- Visual Select button
- Voucher Bar
- Wizard
Loading Indicator
v0.0.0
The Loading Indicator inform users about an unspecified wait time.
It is a drop in element, where it is part of the content that is replaced when data loaded.
<!-- Loading Indicator -->
<label class="vi-loading-indicator" role="status">Loading
<progress class="vi-loading-indicator__progress"></progress>
</label>Color #
The Loading Indicator inherits the color.
<div style="color: pink;">
<!-- Loading Indicator -->
<label class="vi-loading-indicator" role="status">Loading
<progress class="vi-loading-indicator__progress"></progress>
</label>
</div>