kata-team/kata-team.github.io

// Breakpoints
// ========================================================================

// Phone Portrait:   Galaxy (360x640), iPhone 6 (375x667), iPhone 6+ (414x736)
// Phone Landscape:  Galaxy (640x360), iPhone 6 (667x375), iPhone 6+ (736x414)
// Tablet Portrait:  iPad (768x1024), Galaxy Tab (800x1280),
// Tablet Landscape: iPad (1024x768), iPad Pro (1024x1366),
// Desktop:          Galaxy Tab (1280x800), iPad Pro (1366x1024)

@breakpoint-small:         640px;  // Phone landscape
@breakpoint-medium:        960px;  // Tablet Landscape
@breakpoint-large:         1200px; // Desktop
@breakpoint-xlarge:        1600px; // Large Screens

@breakpoint-xsmall-max:    (@breakpoint-small - 1);
@breakpoint-small-max:     (@breakpoint-medium - 1);
@breakpoint-medium-max:    (@breakpoint-large - 1);
@breakpoint-large-max:     (@breakpoint-xlarge - 1);

//
// 
//

@image-folder:           "../images";
@image-folder--patterns: "@{image-folder}/patterns";
@image-folder--projects: "@{image-folder}/projects";

@background-color:        white;
@border-color:            darken(@background-color,10%);
@border-color-dark:       darken(@border-color,20%);
@shadow-color:            darken(@background-color,8%);

//
// Typography
//

@global-font-family:      Lato, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
@global-font-size:        15px;
@global-line-height:      1.5;      // 24px

//
// Colors
//

@global-color:                   #666;
@global-emphasis-color:          #333;
@global-muted-color:             #999;

@global-link-color:              #1e87f0;
@global-link-hover-color:        #0f6ecd;

@global-inverse-color:           #fff;

//
// Backgrounds
//

@global-background:              #fff;

@global-muted-background:        #f8f8f8;
@global-primary-background:      #1e87f0;
@global-secondary-background:    #222;

@global-success-background:      #32d296;
@global-warning-background:      #faa05a;
@global-danger-background:       #f0506e;