@atlassian/aui/lib/css/imports/mixins/typography.css.map

Atlassian User Interface Framework

{"version":3,"names":[],"mappings":"","sources":["imports/mixins/typography.less"],"sourcesContent":["@import '../aui-theme/core/colors';\n@import '../aui-theme/core/text';\n\n// Why are we defining our own mixins when some already exist in Atlaskit? A few reasons:\n//\n// 1) Atlaskit's use the pure ADG3 proportions, which have different line heights and letter-spacing than we are taking on right now.\n// 2) Atlaskit's include margin info, which we don't want.\n//\n// Even if they were exactly the same, we'd probably create our mixins by extending theirs in this file.\n// The adapter pattern is generally useful in shielding us from external change by reducing its scope of impact to a single place.\n\n#aui {\n    .typography {\n        // First-level heading (h1) equivalent\n        .h800() {\n            @size: @aui-font-size-xxxlarge;\n            font-size: @size;\n            font-weight: @aui-font-weight-semibold;\n            line-height: unit(40 / @size);\n            letter-spacing: -0.01em;\n            text-transform: none;\n        }\n        // Second-level heading (h2) equivalent\n        .h700() {\n            @size: @aui-font-size-xxlarge;\n            font-size: @size;\n            font-weight: @aui-font-weight-medium;\n            line-height: unit(30 / @size);\n            letter-spacing: -0.01em;\n            text-transform: none;\n        }\n        // Third-level heading (h3) equivalent\n        .h600() {\n            @size: @aui-font-size-xlarge;\n            font-size: @size;\n            font-weight: @aui-font-weight-medium;\n            line-height: unit(30 / @size);\n            letter-spacing: -0.008em;\n            text-transform: none;\n        }\n        // Fourth-level heading (h4) equivalent\n        .h500() {\n            @size: @aui-font-size-large;\n            font-size: @size;\n            font-weight: @aui-font-weight-medium;\n            line-height: unit(20 / @size);\n            letter-spacing: -0.006em;\n            text-transform: none;\n        }\n        // Fifth-level heading (h5) equivalent\n        .h400() {\n            @size: @aui-font-size-medium;\n            font-size: @size;\n            font-weight: @aui-font-weight-semibold;\n            line-height: unit(20 / @size);\n            letter-spacing: -0.003em;\n            text-transform: none;\n        }\n        // Sixth-level heading (h6) equivalent\n        .h300() {\n            @size: @aui-font-size-small;\n            font-size: @size;\n            font-weight: @aui-font-weight-semibold;\n            line-height: unit(20 / @size);\n            letter-spacing: 0;\n            text-transform: none;\n        }\n        .h200(@color: @ak-color-N200) {\n            @size: @aui-font-size-small;\n            color: @color;\n            font-size: @size;\n            font-weight: @aui-font-weight-semibold;\n            line-height: unit(20 / @size);\n            letter-spacing: 0;\n            text-transform: none;\n        }\n        .h100(@color: @ak-color-N200) {\n            @size: @aui-font-size-xsmall;\n            color: @color;\n            font-size: @size;\n            font-weight: @aui-font-weight-semibold;\n            line-height: unit(16 / @size);\n            letter-spacing: 0;\n            text-transform: uppercase;\n        }\n    }\n}\n"],"file":"typography.css"}