Ionic-framework: CSS custom properties documentation

Created on 24 Jul 2018  路  4Comments  路  Source: ionic-team/ionic-framework

As theming is now based on CSS custom properties, we need to properly document them. We'll be using comments in the source to do so:

/** @prop --max-width: Max width of the alert */
  • [x] action-sheet
  • [x] alert
  • [x] anchor
  • [x] avatar
  • [x] back-button
  • [x] backdrop
  • [x] badge
  • [x] button
  • [x] buttons
  • [x] card-content
  • [x] card-header
  • [x] card-subtitle
  • [x] card-title
  • [x] card
  • [x] checkbox
  • [x] chip-button
  • [x] chip-icon
  • [x] chip
  • [x] col
  • [x] content
  • [x] datetime
  • [x] fab-button
  • [x] fab-list
  • [x] fab
  • [x] footer
  • [x] grid
  • [x] header
  • [x] icon
  • [x] img
  • [x] infinite-scroll-content
  • [x] infinite-scroll
  • [x] input
  • [x] item-divider
  • [x] item-group
  • [x] item-option
  • [x] item-options
  • [x] item-sliding
  • [x] item
  • [x] label
  • [x] list-header
  • [x] list
  • [x] loading
  • [x] menu-button
  • [x] menu-toggle
  • [x] menu
  • [x] modal
  • [x] nav
  • [x] note
  • [x] picker-column
  • [x] picker
  • [x] popover
  • [x] radio-group
  • [x] radio
  • [x] range-knob
  • [x] range
  • [x] refresher-content
  • [x] refresher
  • [x] reorder-group
  • [x] reorder
  • [x] ripple-effect
  • [x] row
  • [x] scroll
  • [x] searchbar
  • [x] segment-button
  • [x] segment
  • [x] select-option
  • [x] select-popover
  • [x] select
  • [x] skeleton-text
  • [x] slide
  • [x] slides
  • [x] spinner
  • [x] split-pane
  • [x] tab-button
  • [x] tab-bar
  • [x] tab
  • [x] tabs
  • [x] tap-click
  • [x] text
  • [x] textarea
  • [x] thumbnail
  • [x] title
  • [x] toast
  • [x] toggle
  • [x] toolbar
  • [x] virtual-scroll
core

Most helpful comment

Ok with a format like jsdocs?

/**
 * @prop --max-width: Max width of the alert
 * @prop --min-width: Min width of the alert
 */

All 4 comments

Ok with a format like jsdocs?

/**
 * @prop --max-width: Max width of the alert
 * @prop --min-width: Min width of the alert
 */

As part of this issue we are also resolving the following issues:

  • setting --background overrides the background set by color #14853
  • enhancement: stop overriding ion-color variables #14808

please update for tab, it is very important

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.

Was this page helpful?
0 / 5 - 0 ratings