UNPKG

pbstyles

Version:

Basic styles for quick prototyping

318 lines (316 loc) 9.53 kB
/** * Do not edit directly, this file was auto-generated. */ :root { --amination-transition-transition-property: all; --amination-transition-transition-timing-function: ease-in-out; --amination-transition-transition-duration: 150ms; --color-basic-main: #000000; --color-basic-light: #78909c; --color-basic-lighter: #f5f5f5; --color-basic-lightest: #fafafa; --color-primary-darker: #2962ff; --color-primary-main: #2979ff; --color-primary-light: #bbdefb; --color-primary-lighter: #e3f2fd; --color-secondary-darker: #263238; --color-secondary-main: #37474f; --color-secondary-light: #cfd8dc; --color-secondary-lighter: #eceff1; --color-success-darker: #4caf50; --color-success-main: #00c853; --color-success-light: #c8e6c9; --color-success-lighter: #e8f5e9; --color-danger-darker: #d50000; --color-danger-main: #ff5252; --color-danger-light: #ffcdd2; --color-danger-lighter: #ffebee; --color-outline-primary: rgba(41, 121, 255, 0.2); --color-outline-secondary: rgba(55, 71, 79, 0.2); --color-outline-success: rgba(0, 200, 83, 0.2); --color-outline-danger: rgba(255, 23, 68, 0.2); --color-black: #000000; --color-white: #ffffff; --color-transparent: transparent; --color-gray-50: #fafafa; --color-gray-100: #f5f5f5; --color-gray-200: #eeeeee; --color-gray-300: #e0e0e0; --color-gray-400: #bdbdbd; --color-gray-500: #9e9e9e; --color-gray-600: #757575; --color-gray-700: #616161; --color-gray-800: #424242; --color-gray-900: #212121; --color-gray-blue-50: #eceff1; --color-gray-blue-100: #cfd8dc; --color-gray-blue-200: #b0bec5; --color-gray-blue-300: #90a4ae; --color-gray-blue-400: #78909c; --color-gray-blue-500: #607d8b; --color-gray-blue-600: #546e7a; --color-gray-blue-700: #455a64; --color-gray-blue-800: #37474f; --color-gray-blue-900: #263238; --color-blue-50: #e3f2fd; --color-blue-100: #bbdefb; --color-blue-200: #90caf9; --color-blue-300: #64b5f6; --color-blue-400: #42a5f5; --color-blue-500: #2196f3; --color-blue-600: #1e88e5; --color-blue-700: #1976d2; --color-blue-800: #1565c0; --color-blue-900: #0d47a1; --color-blue-accent-100: #82b1ff; --color-blue-accent-200: #448aff; --color-blue-accent-300: #2979ff; --color-blue-accent-400: #2962ff; --color-green-50: #e8f5e9; --color-green-100: #c8e6c9; --color-green-200: #a5d6a7; --color-green-300: #81c784; --color-green-400: #66bb6a; --color-green-500: #4caf50; --color-green-600: #43a047; --color-green-700: #388e3c; --color-green-800: #2e7d32; --color-green-900: #1b5e20; --color-green-accent-100: #b9f6ca; --color-green-accent-200: #69f0ae; --color-green-accent-300: #00e676; --color-green-accent-400: #00c853; --color-red-50: #ffebee; --color-red-100: #ffcdd2; --color-red-200: #ef9a9a; --color-red-300: #e57373; --color-red-400: #ef5350; --color-red-500: #f44336; --color-red-600: #e53935; --color-red-700: #d32f2f; --color-red-800: #c62828; --color-red-900: #b71c1c; --color-red-accent-100: #ff8a80; --color-red-accent-200: #ff5252; --color-red-accent-300: #ff1744; --color-red-accent-400: #d50000; --color-pink-50: #fce4ec; --color-pink-100: #f8bbd0; --color-pink-200: #f48fb1; --color-pink-300: #f06292; --color-pink-400: #ec407a; --color-pink-500: #e91e63; --color-pink-600: #d81b60; --color-pink-700: #c2185b; --color-pink-800: #ad1457; --color-pink-900: #880e4f; --color-pink-accent-100: #ff80ab; --color-pink-accent-200: #ff4081; --color-pink-accent-300: #f50057; --color-pink-accent-400: #c51162; --color-yellow-50: #fffde7; --color-yellow-100: #fff9c4; --color-yellow-200: #fff59d; --color-yellow-300: #fff176; --color-yellow-400: #ffee58; --color-yellow-500: #ffeb3b; --color-yellow-600: #fdd835; --color-yellow-700: #fbc02d; --color-yellow-800: #f9a825; --color-yellow-900: #f57f17; --color-yellow-accent-100: #ffff8d; --color-yellow-accent-200: #ffff00; --color-yellow-accent-300: #ffea00; --color-yellow-accent-400: #ffd600; --color-orange-50: #fff3e0; --color-orange-100: #ffe0b2; --color-orange-200: #ffcc80; --color-orange-300: #ffb74d; --color-orange-400: #ffa726; --color-orange-500: #ff9800; --color-orange-600: #fb8c00; --color-orange-700: #f57c00; --color-orange-800: #ef6c00; --color-orange-900: #e65100; --color-orange-accent-100: #ffd180; --color-orange-accent-200: #ffab40; --color-orange-accent-300: #ff9100; --color-orange-accent-400: #ff6d00; --column-5: 5; --column-6: 6; --column-8: 8; --container-736: 736px; --container-1152: 1152px; --container-full: 100%; --container-aside: 184px; --font-family-sans: Inter, sans-serif; --font-decoration-none: none; --font-decoration-underline: underline; --font-decoration-strike: line-through; --font-weight-regular: 400; --font-weight-medium: 600; --font-weight-bold: 700; --font-size-12: 12px; --font-size-14: 14px; --font-size-16: 16px; --font-size-20: 20px; --font-size-24: 24px; --font-size-32: 32px; --font-size-48: 48px; --font-size-64: 64px; --font-leading-none: 1; --font-leading-tight: 1.25; --font-leading-normal: 1.5; --font-h64-font-size: 64px; --font-h64-line-height: 1.25; --font-h64-font-weight: 700; --font-h48-font-size: 48px; --font-h48-line-height: 1.25; --font-h48-font-weight: 700; --font-h32-font-size: 32px; --font-h32-line-height: 1.25; --font-h32-font-weight: 700; --font-h24-font-size: 24px; --font-h24-line-height: 1.25; --font-h24-font-weight: 700; --font-h16-font-size: 16px; --font-h16-line-height: 1.25; --font-h16-font-weight: 700; --font-h20-font-size: 20px; --font-h20-line-height: 1.25; --font-h20-font-weight: 700; --font-t32-font-size: 32px; --font-t32-line-height: 1.5; --font-t32-font-weight: 400; --font-t24-font-size: 24px; --font-t24-line-height: 1.5; --font-t24-font-weight: 400; --font-t20-font-size: 20px; --font-t20-line-height: 1.5; --font-t20-font-weight: 400; --font-t16-font-size: 16px; --font-t16-line-height: 1.5; --font-t16-font-weight: 400; --font-t14-font-size: 14px; --font-t14-line-height: 1.5; --font-t14-font-weight: 400; --font-t12-font-size: 12px; --font-t12-line-height: 1.5; --font-t12-font-weight: 400; --font-tm32-font-size: 32px; --font-tm32-line-height: 1.5; --font-tm32-font-weight: 600; --font-tm24-font-size: 24px; --font-tm24-line-height: 1.5; --font-tm24-font-weight: 600; --font-tm20-font-size: 20px; --font-tm20-line-height: 1.5; --font-tm20-font-weight: 600; --font-tm16-font-size: 16px; --font-tm16-line-height: 1.5; --font-tm16-font-weight: 600; --font-tm14-font-size: 14px; --font-tm14-line-height: 1.5; --font-tm14-font-weight: 600; --font-tm12-font-size: 12px; --font-tm12-line-height: 1.5; --font-tm12-font-weight: 600; --opacity-0: 0; --opacity-5: 0.05; --opacity-10: 0.1; --opacity-15: 0.15; --opacity-20: 0.2; --opacity-25: 0.25; --opacity-30: 0.3; --opacity-35: 0.35; --opacity-40: 0.4; --opacity-45: 0.45; --opacity-50: 0.5; --opacity-55: 0.55; --opacity-60: 0.6; --opacity-65: 0.65; --opacity-70: 0.7; --opacity-75: 0.75; --opacity-80: 0.8; --opacity-85: 0.85; --opacity-90: 0.9; --opacity-95: 0.95; --opacity-100: 1; --rounded-0: 0px; --rounded-4: 4px; --rounded-6: 6px; --rounded-8: 8px; --rounded-12: 12px; --rounded-16: 16px; --rounded-24: 24px; --rounded-32: 32px; --rounded-999: 999px; --screen-desktop-min: 769px; --screen-mobile-max: 768px; --screen-xl-min: 1441px; --screen-lg-max: 1440px; --screen-lg-min: 921px; --screen-md-max: 920px; --screen-md-min: 769px; --screen-sm-max: 768px; --screen-sm-min: 481px; --screen-xs-max: 480px; --shadow-xs: 0px 2px 4px -2px rgba(24, 39, 75, 0.12), 0px 4px 4px -2px rgba(24, 39, 75, 0.08); --shadow-sm: 0px 4px 6px -4px rgba(24, 39, 75, 0.12), 0px 8px 8px -4px rgba(24, 39, 75, 0.08); --shadow-md: 0px 6px 8px -6px rgba(24, 39, 75, 0.12), 0px 8px 16px -6px rgba(24, 39, 75, 0.08); --shadow-lg: 0px 6px 12px -6px rgba(24, 39, 75, 0.12), 0px 8px 24px -4px rgba(24, 39, 75, 0.08); --shadow-xl: 0px 6px 14px -6px rgba(24, 39, 75, 0.12), 0px 10px 32px -4px rgba(24, 39, 75, 0.1); --shadow-xxl: 0px 8px 18px -6px rgba(24, 39, 75, 0.12), 0px 12px 42px -4px rgba(24, 39, 75, 0.12); --shadow-xxxl: 0px 8px 22px -6px rgba(24, 39, 75, 0.12), 0px 14px 64px -4px rgba(24, 39, 75, 0.12); --shadow-xxxxl: 0px 8px 28px -6px rgba(24, 39, 75, 0.12), 0px 18px 88px -4px rgba(24, 39, 75, 0.14); --size-0: 0px; --size-1: 1px; --size-2: 2px; --size-4: 4px; --size-6: 6px; --size-8: 8px; --size-10: 10px; --size-12: 12px; --size-14: 14px; --size-16: 16px; --size-18: 18px; --size-20: 20px; --size-22: 22px; --size-24: 24px; --size-26: 26px; --size-28: 28px; --size-30: 30px; --size-32: 32px; --size-36: 36px; --size-40: 40px; --size-48: 48px; --size-56: 56px; --size-64: 64px; --size-72: 72px; --size-80: 80px; --size-88: 88px; --size-96: 96px; --size-104: 104px; --size-112: 112px; --size-120: 120px; --size-128: 128px; --size-136: 136px; --size-144: 144px; --size-152: 152px; --size-160: 160px; --size-180: 180px; --size-200: 200px; --size-220: 220px; --size-240: 240px; --size-260: 260px; --size-280: 280px; --size-300: 300px; --size-320: 320px; --size-360: 360px; --size-400: 400px; --stroke-0: 0px; --stroke-1: 1px; --stroke-2: 2px; --stroke-4: 4px; }