q2-tecton-theme 1.31.0 → 1.32.1
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/package.json
CHANGED
|
@@ -1,11 +1,13 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "q2-tecton-theme",
|
|
3
|
-
"version": "1.
|
|
4
|
-
"description": "
|
|
3
|
+
"version": "1.32.1",
|
|
4
|
+
"description": "Base tecton theme css and styling utilities",
|
|
5
|
+
"license": "MIT",
|
|
6
|
+
"author": "Q2 Tecton Team",
|
|
5
7
|
"main": "./dist/q2-tecton-theme.css",
|
|
6
8
|
"publishConfig": {
|
|
7
|
-
"
|
|
8
|
-
"
|
|
9
|
+
"access": "public",
|
|
10
|
+
"registry": "https://registry.npmjs.org"
|
|
9
11
|
},
|
|
10
12
|
"scripts": {
|
|
11
13
|
"build": "npm run clean && rollup --config rollup.config.js --bundleConfigAsCjs",
|
|
@@ -14,8 +16,6 @@
|
|
|
14
16
|
"build:prod": "npm run build",
|
|
15
17
|
"clean": "rm -rf ./dist"
|
|
16
18
|
},
|
|
17
|
-
"author": "Q2 Tecton Team",
|
|
18
|
-
"license": "ISC",
|
|
19
19
|
"dependencies": {
|
|
20
20
|
"rollup": "^3.2.5",
|
|
21
21
|
"rollup-plugin-scss": "^3.0.0",
|
|
@@ -24,5 +24,5 @@
|
|
|
24
24
|
"devDependencies": {
|
|
25
25
|
"sass": "^1.62.1"
|
|
26
26
|
},
|
|
27
|
-
"gitHead": "
|
|
27
|
+
"gitHead": "bda0052631f02e89c24ae61c60c8a9c29e3887b7"
|
|
28
28
|
}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
// Creates a collection of classes that alter the display property of an element based on screen size
|
|
2
|
+
@mixin functionalDisplay($name, $value, $breakpoint: null) {
|
|
3
|
+
$argument-map: (
|
|
4
|
+
value: $name,
|
|
5
|
+
breakpoint-name: $breakpoint,
|
|
6
|
+
);
|
|
7
|
+
|
|
8
|
+
.#{build-class-name(map-merge((context: $display-alias), $argument-map)...)} {
|
|
9
|
+
display: $value;
|
|
10
|
+
}
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
$display-map: (
|
|
14
|
+
none: none,
|
|
15
|
+
inline: inline,
|
|
16
|
+
block: block,
|
|
17
|
+
inline-block: inline-block,
|
|
18
|
+
);
|
|
19
|
+
|
|
20
|
+
// Generates classes for setting display property across all screen sizes
|
|
21
|
+
@each $display, $displayValue in $display-map {
|
|
22
|
+
@include functionalDisplay($display, $displayValue);
|
|
23
|
+
}
|
|
24
|
+
|
|
25
|
+
// Generates a media query for each breakpoint, and generates classes within the breakpoint that define the display property's value at that screen size
|
|
26
|
+
@each $breakpoint in $breakpoint-map {
|
|
27
|
+
@include breakpoint($breakpoint) {
|
|
28
|
+
@each $display, $displayValue in $display-map {
|
|
29
|
+
@include functionalDisplay($display, $displayValue, $breakpoint);
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
// Generates classes that define the display property when printing the page
|
|
35
|
+
@media print {
|
|
36
|
+
@each $display, $displayValue in $display-map {
|
|
37
|
+
@include functionalDisplay($display, $displayValue, $print-alias);
|
|
38
|
+
}
|
|
39
|
+
}
|
|
@@ -40,7 +40,7 @@
|
|
|
40
40
|
--t-base: #ffffff;
|
|
41
41
|
--t-text: #4d4d4d;
|
|
42
42
|
--t-textA: rgba(77, 77, 77, 0.77);
|
|
43
|
-
--t-a11y-gray-color-AAA: #
|
|
43
|
+
--t-a11y-gray-color-AAA: #6c6c6c;
|
|
44
44
|
--t-a11y-gray-color-AA: #949494;
|
|
45
45
|
--t-a11y-active-gray-color-AA: #404040;
|
|
46
46
|
--t-primary-text: #ffffff;
|