@redhat-cloud-services/frontend-components-advisor-components 1.0.4 → 1.0.5

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.
Files changed (7) hide show
  1. package/ReportDetails/ReportDetails.css +37 -9
  2. package/ReportDetails/ReportDetails.scss +38 -6
  3. package/cypress/plugins/index.js +7 -0
  4. package/cypress/support/index.js +1 -0
  5. package/esm/ReportDetails/ReportDetails.css +37 -9
  6. package/esm/ReportDetails/ReportDetails.scss +38 -6
  7. package/package.json +3 -2
package/ReportDetails/ReportDetails.css CHANGED
@@ -14,16 +14,44 @@
14
14
  .ins-c-report-details__cards-stack pre code {
15
15
  white-space: pre-wrap;
16
16
  }
17
- .ins-c-report-details__cards-stack ol {
18
- margin-top: 10px;
19
- margin-top: 0.625rem;
20
- margin-left: 15px;
21
- margin-left: 0.9375rem;
17
+ .ins-c-report-details__cards-stack p,
18
+ .ins-c-report-details__cards-stack ul,
19
+ .ins-c-report-details__cards-stack ol,
20
+ .ins-c-report-details__cards-stack li,
21
+ .ins-c-report-details__cards-stack dl,
22
+ .ins-c-report-details__cards-stack dt,
23
+ .ins-c-report-details__cards-stack dd,
24
+ .ins-c-report-details__cards-stack blockquote,
25
+ .ins-c-report-details__cards-stack figure,
26
+ .ins-c-report-details__cards-stack fieldset,
27
+ .ins-c-report-details__cards-stack legend,
28
+ .ins-c-report-details__cards-stack textarea,
29
+ .ins-c-report-details__cards-stack iframe,
30
+ .ins-c-report-details__cards-stack hr {
31
+ margin: revert;
32
+ padding: revert;
22
33
  }
23
- .ins-c-report-details__cards-stack pre + p,
24
- .ins-c-report-details__cards-stack pre + ul {
25
- margin-top: 10px;
26
- margin-top: 0.625rem;
34
+ .ins-c-report-details__cards-stack h1,
35
+ .ins-c-report-details__cards-stack h2,
36
+ .ins-c-report-details__cards-stack h3,
37
+ .ins-c-report-details__cards-stack h4,
38
+ .ins-c-report-details__cards-stack h5,
39
+ .ins-c-report-details__cards-stack h6 {
40
+ font-family: var(--pf-global--FontFamily--heading--sans-serif);
41
+ line-height: 1.5;
42
+ }
43
+ .ins-c-report-details__cards-stack h1 {
44
+ font-size: var(--pf-global--FontSize--2xl);
45
+ line-height: 1.3;
46
+ }
47
+ .ins-c-report-details__cards-stack h2 {
48
+ font-size: var(--pf-global--FontSize--xl);
49
+ }
50
+ .ins-c-report-details__cards-stack h3 {
51
+ font-size: var(--pf-global--FontSize--lg);
52
+ }
53
+ .ins-c-report-details__cards-stack h4, .ins-c-report-details__cards-stack h5, .ins-c-report-details__cards-stack h6 {
54
+ font-size: var(--pf-global--FontSize--md);
27
55
  }
28
56
  .ins-c-report-details__cards-stack .pf-c-list {
29
57
  margin: 5px 0px;
package/ReportDetails/ReportDetails.scss CHANGED
@@ -18,14 +18,46 @@
18
18
  }
19
19
  }
20
20
 
21
- ol {
22
- @include rem('margin-top', 10px);
23
- @include rem('margin-left', 15px);
21
+ p,
22
+ ul,
23
+ ol,
24
+ li,
25
+ dl,
26
+ dt,
27
+ dd,
28
+ blockquote,
29
+ figure,
30
+ fieldset,
31
+ legend,
32
+ textarea,
33
+ iframe,
34
+ hr {
35
+ margin: revert;
36
+ padding: revert;
24
37
  }
25
38
 
26
- pre + p,
27
- pre + ul {
28
- @include rem('margin-top', 10px);
39
+ h1,
40
+ h2,
41
+ h3,
42
+ h4,
43
+ h5,
44
+ h6 {
45
+ font-family: var(--pf-global--FontFamily--heading--sans-serif);
46
+ line-height: 1.5;
47
+ }
48
+
49
+ h1 {
50
+ font-size: var(--pf-global--FontSize--2xl);
51
+ line-height: 1.3;
52
+ }
53
+ h2 {
54
+ font-size: var(--pf-global--FontSize--xl);
55
+ }
56
+ h3 {
57
+ font-size: var(--pf-global--FontSize--lg);
58
+ }
59
+ h4, h5, h6 {
60
+ font-size: var(--pf-global--FontSize--md);
29
61
  }
30
62
 
31
63
  .pf-c-list {
package/cypress/plugins/index.js CHANGED
@@ -12,6 +12,10 @@
12
12
  // This function is called when a project is opened or re-opened (e.g. due to
13
13
  // the project's config changing)
14
14
 
15
+ const {
16
+ initPlugin
17
+ } = require('@frsource/cypress-plugin-visual-regression-diff/plugins');
18
+
15
19
  /**
16
20
  * @type {Cypress.PluginConfig}
17
21
  */
@@ -19,6 +23,9 @@
19
23
  module.exports = (on, config) => {
20
24
  // `on` is used to hook into various events Cypress emits
21
25
  // `config` is the resolved Cypress config
26
+
27
+ initPlugin(on, config);
28
+
22
29
  if (config.testingType === 'component') {
23
30
  const { startDevServer } = require('@cypress/webpack-dev-server')
24
31
 
package/cypress/support/index.js CHANGED
@@ -16,6 +16,7 @@
16
16
  // Import commands.js using ES2015 syntax:
17
17
  import './commands';
18
18
  import '@patternfly/patternfly/patternfly.scss';
19
+ import '@frsource/cypress-plugin-visual-regression-diff';
19
20
 
20
21
  // Alternatively you can use CommonJS syntax:
21
22
  // require('./commands')
package/esm/ReportDetails/ReportDetails.css CHANGED
@@ -14,16 +14,44 @@
14
14
  .ins-c-report-details__cards-stack pre code {
15
15
  white-space: pre-wrap;
16
16
  }
17
- .ins-c-report-details__cards-stack ol {
18
- margin-top: 10px;
19
- margin-top: 0.625rem;
20
- margin-left: 15px;
21
- margin-left: 0.9375rem;
17
+ .ins-c-report-details__cards-stack p,
18
+ .ins-c-report-details__cards-stack ul,
19
+ .ins-c-report-details__cards-stack ol,
20
+ .ins-c-report-details__cards-stack li,
21
+ .ins-c-report-details__cards-stack dl,
22
+ .ins-c-report-details__cards-stack dt,
23
+ .ins-c-report-details__cards-stack dd,
24
+ .ins-c-report-details__cards-stack blockquote,
25
+ .ins-c-report-details__cards-stack figure,
26
+ .ins-c-report-details__cards-stack fieldset,
27
+ .ins-c-report-details__cards-stack legend,
28
+ .ins-c-report-details__cards-stack textarea,
29
+ .ins-c-report-details__cards-stack iframe,
30
+ .ins-c-report-details__cards-stack hr {
31
+ margin: revert;
32
+ padding: revert;
22
33
  }
23
- .ins-c-report-details__cards-stack pre + p,
24
- .ins-c-report-details__cards-stack pre + ul {
25
- margin-top: 10px;
26
- margin-top: 0.625rem;
34
+ .ins-c-report-details__cards-stack h1,
35
+ .ins-c-report-details__cards-stack h2,
36
+ .ins-c-report-details__cards-stack h3,
37
+ .ins-c-report-details__cards-stack h4,
38
+ .ins-c-report-details__cards-stack h5,
39
+ .ins-c-report-details__cards-stack h6 {
40
+ font-family: var(--pf-global--FontFamily--heading--sans-serif);
41
+ line-height: 1.5;
42
+ }
43
+ .ins-c-report-details__cards-stack h1 {
44
+ font-size: var(--pf-global--FontSize--2xl);
45
+ line-height: 1.3;
46
+ }
47
+ .ins-c-report-details__cards-stack h2 {
48
+ font-size: var(--pf-global--FontSize--xl);
49
+ }
50
+ .ins-c-report-details__cards-stack h3 {
51
+ font-size: var(--pf-global--FontSize--lg);
52
+ }
53
+ .ins-c-report-details__cards-stack h4, .ins-c-report-details__cards-stack h5, .ins-c-report-details__cards-stack h6 {
54
+ font-size: var(--pf-global--FontSize--md);
27
55
  }
28
56
  .ins-c-report-details__cards-stack .pf-c-list {
29
57
  margin: 5px 0px;
package/esm/ReportDetails/ReportDetails.scss CHANGED
@@ -18,14 +18,46 @@
18
18
  }
19
19
  }
20
20
 
21
- ol {
22
- @include rem('margin-top', 10px);
23
- @include rem('margin-left', 15px);
21
+ p,
22
+ ul,
23
+ ol,
24
+ li,
25
+ dl,
26
+ dt,
27
+ dd,
28
+ blockquote,
29
+ figure,
30
+ fieldset,
31
+ legend,
32
+ textarea,
33
+ iframe,
34
+ hr {
35
+ margin: revert;
36
+ padding: revert;
24
37
  }
25
38
 
26
- pre + p,
27
- pre + ul {
28
- @include rem('margin-top', 10px);
39
+ h1,
40
+ h2,
41
+ h3,
42
+ h4,
43
+ h5,
44
+ h6 {
45
+ font-family: var(--pf-global--FontFamily--heading--sans-serif);
46
+ line-height: 1.5;
47
+ }
48
+
49
+ h1 {
50
+ font-size: var(--pf-global--FontSize--2xl);
51
+ line-height: 1.3;
52
+ }
53
+ h2 {
54
+ font-size: var(--pf-global--FontSize--xl);
55
+ }
56
+ h3 {
57
+ font-size: var(--pf-global--FontSize--lg);
58
+ }
59
+ h4, h5, h6 {
60
+ font-size: var(--pf-global--FontSize--md);
29
61
  }
30
62
 
31
63
  .pf-c-list {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@redhat-cloud-services/frontend-components-advisor-components",
3
- "version": "1.0.4",
3
+ "version": "1.0.5",
4
4
  "description": "Components to be used in Advisor applications and integrations.",
5
5
  "main": "index.js",
6
6
  "module": "esm/index.js",
@@ -14,7 +14,8 @@
14
14
  "build:css": "node ../../scripts/build-styles.js",
15
15
  "build:packages": "node ../../scripts/build-packages.js --forceTypes",
16
16
  "start": "concurrently \"npm run build:esm -- --watch\" \"npm run build:js -- --watch\" \"npm run build:css -- --watch\"",
17
- "test:ct": "cypress run-ct"
17
+ "test:ct": "cypress run-ct",
18
+ "test:openct": "cypress open-ct"
18
19
  },
19
20
  "repository": {
20
21
  "type": "git",