@navinc/base-react-components
Version:
Nav's Pattern Library
168 lines • 9.36 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.greenSheen400 = exports.greenSheen300 = exports.greenSheen200 = exports.greenSheen100 = exports.wildPurple500 = exports.wildPurple400 = exports.wildPurple300 = exports.wildPurple200 = exports.wildPurple100 = exports.lavender500 = exports.lavender400 = exports.lavender300 = exports.lavender200 = exports.lavender100 = exports.rose500 = exports.rose400 = exports.rose300 = exports.rose200 = exports.rose100 = exports.dustStorm500 = exports.dustStorm400 = exports.dustStorm300 = exports.dustStorm200 = exports.dustStorm100 = exports.paleGold500 = exports.paleGold400 = exports.paleGold300 = exports.paleGold200 = exports.paleGold100 = exports.mermaidGreen500 = exports.mermaidGreen400 = exports.mermaidGreen300 = exports.mermaidGreen200 = exports.mermaidGreen100 = exports.neutral500 = exports.neutral400 = exports.neutral300 = exports.neutral200 = exports.neutral100 = exports.scuttleGray600 = exports.scuttleGray500 = exports.scuttleGray400 = exports.scuttleGray300 = exports.scuttleGray200 = exports.scuttleGray100 = exports.white = exports.belugaWhite = exports.oceanBoat = exports.azure = exports.navBlue = void 0;
exports.tumbleweed100 = exports.tumbleweed = exports.lightRed = exports.copperRed200 = exports.copperRed100 = exports.seaturtleGreen200 = exports.seaturtleGreen100 = exports.flounderYellow200 = exports.flounderYellow100 = exports.sebastianRed200 = exports.sebastianRed100 = exports.transparentRed = exports.transparentBlack = exports.transparentWhite = exports.lightBlue500 = exports.lightBlue400 = exports.lightBlue300 = exports.lightBlue200 = exports.lightBlue100 = exports.pastelBlue500 = exports.pastelBlue400 = exports.pastelBlue300 = exports.pastelBlue200 = exports.pastelBlue100 = exports.bubbleBlue500 = exports.bubbleBlue400 = exports.bubbleBlue300 = exports.bubbleBlue200 = exports.bubbleBlue100 = exports.gainsboro500 = exports.gainsboro400 = exports.gainsboro300 = exports.gainsboro200 = exports.gainsboro100 = exports.timberwolf500 = exports.timberwolf400 = exports.timberwolf300 = exports.timberwolf200 = exports.timberwolf100 = exports.tan500 = exports.tan400 = exports.tan300 = exports.tan200 = exports.tan100 = exports.mossGreen500 = exports.mossGreen400 = exports.mossGreen300 = exports.mossGreen200 = exports.mossGreen100 = exports.greenSheen500 = void 0;
exports.materialTransitionTiming = exports.forLargerThanPhone = exports.media = exports.goldenRatio = exports.contentWidth = exports.gu = exports.border = exports.pagebg = exports.notice = exports.warning = exports.error = exports.success = exports.colorRainbow = exports.statusColors = exports.poor = exports.semipoor = exports.fair = exports.semigood = exports.good = exports.oceanGreen200 = exports.oceanGreen100 = exports.seaFoam = exports.seaFoam100 = exports.tuscan200 = exports.tuscan100 = void 0;
// Primary Colors:
exports.navBlue = '#006EFA';
exports.azure = exports.navBlue;
exports.oceanBoat = '#0075BC';
exports.belugaWhite = '#FFFFFF';
exports.white = exports.belugaWhite;
// New Gray Shades:
exports.scuttleGray100 = '#F5F6F7';
exports.scuttleGray200 = '#ECEDEF';
exports.scuttleGray300 = '#D0D2D6';
exports.scuttleGray400 = '#919499';
exports.scuttleGray500 = '#70727B';
exports.scuttleGray600 = '#06142A';
// Neutral Grays:
exports.neutral100 = exports.scuttleGray100;
exports.neutral200 = exports.scuttleGray200;
exports.neutral300 = exports.scuttleGray300;
exports.neutral400 = exports.scuttleGray500;
exports.neutral500 = exports.scuttleGray600;
// General Palette for Other Colors
exports.mermaidGreen100 = '#E5FBF8';
exports.mermaidGreen200 = '#CBF7F1';
exports.mermaidGreen300 = '#A9F2E7';
exports.mermaidGreen400 = '#87EDDE';
exports.mermaidGreen500 = '#53E5D0';
// Secondary Colors - TODO Deprecate
exports.paleGold100 = exports.mermaidGreen100;
exports.paleGold200 = exports.mermaidGreen200;
exports.paleGold300 = exports.mermaidGreen300;
exports.paleGold400 = exports.mermaidGreen400;
exports.paleGold500 = exports.mermaidGreen500;
exports.dustStorm100 = exports.mermaidGreen100;
exports.dustStorm200 = exports.mermaidGreen200;
exports.dustStorm300 = exports.mermaidGreen300;
exports.dustStorm400 = exports.mermaidGreen400;
exports.dustStorm500 = exports.mermaidGreen500;
exports.rose100 = exports.mermaidGreen100;
exports.rose200 = exports.mermaidGreen200;
exports.rose300 = exports.mermaidGreen300;
exports.rose400 = exports.mermaidGreen400;
exports.rose500 = exports.mermaidGreen500;
exports.lavender100 = exports.mermaidGreen100;
exports.lavender200 = exports.mermaidGreen200;
exports.lavender300 = exports.mermaidGreen300;
exports.lavender400 = exports.mermaidGreen400;
exports.lavender500 = exports.mermaidGreen500;
exports.wildPurple100 = exports.mermaidGreen100;
exports.wildPurple200 = exports.mermaidGreen200;
exports.wildPurple300 = exports.mermaidGreen300;
exports.wildPurple400 = exports.mermaidGreen400;
exports.wildPurple500 = exports.mermaidGreen500;
exports.greenSheen100 = exports.mermaidGreen100;
exports.greenSheen200 = exports.mermaidGreen200;
exports.greenSheen300 = exports.mermaidGreen300;
exports.greenSheen400 = exports.mermaidGreen400;
exports.greenSheen500 = exports.mermaidGreen500;
exports.mossGreen100 = exports.mermaidGreen100;
exports.mossGreen200 = exports.mermaidGreen200;
exports.mossGreen300 = exports.mermaidGreen300;
exports.mossGreen400 = exports.mermaidGreen400;
exports.mossGreen500 = exports.mermaidGreen500;
exports.tan100 = exports.mermaidGreen100;
exports.tan200 = exports.mermaidGreen200;
exports.tan300 = exports.mermaidGreen300;
exports.tan400 = exports.mermaidGreen400;
exports.tan500 = exports.mermaidGreen500;
exports.timberwolf100 = exports.mermaidGreen100;
exports.timberwolf200 = exports.mermaidGreen200;
exports.timberwolf300 = exports.mermaidGreen300;
exports.timberwolf400 = exports.mermaidGreen400;
exports.timberwolf500 = exports.mermaidGreen500;
exports.gainsboro100 = exports.mermaidGreen100;
exports.gainsboro200 = exports.mermaidGreen200;
exports.gainsboro300 = exports.mermaidGreen300;
exports.gainsboro400 = exports.mermaidGreen400;
exports.gainsboro500 = exports.mermaidGreen500;
// Secondary Blue Shades
exports.bubbleBlue100 = '#F2F8FF';
exports.bubbleBlue200 = '#E6F1FF';
exports.bubbleBlue300 = '#99C5FD';
exports.bubbleBlue400 = '#66A8FC';
exports.bubbleBlue500 = '#006AF0';
exports.pastelBlue100 = exports.bubbleBlue100;
exports.pastelBlue200 = exports.bubbleBlue200;
exports.pastelBlue300 = exports.bubbleBlue300;
exports.pastelBlue400 = exports.bubbleBlue400;
exports.pastelBlue500 = exports.bubbleBlue500;
exports.lightBlue100 = exports.bubbleBlue100;
exports.lightBlue200 = exports.bubbleBlue200;
exports.lightBlue300 = exports.bubbleBlue300;
exports.lightBlue400 = exports.bubbleBlue400;
exports.lightBlue500 = exports.bubbleBlue500;
// Transparent Colors: (For animations)
exports.transparentWhite = 'rgba(255, 255, 255, 0)';
exports.transparentBlack = 'rgba(0, 0, 0, 0)';
exports.transparentRed = 'rgba(225, 3, 10, 0.25)';
// Status Colors - V2
exports.sebastianRed100 = '#FFF2F8';
exports.sebastianRed200 = '#E1030A';
exports.flounderYellow100 = '#FFF6EC';
exports.flounderYellow200 = '#FFC90C';
exports.seaturtleGreen100 = '#E8FFF5';
exports.seaturtleGreen200 = '#36B37E';
// Status Colors:
exports.copperRed100 = exports.sebastianRed100;
exports.copperRed200 = exports.sebastianRed200;
exports.lightRed = '#E87979'; // TODO need to remove
exports.tumbleweed = '#EFA88C'; // TODO need to remove
exports.tumbleweed100 = '#F8D9CD'; // TODO need to remove
exports.tuscan100 = exports.flounderYellow100;
exports.tuscan200 = exports.flounderYellow200;
exports.seaFoam100 = '#D0F0E1'; // TODO need to remove
exports.seaFoam = '#96DDBC'; // TODO need to remove
exports.oceanGreen100 = exports.seaturtleGreen100;
exports.oceanGreen200 = exports.seaturtleGreen200;
// By Use Case:
exports.good = exports.seaturtleGreen200;
exports.semigood = exports.seaFoam;
exports.fair = exports.flounderYellow200;
exports.semipoor = exports.tumbleweed;
exports.poor = exports.sebastianRed200;
exports.statusColors = {
good: {
backgroundColor: exports.seaturtleGreen100,
color: exports.good,
},
semigood: {
backgroundColor: exports.seaFoam100,
color: exports.semigood,
},
fair: {
backgroundColor: exports.flounderYellow100,
color: exports.fair,
},
semipoor: {
backgroundColor: exports.tumbleweed100,
color: exports.semipoor,
},
poor: {
backgroundColor: exports.sebastianRed100,
color: exports.poor,
},
};
exports.colorRainbow = [exports.pastelBlue400, exports.mermaidGreen300, exports.seaFoam100, exports.flounderYellow200, exports.tumbleweed, exports.neutral300];
exports.success = exports.oceanGreen200;
exports.error = exports.copperRed200;
exports.warning = exports.copperRed200;
exports.notice = exports.azure;
exports.pagebg = exports.neutral100;
exports.border = exports.neutral300;
// Grid related things
const gu = (units = 0) => `${units * 8}px`;
exports.gu = gu;
exports.contentWidth = 696;
exports.goldenRatio = (1 + Math.sqrt(5)) / 2;
// Media Queries
exports.media = {
small: '600px',
large: '1440px',
};
exports.forLargerThanPhone = 'min-width: 600px';
exports.materialTransitionTiming = 'cubic-bezier(0.4, 0.0, 0.2, 1)';
//# sourceMappingURL=theme.js.map