@microsoft/atlas-css 3.34.0 → 3.34.2
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.
- package/dist/class-names.json +1 -1
- package/dist/index.css +1 -1
- package/dist/index.css.map +1 -1
- package/package.json +7 -7
- package/src/atomics/colors.scss +10 -2
- package/src/atomics/image.scss +4 -0
- package/src/mixins/media-queries.scss +7 -7
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@microsoft/atlas-css",
|
|
3
|
-
"version": "3.34.
|
|
3
|
+
"version": "3.34.2",
|
|
4
4
|
"description": "Styles backing the Atlas Design System used by Microsoft's Developer Relations.",
|
|
5
5
|
"scripts": {
|
|
6
6
|
"test": "echo \"Error: no test specified\" && exit 1",
|
|
@@ -73,17 +73,17 @@
|
|
|
73
73
|
"license": "MIT",
|
|
74
74
|
"devDependencies": {
|
|
75
75
|
"@microsoft/stylelint-config-atlas": "4.1.0",
|
|
76
|
-
"@parcel/transformer-sass": "^2.
|
|
76
|
+
"@parcel/transformer-sass": "^2.9.3",
|
|
77
77
|
"css-tree": "^2.3.1",
|
|
78
78
|
"eslint-plugin-security": "^1.7.1",
|
|
79
79
|
"fs-extra": "^11.1.1",
|
|
80
|
-
"parcel": "^2.
|
|
81
|
-
"lightningcss": "1.
|
|
82
|
-
"prettier": "^2.8.
|
|
83
|
-
"quicktype-core": "^23.0.
|
|
80
|
+
"parcel": "^2.9.3",
|
|
81
|
+
"lightningcss": "1.21.1",
|
|
82
|
+
"prettier": "^2.8.8",
|
|
83
|
+
"quicktype-core": "^23.0.48",
|
|
84
84
|
"grass": "^1.0.2",
|
|
85
85
|
"sass-export": "^2.1.2",
|
|
86
|
-
"stylelint": "^
|
|
86
|
+
"stylelint": "^15.9.0",
|
|
87
87
|
"stylelint-config-prettier": "^9.0.5",
|
|
88
88
|
"stylelint-prettier": "^3.0.0",
|
|
89
89
|
"wireit": "^0.9.5"
|
package/src/atomics/colors.scss
CHANGED
|
@@ -9,12 +9,20 @@
|
|
|
9
9
|
$invert: nth($color-set, $color-index-invert);
|
|
10
10
|
|
|
11
11
|
.color-#{$name} {
|
|
12
|
-
|
|
12
|
+
@if $name == 'warning' {
|
|
13
|
+
color: $active !important;
|
|
14
|
+
} @else {
|
|
15
|
+
color: $base !important;
|
|
16
|
+
}
|
|
13
17
|
}
|
|
14
18
|
|
|
15
19
|
a.color-#{$name} {
|
|
16
20
|
&:hover {
|
|
17
|
-
|
|
21
|
+
@if $name == 'warning' {
|
|
22
|
+
color: $active !important;
|
|
23
|
+
} @else {
|
|
24
|
+
color: $hover !important;
|
|
25
|
+
}
|
|
18
26
|
}
|
|
19
27
|
|
|
20
28
|
@include focus-visible {
|
package/src/atomics/image.scss
CHANGED
|
@@ -1,22 +1,22 @@
|
|
|
1
1
|
// Orientation
|
|
2
2
|
|
|
3
3
|
@mixin orientation-portrait {
|
|
4
|
-
@media screen and (
|
|
5
|
-
screen and (
|
|
4
|
+
@media screen and (aspect-ratio <= 1/1),
|
|
5
|
+
screen and (resolution >= 120dpi) and (aspect-ratio <= 1/1) {
|
|
6
6
|
@content;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
@mixin orientation-landscape {
|
|
11
|
-
@media screen and (
|
|
12
|
-
screen and (
|
|
11
|
+
@media screen and (aspect-ratio >= 1/1),
|
|
12
|
+
screen and (resolution >= 120dpi) and (aspect-ratio >= 1/1) {
|
|
13
13
|
@content;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
|
|
17
17
|
@mixin orientation-square {
|
|
18
|
-
@media screen and (aspect-ratio
|
|
19
|
-
screen and (
|
|
18
|
+
@media screen and (aspect-ratio <= 1/1),
|
|
19
|
+
screen and (resolution >= 120dpi) and (aspect-ratio <= 1/1) {
|
|
20
20
|
@content;
|
|
21
21
|
}
|
|
22
22
|
}
|
|
@@ -43,7 +43,7 @@
|
|
|
43
43
|
|
|
44
44
|
// Please avoid using this mixin if possible. It doesn't follow the mobile-first approach to writing CSS.
|
|
45
45
|
@mixin discouraged-mobile {
|
|
46
|
-
@media screen and (max-width: $breakpoint-tablet - 1px) {
|
|
46
|
+
@media screen and (max-width: ($breakpoint-tablet - 1px)) {
|
|
47
47
|
@content;
|
|
48
48
|
}
|
|
49
49
|
}
|