mirror of
https://github.com/ant-design/ant-design.git
synced 2025-06-07 17:44:35 +08:00
seperate reset styles (#7682)
* seperate reset styles
* not reset ul/ol/p/heading
* revert reset.less idea
* move label style into ant-form-item, #5851
* revert reset.less idea
* update base.less
* Better typography from bootstrap@4
use reboot replace normalize
ref:
b4d84b9cdf/scss/_reboot.scss
close #6162
This commit is contained in:
偏右
GitHub
parent
bb411517cf
commit
759b0bb821
@ -1,4 +1,5 @@
|
||||
@import "../../style/themes/default";
|
||||
@import "../../style/mixins/index";
|
||||
|
||||
@alert-prefix-cls: ~"@{ant-prefix}-alert";
|
||||
|
||||
@ -6,12 +7,10 @@
|
||||
@alert-text-color: @text-color;
|
||||
|
||||
.@{alert-prefix-cls} {
|
||||
.reset-component;
|
||||
position: relative;
|
||||
padding: 8px 48px 8px 38px;
|
||||
border-radius: @border-radius-base;
|
||||
color: @alert-text-color;
|
||||
font-size: @font-size-base;
|
||||
line-height: @line-height-base;
|
||||
|
||||
&&-no-icon {
|
||||
padding: 8px 48px 8px 16px;
|
||||
|
||||
@ -1,6 +1,8 @@
|
||||
@import "../../style/themes/default";
|
||||
@import "../../style/mixins/index";
|
||||
|
||||
.@{ant-prefix}-anchor {
|
||||
.reset-component;
|
||||
position: relative;
|
||||
&-wrapper {
|
||||
background-color: @component-background;
|
||||
|
||||
@ -7,6 +7,8 @@
|
||||
@autocomplete-prefix-cls: ~"@{select-prefix-cls}-auto-complete";
|
||||
|
||||
.@{autocomplete-prefix-cls} {
|
||||
.reset-component;
|
||||
|
||||
&.@{select-prefix-cls} {
|
||||
.@{select-prefix-cls} {
|
||||
&-selection {
|
||||
|
||||
@ -1,8 +1,10 @@
|
||||
@import "../../style/themes/default";
|
||||
@import "../../style/mixins/index";
|
||||
|
||||
@avatar-prefix-cls: ~"@{ant-prefix}-avatar";
|
||||
|
||||
.@{avatar-prefix-cls} {
|
||||
.reset-component;
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
background: @avatar-bg;
|
||||
|
||||
@ -1,8 +1,10 @@
|
||||
@import "../../style/themes/default";
|
||||
@import "../../style/mixins/index";
|
||||
|
||||
@backtop-prefix-cls: ~"@{ant-prefix}-back-top";
|
||||
|
||||
.@{backtop-prefix-cls} {
|
||||
.reset-component;
|
||||
z-index: @zindex-back-top;
|
||||
position: fixed;
|
||||
right: 100px;
|
||||
|
||||
@ -1,9 +1,11 @@
|
||||
@import "../../style/themes/default";
|
||||
@import "../../style/mixins/index";
|
||||
|
||||
@badge-prefix-cls: ~"@{ant-prefix}-badge";
|
||||
@number-prefix-cls: ~"@{ant-prefix}-scroll-number";
|
||||
|
||||
.@{badge-prefix-cls} {
|
||||
.reset-component;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
line-height: 1;
|
||||
|
||||
@ -1,10 +1,10 @@
|
||||
@import "../../style/themes/default";
|
||||
@import "../../style/mixins/index";
|
||||
|
||||
@breadcrumb-prefix-cls: ~"@{ant-prefix}-breadcrumb";
|
||||
|
||||
.@{breadcrumb-prefix-cls} {
|
||||
color: @text-color;
|
||||
font-size: @font-size-base;
|
||||
.reset-component;
|
||||
|
||||
a {
|
||||
color: @text-color;
|
||||
|
||||
@ -12,6 +12,7 @@
|
||||
// Button styles
|
||||
// -----------------------------
|
||||
.@{btn-prefix-cls} {
|
||||
.reset-component;
|
||||
.btn;
|
||||
.btn-default;
|
||||
|
||||
|
||||
@ -1,10 +1,10 @@
|
||||
@import "../../style/themes/default";
|
||||
@import "../../style/mixins/index";
|
||||
|
||||
@full-calendar-prefix-cls: ~"@{ant-prefix}-fullcalendar";
|
||||
|
||||
.@{full-calendar-prefix-cls} {
|
||||
font-size: @font-size-base;
|
||||
line-height: @line-height-base;
|
||||
.reset-component;
|
||||
outline: none;
|
||||
border-top: @border-width-base @border-style-base @border-color-base;
|
||||
|
||||
|
||||
@ -24,3 +24,9 @@ ReactDOM.render(
|
||||
</Card>
|
||||
, mountNode);
|
||||
````
|
||||
|
||||
<style>
|
||||
.code-box-demo p {
|
||||
margin: 0;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -6,9 +6,9 @@
|
||||
@card-padding-wider: 32px;
|
||||
|
||||
.@{card-prefix-cls} {
|
||||
.reset-component;
|
||||
background: @component-background;
|
||||
border-radius: @border-radius-sm;
|
||||
font-size: @font-size-base;
|
||||
position: relative;
|
||||
transition: all .3s;
|
||||
|
||||
@ -78,6 +78,9 @@
|
||||
|
||||
&-loading-content {
|
||||
padding: @card-padding-base;
|
||||
p {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&-loading-block {
|
||||
|
||||
@ -2,6 +2,8 @@
|
||||
@import "../../style/mixins/index";
|
||||
|
||||
.@{ant-prefix}-carousel {
|
||||
.reset-component;
|
||||
|
||||
.slick-slider {
|
||||
position: relative;
|
||||
display: block;
|
||||
|
||||
@ -5,7 +5,7 @@
|
||||
@cascader-prefix-cls: ~"@{ant-prefix}-cascader";
|
||||
|
||||
.@{cascader-prefix-cls} {
|
||||
font-size: @font-size-base;
|
||||
.reset-component;
|
||||
|
||||
&-input.@{ant-prefix}-input {
|
||||
// Add important to fix https://github.com/ant-design/ant-design/issues/5078
|
||||
@ -17,10 +17,10 @@
|
||||
}
|
||||
|
||||
&-picker {
|
||||
.reset-component;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
font-size: @font-size-base;
|
||||
background-color: @component-background;
|
||||
border-radius: @border-radius-base;
|
||||
outline: 0;
|
||||
@ -110,6 +110,14 @@
|
||||
border-radius: @border-radius-base;
|
||||
box-shadow: @box-shadow-base;
|
||||
white-space: nowrap;
|
||||
|
||||
ul,
|
||||
ol {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
&-empty,
|
||||
&-hidden {
|
||||
display: none;
|
||||
|
||||
@ -4,6 +4,7 @@
|
||||
@checkbox-inner-prefix-cls: ~"@{checkbox-prefix-cls}-inner";
|
||||
// 一般状态
|
||||
.@{checkbox-prefix-cls} {
|
||||
.reset-component;
|
||||
white-space: nowrap;
|
||||
cursor: pointer;
|
||||
outline: none;
|
||||
@ -149,8 +150,8 @@
|
||||
}
|
||||
|
||||
.@{checkbox-prefix-cls}-wrapper {
|
||||
.reset-component;
|
||||
cursor: pointer;
|
||||
font-size: @font-size-base;
|
||||
display: inline-block;
|
||||
&:not(:last-child) {
|
||||
margin-right: 8px;
|
||||
@ -164,7 +165,7 @@
|
||||
}
|
||||
|
||||
.@{checkbox-prefix-cls}-group {
|
||||
font-size: @font-size-base;
|
||||
.reset-component;
|
||||
&-item {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
@ -14,6 +14,7 @@
|
||||
}
|
||||
|
||||
.@{collapse-prefix-cls} {
|
||||
.reset-component;
|
||||
background-color: @collapse-header-bg;
|
||||
border-radius: @border-radius-base;
|
||||
border: @border-width-base @border-style-base @border-color-base;
|
||||
|
||||
@ -1,4 +1,5 @@
|
||||
.@{calendar-prefix-cls}-picker-container {
|
||||
.reset-component;
|
||||
position: absolute;
|
||||
z-index: @zindex-picker;
|
||||
|
||||
@ -28,10 +29,10 @@
|
||||
}
|
||||
|
||||
.@{calendar-prefix-cls}-picker {
|
||||
.reset-component;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
outline: none;
|
||||
font-size: @font-size-base;
|
||||
transition: opacity 0.3s;
|
||||
|
||||
&-input {
|
||||
|
||||
@ -4,6 +4,7 @@
|
||||
@divider-prefix-cls: ~"@{ant-prefix}-divider";
|
||||
|
||||
.@{divider-prefix-cls} {
|
||||
.reset-component;
|
||||
background: @border-color-split;
|
||||
|
||||
&, // for compatiable
|
||||
|
||||
@ -4,14 +4,12 @@
|
||||
@dropdown-prefix-cls: ~"@{ant-prefix}-dropdown";
|
||||
|
||||
.@{dropdown-prefix-cls} {
|
||||
.reset-component;
|
||||
position: absolute;
|
||||
left: -9999px;
|
||||
top: -9999px;
|
||||
z-index: @zindex-dropdown;
|
||||
display: block;
|
||||
font-size: @font-size-base;
|
||||
font-weight: normal;
|
||||
line-height: 1.5;
|
||||
|
||||
&-wrap {
|
||||
position: relative;
|
||||
|
||||
@ -9,15 +9,9 @@
|
||||
@form-component-height: @input-height-lg;
|
||||
@form-feedback-icon-size: 14px;
|
||||
|
||||
.reset-form();
|
||||
|
||||
label {
|
||||
position: relative;
|
||||
|
||||
> .@{iconfont-css-prefix} {
|
||||
vertical-align: top;
|
||||
font-size: @font-size-base;
|
||||
}
|
||||
.@{form-prefix-cls} {
|
||||
.reset-component;
|
||||
.reset-form;
|
||||
}
|
||||
|
||||
.@{form-prefix-cls}-item-required:before {
|
||||
@ -65,9 +59,17 @@ input[type="checkbox"] {
|
||||
// Form items
|
||||
// You should wrap labels and controls in .@{form-prefix-cls}-item for optimum spacing
|
||||
.@{form-prefix-cls}-item {
|
||||
font-size: @font-size-base;
|
||||
label {
|
||||
position: relative;
|
||||
|
||||
> .@{iconfont-css-prefix} {
|
||||
vertical-align: top;
|
||||
font-size: @font-size-base;
|
||||
}
|
||||
}
|
||||
|
||||
.reset-component;
|
||||
margin-bottom: @form-item-margin-bottom;
|
||||
color: @text-color;
|
||||
vertical-align: top;
|
||||
transition: margin .15s steps(1);
|
||||
|
||||
@ -81,6 +83,10 @@ input[type="checkbox"] {
|
||||
line-height: @form-component-height;
|
||||
position: relative;
|
||||
.clearfix;
|
||||
font-size: 0;
|
||||
* {
|
||||
font-size: @font-size-base;
|
||||
}
|
||||
}
|
||||
|
||||
&-with-help {
|
||||
|
||||
@ -6,6 +6,7 @@
|
||||
.@{ant-prefix}-row {
|
||||
.make-row();
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.@{ant-prefix}-row-flex {
|
||||
|
||||
@ -53,6 +53,7 @@
|
||||
.loop-grid-columns(@index, @class) when (@index > 0) {
|
||||
.@{ant-prefix}-col@{class}-@{index} {
|
||||
display: block;
|
||||
box-sizing: border-box;
|
||||
width: percentage((@index / @grid-columns));
|
||||
}
|
||||
.@{ant-prefix}-col@{class}-push-@{index} {
|
||||
|
||||
@ -11,11 +11,10 @@
|
||||
}
|
||||
|
||||
.@{input-number-prefix-cls} {
|
||||
.input();
|
||||
.reset-component;
|
||||
.input;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-size: @font-size-base;
|
||||
height: @input-height-base;
|
||||
display: inline-block;
|
||||
border: @border-width-base @border-style-base @border-color-base;
|
||||
border-radius: @border-radius-base;
|
||||
|
||||
@ -4,11 +4,13 @@
|
||||
|
||||
// Input styles
|
||||
.@{ant-prefix}-input {
|
||||
.reset-component;
|
||||
.input;
|
||||
}
|
||||
|
||||
//== Style for input-group: input with label, with button or dropdown...
|
||||
.@{ant-prefix}-input-group {
|
||||
.reset-component;
|
||||
.input-group(~"@{ant-prefix}-input");
|
||||
&-wrapper {
|
||||
display: inline-block;
|
||||
@ -19,6 +21,7 @@
|
||||
|
||||
// Input with affix: prefix or suffix
|
||||
.@{ant-prefix}-input-affix-wrapper {
|
||||
.reset-component;
|
||||
.input-affix-wrapper(~"@{ant-prefix}-input");
|
||||
|
||||
// https://github.com/ant-design/ant-design/issues/6144
|
||||
|
||||
@ -9,6 +9,11 @@
|
||||
flex: auto;
|
||||
background: @layout-body-background;
|
||||
|
||||
&,
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
&&-has-sider {
|
||||
flex-direction: row;
|
||||
> .@{layout-prefix-cls},
|
||||
|
||||
@ -4,6 +4,8 @@
|
||||
@list-prefix-cls: ~"@{ant-prefix}-list";
|
||||
|
||||
.@{list-prefix-cls} {
|
||||
.reset-component;
|
||||
|
||||
&-more, &-pagination {
|
||||
margin-top: 24px;
|
||||
text-align: center;
|
||||
|
||||
@ -5,10 +5,12 @@
|
||||
@mention-prefix-cls: ~"@{ant-prefix}-mention";
|
||||
|
||||
.@{mention-prefix-cls}-wrapper {
|
||||
.reset-component;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
vertical-align: middle;
|
||||
|
||||
.@{mention-prefix-cls}-editor {
|
||||
.input;
|
||||
line-height: @line-height-base;
|
||||
@ -44,13 +46,13 @@
|
||||
}
|
||||
|
||||
.@{mention-prefix-cls}-dropdown {
|
||||
.reset-component;
|
||||
margin-top: 1.5em;
|
||||
max-height: 250px;
|
||||
min-width: 120px;
|
||||
background-color: @component-background;
|
||||
box-shadow: @box-shadow-base;
|
||||
border-radius: @border-radius-base;
|
||||
box-sizing: border-box;
|
||||
z-index: @zindex-dropdown;
|
||||
left: -9999px;
|
||||
top: -9999px;
|
||||
@ -58,7 +60,7 @@
|
||||
outline: none;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
font-size: @font-size-base;
|
||||
|
||||
&-notfound&-item {
|
||||
color: @disabled-color;
|
||||
|
||||
|
||||
@ -5,17 +5,24 @@
|
||||
|
||||
// default theme
|
||||
.@{menu-prefix-cls} {
|
||||
.reset-component;
|
||||
outline: none;
|
||||
margin-bottom: 0;
|
||||
padding-left: 0; // Override default ul/ol
|
||||
list-style: none;
|
||||
z-index: @zindex-dropdown;
|
||||
box-shadow: @box-shadow-base;
|
||||
color: @text-color;
|
||||
background: @component-background;
|
||||
line-height: 46px;
|
||||
transition: background .3s, width .2s;
|
||||
|
||||
ul,
|
||||
ol {
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
&-hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@ -1,9 +1,10 @@
|
||||
@import "../../style/themes/default";
|
||||
@import "../../style/mixins/index";
|
||||
|
||||
@message-prefix-cls: ~"@{ant-prefix}-message";
|
||||
|
||||
.@{message-prefix-cls} {
|
||||
font-size: @font-size-base;
|
||||
.reset-component;
|
||||
position: fixed;
|
||||
z-index: @zindex-message;
|
||||
width: 100%;
|
||||
|
||||
@ -1,3 +1,4 @@
|
||||
@import "../../style/themes/default";
|
||||
@import "../../style/mixins/index";
|
||||
@import "./modal";
|
||||
@import "./confirm";
|
||||
|
||||
@ -1,6 +1,7 @@
|
||||
@dialog-prefix-cls: ~"@{ant-prefix}-modal";
|
||||
|
||||
.@{dialog-prefix-cls} {
|
||||
.reset-component;
|
||||
position: relative;
|
||||
width: auto;
|
||||
margin: 0 auto;
|
||||
|
||||
@ -7,6 +7,8 @@
|
||||
@notification-margin-bottom: 10px;
|
||||
|
||||
.@{notification-prefix-cls} {
|
||||
.reset-component;
|
||||
|
||||
position: fixed;
|
||||
z-index: @zindex-notification;
|
||||
width: @notification-width;
|
||||
|
||||
@ -5,7 +5,14 @@
|
||||
@pagination-prefix-cls: ~"@{ant-prefix}-pagination";
|
||||
|
||||
.@{pagination-prefix-cls} {
|
||||
font-size: @font-size-base;
|
||||
.reset-component;
|
||||
|
||||
ul,
|
||||
ol {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
&:after {
|
||||
content: " ";
|
||||
|
||||
@ -4,6 +4,7 @@
|
||||
@popover-prefix-cls: ~"@{ant-prefix}-popover";
|
||||
|
||||
.@{popover-prefix-cls} {
|
||||
.reset-component;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
@ -11,8 +12,6 @@
|
||||
cursor: auto;
|
||||
user-select: text;
|
||||
white-space: normal;
|
||||
font-size: @font-size-base;
|
||||
line-height: @line-height-base;
|
||||
font-weight: normal;
|
||||
text-align: left;
|
||||
|
||||
|
||||
@ -4,6 +4,7 @@
|
||||
@progress-prefix-cls: ~"@{ant-prefix}-progress";
|
||||
|
||||
.@{progress-prefix-cls} {
|
||||
.reset-component;
|
||||
display: inline-block;
|
||||
|
||||
&-line {
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
@import "../../style/themes/default";
|
||||
@import "../../style/mixins/index";
|
||||
@import "../../style/mixins/index";
|
||||
|
||||
@radio-prefix-cls: ~"@{ant-prefix}-radio";
|
||||
@radio-group-prefix-cls: ~"@{radio-prefix-cls}-group";
|
||||
@ -8,12 +9,12 @@
|
||||
|
||||
.@{radio-group-prefix-cls} {
|
||||
display: inline-block;
|
||||
font-size: @font-size-base;
|
||||
.reset-component;
|
||||
}
|
||||
|
||||
// 一般状态
|
||||
.@{radio-prefix-cls}-wrapper {
|
||||
font-size: @font-size-base;
|
||||
.reset-component;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
white-space: nowrap;
|
||||
@ -22,6 +23,7 @@
|
||||
}
|
||||
|
||||
.@{radio-prefix-cls} {
|
||||
.reset-component;
|
||||
white-space: nowrap;
|
||||
outline: none;
|
||||
display: inline-block;
|
||||
|
||||
@ -4,6 +4,7 @@
|
||||
@rate-prefix-cls: ~"@{ant-prefix}-rate";
|
||||
|
||||
.@{rate-prefix-cls} {
|
||||
.reset-component;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
|
||||
@ -35,11 +35,16 @@
|
||||
}
|
||||
|
||||
.@{select-prefix-cls} {
|
||||
box-sizing: border-box;
|
||||
.reset-component;
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
color: @text-color;
|
||||
font-size: @font-size-base;
|
||||
|
||||
ul,
|
||||
ol {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
> ul > li > a {
|
||||
padding: 0;
|
||||
@ -397,6 +402,8 @@
|
||||
}
|
||||
|
||||
.@{select-prefix-cls}-dropdown {
|
||||
.reset-component;
|
||||
|
||||
&.slide-up-enter.slide-up-enter-active&-placement-bottomLeft,
|
||||
&.slide-up-appear.slide-up-appear-active&-placement-bottomLeft {
|
||||
animation-name: antSlideUpIn;
|
||||
|
||||
@ -12,6 +12,7 @@
|
||||
@slider-tooltip-arrow-color: @slider-tooltip-bg;
|
||||
|
||||
.@{slider-prefix-cls} {
|
||||
.reset-component;
|
||||
position: relative;
|
||||
margin: 10px 6px;
|
||||
padding: 4px 0;
|
||||
|
||||
@ -5,13 +5,13 @@
|
||||
@spin-dot-default: @text-color-secondary;
|
||||
|
||||
.@{spin-prefix-cls} {
|
||||
.reset-component;
|
||||
color: @primary-color;
|
||||
vertical-align: middle;
|
||||
text-align: center;
|
||||
opacity: 0;
|
||||
position: absolute;
|
||||
transition: transform 0.3s @ease-in-out-circ;
|
||||
font-size: @font-size-base;
|
||||
display: none;
|
||||
|
||||
&-spinning {
|
||||
|
||||
@ -28,15 +28,10 @@
|
||||
@steps-desciption-max-width: 120px;
|
||||
|
||||
.@{steps-prefix-cls} {
|
||||
.reset-component;
|
||||
font-size: 0;
|
||||
width: 100%;
|
||||
line-height: @line-height-base;
|
||||
display: flex;
|
||||
|
||||
&,
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
|
||||
.@{steps-prefix-cls}-item {
|
||||
|
||||
@ -1,4 +1,11 @@
|
||||
@import "./normalize.less";
|
||||
/* stylelint-disable at-rule-no-unknown */
|
||||
|
||||
// Reboot
|
||||
//
|
||||
// Normalization of HTML elements, manually forked from Normalize.css to emove
|
||||
// styles targeting irrelevant browsers while applying new styles.
|
||||
//
|
||||
// Normalize is licensed MIT. https://github.com/necolas/normalize.css
|
||||
|
||||
// http://stackoverflow.com/a/13611748/3040605
|
||||
@font-face {
|
||||
@ -7,72 +14,198 @@
|
||||
unicode-range: U+30-39;
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0); // remove tap highlight color for mobile safari
|
||||
}
|
||||
|
||||
*:before,
|
||||
*:after {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
// HTML & Body reset
|
||||
html, body {
|
||||
.square(100%);
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: @font-family;
|
||||
font-size: @font-size-base;
|
||||
line-height: @line-height-base;
|
||||
color: @text-color;
|
||||
background-color: @body-background;
|
||||
}
|
||||
|
||||
// unify the setting of elements's margin and padding for browsers
|
||||
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
// Reset fonts for relevant elements
|
||||
button,input,select,textarea {
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
line-height: inherit;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
ul,
|
||||
ol {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
// Remove the clear button of a text input control in IE10+
|
||||
// emove the clear button of a text input control in IE10+
|
||||
input::-ms-clear, input::-ms-reveal {
|
||||
display: none;
|
||||
}
|
||||
|
||||
::selection {
|
||||
background: @primary-color;
|
||||
color: #fff;
|
||||
// Document
|
||||
//
|
||||
// 1. Change from `box-sizing: content-box` so that `width` is not affected by `padding` or `border`.
|
||||
// 2. Change the default font family in all browsers.
|
||||
// 3. Correct the line height in all browsers.
|
||||
// 4. Prevent adjustments of font size after orientation changes in IE on Windows Phone and in iOS.
|
||||
// 5. Setting @viewport causes scrollbars to overlap content in IE11 and Edge, so
|
||||
// we force a non-overlapping, non-auto-hiding scrollbar to counteract.
|
||||
// 6. Change the default tap highlight to be completely transparent in iOS.
|
||||
|
||||
*,
|
||||
*::before,
|
||||
*::after {
|
||||
box-sizing: border-box; // 1
|
||||
}
|
||||
|
||||
// Headers
|
||||
html {
|
||||
font-family: sans-serif; // 2
|
||||
line-height: 1.15; // 3
|
||||
-webkit-text-size-adjust: 100%; // 4
|
||||
-ms-text-size-adjust: 100%; // 4
|
||||
-ms-overflow-style: scrollbar; // 5
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0); // 6
|
||||
}
|
||||
|
||||
// IE10+ doesn't honor `<meta name="viewport">` in some cases.
|
||||
@at-root {
|
||||
@-ms-viewport { width: device-width; }
|
||||
}
|
||||
|
||||
// Shim for "new" HTML5 structural elements to display correctly (IE10, older browsers)
|
||||
article, aside, dialog, figcaption, figure, footer, header, hgroup, main, nav, section {
|
||||
display: block;
|
||||
}
|
||||
|
||||
// Body
|
||||
//
|
||||
// 1. emove the margin in all browsers.
|
||||
// 2. As a best practice, apply a default `body-background`.
|
||||
|
||||
body {
|
||||
margin: 0; // 1
|
||||
font-family: @font-family;
|
||||
font-size: @font-size-base;
|
||||
line-height: @line-height-base;
|
||||
color: @text-color;
|
||||
background-color: @body-background; // 2
|
||||
}
|
||||
|
||||
// Suppress the focus outline on elements that cannot be accessed via keyboard.
|
||||
// This prevents an unwanted focus outline from appearing around elements that
|
||||
// might still respond to pointer events.
|
||||
//
|
||||
// Credit: https://github.com/suitcss/base
|
||||
[tabindex="-1"]:focus {
|
||||
outline: none !important;
|
||||
}
|
||||
|
||||
// Content grouping
|
||||
//
|
||||
// 1. Add the correct box sizing in Firefox.
|
||||
// 2. Show the overflow in Edge and IE.
|
||||
|
||||
hr {
|
||||
box-sizing: content-box; // 1
|
||||
height: 0; // 1
|
||||
overflow: visible; // 2
|
||||
}
|
||||
|
||||
//
|
||||
// Typography
|
||||
//
|
||||
|
||||
// emove top margins from headings
|
||||
//
|
||||
// By default, `<h1>`-`<h6>` all receive top and bottom margins. We nuke the top
|
||||
// margin for easier control within type scales as it avoids margin collapsing.
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
margin-top: 0;
|
||||
margin-bottom: .5em;
|
||||
color: @heading-color;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
// Reset margins on paragraphs
|
||||
//
|
||||
// Similarly, the top margin on `<p>`s get reset. However, we also reset the
|
||||
// bottom margin to use `em` units instead of `em`.
|
||||
p {
|
||||
margin-top: 0;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
// Abbreviations
|
||||
//
|
||||
// 1. emove the bottom border in Firefox 39-.
|
||||
// 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
|
||||
// 3. Add explicit cursor to indicate changed behavior.
|
||||
// 4. Duplicate behavior to the data-* attribute for our tooltip plugin
|
||||
|
||||
abbr[title],
|
||||
abbr[data-original-title] { // 4
|
||||
text-decoration: underline; // 2
|
||||
text-decoration: underline dotted; // 2
|
||||
cursor: help; // 3
|
||||
border-bottom: 0; // 1
|
||||
}
|
||||
|
||||
address {
|
||||
margin-bottom: 1em;
|
||||
font-style: normal;
|
||||
line-height: inherit;
|
||||
}
|
||||
|
||||
ol,
|
||||
ul,
|
||||
dl {
|
||||
margin-top: 0;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
ol ol,
|
||||
ul ul,
|
||||
ol ul,
|
||||
ul ol {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
dt {
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
dd {
|
||||
margin-bottom: .5em;
|
||||
margin-left: 0; // Undo browser default
|
||||
}
|
||||
|
||||
blockquote {
|
||||
margin: 0 0 1em;
|
||||
}
|
||||
|
||||
dfn {
|
||||
font-style: italic; // Add the correct font style in Android 4.3-
|
||||
}
|
||||
|
||||
b,
|
||||
strong {
|
||||
font-weight: bolder; // Add the correct font weight in Chrome, Edge, and Safari
|
||||
}
|
||||
|
||||
small {
|
||||
font-size: 80%; // Add the correct font size in all browsers
|
||||
}
|
||||
|
||||
//
|
||||
// Prevent `sub` and `sup` elements from affecting the line height in
|
||||
// all browsers.
|
||||
//
|
||||
|
||||
sub,
|
||||
sup {
|
||||
position: relative;
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
sub { bottom: -.25em; }
|
||||
sup { top: -.5em; }
|
||||
|
||||
//
|
||||
// Links
|
||||
//
|
||||
|
||||
a {
|
||||
color: @link-color;
|
||||
background: transparent;
|
||||
background-color: transparent; // emove the gray background on active links in IE 10.
|
||||
text-decoration: @link-hover-decoration;
|
||||
outline: none;
|
||||
cursor: pointer;
|
||||
transition: color .3s ease;
|
||||
transition: color .3s;
|
||||
-webkit-text-decoration-skip: objects; // emove gaps in links underline in iOS 8+ and Safari 8+.
|
||||
|
||||
&:focus {
|
||||
text-decoration: underline;
|
||||
@ -100,11 +233,255 @@ a {
|
||||
}
|
||||
}
|
||||
|
||||
//
|
||||
// Code
|
||||
//
|
||||
|
||||
pre,
|
||||
code,
|
||||
kbd,
|
||||
pre,
|
||||
samp {
|
||||
font-family: @code-family;
|
||||
font-size: 1em; // Correct the odd `em` font sizing in all browsers.
|
||||
}
|
||||
|
||||
pre {
|
||||
// emove browser default top margin
|
||||
margin-top: 0;
|
||||
// Reset browser default of `1em` to use `em`s
|
||||
margin-bottom: 1em;
|
||||
// Don't allow content to break outside
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
//
|
||||
// Figures
|
||||
//
|
||||
figure {
|
||||
// Apply a consistent margin strategy (matches our type styles).
|
||||
margin: 0 0 1em;
|
||||
}
|
||||
|
||||
//
|
||||
// Images and content
|
||||
//
|
||||
|
||||
img {
|
||||
vertical-align: middle;
|
||||
border-style: none; // emove the border on images inside links in IE 10-.
|
||||
}
|
||||
|
||||
svg:not(:root) {
|
||||
overflow: hidden; // Hide the overflow in IE
|
||||
}
|
||||
|
||||
// Avoid 300ms click delay on touch devices that support the `touch-action` CSS property.
|
||||
//
|
||||
// In particular, unlike most other browsers, IE11+Edge on Windows 10 on touch devices and IE Mobile 10-11
|
||||
// DON'T emove the click delay when `<meta name="viewport" content="width=device-width">` is present.
|
||||
// However, they DO support emoving the click delay via `touch-action: manipulation`.
|
||||
// See:
|
||||
// * https://getbootstrap.com/docs/4.0/content/reboot/#click-delay-optimization-for-touch
|
||||
// * http://caniuse.com/#feat=css-touch-action
|
||||
// * https://patrickhlauke.github.io/touch/tests/results/#suppressing-300ms-delay
|
||||
|
||||
a,
|
||||
area,
|
||||
button,
|
||||
[role="button"],
|
||||
input:not([type=range]),
|
||||
label,
|
||||
select,
|
||||
summary,
|
||||
textarea {
|
||||
touch-action: manipulation;
|
||||
}
|
||||
|
||||
//
|
||||
// Tables
|
||||
//
|
||||
|
||||
table {
|
||||
border-collapse: collapse; // Prevent double borders
|
||||
}
|
||||
|
||||
caption {
|
||||
padding-top: .75em;
|
||||
padding-bottom: .3em;
|
||||
color: @text-color-secondary;
|
||||
text-align: left;
|
||||
caption-side: bottom;
|
||||
}
|
||||
|
||||
th {
|
||||
// Matches default `<td>` alignment by inheriting from the `<body>`, or the
|
||||
// closest parent with a set `text-align`.
|
||||
text-align: inherit;
|
||||
}
|
||||
|
||||
//
|
||||
// Forms
|
||||
//
|
||||
|
||||
input,
|
||||
button,
|
||||
select,
|
||||
optgroup,
|
||||
textarea {
|
||||
margin: 0; // emove the margin in Firefox and Safari
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
line-height: inherit;
|
||||
}
|
||||
|
||||
button,
|
||||
input {
|
||||
overflow: visible; // Show the overflow in Edge
|
||||
}
|
||||
|
||||
button,
|
||||
select {
|
||||
text-transform: none; // emove the inheritance of text transform in Firefox
|
||||
}
|
||||
|
||||
// 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
|
||||
// controls in Android 4.
|
||||
// 2. Correct the inability to style clickable types in iOS and Safari.
|
||||
button,
|
||||
html [type="button"], // 1
|
||||
[type="reset"],
|
||||
[type="submit"] {
|
||||
-webkit-appearance: button; // 2
|
||||
}
|
||||
|
||||
// emove inner border and padding from Firefox, but don't restore the outline like Normalize.
|
||||
button::-moz-focus-inner,
|
||||
[type="button"]::-moz-focus-inner,
|
||||
[type="reset"]::-moz-focus-inner,
|
||||
[type="submit"]::-moz-focus-inner {
|
||||
padding: 0;
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
input[type="radio"],
|
||||
input[type="checkbox"] {
|
||||
box-sizing: border-box; // 1. Add the correct box sizing in IE 10-
|
||||
padding: 0; // 2. emove the padding in IE 10-
|
||||
}
|
||||
|
||||
input[type="date"],
|
||||
input[type="time"],
|
||||
input[type="datetime-local"],
|
||||
input[type="month"] {
|
||||
// emove the default appearance of temporal inputs to avoid a Mobile Safari
|
||||
// bug where setting a custom line-height prevents text from being vertically
|
||||
// centered within the input.
|
||||
// See https://bugs.webkit.org/show_bug.cgi?id=139848
|
||||
// and https://github.com/twbs/bootstrap/issues/11266
|
||||
-webkit-appearance: listbox;
|
||||
}
|
||||
|
||||
textarea {
|
||||
overflow: auto; // emove the default vertical scrollbar in IE.
|
||||
// Textareas should really only resize vertically so they don't break their (horizontal) containers.
|
||||
resize: vertical;
|
||||
}
|
||||
|
||||
fieldset {
|
||||
// Browsers set a default `min-width: min-content;` on fieldsets,
|
||||
// unlike e.g. `<div>`s, which have `min-width: 0;` by default.
|
||||
// So we reset that to ensure fieldsets behave more like a standard block element.
|
||||
// See https://github.com/twbs/bootstrap/issues/12359
|
||||
// and https://html.spec.whatwg.org/multipage/#the-fieldset-and-legend-elements
|
||||
min-width: 0;
|
||||
// Reset the default outline behavior of fieldsets so they don't affect page layout.
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
// 1. Correct the text wrapping in Edge and IE.
|
||||
// 2. Correct the color inheritance from `fieldset` elements in IE.
|
||||
legend {
|
||||
display: block;
|
||||
width: 100%;
|
||||
max-width: 100%; // 1
|
||||
padding: 0;
|
||||
margin-bottom: .5em;
|
||||
font-size: 1.5em;
|
||||
line-height: inherit;
|
||||
color: inherit; // 2
|
||||
white-space: normal; // 1
|
||||
}
|
||||
|
||||
progress {
|
||||
vertical-align: baseline; // Add the correct vertical alignment in Chrome, Firefox, and Opera.
|
||||
}
|
||||
|
||||
// Correct the cursor style of incement and decement buttons in Chrome.
|
||||
[type="number"]::-webkit-inner-spin-button,
|
||||
[type="number"]::-webkit-outer-spin-button {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
[type="search"] {
|
||||
// This overrides the extra rounded corners on search inputs in iOS so that our
|
||||
// `.form-control` class can properly style them. Note that this cannot simply
|
||||
// be added to `.form-control` as it's not specific enough. For details, see
|
||||
// https://github.com/twbs/bootstrap/issues/11586.
|
||||
outline-offset: -2px; // 2. Correct the outline style in Safari.
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
//
|
||||
// emove the inner padding and cancel buttons in Chrome and Safari on macOS.
|
||||
//
|
||||
|
||||
[type="search"]::-webkit-search-cancel-button,
|
||||
[type="search"]::-webkit-search-decoration {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
//
|
||||
// 1. Correct the inability to style clickable types in iOS and Safari.
|
||||
// 2. Change font properties to `inherit` in Safari.
|
||||
//
|
||||
|
||||
::-webkit-file-upload-button {
|
||||
font: inherit; // 2
|
||||
-webkit-appearance: button; // 1
|
||||
}
|
||||
|
||||
//
|
||||
// Correct element displays
|
||||
//
|
||||
|
||||
output {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
summary {
|
||||
display: list-item; // Add the correct display in all browsers
|
||||
}
|
||||
|
||||
template {
|
||||
display: none; // Add the correct display in IE
|
||||
}
|
||||
|
||||
// Always hide an element with the `hidden` HTML attribute (from PureCSS).
|
||||
// Needed for proper display in IE 10-.
|
||||
[hidden] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
mark {
|
||||
padding: .2em;
|
||||
background-color: @yellow-1;
|
||||
}
|
||||
|
||||
::selection {
|
||||
background: @primary-color;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
// Utility classes
|
||||
|
||||
447
components/style/core/normalize.less
vendored
447
components/style/core/normalize.less
vendored
@ -1,447 +0,0 @@
|
||||
/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */
|
||||
|
||||
/* Document
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* 1. Correct the line height in all browsers.
|
||||
* 2. Prevent adjustments of font size after orientation changes in
|
||||
* IE on Windows Phone and in iOS.
|
||||
*/
|
||||
|
||||
html {
|
||||
line-height: 1.15; /* 1 */
|
||||
-ms-text-size-adjust: 100%; /* 2 */
|
||||
-webkit-text-size-adjust: 100%; /* 2 */
|
||||
}
|
||||
|
||||
/* Sections
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Remove the margin in all browsers (opinionated).
|
||||
*/
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct display in IE 9-.
|
||||
*/
|
||||
|
||||
article,
|
||||
aside,
|
||||
footer,
|
||||
header,
|
||||
nav,
|
||||
section {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/**
|
||||
* Correct the font size and margin on `h1` elements within `section` and
|
||||
* `article` contexts in Chrome, Firefox, and Safari.
|
||||
*/
|
||||
|
||||
h1 {
|
||||
font-size: 2em;
|
||||
margin: 0.67em 0;
|
||||
}
|
||||
|
||||
/* Grouping content
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Add the correct display in IE 9-.
|
||||
* 1. Add the correct display in IE.
|
||||
*/
|
||||
|
||||
figcaption,
|
||||
figure,
|
||||
main { /* 1 */
|
||||
display: block;
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct margin in IE 8.
|
||||
*/
|
||||
|
||||
figure {
|
||||
margin: 1em 40px;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Add the correct box sizing in Firefox.
|
||||
* 2. Show the overflow in Edge and IE.
|
||||
*/
|
||||
|
||||
hr {
|
||||
box-sizing: content-box; /* 1 */
|
||||
height: 0; /* 1 */
|
||||
overflow: visible; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||
* 2. Correct the odd `em` font sizing in all browsers.
|
||||
*/
|
||||
|
||||
pre {
|
||||
font-family: monospace, monospace; /* 1 */ /* stylelint-disable-line */
|
||||
font-size: 1em; /* 2 */
|
||||
}
|
||||
|
||||
/* Text-level semantics
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* 1. Remove the gray background on active links in IE 10.
|
||||
* 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
|
||||
*/
|
||||
|
||||
a {
|
||||
background-color: transparent; /* 1 */
|
||||
-webkit-text-decoration-skip: objects; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Remove the bottom border in Chrome 57- and Firefox 39-.
|
||||
* 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
|
||||
*/
|
||||
|
||||
abbr[title] {
|
||||
border-bottom: none; /* 1 */
|
||||
text-decoration: underline; /* 2 */
|
||||
text-decoration: underline dotted; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Prevent the duplicate application of `bolder` by the next rule in Safari 6.
|
||||
*/
|
||||
|
||||
b,
|
||||
strong {
|
||||
font-weight: inherit;
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct font weight in Chrome, Edge, and Safari.
|
||||
*/
|
||||
|
||||
b,
|
||||
strong {
|
||||
font-weight: bolder;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the inheritance and scaling of font size in all browsers.
|
||||
* 2. Correct the odd `em` font sizing in all browsers.
|
||||
*/
|
||||
|
||||
code,
|
||||
kbd,
|
||||
samp {
|
||||
font-family: monospace, monospace; /* 1 */ /* stylelint-disable-line */
|
||||
font-size: 1em; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct font style in Android 4.3-.
|
||||
*/
|
||||
|
||||
dfn {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct background and color in IE 9-.
|
||||
*/
|
||||
|
||||
mark {
|
||||
background-color: #ff0;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct font size in all browsers.
|
||||
*/
|
||||
|
||||
small {
|
||||
font-size: 80%;
|
||||
}
|
||||
|
||||
/**
|
||||
* Prevent `sub` and `sup` elements from affecting the line height in
|
||||
* all browsers.
|
||||
*/
|
||||
|
||||
sub,
|
||||
sup {
|
||||
font-size: 75%;
|
||||
line-height: 0;
|
||||
position: relative;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
sub {
|
||||
bottom: -0.25em;
|
||||
}
|
||||
|
||||
sup {
|
||||
top: -0.5em;
|
||||
}
|
||||
|
||||
/* Embedded content
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Add the correct display in IE 9-.
|
||||
*/
|
||||
|
||||
audio,
|
||||
video {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct display in iOS 4-7.
|
||||
*/
|
||||
|
||||
audio:not([controls]) {
|
||||
display: none;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the border on images inside links in IE 10-.
|
||||
*/
|
||||
|
||||
img {
|
||||
border-style: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* Hide the overflow in IE.
|
||||
*/
|
||||
|
||||
svg:not(:root) {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* Forms
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* 1. Change the font styles in all browsers (opinionated).
|
||||
* 2. Remove the margin in Firefox and Safari.
|
||||
*/
|
||||
|
||||
button,
|
||||
input,
|
||||
optgroup,
|
||||
select,
|
||||
textarea {
|
||||
font-family: sans-serif; /* 1 */
|
||||
font-size: 100%; /* 1 */
|
||||
line-height: 1.15; /* 1 */
|
||||
margin: 0; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Show the overflow in IE.
|
||||
* 1. Show the overflow in Edge.
|
||||
*/
|
||||
|
||||
button,
|
||||
input { /* 1 */
|
||||
overflow: visible;
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the inheritance of text transform in Edge, Firefox, and IE.
|
||||
* 1. Remove the inheritance of text transform in Firefox.
|
||||
*/
|
||||
|
||||
button,
|
||||
select { /* 1 */
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
|
||||
* controls in Android 4.
|
||||
* 2. Correct the inability to style clickable types in iOS and Safari.
|
||||
*/
|
||||
|
||||
button,
|
||||
html [type="button"], /* 1 */
|
||||
[type="reset"],
|
||||
[type="submit"] {
|
||||
-webkit-appearance: button; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the inner border and padding in Firefox.
|
||||
*/
|
||||
|
||||
button::-moz-focus-inner,
|
||||
[type="button"]::-moz-focus-inner,
|
||||
[type="reset"]::-moz-focus-inner,
|
||||
[type="submit"]::-moz-focus-inner {
|
||||
border-style: none;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
/**
|
||||
* Restore the focus styles unset by the previous rule.
|
||||
*/
|
||||
|
||||
button:-moz-focusring,
|
||||
[type="button"]:-moz-focusring,
|
||||
[type="reset"]:-moz-focusring,
|
||||
[type="submit"]:-moz-focusring {
|
||||
outline: 1px dotted ButtonText;
|
||||
}
|
||||
|
||||
/**
|
||||
* Correct the padding in Firefox.
|
||||
*/
|
||||
|
||||
fieldset {
|
||||
padding: 0.35em 0.75em 0.625em;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the text wrapping in Edge and IE.
|
||||
* 2. Correct the color inheritance from `fieldset` elements in IE.
|
||||
* 3. Remove the padding so developers are not caught out when they zero out
|
||||
* `fieldset` elements in all browsers.
|
||||
*/
|
||||
|
||||
legend {
|
||||
box-sizing: border-box; /* 1 */
|
||||
color: inherit; /* 2 */
|
||||
display: table; /* 1 */
|
||||
max-width: 100%; /* 1 */
|
||||
padding: 0; /* 3 */
|
||||
white-space: normal; /* 1 */
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Add the correct display in IE 9-.
|
||||
* 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
|
||||
*/
|
||||
|
||||
progress {
|
||||
display: inline-block; /* 1 */
|
||||
vertical-align: baseline; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the default vertical scrollbar in IE.
|
||||
*/
|
||||
|
||||
textarea {
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Add the correct box sizing in IE 10-.
|
||||
* 2. Remove the padding in IE 10-.
|
||||
*/
|
||||
|
||||
[type="checkbox"],
|
||||
[type="radio"] {
|
||||
box-sizing: border-box; /* 1 */
|
||||
padding: 0; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Correct the cursor style of increment and decrement buttons in Chrome.
|
||||
*/
|
||||
|
||||
[type="number"]::-webkit-inner-spin-button,
|
||||
[type="number"]::-webkit-outer-spin-button {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the odd appearance in Chrome and Safari.
|
||||
* 2. Correct the outline style in Safari.
|
||||
*/
|
||||
|
||||
[type="search"] {
|
||||
-webkit-appearance: textfield; /* 1 */
|
||||
outline-offset: -2px; /* 2 */
|
||||
}
|
||||
|
||||
/**
|
||||
* Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
|
||||
*/
|
||||
|
||||
[type="search"]::-webkit-search-cancel-button,
|
||||
[type="search"]::-webkit-search-decoration {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
/**
|
||||
* 1. Correct the inability to style clickable types in iOS and Safari.
|
||||
* 2. Change font properties to `inherit` in Safari.
|
||||
*/
|
||||
|
||||
::-webkit-file-upload-button {
|
||||
-webkit-appearance: button; /* 1 */
|
||||
font: inherit; /* 2 */
|
||||
}
|
||||
|
||||
/* Interactive
|
||||
========================================================================== */
|
||||
|
||||
/*
|
||||
* Add the correct display in IE 9-.
|
||||
* 1. Add the correct display in Edge, IE, and Firefox.
|
||||
*/
|
||||
|
||||
details, /* 1 */
|
||||
menu {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/*
|
||||
* Add the correct display in all browsers.
|
||||
*/
|
||||
|
||||
summary {
|
||||
display: list-item;
|
||||
}
|
||||
|
||||
/* Scripting
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Add the correct display in IE 9-.
|
||||
*/
|
||||
|
||||
canvas {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
/**
|
||||
* Add the correct display in IE.
|
||||
*/
|
||||
|
||||
template {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* Hidden
|
||||
========================================================================== */
|
||||
|
||||
/**
|
||||
* Add the correct display in IE 10-.
|
||||
*/
|
||||
|
||||
[hidden] {
|
||||
display: none;
|
||||
}
|
||||
@ -5,3 +5,4 @@
|
||||
@import "clearfix";
|
||||
@import "iconfont";
|
||||
@import "motion";
|
||||
@import "reset";
|
||||
|
||||
12
components/style/mixins/reset.less
Normal file
12
components/style/mixins/reset.less
Normal file
@ -0,0 +1,12 @@
|
||||
@import '../themes/default';
|
||||
|
||||
.reset-component() {
|
||||
font-family: @font-family;
|
||||
font-size: @font-size-base;
|
||||
line-height: @line-height-base;
|
||||
color: @text-color;
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
}
|
||||
@ -5,6 +5,7 @@
|
||||
@switch-duration: .36s;
|
||||
|
||||
.@{switch-prefix-cls} {
|
||||
.reset-component;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
box-sizing: border-box;
|
||||
|
||||
@ -8,8 +8,7 @@
|
||||
}
|
||||
|
||||
.@{table-prefix-cls} {
|
||||
font-size: @font-size-base;
|
||||
color: @text-color;
|
||||
.reset-component;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
border-radius: @border-radius-base @border-radius-base 0 0;
|
||||
|
||||
@ -5,11 +5,10 @@
|
||||
@import "./card-style";
|
||||
|
||||
.@{tab-prefix-cls} {
|
||||
box-sizing: border-box;
|
||||
.reset-component;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
.clearfix;
|
||||
color: @text-color;
|
||||
|
||||
&-ink-bar {
|
||||
z-index: 1;
|
||||
|
||||
@ -4,6 +4,7 @@
|
||||
@tag-prefix-cls: ~"@{ant-prefix}-tag";
|
||||
|
||||
.@{tag-prefix-cls} {
|
||||
.reset-component;
|
||||
display: inline-block;
|
||||
line-height: 20px;
|
||||
height: 22px;
|
||||
|
||||
@ -5,6 +5,7 @@
|
||||
@timepicker-prefix-cls: ~"@{ant-prefix}-time-picker";
|
||||
|
||||
.@{timepicker-prefix-cls}-panel {
|
||||
.reset-component;
|
||||
z-index: @zindex-picker;
|
||||
position: absolute;
|
||||
|
||||
@ -60,7 +61,7 @@
|
||||
}
|
||||
|
||||
&-clear-btn:after {
|
||||
font-size: @font-size-base;
|
||||
font-size: @font-size-base - 2px;
|
||||
color: @disabled-color;
|
||||
display: inline-block;
|
||||
line-height: 1;
|
||||
@ -182,10 +183,10 @@
|
||||
}
|
||||
|
||||
.@{timepicker-prefix-cls} {
|
||||
.reset-component;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
outline: none;
|
||||
font-size: @font-size-base;
|
||||
transition: opacity 0.3s ease;
|
||||
width: 100px;
|
||||
|
||||
@ -222,7 +223,7 @@
|
||||
&:after {
|
||||
content: "\e641";
|
||||
font-family: "anticon";
|
||||
font-size: @font-size-base;
|
||||
font-size: @font-size-base - 2px;
|
||||
color: @text-color-secondary;
|
||||
display: block;
|
||||
line-height: 1;
|
||||
|
||||
@ -5,6 +5,7 @@
|
||||
@timeline-color: @border-color-split;
|
||||
|
||||
.@{timeline-prefix-cls} {
|
||||
.reset-component;
|
||||
list-style: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
@ -5,12 +5,11 @@
|
||||
|
||||
// Base class
|
||||
.@{tooltip-prefix-cls} {
|
||||
.reset-component;
|
||||
position: absolute;
|
||||
z-index: @zindex-tooltip;
|
||||
display: block;
|
||||
visibility: visible;
|
||||
font-size: @font-size-base;
|
||||
line-height: @line-height-base;
|
||||
|
||||
&-hidden {
|
||||
display: none;
|
||||
|
||||
@ -5,11 +5,10 @@
|
||||
@transfer-prefix-cls: ~"@{ant-prefix}-transfer";
|
||||
|
||||
.@{transfer-prefix-cls} {
|
||||
.reset-component;
|
||||
position: relative;
|
||||
line-height: @line-height-base;
|
||||
|
||||
&-list {
|
||||
font-size: @font-size-base;
|
||||
border: @border-width-base @border-style-base @border-color-base;
|
||||
display: inline-block;
|
||||
border-radius: @border-radius-base;
|
||||
|
||||
@ -9,10 +9,10 @@
|
||||
.antCheckboxFn(@checkbox-prefix-cls: ~"@{ant-prefix}-select-tree-checkbox");
|
||||
|
||||
.@{select-tree-prefix-cls} {
|
||||
.reset-component;
|
||||
margin: 0;
|
||||
padding: 0 4px;
|
||||
margin-top: -4px;
|
||||
font-size: @font-size-base;
|
||||
li {
|
||||
padding: 0;
|
||||
margin: 8px 0;
|
||||
@ -118,6 +118,7 @@
|
||||
}
|
||||
|
||||
.@{select-prefix-cls}-tree-dropdown {
|
||||
.reset-component;
|
||||
.@{select-prefix-cls}-dropdown-search {
|
||||
display: block;
|
||||
padding: 4px;
|
||||
|
||||
@ -9,9 +9,9 @@
|
||||
.antCheckboxFn(@checkbox-prefix-cls: ~"@{ant-prefix}-tree-checkbox");
|
||||
|
||||
.@{tree-prefix-cls} {
|
||||
.reset-component;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-size: @font-size-base;
|
||||
li {
|
||||
padding: 4px 0;
|
||||
margin: 0;
|
||||
|
||||
@ -6,7 +6,7 @@
|
||||
@upload-pictrue-card-size: 96px;
|
||||
|
||||
.@{upload-prefix-cls} {
|
||||
font-size: @font-size-base;
|
||||
.reset-component;
|
||||
outline: 0;
|
||||
|
||||
&-btn {
|
||||
@ -112,6 +112,7 @@
|
||||
}
|
||||
|
||||
.@{upload-prefix-cls}-list {
|
||||
.reset-component;
|
||||
overflow: hidden;
|
||||
&-item {
|
||||
overflow: hidden;
|
||||
|
||||
@ -60,6 +60,11 @@
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
.markdown ul,
|
||||
.markdown ol {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.markdown ul > li {
|
||||
list-style-type: circle;
|
||||
margin-left: 20px;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user