@atlassian/aui/lib/css/adg-help.css.map

Atlassian User Interface Framework

{"version":3,"sources":["adg-help.less","imports/mixins/typography.less"],"names":[],"mappings":"AAeI,SAAC;AACD,SAAC;EACG,kBAAA;EACA,gBAAA;EACA,UAAA;EACA,YAAA;;AANR,SASI;EACI,8BAAA;EACA,eAAA;EACA,gBAAA;EACA,kBAAA;;AAbR,SASI,kBAMI;AAfR,SASI,kBAOI;AAhBR,SASI,kBAQI;AAjBR,SASI,kBASI;AAlBR,SASI,kBAUI;AAnBR,SASI,kBAWI;EC4CI,cAAA;EACA,eAAA;EACA,gBAAA;EACA,uBAAA;EACA,iBAAA;EACA,yBAAA;;ADrEZ,SAyBI,uBAAuB;EACnB,iBAAA;EACA,kBAAA;;AA3BR,SA8BI;EACI,WAAA;;AA/BR,SAkCI,kBAAkB;EACd,iBAAA;;AAIJ,iBAAiB,SACb;AADgB,kBAAkB,SAClC;EACI,yBAAA;;AAFR,iBAAiB,SACb,4BAGI,GAAE;AAJU,kBAAkB,SAClC,4BAGI,GAAE;ECqBF,cAAA;EACA,eAAA;EACA,gBAAA;EACA,uBAAA;EACA,iBAAA;EACA,yBAAA;;ADrBJ,iBATa,SASZ;AAAD,kBATkC,SASjC;EACG,4BAAA;;AAIA,iBAdS,SAaZ,uBACI;AAAD,kBAd8B,SAajC,uBACI;EACG,gBAAA;;AAKA,iBApBK,SAaZ,uBAMI,mCACI;AAAD,kBApB0B,SAajC,uBAMI,mCACI;EACG,eAAA;;AAOR,iBA5BS,SA2BZ,0BACI;AAAD,kBA5B8B,SA2BjC,0BACI;EACG,eAAA;;AAKA,iBAlCK,SA2BZ,0BAMI,sCACI;AAAD,kBAlC0B,SA2BjC,0BAMI,sCACI;EACG,gBAAA;;AAOR,iBA1CS,SAyCZ,wBACI;AAAD,kBA1C8B,SAyCjC,wBACI;EACG,iBAAA;;AAKA,iBAhDK,SAyCZ,wBAMI,oCACI;AAAD,kBAhD0B,SAyCjC,wBAMI,oCACI;EACG,gBAAA;;AAOR,iBAxDS,SAuDZ,yBACI;AAAD,kBAxD8B,SAuDjC,yBACI;EACG,gBAAA;;AAKA,iBA9DK,SAuDZ,yBAMI,qCACI;AAAD,kBA9D0B,SAuDjC,yBAMI,qCACI;EACG,iBAAA;;AAQZ,SADJ,yBAAwB,cACnB;AACD,SAFJ,yBAAwB,cAEnB;EACG,iCAAA;;AAEJ,SALJ,yBAAwB,cAKnB;EACG,4BAAA;EACA,QAAA;;AAGJ,SAVJ,yBAAwB,cAUnB,iBAAiB;EACd,yBAAA;EACA,SAAA;;AAGJ,SAfJ,yBAAwB,cAenB,eAAe;EACZ,iCAAA;;AAGJ,SAnBJ,yBAAwB,cAmBnB,eAAe;EACZ,2BAAA;EACA,WAAA","sourcesContent":["@import 'imports/global';\n\n// Help block\n@aui-help-header-color: @ak-color-N200;\n@aui-help-border-color: @ak-color-P400;\n@aui-help-illustration-width: 128px;\n@aui-help-content-padding-left: 20px;\n\n// Inline Dialog Theme\n@aui-inline-dialog-help-border-color: @aui-help-border-color;\n@aui-inline-dialog-help-headline-color: @ak-color-N100;\n@aui-inline-dialog-help-border-width: 2px;\n@aui-inline-dialog2-help-arrow-margin-offset: 1px;\n\n.aui-help {\n    &.aui-help-text,\n    &.aui-help-empty-state {\n        margin: 10px 0 0 0;\n        overflow: hidden;\n        padding: 0;\n        width: 720px;\n    }\n\n    .aui-help-content {\n        border-left: 4px solid @aui-help-border-color;\n        font-size: @aui-font-size-large;\n        line-height: 1.5;\n        padding-left: @aui-help-content-padding-left;\n\n        > h1,\n        > h2,\n        > h3,\n        > h4,\n        > h5,\n        > h6 {\n            #aui.typography.h100(@aui-help-header-color);\n        }\n    }\n\n    .aui-help-illustration + .aui-help-content {\n        border-left: none;\n        margin-left: @aui-help-illustration-width;\n    }\n\n    .aui-help-illustration {\n        float: left;\n    }\n\n    .aui-help-content > p {\n        margin: 5px 0 0 0;\n    }\n\n    // Inline Dialog2 help\n    aui-inline-dialog&, .aui-inline-dialog& {\n        .aui-inline-dialog-contents {\n            border: @aui-inline-dialog-help-border-width solid @aui-inline-dialog-help-border-color;\n\n            h2:first-child {\n                #aui.typography.h100(@aui-inline-dialog-help-headline-color);\n            }\n        }\n\n        &::before {\n            border-bottom-color: @aui-inline-dialog-help-border-color;\n        }\n\n        &.aui-alignment-side-top {\n            &::after {\n                margin-top: -@aui-inline-dialog2-help-arrow-margin-offset;\n            }\n\n            // The flipped case\n            &.aui-alignment-element-attached-top {\n                &::after {\n                    margin-top: @aui-inline-dialog2-help-arrow-margin-offset;\n                }\n            }\n        }\n\n        // 'bottom _' alignment\n        &.aui-alignment-side-bottom {\n            &::after {\n                margin-top: @aui-inline-dialog2-help-arrow-margin-offset;\n            }\n\n            // The flipped case\n            &.aui-alignment-element-attached-bottom {\n                &::after {\n                    margin-top: -@aui-inline-dialog2-help-arrow-margin-offset;\n                }\n            }\n        }\n\n        // 'left _' alignment\n        &.aui-alignment-side-left {\n            &::after {\n                margin-left: -@aui-inline-dialog2-help-arrow-margin-offset;\n            }\n\n            // The flipped case\n            &.aui-alignment-element-attached-left {\n                &::after {\n                    margin-left: @aui-inline-dialog2-help-arrow-margin-offset;\n                }\n            }\n        }\n\n        // 'right _' alignment\n        &.aui-alignment-side-right {\n            &::after {\n                margin-left: @aui-inline-dialog2-help-arrow-margin-offset;\n            }\n\n            // The flipped case\n            &.aui-alignment-element-attached-right {\n                &::after {\n                    margin-left: -@aui-inline-dialog2-help-arrow-margin-offset;\n                }\n            }\n        }\n    }\n\n    // Inline dialog help\n    .aui-inline-dialog-arrow.aui-css-arrow {\n        &::after,\n        &::before {\n            border-color: @aui-inline-dialog-help-border-color transparent;\n        }\n        &::after {\n            border-bottom-color: @aui-inline-dialog-bg-color;\n            top: @aui-inline-dialog-help-border-width;\n        }\n\n        &.aui-bottom-arrow::after {\n            border-top-color: @aui-inline-dialog-bg-color;\n            top: -@aui-inline-dialog-help-border-width;\n        }\n\n        &.aui-left-arrow::before {\n            border-color: transparent @aui-inline-dialog-help-border-color;\n        }\n\n        &.aui-left-arrow::after {\n            border-right-color: @aui-inline-dialog-bg-color;\n            right: -@aui-inline-dialog-help-border-width;\n        }\n    }\n}\n","@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":"adg-help.css"}