@marioschmidt/design-system-tokens 1.3.7 → 1.3.8

package/dist/ios/brands/bild/semantic/effects/EffectsLight.swift

@@ -1,71 +0,0 @@
-// Do not edit directly, this file was auto-generated.
-//
-// BILD Design System Tokens v1.3.7
-// Generated by Style Dictionary v4.2.0
-//
-// Brand: Bild | Context: Effects light
-//
-// Copyright (c) 2026 Axel Springer Deutschland GmbH
-// Proprietary and confidential. All rights reserved.
-//
-// Documentation: https://github.com/UXWizard25/vv-token-test-v3/blob/main/packages/tokens/docs/ios.md
-import SwiftUI
-
-/// Protocol for type-safe effects access
-public protocol BildEffectsScheme: Sendable {
-    /// Broad and soft shadows with low contrast. Best for cards, sheets, or subtle surface separation.
-    var shadowSoftSm: ShadowStyle { get }
-    /// Broad and soft shadows with low contrast. Best for cards, sheets, or subtle surface separation.
-    var shadowSoftMd: ShadowStyle { get }
-    /// Broad and soft shadows with low contrast. Best for cards, sheets, or subtle surface separation.
-    var shadowSoftLg: ShadowStyle { get }
-    /// Broad and soft shadows with low contrast. Best for cards, sheets, or subtle surface separation.
-    var shadowSoftXl: ShadowStyle { get }
-    /// Sharper, higher-contrast shadows. Best for dialogs, modals, dropdowns and overlays that require stronger focus.
-    var shadowHardSm: ShadowStyle { get }
-    /// Sharper, higher-contrast shadows. Best for dialogs, modals, dropdowns and overlays that require stronger focus.
-    var shadowHardMd: ShadowStyle { get }
-    /// Sharper, higher-contrast shadows. Best for dialogs, modals, dropdowns and overlays that require stronger focus.
-    var shadowHardLg: ShadowStyle { get }
-    /// Sharper, higher-contrast shadows. Best for dialogs, modals, dropdowns and overlays that require stronger focus.
-    var shadowHardXl: ShadowStyle { get }
-}
-
-/// Light mode effects implementation
-public struct BildEffectsLight: BildEffectsScheme, DesignEffectsScheme {
-    public static let shared = BildEffectsLight()
-    private init() {}
-
-    public let shadowSoftSm = ShadowStyle(shadows: [
-        DropShadow(color: Color(hex: 0x000000, alpha: 0.04), offsetX: 0, offsetY: 1, radius: 4, spread: 0),
-        DropShadow(color: Color(hex: 0x000000, alpha: 0.08), offsetX: 0, offsetY: 2, radius: 6, spread: 0)
-    ])
-    public let shadowSoftMd = ShadowStyle(shadows: [
-        DropShadow(color: Color(hex: 0x000000, alpha: 0.03), offsetX: 0, offsetY: 2, radius: 16, spread: 0),
-        DropShadow(color: Color(hex: 0x000000, alpha: 0.07), offsetX: 0, offsetY: 4, radius: 12, spread: 0)
-    ])
-    public let shadowSoftLg = ShadowStyle(shadows: [
-        DropShadow(color: Color(hex: 0x000000, alpha: 0.03), offsetX: 0, offsetY: 8, radius: 24, spread: 0),
-        DropShadow(color: Color(hex: 0x000000, alpha: 0.07), offsetX: 0, offsetY: 8, radius: 16, spread: 0)
-    ])
-    public let shadowSoftXl = ShadowStyle(shadows: [
-        DropShadow(color: Color(hex: 0x000000, alpha: 0.05), offsetX: 0, offsetY: 0, radius: 64, spread: 0),
-        DropShadow(color: Color(hex: 0x000000, alpha: 0.10), offsetX: 0, offsetY: 16, radius: 32, spread: 0)
-    ])
-    public let shadowHardSm = ShadowStyle(shadows: [
-        DropShadow(color: Color(hex: 0x000000, alpha: 0.20), offsetX: 0, offsetY: 1, radius: 2, spread: 0),
-        DropShadow(color: Color(hex: 0x000000, alpha: 0.10), offsetX: 0, offsetY: 1, radius: 3, spread: 1)
-    ])
-    public let shadowHardMd = ShadowStyle(shadows: [
-        DropShadow(color: Color(hex: 0x000000, alpha: 0.10), offsetX: 0, offsetY: 4, radius: 8, spread: 0),
-        DropShadow(color: Color(hex: 0x000000, alpha: 0.16), offsetX: 0, offsetY: 2, radius: 4, spread: 0)
-    ])
-    public let shadowHardLg = ShadowStyle(shadows: [
-        DropShadow(color: Color(hex: 0x000000, alpha: 0.20), offsetX: 0, offsetY: 2, radius: 3, spread: 0),
-        DropShadow(color: Color(hex: 0x000000, alpha: 0.10), offsetX: 0, offsetY: 6, radius: 10, spread: 4)
-    ])
-    public let shadowHardXl = ShadowStyle(shadows: [
-        DropShadow(color: Color(hex: 0x000000, alpha: 0.20), offsetX: 0, offsetY: 4, radius: 4, spread: 0),
-        DropShadow(color: Color(hex: 0x000000, alpha: 0.10), offsetX: 0, offsetY: 8, radius: 12, spread: 6)
-    ])
-}

