@salesforce-ux/design-system/design-tokens/s1-base/sizing.yml

Salesforce Lightning Design System

# Copyright (c) 2015-present, salesforce.com, inc. All rights reserved
# Licensed under BSD 3-Clause - see LICENSE.txt or git.io/sfdc-license

global:
  type: size
  category: sizing
  cssProperties:
  - '*width'
  - '*height'
  - '*flex*'
  - top
  - right
  - bottom
  - left
  - 'margin*'
  - 'padding*'
  - transform
props:
  WIDTH_STAGE_LEFT:
    value: '88%'
  HEIGHT_FOOTER:
    value: 3.75rem
    comment: Action footer menu. Phone 44px; Tablet 50px
  HEIGHT_HEADER:
    value: 2.75rem
    comment: Brand header. Phone 44px; Tablet 50px
  HEIGHT_INPUT:
    value: 1.875rem
    comment: Text input height
  HEIGHT_OVERFLOW_START:
    value: 144px
    comment: Space above overflow menu before scrolling.
  MAX_HEIGHT_CARD_MEDIA:
    value: 144px
    comment: Maximum height for photos and such in cards.
    deprecated: true
  MAX_HEIGHT_HEADER_BRAND:
    value: 32px
    comment: Maximum height for brand logos in header.
    deprecated: true
  MAX_WIDTH_ACTION_BAR_WITH_LABELS:
    value: 320px
    comment: Maximum width for action icons in action bar when there are only 2 items with labels.
  MAX_WIDTH_ACTION_OVERFLOW_MENU:
    value: 512px
    comment: "Maximum width for action overflow menu so that it's not full-screen for tablet."
  MAX_WIDTH_HEADER_BRAND:
    value: 156px
    comment: Maximum width for brand logos in header.
    deprecated: true
  SQUARE_RECORD_ANCHOR_PIC:
    value: 3rem
    comment: Use squareIconLargeBoundary
    deprecated: true
  SQUARE_TAPPABLE:
    value: 2.75rem
    comment: Tap target Size
  FLEX_MASTER_PANEL:
    value: '7'
    comment: 2 Column Layout - Master
  SQUARE_TOOLTIP:
    value: 1.25rem
    comment: Tooltip square size
    deprecated: true
  SQUARE_TOOLTIP_NUBBIN:
    value: 1rem
    comment: Tooltip nubbin square size
  FLEX_DETAIL_PANEL:
    value: '3'
    comment: 2 Column Layout - Detail