2020-02-11 20:47:29 +08:00
|
|
|
/**
|
|
|
|
* Author: Sivan [sun.sivan@gmail.com]
|
|
|
|
* Description: define variables, alias etc.
|
|
|
|
*/
|
|
|
|
|
|
|
|
// 定义赫蹏根 class 名
|
|
|
|
$root-selector: '.heti' !default;
|
|
|
|
|
2020-02-11 21:01:13 +08:00
|
|
|
/* 字体 Fonts */
|
|
|
|
// 字体栈 Font Stacks
|
2020-02-11 20:47:29 +08:00
|
|
|
$_font-stack-sans: "Helvetica Neue", Helvetica, Arial !default;
|
|
|
|
$_font-stack-serif: "Times New Roman", Times !default;
|
|
|
|
$_font-stack-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier !default;
|
|
|
|
$_font-stack-symbol: "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol" !default;
|
|
|
|
|
2020-02-11 21:01:13 +08:00
|
|
|
// 字体族 Font Families
|
2020-02-18 17:01:14 +08:00
|
|
|
$font-family-hei: $_font-stack-sans, "Heti Hei", sans-serif, $_font-stack-symbol !default;
|
|
|
|
$font-family-song: $_font-stack-serif, "Heti Song", serif, $_font-stack-symbol !default;
|
|
|
|
$font-family-kai: $_font-stack-serif, "Heti Kai", serif, $_font-stack-symbol !default;
|
|
|
|
$font-family-hei-black: $_font-stack-sans, "Heti Hei Black", sans-serif, $_font-stack-symbol !default;
|
|
|
|
$font-family-song-black: $_font-stack-serif, "Heti Song Black", serif, $_font-stack-symbol !default;
|
|
|
|
$font-family-kai-black: $_font-stack-serif, "Heti Kai Black", serif, $_font-stack-symbol !default;
|
2020-02-11 20:47:29 +08:00
|
|
|
$font-family-mono: $_font-stack-mono, monospace, $_font-stack-symbol !default;
|
|
|
|
|
2020-02-11 21:01:13 +08:00
|
|
|
// 字重 Font Weights
|
2020-02-11 20:47:29 +08:00
|
|
|
$font-weight-bolder: 800 !default;
|
|
|
|
$font-weight-bold: 600 !default;
|
|
|
|
$font-weight-normal: 400 !default;
|
|
|
|
$font-weight-lighter: 200 !default;
|
|
|
|
|
2020-02-11 21:01:13 +08:00
|
|
|
// 字号 Font Sizes
|
2020-02-11 20:47:29 +08:00
|
|
|
$font-size-normal: 16px !default;
|
|
|
|
$font-size-x-large: 20px !default;
|
|
|
|
$font-size-large: 18px !default;
|
|
|
|
$font-size-small: 14px !default;
|
|
|
|
$font-size-x-small: 12px !default;
|
|
|
|
|
|
|
|
$font-size-h1: 32px !default;
|
|
|
|
$font-size-h2: 24px !default;
|
|
|
|
$font-size-h3: 20px !default;
|
|
|
|
$font-size-h4: 18px !default;
|
|
|
|
$font-size-h5: 16px !default;
|
|
|
|
$font-size-h6: 14px !default;
|
|
|
|
|
2020-02-11 21:01:13 +08:00
|
|
|
/* 行 Lines */
|
2020-02-11 20:47:29 +08:00
|
|
|
// 行宽
|
|
|
|
$line-length: 42em !default;
|
|
|
|
|
|
|
|
// 行高 Line Heights
|
|
|
|
$line-height-normal: 1.5 !default;
|
|
|
|
//$line-height-expanded: 1.875 !default;
|
|
|
|
$line-height-expanded-ultra: 2.25 !default;
|
|
|
|
//$line-height-condensed: 1.25 !default;
|
|
|
|
//$line-height-condensed-ultra: 1 !default;
|
|
|
|
|
|
|
|
$line-height-size-normal: $font-size-normal * $line-height-normal !default;
|
|
|
|
$line-height-size-large: $line-height-size-normal !default;
|
|
|
|
$line-height-size-x-large: $font-size-x-large * $line-height-normal !default;
|
|
|
|
$line-height-size-small: $line-height-size-normal !default;
|
|
|
|
$line-height-size-x-small: 18px !default;
|
|
|
|
$line-height-size-h1: 48px !default;
|
|
|
|
$line-height-size-h2: 36px !default;
|
|
|
|
$line-height-size-h3: 36px !default;
|
|
|
|
$line-height-size-h4: 24px !default;
|
|
|
|
$line-height-size-h5: 24px !default;
|
|
|
|
$line-height-size-h6: 24px !default;
|
|
|
|
|
2020-02-11 21:01:13 +08:00
|
|
|
/* 段落 Paragraphs */
|
2020-02-11 20:47:29 +08:00
|
|
|
// 标准网格单位变量 Standard Length
|
|
|
|
// 垂直方向标准单位 = 标准行高
|
|
|
|
// 水平方向标准单位 = 标准字号
|
|
|
|
$std-block-unit: $line-height-size-normal !default;
|
|
|
|
$std-inline-unit: $font-size-normal !default;
|
|
|
|
|
|
|
|
// 示例:缩进单位 = 二倍文字宽度
|
|
|
|
$text-indent-length: 2em !default;
|
2020-02-18 19:59:53 +08:00
|
|
|
$text-indent-size: $font-size-normal * 2 !default;
|
2020-02-11 20:47:29 +08:00
|
|
|
|
2020-02-11 21:01:13 +08:00
|
|
|
/* 栏 Columns */
|
|
|
|
// 分栏
|
|
|
|
$column-count-list: (1, 2, 3, 4) !default;
|
|
|
|
$column-width-list: (16em, 20em, 24em, 28em, 32em, 36em, 40em, 44em, 48em) !default;
|
2020-02-11 20:47:29 +08:00
|
|
|
|
2020-02-11 21:01:13 +08:00
|
|
|
/* 开发用配置项 Develop Configs */
|
|
|
|
// 预设重置方案
|
|
|
|
// `reset`:假定 Eric Meyer 的 CSS Reset 或其它流行的 Reset
|
|
|
|
// `normalize`:指定为 normalize.css
|
2020-02-11 20:47:29 +08:00
|
|
|
$_css-reset-scheme: "reset";
|
|
|
|
|
2020-02-11 21:01:13 +08:00
|
|
|
/* 混合 Mix-ins */
|
2020-02-11 20:47:29 +08:00
|
|
|
// Mix-in: Clear float
|
|
|
|
@mixin clear-float {
|
|
|
|
&::before,
|
|
|
|
&::after {
|
|
|
|
content: "";
|
|
|
|
display: table;
|
|
|
|
}
|
|
|
|
|
|
|
|
&::after {
|
|
|
|
clear: both;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
// Mix-in: Include Non-cjk styles
|
|
|
|
@mixin non-cjk-block {
|
|
|
|
&:not(:lang(zh)):not(:lang(ja)):not(:lang(kr)),
|
|
|
|
&:not(:lang(zh)) {
|
|
|
|
@content;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
// Mix-in: Hang Punctuation Mark
|
|
|
|
@mixin hang {
|
|
|
|
position: absolute;
|
|
|
|
line-height: inherit;
|
2020-02-11 21:01:13 +08:00
|
|
|
text-indent: 0;
|
|
|
|
}
|
|
|
|
|
|
|
|
/* 函数 Functions */
|
|
|
|
// Function: batch prefix/suffix list-item
|
|
|
|
// batch-fix-list((2, 3), '#{$root-selector}--columns-') => (.heti--columns-2, .heti--columns-3)
|
|
|
|
@function batch-fix-list($list, $prefix: '', $suffix: '') {
|
|
|
|
$_list: () !default;
|
|
|
|
|
|
|
|
@each $item in $list {
|
|
|
|
$_list: append($_list, #{$prefix}#{$item}#{$suffix}, comma);
|
|
|
|
}
|
|
|
|
|
|
|
|
@return $_list;
|
2020-02-11 20:47:29 +08:00
|
|
|
}
|