package/dist/ios/brands/bild/semantic/sizeclass/SizingCompact.swift

@@ -1,500 +0,0 @@
-// Do not edit directly, this file was auto-generated.
-//
-// BILD Design System Tokens v1.3.7
-// Generated by Style Dictionary v4.2.0
-//
-// Brand: Bild | Context: SizingScheme compact
-//
-// Copyright (c) 2026 Axel Springer Deutschland GmbH
-// Proprietary and confidential. All rights reserved.
-//
-// Documentation: https://github.com/UXWizard25/vv-token-test-v3/blob/main/packages/tokens/docs/ios.md
-import SwiftUI
-
-/// Protocol for type-safe sizing access across Compact/Regular size classes
-public protocol BildSizingScheme: Sendable {
-    /// 24-24-32-32 – use for side paddings and gutters in responsive layouts
-    var gridSpaceRespLg: CGFloat { get }
-    /// 48-48-64-64 – use for side paddings and gutters in responsive layouts
-    var gridSpaceRespXl: CGFloat { get }
-    /// 12-12-12-16 – use for side paddings and gutters in responsive layouts
-    var gridSpaceRespBase: CGFloat { get }
-    /// 6-6-6-8 – use for side paddings and gutters in responsive layouts
-    var gridSpaceRespSm: CGFloat { get }
-    /// 0-0-0-16 – This token is used on the main homepages content container, ensuring full-width layout (no horizontal padding) on mobile and tablet breakpoints.
-    var pageInlineSpace: CGFloat { get }
-    /// 16-16-16-16 – use for fixed side paddings and gutters
-    var gridSpaceConstLg: CGFloat { get }
-    /// 12-12-12-12 – use for fixed side paddings and gutters
-    var gridSpaceConstSm: CGFloat { get }
-    /// Used to set the column count in Figma Layout guide Grids
-    var layoutGuideGridColums: CGFloat { get }
-    /// 36-36-48-48 – Use for vertical spacing between sections in a layout.
-    var sectionSpaceBase: CGFloat { get }
-    /// 72-72-96-96 – Use for vertical spacing between sections in a layout
-    var sectionSpaceLg: CGFloat { get }
-    /// 16-16-32-32 – Use for spacing after paragraphs in text content
-    var paragraphEndSpace: CGFloat { get }
-    /// 24-24-36-36 – Use for vertical spacing between subsections in a layout
-    var sectionSpaceSm: CGFloat { get }
-    /// 320 - 390 - 600 - 1024 – Defines the minimum width of the main frame for different breakpoints. Apply this token to the main frame of page layouts to simulate realistic minimum widths across responsive viewports.
-    var breakpointMinWidthSize: CGFloat { get }
-    /// 389 - 599 - 1023 - 1024 – Defines the minimum width of the main frame for different breakpoints. Apply this token to the main frame of page layouts to simulate realistic maximum widths across responsive viewports.
-    var breakpointMaxWidthSize: CGFloat { get }
-    /// Common viewport height size based on the selected mode. Apply this token to the main frame of page layouts to simulate realistic vertical space.
-    var canvasHeightSizeWeb: CGFloat { get }
-    /// Use for content containers that should not fill the full page width on larger viewports. This is commonly used on article body text content and other elements in an article page.
-    var contentMaxWidthMedium: CGFloat { get }
-    /// Use for content containers that should fill the full width of the page
-    var contentMaxWidthFull: CGFloat { get }
-    /// Common viewport width size based on the selected breakpoint. Apply this token to the main frame of page layouts.
-    var canvasWidthSizeWeb: CGFloat { get }
-    /// Common viewport width size based on the selected breakpoint. Apply this token to the main frame of page layouts.
-    var canvasWidthSizeApp: CGFloat { get }
-    /// Common viewport height size based on the selected mode. Apply this token to the main frame of page layouts to simulate realistic vertical space.
-    var canvasHeightSizeApp: CGFloat { get }
-    /// 22 - 22 - 22 - 28 -- html class stage-block-title__text css var --ressort-header-font-size(sm-md-lg)
-    var title1fontSize: CGFloat { get }
-    /// 16 - 16 - 18 - 20 - html class stage-block-title__text css var --ressort-header-font-size(sm-md-lg)
-    var title2fontSize: CGFloat { get }
-    /// This variable is used on the font size parameter for the display1 text style. 40 - 40 - 72 - 120
-    var display1fontSize: CGFloat { get }
-    /// This variable is used for the font size parameter of the Display2 text style. 36 - 36 - 42 - 64
-    var display2fontSize: CGFloat { get }
-    /// This variable is used on the display3 font size parameter of the display3 text style. 28 - 28 - 32 - 40
-    var display3fontSize: CGFloat { get }
-    /// This token is used for the headline1 text style's font size parameter. 48 - 48 - 72 - 100
-    var headline1fontSize: CGFloat { get }
-    /// This token is used on the headline2 text style's font size parameter. 40 - 40 - 48 - 64
-    var headline2fontSize: CGFloat { get }
-    /// This token is used on the headline3 text style's font size parameter. 28 - 28 - 36 - 40
-    var headline3fontSize: CGFloat { get }
-    /// This token controls the headline4 text style's font size parameter: 22 - 22 - 26 - 32
-    var headline4fontSize: CGFloat { get }
-    /// This variable is used on the body text style's font size parameter. It remains constant at 21.
-    var bodyFontSize: CGFloat { get }
-    /// This token is used in the label3 text style's font size parameter. Its value remains constant at 12 across device sizes.
-    var label3fontSize: CGFloat { get }
-    /// This variable controls the label2 text style's font size parameter. Its value remains constant at 15.
-    var label2fontSize: CGFloat { get }
-    /// This token is used in the label1 text style font size parameter. Its value remains constant at 17 across device sizes.
-    var label1fontSize: CGFloat { get }
-    /// This token is used for the font size parameter of the callout text style. 18 - 18 - 22 - 22
-    var callout1fontSize: CGFloat { get }
-    /// This token is used on the footnote text style font size parameter. 16 - 16 - 16 - 18
-    var footnote1fontSize: CGFloat { get }
-    /// This token is used in the font size parameter of the footnote2 text style. 12 - 12 - 12 - 16
-    var footnote2fontSize: CGFloat { get }
-    /// Values come from NMT Figma File 01_Foundation; in online CSS this is kicker0. 18 - 18 - 22 - 30 - This variable does not exist yet in online css. Online css is called kicker0 for smallest font size.
-    var kicker1fontSize: CGFloat { get }
-    /// Values come from comparing NMT Figma File 01_Foundation to online CSS. Online kickers are numbered from 0 to 3. This DS uses 1 to 4 following html convention of h1, h2, h3, etc. 18 - 18 - 22 - 24
-    var kicker2fontSize: CGFloat { get }
-    /// Values come from comparing NMT Figma File 01_Foundation to online CSS. Online kickers are numbered from 0 to 3. 16 - 16 - 18 - 20
-    var kicker3fontSize: CGFloat { get }
-    /// Values come from comparing NMT Figma File 01_Foundation to online CSS. Online kickers are numbered from 0 to 3. 14 - 14 - 16 - 16
-    var kicker4fontSize: CGFloat { get }
-    /// This token controls the subheadline1 font size parameter. 24 - 24 - 32 - 36
-    var subheadline1fontSize: CGFloat { get }
-    /// 16 - 16 - 18 - 20 -- This variable is used for controlling the font size of the quote text style.
-    var quoteFontSize: CGFloat { get }
-    /// This variable references the bodyFontFamily variable from the branding collection.
-    var bodyFontFamily: String { get }
-    var calloutFontFamily: String { get }
-    var headlineFontFamily: String { get }
-    var footnoteFontFamily: String { get }
-    var labelFontFamily: String { get }
-    var kickerFontFamily: String { get }
-    var subheadlineFontFamily: String { get }
-    var titleFontFamily: String { get }
-    var quoteFontFamily: String { get }
-    var displayFontFamily: String { get }
-    var calloutFontWeight: CGFloat { get }
-    var labelFontWeightBold: CGFloat { get }
-    var labelFontWeightBook: CGFloat { get }
-    var labelFontWeightBoldSt: String { get }
-    var labelFontWeightBookSt: String { get }
-    var bodyFontWeightBook: CGFloat { get }
-    var bodyFontWeightBold: CGFloat { get }
-    var kickerFontWeight: CGFloat { get }
-    var kickerFontWeightSt: String { get }
-    var subheadlineFontWeight: CGFloat { get }
-    var headline1fontWeight: CGFloat { get }
-    var headline2fontWeight: CGFloat { get }
-    var headline3fontWeight: CGFloat { get }
-    var headline4fontWeight: CGFloat { get }
-    /// This variable is a string type variable for controlling not only headline font weight but also the italic style for Sport Bild headlines.
-    var headline1fontWeightSt: String { get }
-    /// This variable is a string type variable for controlling not only headline font weight but also the italic style for Sport Bild headlines.
-    var headline2fontWeightSt: String { get }
-    /// This variable is a string type variable for controlling not only headline font weight but also the italic style for Sport Bild headlines.
-    var headline3fontWeightSt: String { get }
-    /// This variable is a string type variable for controlling not only headline font weight but also the italic style for Sport Bild headlines.
-    var headline4fontWeightSt: String { get }
-    var titleFontWeight: CGFloat { get }
-    var displayFontWeight: CGFloat { get }
-    var displayFontWeightSt: String { get }
-    var quoteFontWeight: CGFloat { get }
-    var footnoteFontWeightBook: CGFloat { get }
-    var footnoteFontWeightBold: CGFloat { get }
-    /// Figma's font line height currently does not allow for multipliers as is used on current website css var(--body-line-height)
-    var bodyLineHeight: CGFloat { get }
-    var kicker4lineHeight: CGFloat { get }
-    var kicker3lineHeight: CGFloat { get }
-    var kicker2lineHeight: CGFloat { get }
-    var kicker1lineHeight: CGFloat { get }
-    var label3lineHeight: CGFloat { get }
-    /// This variable is used in the label1 text style's line height parameter. It references branding variables for brand specific line heights.
-    var label1lineHeight: CGFloat { get }
-    var label2lineHeight: CGFloat { get }
-    var display1lineHeight: CGFloat { get }
-    var display2lineHeight: CGFloat { get }
-    var display3lineHeight: CGFloat { get }
-    var title1lineHeight: CGFloat { get }
-    /// html class stage-block-title__text css var --ressort-header-font-size(sm-md-lg)
-    var title2lineHeight: CGFloat { get }
-    /// This variable is used in the quote text style line height parameter.
-    var quoteLineHeight: CGFloat { get }
-    var footnote1lineHeight: CGFloat { get }
-    var footnote2lineHeight: CGFloat { get }
-    var headline1lineHeight: CGFloat { get }
-    var headline2lineHeight: CGFloat { get }
-    var headline3lineHeight: CGFloat { get }
-    var headline4lineHeight: CGFloat { get }
-    var calloutLineHeight: CGFloat { get }
-    var subheadline1lineHeight: CGFloat { get }
-    /// 0.5 | 0.5 | 0.5 | 0.5 | This variable takes primitive letter spacing variables and creates this semantic variable for use on designs that change across device sizes.
-    var letterSpacePositiveSm: CGFloat { get }
-    /// 2 | 2 | 2 | 3 | This variable takes primitive letter spacing variables and creates this semantic variable for use on designs that change across device sizes.
-    var letterSpacePositiveLg: CGFloat { get }
-    /// 1 | 1 | 1 | 1 | This variable takes primitive letter spacing variables and creates this semantic variable for use on designs that change across device sizes.
-    var letterSpacePositiveMd: CGFloat { get }
-    /// 0 | 0 | 0 | 0 | This variable takes primitive letter spacing variables and creates this semantic variable for use on designs that change across device sizes.
-    var letterSpaceNone: CGFloat { get }
-    /// -0.5 | -0.5 | -0.25 | -0.25 | This variable takes primitive letter spacing variables and creates this semantic variable for use on designs that change across device sizes.
-    var letterSpaceNegativeSm: CGFloat { get }
-    /// -1 | -1 | -1 | -1 | This variable takes primitive letter spacing variables and creates this semantic variable for use on designs that change across device sizes.
-    var letterSpaceNegativeMd: CGFloat { get }
-    /// -2 | -2 | -2 | -3 | This variable takes primitive letter spacing variables and creates this semantic variable for use on designs that change across device sizes.
-    var letterSpaceNegativeLg: CGFloat { get }
-    /// -0.25 | -0.25 | -0.25 | -0.25 | This variable takes primitive letter spacing variables and creates this semantic variable for use on designs that change across device sizes. This letter spacing was only found in large titles on iOS mobile app large title component.
-    var letterSpaceNegativeXs: CGFloat { get }
-    /// 0.25 | 0.25 | 0.25 | 0.25 | This variable takes primitive letter spacing variables and creates this semantic variable for use on designs that change across device sizes.
-    var letterSpacePositiveXs: CGFloat { get }
-    /// -0.5 | -0.5 | -1 | -2 | This variable is used for the letter spacing parameter of the display1 text style. On smaller devices the value is smaller than on larger devices. On desktop devices the letter spacing is further reduced for making the text style more compact.
-    var display1letterSpace: CGFloat { get }
-    /// -0.5 | -0.5 | -1 | -1 | This variable is used for the letter spacing parameter of the display2 text style. On smaller devices the value is smaller than on larger devices.
-    var display2letterSpace: CGFloat { get }
-    /// -0.5 | -0.5 | -1 | -1 | This variable is used for the letter spacing parameter of the display3 text style. On smaller devices the value is smaller than on larger devices.
-    var display3letterSpace: CGFloat { get }
-    /// 2-2-2-2 use for corner rounding on very small UI elements such as tooltips and badges.
-    var borderRadiusXs: CGFloat { get }
-    /// 8-8-8-8 – Standard radius for buttons, chips, input fields, and medium-sized interactive elements.
-    var borderRadiusMd: CGFloat { get }
-    /// 4-4-4-4 – use for corner rounding on compact components like checkboxes or small input controls.
-    var borderRadiusSm: CGFloat { get }
-    /// 24-24-24-24 – use for corner rounding on larger cards, overlays, dialogs, and other container components.
-    var borderRadiusXl: CGFloat { get }
-    /// 16-16-16-16 – use for corner rounding on small cards, overlays, and modal surfaces.
-    var borderRadiusLg: CGFloat { get }
-    /// 0-0-0-0 – no corner rounding. Used as default for flat layouts, content modules, images, and teaser elements.
-    var borderRadiusNone: CGFloat { get }
-    /// creates fully rounded shapes, typically used for circular elements like avatars.
-    var borderRadiusFull: CGFloat { get }
-    /// 1-1-1-1 – use for subtle outlines and dividers
-    var borderWidthThin: CGFloat { get }
-    /// 2-2-2-2 – use for stronger outlines on form elements (inputs), buttons (outline variants), and interaction states (focus, hover, active)
-    var borderWidthThick: CGFloat { get }
-    /// 0.33 -0.33 -0.33 -0.33 – primarily used in mobile app interfaces. Optimized for high-density displays to create subtle dividers and outlines without visual overload.
-    var borderWidthHairline: CGFloat { get }
-    var changeOnLg: String { get }
-    /// This variable is used for controlling size changes across device sizes on some components such as the vertical newsticker cards and the search results cards. Both have cards that change layouts at different breakpoints.
-    var changeOnMd: String { get }
-    var bpSpecificWeb: String { get }
-    var bpSpecificApp: String { get }
-    /// 8-8-12-16 – use for horizontal (left/right) padding of UI elements that scales across breakpoints
-    var inlineSpaceRespSm: CGFloat { get }
-    /// 12-12-16-24 use for horizontal (left/right) padding of UI elements that scales across breakpoints
-    var inlineSpaceRespMd: CGFloat { get }
-    /// 16-16-24-32 – use for horizontal (left/right) padding of UI elements that scales across breakpoints
-    var inlineSpaceRespLg: CGFloat { get }
-    /// 32-32-48-64 – use for horizontal (left/right) padding of UI elements that scales across breakpoints
-    var inlineSpaceResp2xl: CGFloat { get }
-    /// 24-24-32-40 – use for horizontal (left/right) padding of UI elements that scales across breakpoints
-    var inlineSpaceRespXl: CGFloat { get }
-    /// 8-8-8-8 – Use for fixed horizontal (left/right) padding of UI elements
-    var inlineSpaceConstSm: CGFloat { get }
-    /// 12-12-12-12 – Use for fixed horizontal (left/right) padding of UI elements
-    var inlineSpaceConstMd: CGFloat { get }
-    /// 16-16-16-16 – Use for fixed horizontal (left/right) padding of UI elements
-    var inlineSpaceConstLg: CGFloat { get }
-    /// 32-32-32-32 – Use for fixed horizontal (left/right) padding of UI elements
-    var inlineSpaceConst2xl: CGFloat { get }
-    /// 24-24-24-24 – Use for fixed horizontal (left/right) padding of UI elements
-    var inlineSpaceConstXl: CGFloat { get }
-    /// 6-6-6-6 – Use for fixed horizontal (left/right) padding of UI elements
-    var inlineSpaceConstXs: CGFloat { get }
-    /// 2-2-2-2 – Use for fixed horizontal (left/right) padding of UI elements
-    var inlineSpaceConst3xs: CGFloat { get }
-    /// 4-4-4-4 – Use for fixed horizontal (left/right) padding of UI elements
-    var inlineSpaceConst2xs: CGFloat { get }
-    /// 4-4-6-8 – Use for gaps between items inside of UI elements that scale across breakpoints
-    var gapSpaceRespXs: CGFloat { get }
-    /// 16-16-24-32 – Use for gaps between items inside of UI elements that scale across breakpoints
-    var gapSpaceRespLg: CGFloat { get }
-    /// 24-24-32-48 – Use for gaps between items inside of UI elements that scale across breakpoints
-    var gapSpaceRespXl: CGFloat { get }
-    /// 32-32-48-64 – Use for gaps between items inside of UI elements that scale across breakpoints
-    var gapSpaceResp2xl: CGFloat { get }
-    /// 12-12-16-24 – Use for gaps between items inside of UI elements that scale across breakpoints
-    var gapSpaceRespMd: CGFloat { get }
-    /// 8-8-12-16 – Use for gaps between items inside of UI elements that scale across breakpoints
-    var gapSpaceRespSm: CGFloat { get }
-    /// 2-2-4-6 – Use for gaps between items inside of UI elements that scale across breakpoints
-    var gapSpaceResp2xs: CGFloat { get }
-    /// 48-48-72-96 – Use for gaps between items inside of UI elements that scale across breakpoints
-    var gapSpaceResp3xl: CGFloat { get }
-    /// 2-2-2-2 – Use for fixed gaps between items inside of UI elements
-    var gapSpaceConst2xs: CGFloat { get }
-    /// 4-4-4-4 – Use for fixed gaps between items inside of UI elements
-    var gapSpaceConstXs: CGFloat { get }
-    /// 8-8-8-8 – Use for fixed gaps between items inside of UI elements
-    var gapSpaceConstSm: CGFloat { get }
-    /// 12-12-12-12 – Use for fixed gaps between items inside of UI elements
-    var gapSpaceConstMd: CGFloat { get }
-    /// 16-16-16-16 – Use for fixed gaps between items inside of UI elements
-    var gapSpaceConstLg: CGFloat { get }
-    /// 24-24-24-24 – Use for fixed gaps between items inside of UI elements
-    var gapSpaceConstXl: CGFloat { get }
-    /// 32-32-32-32 – Use for fixed gaps between items inside of UI elements
-    var gapSpaceConst2xl: CGFloat { get }
-    /// 48-48-48-48 – Use for fixed gaps between items inside of UI elements
-    var gapSpaceConst3xl: CGFloat { get }
-    /// 16-16-16-16 – Use for setting fixed height and width of UI elements
-    var sizeConst3xs: CGFloat { get }
-    /// 24-24-24-24 – Use for setting fixed height and width of UI elements
-    var sizeConst2xs: CGFloat { get }
-    /// 32-32-32-32 – Use for setting fixed height and width of UI elements
-    var sizeConstXs: CGFloat { get }
-    /// 40-40-40-40 – Use for setting fixed height and width of UI elements
-    var sizeConstSm: CGFloat { get }
-    /// 48-48-48-48 Use for setting fixed height and width of UI elements
-    var sizeConstMd: CGFloat { get }
-    /// 56-56-56-56 – Use for setting fixed height and width of UI elements
-    var sizeConstLg: CGFloat { get }
-    /// 64-64-64-64 – Use for setting fixed height and width of UI elements
-    var sizeConstXl: CGFloat { get }
-    /// 96-96-96-96 – Use for setting fixed height and width of UI elements
-    var sizeConst3xl: CGFloat { get }
-    /// 148-148-148-148 – Use for setting fixed height and width of UI elements
-    var sizeConst4xl: CGFloat { get }
-    /// 72-72-72-72 – Use for setting fixed height and width of UI elements
-    var sizeConst2xl: CGFloat { get }
-    /// 8-8-8-8 – Use for setting fixed height and width of UI elements
-    var sizeConst4xs: CGFloat { get }
-    /// 16-16-16-24 – Use for setting height and width of UI elements that scale across breakpoints
-    var sizeResp3xs: CGFloat { get }
-    /// 24-24-32-32 – Use for setting height and width of UI elements that scale across breakpoints
-    var sizeResp2xs: CGFloat { get }
-    /// 32-32-40-48 – Use for setting height and width of UI elements that scale across breakpoints
-    var sizeRespXs: CGFloat { get }
-    /// 40-40-48-56 – Use for setting height and width of UI elements that scale across breakpoints
-    var sizeRespSm: CGFloat { get }
-    /// 48-48-64-72 – Use for setting height and width of UI elements that scale across breakpoints
-    var sizeRespMd: CGFloat { get }
-    /// 56-56-72-92 – Use for setting height and width of UI elements that scale across breakpoints
-    var sizeRespLg: CGFloat { get }
-    /// 64-64-80-96 – Use for setting height and width of UI elements that scale across breakpoints
-    var sizeRespXl: CGFloat { get }
-    /// 72-72-92-100 – Use for setting height and width of UI elements that scale across breakpoints
-    var sizeResp2xl: CGFloat { get }
-    /// 96-96-120-148 – Use for setting height and width of UI elements that scale across breakpoints
-    var sizeResp3xl: CGFloat { get }
-    /// 148-148-160-180 – Use for setting height and width of UI elements that scale across breakpoints
-    var sizeResp4xl: CGFloat { get }
-    /// 12-12-14-16 – Use for setting height and width of UI elements that scale across breakpoints
-    var sizeResp4xs: CGFloat { get }
-    var breakpointName: String { get }
-}
-
-/// Compact size class implementation
-public struct BildSizingCompact: BildSizingScheme, DesignSizingScheme {
-    public static let shared = BildSizingCompact()
-    private init() {}
-
-    public let gridSpaceRespLg: CGFloat = 24
-    public let gridSpaceRespXl: CGFloat = 48
-    public let gridSpaceRespBase: CGFloat = 12
-    public let gridSpaceRespSm: CGFloat = 6
-    public let pageInlineSpace: CGFloat = 0
-    public let gridSpaceConstLg: CGFloat = 16
-    public let gridSpaceConstSm: CGFloat = 12
-    public let layoutGuideGridColums: CGFloat = 4
-    public let sectionSpaceBase: CGFloat = 36
-    public let sectionSpaceLg: CGFloat = 72
-    public let paragraphEndSpace: CGFloat = 16
-    public let sectionSpaceSm: CGFloat = 24
-    public let breakpointMinWidthSize: CGFloat = 390
-    public let breakpointMaxWidthSize: CGFloat = 599
-    public let canvasHeightSizeWeb: CGFloat = 844
-    public let contentMaxWidthMedium: CGFloat = 700
-    public let contentMaxWidthFull: CGFloat = 1024
-    public let canvasWidthSizeWeb: CGFloat = 390
-    public let canvasWidthSizeApp: CGFloat = 390
-    public let canvasHeightSizeApp: CGFloat = 844
-    public let title1fontSize: CGFloat = 22
-    public let title2fontSize: CGFloat = 16
-    public let display1fontSize: CGFloat = 40
-    public let display2fontSize: CGFloat = 36
-    public let display3fontSize: CGFloat = 28
-    public let headline1fontSize: CGFloat = 48
-    public let headline2fontSize: CGFloat = 40
-    public let headline3fontSize: CGFloat = 28
-    public let headline4fontSize: CGFloat = 22
-    public let bodyFontSize: CGFloat = 21
-    public let label3fontSize: CGFloat = 12
-    public let label2fontSize: CGFloat = 15
-    public let label1fontSize: CGFloat = 17
-    public let callout1fontSize: CGFloat = 18
-    public let footnote1fontSize: CGFloat = 16
-    public let footnote2fontSize: CGFloat = 12
-    public let kicker1fontSize: CGFloat = 18
-    public let kicker2fontSize: CGFloat = 18
-    public let kicker3fontSize: CGFloat = 16
-    public let kicker4fontSize: CGFloat = 14
-    public let subheadline1fontSize: CGFloat = 24
-    public let quoteFontSize: CGFloat = 16
-    public let bodyFontFamily: String = "Gotham XNarrow"
-    public let calloutFontFamily: String = "Gotham"
-    public let headlineFontFamily: String = "Gotham Condensed"
-    public let footnoteFontFamily: String = "Gotham XNarrow"
-    public let labelFontFamily: String = "Gotham XNarrow"
-    public let kickerFontFamily: String = "Gotham XNarrow"
-    public let subheadlineFontFamily: String = "Gotham Condensed"
-    public let titleFontFamily: String = "Gotham"
-    public let quoteFontFamily: String = "Gotham"
-    public let displayFontFamily: String = "Gotham"
-    public let calloutFontWeight: CGFloat = 800
-    public let labelFontWeightBold: CGFloat = 700
-    public let labelFontWeightBook: CGFloat = 400
-    public let labelFontWeightBoldSt: String = "700"
-    public let labelFontWeightBookSt: String = "400"
-    public let bodyFontWeightBook: CGFloat = 400
-    public let bodyFontWeightBold: CGFloat = 700
-    public let kickerFontWeight: CGFloat = 700
-    public let kickerFontWeightSt: String = "700"
-    public let subheadlineFontWeight: CGFloat = 700
-    public let headline1fontWeight: CGFloat = 700
-    public let headline2fontWeight: CGFloat = 700
-    public let headline3fontWeight: CGFloat = 700
-    public let headline4fontWeight: CGFloat = 600
-    public let headline1fontWeightSt: String = "700"
-    public let headline2fontWeightSt: String = "700"
-    public let headline3fontWeightSt: String = "700"
-    public let headline4fontWeightSt: String = "600"
-    public let titleFontWeight: CGFloat = 800
-    public let displayFontWeight: CGFloat = 800
-    public let displayFontWeightSt: String = "800"
-    public let quoteFontWeight: CGFloat = 800
-    public let footnoteFontWeightBook: CGFloat = 400
-    public let footnoteFontWeightBold: CGFloat = 700
-    public let bodyLineHeight: CGFloat = 28
-    public let kicker4lineHeight: CGFloat = 15.4
-    public let kicker3lineHeight: CGFloat = 17.6
-    public let kicker2lineHeight: CGFloat = 19.8
-    public let kicker1lineHeight: CGFloat = 19.8
-    public let label3lineHeight: CGFloat = 14.4
-    public let label1lineHeight: CGFloat = 17
-    public let label2lineHeight: CGFloat = 16
-    public let display1lineHeight: CGFloat = 40
-    public let display2lineHeight: CGFloat = 36
-    public let display3lineHeight: CGFloat = 28
-    public let title1lineHeight: CGFloat = 22
-    public let title2lineHeight: CGFloat = 17.6
-    public let quoteLineHeight: CGFloat = 16
-    public let footnote1lineHeight: CGFloat = 21
-    public let footnote2lineHeight: CGFloat = 15.6
-    public let headline1lineHeight: CGFloat = 48
-    public let headline2lineHeight: CGFloat = 40
-    public let headline3lineHeight: CGFloat = 28
-    public let headline4lineHeight: CGFloat = 22
-    public let calloutLineHeight: CGFloat = 18
-    public let subheadline1lineHeight: CGFloat = 24
-    public let letterSpacePositiveSm: CGFloat = 0.5
-    public let letterSpacePositiveLg: CGFloat = 2
-    public let letterSpacePositiveMd: CGFloat = 1
-    public let letterSpaceNone: CGFloat = 0
-    public let letterSpaceNegativeSm: CGFloat = -0.5
-    public let letterSpaceNegativeMd: CGFloat = -1
-    public let letterSpaceNegativeLg: CGFloat = -2
-    public let letterSpaceNegativeXs: CGFloat = -0.25
-    public let letterSpacePositiveXs: CGFloat = 0.25
-    public let display1letterSpace: CGFloat = -0.5
-    public let display2letterSpace: CGFloat = -0.5
-    public let display3letterSpace: CGFloat = -0.5
-    public let borderRadiusXs: CGFloat = 2
-    public let borderRadiusMd: CGFloat = 8
-    public let borderRadiusSm: CGFloat = 4
-    public let borderRadiusXl: CGFloat = 24
-    public let borderRadiusLg: CGFloat = 16
-    public let borderRadiusNone: CGFloat = 0
-    public let borderRadiusFull: CGFloat = 9999
-    public let borderWidthThin: CGFloat = 1
-    public let borderWidthThick: CGFloat = 2
-    public let borderWidthHairline: CGFloat = 0.33
-    public let changeOnLg: String = "xs/sm/md"
-    public let changeOnMd: String = "xs/sm"
-    public let bpSpecificWeb: String = "xs/sm"
-    public let bpSpecificApp: String = "compact"
-    public let inlineSpaceRespSm: CGFloat = 8
-    public let inlineSpaceRespMd: CGFloat = 12
-    public let inlineSpaceRespLg: CGFloat = 16
-    public let inlineSpaceResp2xl: CGFloat = 32
-    public let inlineSpaceRespXl: CGFloat = 24
-    public let inlineSpaceConstSm: CGFloat = 8
-    public let inlineSpaceConstMd: CGFloat = 12
-    public let inlineSpaceConstLg: CGFloat = 16
-    public let inlineSpaceConst2xl: CGFloat = 32
-    public let inlineSpaceConstXl: CGFloat = 24
-    public let inlineSpaceConstXs: CGFloat = 6
-    public let inlineSpaceConst3xs: CGFloat = 2
-    public let inlineSpaceConst2xs: CGFloat = 4
-    public let gapSpaceRespXs: CGFloat = 4
-    public let gapSpaceRespLg: CGFloat = 16
-    public let gapSpaceRespXl: CGFloat = 24
-    public let gapSpaceResp2xl: CGFloat = 32
-    public let gapSpaceRespMd: CGFloat = 12
-    public let gapSpaceRespSm: CGFloat = 8
-    public let gapSpaceResp2xs: CGFloat = 2
-    public let gapSpaceResp3xl: CGFloat = 48
-    public let gapSpaceConst2xs: CGFloat = 2
-    public let gapSpaceConstXs: CGFloat = 4
-    public let gapSpaceConstSm: CGFloat = 8
-    public let gapSpaceConstMd: CGFloat = 12
-    public let gapSpaceConstLg: CGFloat = 16
-    public let gapSpaceConstXl: CGFloat = 24
-    public let gapSpaceConst2xl: CGFloat = 32
-    public let gapSpaceConst3xl: CGFloat = 48
-    public let sizeConst3xs: CGFloat = 16
-    public let sizeConst2xs: CGFloat = 24
-    public let sizeConstXs: CGFloat = 32
-    public let sizeConstSm: CGFloat = 40
-    public let sizeConstMd: CGFloat = 48
-    public let sizeConstLg: CGFloat = 56
-    public let sizeConstXl: CGFloat = 64
-    public let sizeConst3xl: CGFloat = 96
-    public let sizeConst4xl: CGFloat = 148
-    public let sizeConst2xl: CGFloat = 72
-    public let sizeConst4xs: CGFloat = 8
-    public let sizeResp3xs: CGFloat = 16
-    public let sizeResp2xs: CGFloat = 24
-    public let sizeRespXs: CGFloat = 32
-    public let sizeRespSm: CGFloat = 40
-    public let sizeRespMd: CGFloat = 48
-    public let sizeRespLg: CGFloat = 56
-    public let sizeRespXl: CGFloat = 64
-    public let sizeResp2xl: CGFloat = 72
-    public let sizeResp3xl: CGFloat = 96
-    public let sizeResp4xl: CGFloat = 148
-    public let sizeResp4xs: CGFloat = 12
-    public let breakpointName: String = "sm"
-}