office-ui-fabric-core-rails 5.1.0.0 → 6.0.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/.travis.yml +1 -1
- data/lib/office-ui-fabric-core-rails/version.rb +2 -2
- data/package.json +2 -2
- data/vendor/assets/css/fabric-6.0.0.scoped.css +8251 -0
- data/vendor/assets/css/fabric-6.0.0.scoped.min.css +6 -0
- data/vendor/assets/css/fabric.css +4597 -4324
- data/vendor/assets/css/fabric.min.css +2 -2
- data/vendor/assets/css/fabric.rtl.css +5630 -4137
- data/vendor/assets/css/fabric.rtl.min.css +2 -2
- data/vendor/assets/scss/Fabric.RTL.scss +13 -39
- data/vendor/assets/scss/Fabric.Scoped.scss +33 -0
- data/vendor/assets/scss/Fabric.scss +22 -43
- data/vendor/assets/scss/_Animation.RTL.scss +58 -0
- data/vendor/assets/scss/_Animation.scss +173 -0
- data/vendor/assets/scss/_BrandIcon.scss +19 -0
- data/vendor/assets/scss/{Fabric.Color.Mixins.Output.scss → _Color.scss} +441 -443
- data/vendor/assets/scss/_Font.Definitions.scss +33 -0
- data/vendor/assets/scss/{Fabric.Typography.Output.scss → _Font.scss} +387 -389
- data/vendor/assets/scss/{Fabric.Grid.Output.scss → _Grid.scss} +24 -32
- data/vendor/assets/scss/{Fabric.Icons.Font.Output.scss → _Icon.Definitions.scss} +28 -21
- data/vendor/assets/scss/{Fabric.Icons.RTL.Output.scss → _Icon.RTL.scss} +146 -149
- data/vendor/assets/scss/{Fabric.Icons.Output.scss → _Icon.scss} +754 -751
- data/vendor/assets/scss/_References.scss +26 -0
- data/vendor/assets/scss/_Responsive.scss +1010 -0
- data/vendor/assets/scss/{Fabric.Utilities.Output.scss → _Utility.scss} +44 -46
- data/vendor/assets/scss/_Wrapper.scss +41 -0
- data/vendor/assets/scss/mixins/_Animation.Mixins.scss +360 -0
- data/vendor/assets/scss/mixins/_BrandIcon.Mixins.scss +36 -0
- data/vendor/assets/scss/{_Fabric.Color.Mixins.scss → mixins/_Color.Mixins.scss} +418 -418
- data/vendor/assets/scss/{_Fabric.Mixins.RTL.scss → mixins/_Directionality.Mixins.scss} +325 -325
- data/vendor/assets/scss/{_Fabric.Typography.scss → mixins/_Font.Mixins.scss} +381 -345
- data/vendor/assets/scss/mixins/_General.Mixins.scss +371 -0
- data/vendor/assets/scss/{_Fabric.Grid.scss → mixins/_Grid.Mixins.scss} +39 -34
- data/vendor/assets/scss/mixins/_Icon.Mixins.scss +777 -0
- data/vendor/assets/scss/mixins/_Responsive.Mixins.scss +1425 -0
- data/vendor/assets/scss/mixins/_ScopedStyles.Mixins.scss +20 -0
- data/vendor/assets/scss/variables/_Animation.Variables.scss +11 -0
- data/vendor/assets/scss/variables/_BrandIcon.Variables.scss +12 -0
- data/vendor/assets/scss/{_Fabric.Color.Variables.scss → variables/_Color.Variables.scss} +77 -93
- data/vendor/assets/scss/variables/_Font.Variables.scss +41 -0
- data/vendor/assets/scss/variables/_General.Variables.scss +6 -0
- data/vendor/assets/scss/variables/_Icon.Variables.scss +7 -0
- data/vendor/assets/scss/variables/_Responsive.Variables.scss +16 -0
- data/vendor/assets/scss/variables/_ZIndex.Variables.scss +14 -0
- metadata +38 -39
- data/vendor/assets/scss/Fabric.Animations.Output.scss +0 -419
- data/vendor/assets/scss/Fabric.Animations.RTL.Output.scss +0 -80
- data/vendor/assets/scss/Fabric.Base.Output.scss +0 -14
- data/vendor/assets/scss/Fabric.Brand.Icons.Output.scss +0 -19
- data/vendor/assets/scss/Fabric.Responsive.Utilities.Output.scss +0 -1012
- data/vendor/assets/scss/Fabric.Typography.Fonts.Extended.Output.scss +0 -67
- data/vendor/assets/scss/Fabric.Typography.Fonts.Output.scss +0 -13
- data/vendor/assets/scss/Fabric.Typography.Language.Overrides.Output.scss +0 -53
- data/vendor/assets/scss/_Fabric.Animations.RTL.scss +0 -79
- data/vendor/assets/scss/_Fabric.Animations.scss +0 -237
- data/vendor/assets/scss/_Fabric.Base.scss +0 -13
- data/vendor/assets/scss/_Fabric.Brand.Icons.scss +0 -51
- data/vendor/assets/scss/_Fabric.Common.scss +0 -16
- data/vendor/assets/scss/_Fabric.Icons.scss +0 -779
- data/vendor/assets/scss/_Fabric.Mixins.scss +0 -282
- data/vendor/assets/scss/_Fabric.Responsive.Utilities.Variables.scss +0 -1423
- data/vendor/assets/scss/_Fabric.Responsive.Variables.scss +0 -35
- data/vendor/assets/scss/_Fabric.Typography.Fonts.scss +0 -167
- data/vendor/assets/scss/_Fabric.Typography.Language.Overrides.scss +0 -50
- data/vendor/assets/scss/_Fabric.Typography.Mixins.scss +0 -11
- data/vendor/assets/scss/_Fabric.Typography.Variables.scss +0 -29
- data/vendor/assets/scss/_Fabric.Utilities.scss +0 -76
- data/vendor/assets/scss/_Fabric.ZIndex.Variables.scss +0 -32
- data/vendor/assets/scss/_Fabric.i18n.scss +0 -316
@@ -1,35 +0,0 @@
|
|
1
|
-
// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
|
2
|
-
|
3
|
-
//
|
4
|
-
// Office UI Fabric
|
5
|
-
// --------------------------------------------------
|
6
|
-
// Fabric responsive variables
|
7
|
-
|
8
|
-
|
9
|
-
//== Variables for responsive breakpoints
|
10
|
-
//
|
11
|
-
|
12
|
-
// Small screen / phone (320px - 479px)
|
13
|
-
$ms-screen-sm-min: 320px !default;
|
14
|
-
|
15
|
-
// Medium screen / tablet (480px - 639px)
|
16
|
-
$ms-screen-md-min: 480px !default;
|
17
|
-
|
18
|
-
// Large screen / tablet (640px - 1023px)
|
19
|
-
$ms-screen-lg-min: 640px !default;
|
20
|
-
|
21
|
-
// Extra large screen / tablet (1024px - 1365px)
|
22
|
-
$ms-screen-xl-min: 1024px !default;
|
23
|
-
|
24
|
-
// Extra extra large screen / desktop (1366px - 1919px)
|
25
|
-
$ms-screen-xxl-min: 1366px !default;
|
26
|
-
|
27
|
-
// Extra extra extra large screen / desktop (1920px and up)
|
28
|
-
$ms-screen-xxxl-min: 1920px !default;
|
29
|
-
|
30
|
-
// Set all maxes since order matters in SASS
|
31
|
-
$ms-screen-sm-max: ($ms-screen-md-min - 1);
|
32
|
-
$ms-screen-md-max: ($ms-screen-lg-min - 1);
|
33
|
-
$ms-screen-lg-max: ($ms-screen-xl-min - 1);
|
34
|
-
$ms-screen-xl-max: ($ms-screen-xxl-min - 1);
|
35
|
-
$ms-screen-xxl-max: ($ms-screen-xxxl-min - 1);
|
@@ -1,167 +0,0 @@
|
|
1
|
-
// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
|
2
|
-
|
3
|
-
//
|
4
|
-
// Office UI Fabric
|
5
|
-
// --------------------------------------------------
|
6
|
-
// Font definitions
|
7
|
-
|
8
|
-
|
9
|
-
// Font weights.
|
10
|
-
$ms-font-name: "Segoe UI" !default;
|
11
|
-
|
12
|
-
|
13
|
-
// Font paths.
|
14
|
-
$ms-font-directory: "https://static2.sharepointonline.com/files/fabric/assets/fonts/" !default;
|
15
|
-
$ms-font-path-arabic: "segoeui-arabic" !default;
|
16
|
-
$ms-font-path-cyrillic: "segoeui-cyrillic" !default;
|
17
|
-
$ms-font-path-easteuropean: "segoeui-easteuropean" !default;
|
18
|
-
$ms-font-path-greek: "segoeui-greek" !default;
|
19
|
-
$ms-font-path-hebrew: "segoeui-hebrew" !default;
|
20
|
-
$ms-font-path-vietnamese: "segoeui-vietnamese" !default;
|
21
|
-
$ms-font-path-westeuropean: "segoeui-westeuropean" !default;
|
22
|
-
|
23
|
-
|
24
|
-
/*
|
25
|
-
Your use of the content in the files referenced here are subject to the terms of the license at http://aka.ms/fabric-font-license
|
26
|
-
*/
|
27
|
-
|
28
|
-
// Mixins to generate @font-face rules for unique languages.
|
29
|
-
@mixin SegoeUILight($ms-font-language, $ms-font-path) {
|
30
|
-
@font-face {
|
31
|
-
font-family: "#{$ms-font-name} #{$ms-font-language}";
|
32
|
-
src: local("Segoe UI Light"),
|
33
|
-
url('#{$ms-font-directory}/#{$ms-font-path}/segoeui-light.woff2') format('woff2'),
|
34
|
-
url('#{$ms-font-directory}/#{$ms-font-path}/segoeui-light.woff') format('woff'),
|
35
|
-
url('#{$ms-font-directory}/#{$ms-font-path}/segoeui-light.ttf') format('truetype');
|
36
|
-
font-weight: 100;
|
37
|
-
font-style: normal;
|
38
|
-
}
|
39
|
-
}
|
40
|
-
|
41
|
-
@mixin SegoeUISemilight($ms-font-language, $ms-font-path) {
|
42
|
-
@font-face {
|
43
|
-
font-family: "#{$ms-font-name} #{$ms-font-language}";
|
44
|
-
src: local("Segoe UI Semilight"),
|
45
|
-
url('#{$ms-font-directory}/#{$ms-font-path}/segoeui-semilight.woff2') format('woff2'),
|
46
|
-
url('#{$ms-font-directory}/#{$ms-font-path}/segoeui-semilight.woff') format('woff'),
|
47
|
-
url('#{$ms-font-directory}/#{$ms-font-path}/segoeui-semilight.ttf') format('truetype');
|
48
|
-
font-weight: 200;
|
49
|
-
font-style: normal;
|
50
|
-
}
|
51
|
-
}
|
52
|
-
|
53
|
-
@mixin SegoeUIRegular($ms-font-language, $ms-font-path) {
|
54
|
-
@font-face {
|
55
|
-
font-family: "#{$ms-font-name} #{$ms-font-language}";
|
56
|
-
src: local("Segoe UI"),
|
57
|
-
url('#{$ms-font-directory}/#{$ms-font-path}/segoeui-regular.woff2') format('woff2'),
|
58
|
-
url('#{$ms-font-directory}/#{$ms-font-path}/segoeui-regular.woff') format('woff'),
|
59
|
-
url('#{$ms-font-directory}/#{$ms-font-path}/segoeui-regular.ttf') format('truetype');
|
60
|
-
font-weight: 400;
|
61
|
-
font-style: normal;
|
62
|
-
}
|
63
|
-
}
|
64
|
-
|
65
|
-
@mixin SegoeUISemibold($ms-font-language, $ms-font-path) {
|
66
|
-
@font-face {
|
67
|
-
font-family: "#{$ms-font-name} #{$ms-font-language}";
|
68
|
-
src: local("Segoe UI Semibold"),
|
69
|
-
url('#{$ms-font-directory}/#{$ms-font-path}/segoeui-semibold.woff2') format('woff2'),
|
70
|
-
url('#{$ms-font-directory}/#{$ms-font-path}/segoeui-semibold.woff') format('woff'),
|
71
|
-
url('#{$ms-font-directory}/#{$ms-font-path}/segoeui-semibold.ttf') format('truetype');
|
72
|
-
font-weight: 600;
|
73
|
-
font-style: normal;
|
74
|
-
}
|
75
|
-
}
|
76
|
-
|
77
|
-
// Mixins to generate language-specific font faces.
|
78
|
-
@mixin SegoeUIArabicLight {
|
79
|
-
@include SegoeUILight("Arabic", $ms-font-path-arabic);
|
80
|
-
}
|
81
|
-
@mixin SegoeUIArabicRegular {
|
82
|
-
@include SegoeUIRegular("Arabic", $ms-font-path-arabic);
|
83
|
-
}
|
84
|
-
@mixin SegoeUIArabicSemibold {
|
85
|
-
@include SegoeUISemibold("Arabic", $ms-font-path-arabic);
|
86
|
-
}
|
87
|
-
@mixin SegoeUIArabicSemilight {
|
88
|
-
@include SegoeUISemilight("Arabic", $ms-font-path-arabic);
|
89
|
-
}
|
90
|
-
|
91
|
-
@mixin SegoeUICyrillicLight {
|
92
|
-
@include SegoeUILight("Cyrillic", $ms-font-path-cyrillic);
|
93
|
-
}
|
94
|
-
@mixin SegoeUICyrillicRegular {
|
95
|
-
@include SegoeUIRegular("Cyrillic", $ms-font-path-cyrillic);
|
96
|
-
}
|
97
|
-
@mixin SegoeUICyrillicSemibold {
|
98
|
-
@include SegoeUISemibold("Cyrillic", $ms-font-path-cyrillic);
|
99
|
-
}
|
100
|
-
@mixin SegoeUICyrillicSemilight {
|
101
|
-
@include SegoeUISemilight("Cyrillic", $ms-font-path-cyrillic);
|
102
|
-
}
|
103
|
-
|
104
|
-
@mixin SegoeUIEastEuropeanLight {
|
105
|
-
@include SegoeUILight("EastEuropean", $ms-font-path-easteuropean);
|
106
|
-
}
|
107
|
-
@mixin SegoeUIEastEuropeanRegular {
|
108
|
-
@include SegoeUIRegular("EastEuropean", $ms-font-path-easteuropean);
|
109
|
-
}
|
110
|
-
@mixin SegoeUIEastEuropeanSemibold {
|
111
|
-
@include SegoeUISemibold("EastEuropean", $ms-font-path-easteuropean);
|
112
|
-
}
|
113
|
-
@mixin SegoeUIEastEuropeanSemilight {
|
114
|
-
@include SegoeUISemilight("EastEuropean", $ms-font-path-easteuropean);
|
115
|
-
}
|
116
|
-
|
117
|
-
@mixin SegoeUIGreekLight {
|
118
|
-
@include SegoeUILight("Greek", $ms-font-path-greek);
|
119
|
-
}
|
120
|
-
@mixin SegoeUIGreekRegular {
|
121
|
-
@include SegoeUIRegular("Greek", $ms-font-path-greek);
|
122
|
-
}
|
123
|
-
@mixin SegoeUIGreekSemibold {
|
124
|
-
@include SegoeUISemibold("Greek", $ms-font-path-greek);
|
125
|
-
}
|
126
|
-
@mixin SegoeUIGreekSemilight {
|
127
|
-
@include SegoeUISemilight("Greek", $ms-font-path-greek);
|
128
|
-
}
|
129
|
-
|
130
|
-
@mixin SegoeUIHebrewLight {
|
131
|
-
@include SegoeUILight("Hebrew", $ms-font-path-hebrew);
|
132
|
-
}
|
133
|
-
@mixin SegoeUIHebrewRegular {
|
134
|
-
@include SegoeUIRegular("Hebrew", $ms-font-path-hebrew);
|
135
|
-
}
|
136
|
-
@mixin SegoeUIHebrewSemibold {
|
137
|
-
@include SegoeUISemibold("Hebrew", $ms-font-path-hebrew);
|
138
|
-
}
|
139
|
-
@mixin SegoeUIHebrewSemilight {
|
140
|
-
@include SegoeUISemilight("Hebrew", $ms-font-path-hebrew);
|
141
|
-
}
|
142
|
-
|
143
|
-
@mixin SegoeUIVietnameseLight {
|
144
|
-
@include SegoeUILight("Vietnamese", $ms-font-path-vietnamese);
|
145
|
-
}
|
146
|
-
@mixin SegoeUIVietnameseRegular {
|
147
|
-
@include SegoeUIRegular("Vietnamese", $ms-font-path-vietnamese);
|
148
|
-
}
|
149
|
-
@mixin SegoeUIVietnameseSemibold {
|
150
|
-
@include SegoeUISemibold("Vietnamese", $ms-font-path-vietnamese);
|
151
|
-
}
|
152
|
-
@mixin SegoeUIVietnameseSemilight {
|
153
|
-
@include SegoeUISemilight("Vietnamese", $ms-font-path-vietnamese);
|
154
|
-
}
|
155
|
-
|
156
|
-
@mixin SegoeUIWestEuropeanLight {
|
157
|
-
@include SegoeUILight("WestEuropean", $ms-font-path-westeuropean);
|
158
|
-
}
|
159
|
-
@mixin SegoeUIWestEuropeanRegular {
|
160
|
-
@include SegoeUIRegular("WestEuropean", $ms-font-path-westeuropean);
|
161
|
-
}
|
162
|
-
@mixin SegoeUIWestEuropeanSemibold {
|
163
|
-
@include SegoeUISemibold("WestEuropean", $ms-font-path-westeuropean);
|
164
|
-
}
|
165
|
-
@mixin SegoeUIWestEuropeanSemilight {
|
166
|
-
@include SegoeUISemilight("WestEuropean", $ms-font-path-westeuropean);
|
167
|
-
}
|
@@ -1,50 +0,0 @@
|
|
1
|
-
// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
|
2
|
-
|
3
|
-
//
|
4
|
-
// Office UI Fabric
|
5
|
-
// --------------------------------------------------
|
6
|
-
// Language override definitions
|
7
|
-
|
8
|
-
|
9
|
-
// A mixin that overrides all of the font classes for languages that
|
10
|
-
// use system fonts. A single font-family is used for all weights.
|
11
|
-
@mixin language-override-system-fonts($lang-code, $font-family) {
|
12
|
-
*[lang="#{$lang-code}"] {
|
13
|
-
.ms-font-mi,
|
14
|
-
.ms-font-xs,
|
15
|
-
.ms-font-s,
|
16
|
-
.ms-font-s-plus,
|
17
|
-
.ms-font-m,
|
18
|
-
.ms-font-m-plus,
|
19
|
-
.ms-font-l,
|
20
|
-
.ms-font-xl,
|
21
|
-
.ms-font-xxl,
|
22
|
-
.ms-font-su,
|
23
|
-
.ms-fontWeight-light,
|
24
|
-
.ms-fontWeight-light-hover:hover,
|
25
|
-
.ms-fontWeight-semilight,
|
26
|
-
.ms-fontWeight-semilight-hover:hover,
|
27
|
-
.ms-fontWeight-regular,
|
28
|
-
.ms-fontWeight-regular-hover:hover,
|
29
|
-
.ms-fontWeight-semibold,
|
30
|
-
.ms-fontWeight-semibold-hover:hover {
|
31
|
-
font-family: $font-family;
|
32
|
-
}
|
33
|
-
}
|
34
|
-
}
|
35
|
-
|
36
|
-
// Variables for each of the non-distributed (native) font stacks.
|
37
|
-
$ms-font-stack-japanese: 'Yu Gothic', 'Meiryo UI', Meiryo, 'MS Pgothic', Osaka, $ms-font-system-base !default;
|
38
|
-
$ms-font-stack-korean: 'Malgun Gothic', Gulim, $ms-font-system-base !default;
|
39
|
-
$ms-font-stack-chinese-simplified: 'Microsoft Yahei', Verdana, Simsun, $ms-font-system-base !default;
|
40
|
-
$ms-font-stack-chinese-traditional: 'Microsoft Jhenghei', Pmingliu, $ms-font-system-base !default;
|
41
|
-
$ms-font-stack-hindi: 'Nirmala UI', $ms-font-system-base !default;
|
42
|
-
|
43
|
-
// Variables for each of the web font stacks.
|
44
|
-
$ms-font-stack-arabic: 'Segoe UI Arabic', $ms-font-family-base !default;
|
45
|
-
$ms-font-stack-cyrillic: 'Segoe UI Cyrillic', $ms-font-family-base !default;
|
46
|
-
$ms-font-stack-eastEuropean: 'Segoe UI EastEuropean', $ms-font-family-base !default;
|
47
|
-
$ms-font-stack-greek: 'Segoe UI Greek', $ms-font-family-base !default;
|
48
|
-
$ms-font-stack-hebrew: 'Segoe UI Hebrew', $ms-font-family-base !default;
|
49
|
-
$ms-font-stack-vietnamese: 'Segoe UI Vietnamese', $ms-font-family-base !default;
|
50
|
-
$ms-font-stack-leelawadee: 'Leelawadee UI', 'Kmer UI', $ms-font-family-base !default;
|
@@ -1,11 +0,0 @@
|
|
1
|
-
// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
|
2
|
-
|
3
|
-
//
|
4
|
-
// Office UI Fabric
|
5
|
-
// --------------------------------------------------
|
6
|
-
// Fabric Core Typography mixins
|
7
|
-
|
8
|
-
@mixin ms-baseFont {
|
9
|
-
font-family: $ms-font-family-base;
|
10
|
-
-webkit-font-smoothing: antialiased;
|
11
|
-
}
|
@@ -1,29 +0,0 @@
|
|
1
|
-
// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
|
2
|
-
|
3
|
-
//
|
4
|
-
// Office UI Fabric
|
5
|
-
// --------------------------------------------------
|
6
|
-
// Fabric Core Typography variables
|
7
|
-
|
8
|
-
$ms-font-system-base: 'Segoe UI', -apple-system, BlinkMacSystemFont, 'Roboto', 'Helvetica Neue', sans-serif !default;
|
9
|
-
$ms-font-family-base: 'Segoe UI WestEuropean', $ms-font-system-base !default;
|
10
|
-
|
11
|
-
$ms-font-weight-light: 100 !default;
|
12
|
-
$ms-font-weight-regular: 400 !default;
|
13
|
-
$ms-font-weight-semilight: 300 !default;
|
14
|
-
$ms-font-weight-semibold: 600 !default;
|
15
|
-
|
16
|
-
|
17
|
-
//== Type sizes
|
18
|
-
//
|
19
|
-
|
20
|
-
$ms-font-size-su: 42px !default;
|
21
|
-
$ms-font-size-xxl: 28px !default;
|
22
|
-
$ms-font-size-xl: 21px !default;
|
23
|
-
$ms-font-size-l: 17px !default;
|
24
|
-
$ms-font-size-m-plus: 15px !default;
|
25
|
-
$ms-font-size-m: 14px !default;
|
26
|
-
$ms-font-size-s-plus: 13px !default;
|
27
|
-
$ms-font-size-s: 12px !default;
|
28
|
-
$ms-font-size-xs: 11px !default;
|
29
|
-
$ms-font-size-mi: 10px !default;
|
@@ -1,76 +0,0 @@
|
|
1
|
-
// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
|
2
|
-
|
3
|
-
//
|
4
|
-
// Office UI Fabric
|
5
|
-
// --------------------------------------------------
|
6
|
-
// Utility classes and mixins used throughout Fabric.
|
7
|
-
|
8
|
-
@import "Fabric.Mixins";
|
9
|
-
|
10
|
-
// The best box is a border box.
|
11
|
-
@mixin ms-u-borderBox {
|
12
|
-
box-sizing: border-box;
|
13
|
-
}
|
14
|
-
|
15
|
-
// For setting the border base width
|
16
|
-
@mixin ms-u-borderBase {
|
17
|
-
border: 1px solid;
|
18
|
-
}
|
19
|
-
|
20
|
-
// Ensures the block expands to the full height to enclose its floated childen.
|
21
|
-
@mixin ms-u-clearfix {
|
22
|
-
*zoom: 1;
|
23
|
-
&::before,
|
24
|
-
&::after {
|
25
|
-
display: table;
|
26
|
-
content: "";
|
27
|
-
line-height: 0;
|
28
|
-
}
|
29
|
-
&::after {
|
30
|
-
clear: both;
|
31
|
-
}
|
32
|
-
}
|
33
|
-
|
34
|
-
// Basic border-box, margin, and padding reset.
|
35
|
-
@mixin ms-u-normalize {
|
36
|
-
@include ms-u-borderBox;
|
37
|
-
@include resetMargins;
|
38
|
-
@include resetPadding;
|
39
|
-
@include resetBoxShadow;
|
40
|
-
}
|
41
|
-
|
42
|
-
// To set various text alignment styles
|
43
|
-
// @param [variable list] $alignments
|
44
|
-
@mixin ms-u-textAlign($alignments...) {
|
45
|
-
@each $align in $alignments {
|
46
|
-
$alignStr: inspect($align);
|
47
|
-
.ms-u-textAlign#{to-upper-case(str-slice($alignStr, 1, 1)) + str-slice($alignStr, 2)} {
|
48
|
-
text-align: $align;
|
49
|
-
}
|
50
|
-
}
|
51
|
-
}
|
52
|
-
|
53
|
-
// To hide content while still making it readable by screen readers (Accessibility)
|
54
|
-
@mixin ms-u-screenReaderOnly {
|
55
|
-
position: absolute;
|
56
|
-
width: 1px;
|
57
|
-
height: 1px;
|
58
|
-
padding: 0;
|
59
|
-
margin: -1px;
|
60
|
-
overflow: hidden;
|
61
|
-
clip: rect(0,0,0,0);
|
62
|
-
border: 0;
|
63
|
-
}
|
64
|
-
|
65
|
-
// To add truncation with ellipsis
|
66
|
-
@mixin ms-u-textTruncate {
|
67
|
-
overflow: hidden;
|
68
|
-
text-overflow: ellipsis;
|
69
|
-
white-space: nowrap;
|
70
|
-
word-wrap: normal; // Fix for IE 8/9 in case 'word-wrap: break-word' is set on parent nodes
|
71
|
-
}
|
72
|
-
|
73
|
-
// To disable text wrapping
|
74
|
-
@mixin ms-u-noWrap {
|
75
|
-
white-space: nowrap;
|
76
|
-
}
|
@@ -1,32 +0,0 @@
|
|
1
|
-
// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
|
2
|
-
|
3
|
-
//
|
4
|
-
// Office UI Fabric
|
5
|
-
// --------------------------------------------------
|
6
|
-
// Z-Index Layeringz
|
7
|
-
|
8
|
-
|
9
|
-
// Base Layer Variables
|
10
|
-
$ms-zIndex-0: 0 !default;
|
11
|
-
$ms-zIndex-1: 100 !default;
|
12
|
-
$ms-zIndex-2: 200 !default;
|
13
|
-
$ms-zIndex-3: 300 !default;
|
14
|
-
$ms-zIndex-4: 400 !default;
|
15
|
-
$ms-zIndex-5: 500 !default;
|
16
|
-
|
17
|
-
// Base Layer Modifier Variables
|
18
|
-
$ms-zIndex-back: 0 !default;
|
19
|
-
$ms-zIndex-middle: 5 !default;
|
20
|
-
$ms-zIndex-front: 10 !default;
|
21
|
-
|
22
|
-
|
23
|
-
// Fabric Component Base Layer Assignments
|
24
|
-
|
25
|
-
$ms-zIndex-Callout: $ms-zIndex-1 !default;
|
26
|
-
$ms-zIndex-ContextualMenu: $ms-zIndex-1 !default;
|
27
|
-
$ms-zIndex-Overlay: $ms-zIndex-2 !default;
|
28
|
-
$ms-zIndex-Panel: $ms-zIndex-3 !default;
|
29
|
-
$ms-zIndex-DatePicker: $ms-zIndex-3 !default;
|
30
|
-
$ms-zIndex-Dialog: $ms-zIndex-3 !default;
|
31
|
-
$ms-zIndex-PeoplePicker: $ms-zIndex-3 !default;
|
32
|
-
$ms-zIndex-Dropdown: $ms-zIndex-4 !default;
|
@@ -1,316 +0,0 @@
|
|
1
|
-
// Copyright (c) Microsoft. All rights reserved. Licensed under the MIT license. See LICENSE in the project root for license information.
|
2
|
-
|
3
|
-
//
|
4
|
-
// Office UI Fabric
|
5
|
-
// --------------------------------------------------
|
6
|
-
// Internationalization mixins
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
// Base left-to-right mixin definition.
|
11
|
-
@mixin LTR {
|
12
|
-
html[dir='ltr'] & {
|
13
|
-
@content;
|
14
|
-
}
|
15
|
-
}
|
16
|
-
|
17
|
-
// Base right-to-left mixin definition.
|
18
|
-
@mixin RTL {
|
19
|
-
html[dir='rtl'] & {
|
20
|
-
@content;
|
21
|
-
}
|
22
|
-
}
|
23
|
-
|
24
|
-
// Use baseRTL on a root element (e.g. page or region) that needs RTL support.
|
25
|
-
@mixin baseRtl {
|
26
|
-
@include RTL {
|
27
|
-
direction: rtl;
|
28
|
-
unicode-bidi: bidi-override;
|
29
|
-
}
|
30
|
-
}
|
31
|
-
|
32
|
-
|
33
|
-
// Common CSS property mixins with support for RTL.
|
34
|
-
// Use to automatically create RTL versions of your properties.
|
35
|
-
|
36
|
-
// Border styles.
|
37
|
-
@mixin border-color($top, $right, $bottom, $left) {
|
38
|
-
border-color: $top $right $bottom $left;
|
39
|
-
|
40
|
-
@include RTL {
|
41
|
-
border-color: $top $left $bottom $right;
|
42
|
-
}
|
43
|
-
}
|
44
|
-
|
45
|
-
@mixin border-left($width, $style, $color) {
|
46
|
-
@include LTR {
|
47
|
-
border-left: $width $style $color;
|
48
|
-
}
|
49
|
-
|
50
|
-
@include RTL {
|
51
|
-
border-right: $width $style $color;
|
52
|
-
}
|
53
|
-
}
|
54
|
-
|
55
|
-
@mixin border-left-color($color) {
|
56
|
-
@include LTR {
|
57
|
-
border-left-color: $color;
|
58
|
-
}
|
59
|
-
|
60
|
-
@include RTL {
|
61
|
-
border-right-color: $color;
|
62
|
-
}
|
63
|
-
}
|
64
|
-
|
65
|
-
@mixin border-left-style($style) {
|
66
|
-
@include LTR {
|
67
|
-
border-left-style: $style;
|
68
|
-
}
|
69
|
-
|
70
|
-
@include RTL {
|
71
|
-
border-right-style: $style;
|
72
|
-
}
|
73
|
-
}
|
74
|
-
|
75
|
-
@mixin border-left-width($width) {
|
76
|
-
@include LTR {
|
77
|
-
border-left-width: $width;
|
78
|
-
}
|
79
|
-
|
80
|
-
@include RTL {
|
81
|
-
border-right-width: $width;
|
82
|
-
}
|
83
|
-
}
|
84
|
-
|
85
|
-
@mixin border-radius($topLeft, $topRight, $bottomRight, $bottomLeft) {
|
86
|
-
border-radius: $topLeft $topRight $bottomRight $bottomLeft;
|
87
|
-
|
88
|
-
@include RTL {
|
89
|
-
border-radius: $topRight $topLeft $bottomLeft $bottomRight;
|
90
|
-
}
|
91
|
-
}
|
92
|
-
|
93
|
-
@mixin border-right($width, $style, $color) {
|
94
|
-
@include LTR {
|
95
|
-
border-right: $width $style $color;
|
96
|
-
}
|
97
|
-
|
98
|
-
@include RTL {
|
99
|
-
border-left: $width $style $color;
|
100
|
-
}
|
101
|
-
}
|
102
|
-
|
103
|
-
@mixin border-right-color($color) {
|
104
|
-
@include LTR {
|
105
|
-
border-right-color: $color;
|
106
|
-
}
|
107
|
-
|
108
|
-
@include RTL {
|
109
|
-
border-left-color: $color;
|
110
|
-
}
|
111
|
-
}
|
112
|
-
|
113
|
-
@mixin border-right-style($style) {
|
114
|
-
@include LTR {
|
115
|
-
border-right-style: $style;
|
116
|
-
}
|
117
|
-
|
118
|
-
@include RTL {
|
119
|
-
border-left-style: $style;
|
120
|
-
}
|
121
|
-
}
|
122
|
-
|
123
|
-
@mixin border-right-width($width) {
|
124
|
-
@include LTR {
|
125
|
-
border-right-width: $width;
|
126
|
-
}
|
127
|
-
|
128
|
-
@include RTL {
|
129
|
-
border-left-width: $width;
|
130
|
-
}
|
131
|
-
}
|
132
|
-
|
133
|
-
// Floats.
|
134
|
-
@mixin clear($side) {
|
135
|
-
@if $side == left {
|
136
|
-
@include LTR {
|
137
|
-
clear: $side;
|
138
|
-
}
|
139
|
-
|
140
|
-
@include RTL {
|
141
|
-
clear: right;
|
142
|
-
}
|
143
|
-
} @else if $side == right {
|
144
|
-
@include LTR {
|
145
|
-
clear: $side;
|
146
|
-
}
|
147
|
-
|
148
|
-
@include RTL {
|
149
|
-
clear: left;
|
150
|
-
}
|
151
|
-
} @else {
|
152
|
-
clear: $side;
|
153
|
-
}
|
154
|
-
}
|
155
|
-
|
156
|
-
@mixin float($direction) {
|
157
|
-
@if $direction == left {
|
158
|
-
@include LTR {
|
159
|
-
float: left;
|
160
|
-
}
|
161
|
-
|
162
|
-
@include RTL {
|
163
|
-
float: right;
|
164
|
-
}
|
165
|
-
} @else {
|
166
|
-
@include LTR {
|
167
|
-
float: right;
|
168
|
-
}
|
169
|
-
|
170
|
-
@include RTL {
|
171
|
-
float: left;
|
172
|
-
}
|
173
|
-
}
|
174
|
-
}
|
175
|
-
|
176
|
-
// Positioning.
|
177
|
-
@mixin left($distance) {
|
178
|
-
@include LTR {
|
179
|
-
left: $distance;
|
180
|
-
}
|
181
|
-
|
182
|
-
@include RTL {
|
183
|
-
right: $distance;
|
184
|
-
}
|
185
|
-
}
|
186
|
-
|
187
|
-
@mixin right($distance) {
|
188
|
-
@include LTR {
|
189
|
-
right: $distance;
|
190
|
-
}
|
191
|
-
|
192
|
-
@include RTL {
|
193
|
-
left: $distance;
|
194
|
-
}
|
195
|
-
}
|
196
|
-
|
197
|
-
// Margins.
|
198
|
-
@mixin margin($top, $right, $bottom, $left) {
|
199
|
-
margin: $top $right $bottom $left;
|
200
|
-
|
201
|
-
@include RTL {
|
202
|
-
margin: $top $left $bottom $right;
|
203
|
-
}
|
204
|
-
}
|
205
|
-
|
206
|
-
@mixin margin-left($distance) {
|
207
|
-
@include LTR {
|
208
|
-
margin-left: $distance;
|
209
|
-
}
|
210
|
-
|
211
|
-
@include RTL {
|
212
|
-
margin-right: $distance;
|
213
|
-
}
|
214
|
-
}
|
215
|
-
|
216
|
-
@mixin margin-right($distance) {
|
217
|
-
@include LTR {
|
218
|
-
margin-right: $distance;
|
219
|
-
}
|
220
|
-
@include RTL {
|
221
|
-
margin-left: $distance;
|
222
|
-
}
|
223
|
-
}
|
224
|
-
|
225
|
-
// Padding.
|
226
|
-
@mixin padding($top, $right, $bottom, $left) {
|
227
|
-
padding: $top $right $bottom $left;
|
228
|
-
|
229
|
-
@include RTL {
|
230
|
-
padding: $top $left $bottom $right;
|
231
|
-
}
|
232
|
-
}
|
233
|
-
|
234
|
-
@mixin padding-left($distance) {
|
235
|
-
@include LTR {
|
236
|
-
padding-left: $distance;
|
237
|
-
}
|
238
|
-
|
239
|
-
@include RTL {
|
240
|
-
padding-right: $distance;
|
241
|
-
}
|
242
|
-
}
|
243
|
-
|
244
|
-
@mixin padding-right($distance) {
|
245
|
-
@include LTR {
|
246
|
-
padding-right: $distance;
|
247
|
-
}
|
248
|
-
|
249
|
-
@include RTL {
|
250
|
-
padding-left: $distance;
|
251
|
-
}
|
252
|
-
}
|
253
|
-
|
254
|
-
// Text-alignment.
|
255
|
-
@mixin text-align($direction) {
|
256
|
-
@if $direction == left {
|
257
|
-
@include LTR {
|
258
|
-
text-align: left;
|
259
|
-
}
|
260
|
-
|
261
|
-
@include RTL {
|
262
|
-
text-align: right;
|
263
|
-
}
|
264
|
-
} @else {
|
265
|
-
@include LTR {
|
266
|
-
text-align: right;
|
267
|
-
}
|
268
|
-
|
269
|
-
@include RTL {
|
270
|
-
text-align: left;
|
271
|
-
}
|
272
|
-
}
|
273
|
-
}
|
274
|
-
|
275
|
-
// Box-shadow.
|
276
|
-
@mixin box-shadow($left, $etc) {
|
277
|
-
@include LTR {
|
278
|
-
box-shadow: $left $etc;
|
279
|
-
}
|
280
|
-
|
281
|
-
@include RTL {
|
282
|
-
box-shadow: -$left $etc;
|
283
|
-
}
|
284
|
-
}
|
285
|
-
|
286
|
-
// Transforms.
|
287
|
-
@mixin transform-rtl() {
|
288
|
-
@include LTR {
|
289
|
-
transform: scaleX(1);
|
290
|
-
}
|
291
|
-
|
292
|
-
@include RTL {
|
293
|
-
transform: scaleX(-1);
|
294
|
-
}
|
295
|
-
}
|
296
|
-
|
297
|
-
// Transitions. Only supported when ONLY left/right are declared
|
298
|
-
@mixin transition-property($direction) {
|
299
|
-
@if $direction == left {
|
300
|
-
@include LTR {
|
301
|
-
transition-property: left;
|
302
|
-
}
|
303
|
-
|
304
|
-
@include RTL {
|
305
|
-
transition-property: right;
|
306
|
-
}
|
307
|
-
} @else {
|
308
|
-
@include LTR {
|
309
|
-
transition-property: right;
|
310
|
-
}
|
311
|
-
|
312
|
-
@include RTL {
|
313
|
-
transition-property: left;
|
314
|
-
}
|
315
|
-
}
|
316
|
-
}
|