diff --git a/e2e/busy-screen.e2e.ts-snapshots/Should-hide-spinner-1-Google-Chrome-linux.png b/e2e/busy-screen.e2e.ts-snapshots/Should-hide-spinner-1-Google-Chrome-linux.png index f14b105d..c56152af 100644 Binary files a/e2e/busy-screen.e2e.ts-snapshots/Should-hide-spinner-1-Google-Chrome-linux.png and b/e2e/busy-screen.e2e.ts-snapshots/Should-hide-spinner-1-Google-Chrome-linux.png differ diff --git a/e2e/checkbox.e2e.ts-snapshots/Should-display-default-behavior-1-Google-Chrome-linux.png b/e2e/checkbox.e2e.ts-snapshots/Should-display-default-behavior-1-Google-Chrome-linux.png index a0cd1558..81b9d9b5 100644 Binary files a/e2e/checkbox.e2e.ts-snapshots/Should-display-default-behavior-1-Google-Chrome-linux.png and b/e2e/checkbox.e2e.ts-snapshots/Should-display-default-behavior-1-Google-Chrome-linux.png differ diff --git a/e2e/external-link.e2e.ts-snapshots/External-link-is-displayed-with-an-icon-1-Google-Chrome-linux.png b/e2e/external-link.e2e.ts-snapshots/External-link-is-displayed-with-an-icon-1-Google-Chrome-linux.png index e03e2c8c..c8bc265c 100644 Binary files a/e2e/external-link.e2e.ts-snapshots/External-link-is-displayed-with-an-icon-1-Google-Chrome-linux.png and b/e2e/external-link.e2e.ts-snapshots/External-link-is-displayed-with-an-icon-1-Google-Chrome-linux.png differ diff --git a/e2e/menu.e2e.ts-snapshots/Menu-can-be-collapsed-1-Google-Chrome-linux.png b/e2e/menu.e2e.ts-snapshots/Menu-can-be-collapsed-1-Google-Chrome-linux.png index c0ed3de8..ee31dede 100644 Binary files a/e2e/menu.e2e.ts-snapshots/Menu-can-be-collapsed-1-Google-Chrome-linux.png and b/e2e/menu.e2e.ts-snapshots/Menu-can-be-collapsed-1-Google-Chrome-linux.png differ diff --git a/e2e/menu.e2e.ts-snapshots/Menu-is-expanded-per-default-1-Google-Chrome-linux.png b/e2e/menu.e2e.ts-snapshots/Menu-is-expanded-per-default-1-Google-Chrome-linux.png index 4672ad84..7e430996 100644 Binary files a/e2e/menu.e2e.ts-snapshots/Menu-is-expanded-per-default-1-Google-Chrome-linux.png and b/e2e/menu.e2e.ts-snapshots/Menu-is-expanded-per-default-1-Google-Chrome-linux.png differ diff --git a/e2e/page-banner.e2e.ts-snapshots/Should-display-default-behavior-1-Google-Chrome-linux.png b/e2e/page-banner.e2e.ts-snapshots/Should-display-default-behavior-1-Google-Chrome-linux.png index 9ba883e0..da690f98 100644 Binary files a/e2e/page-banner.e2e.ts-snapshots/Should-display-default-behavior-1-Google-Chrome-linux.png and b/e2e/page-banner.e2e.ts-snapshots/Should-display-default-behavior-1-Google-Chrome-linux.png differ diff --git a/e2e/popover.e2e.ts-snapshots/Should-render-close-button-1-Google-Chrome-linux.png b/e2e/popover.e2e.ts-snapshots/Should-render-close-button-1-Google-Chrome-linux.png index ce101166..1a17ed1a 100644 Binary files a/e2e/popover.e2e.ts-snapshots/Should-render-close-button-1-Google-Chrome-linux.png and b/e2e/popover.e2e.ts-snapshots/Should-render-close-button-1-Google-Chrome-linux.png differ diff --git a/e2e/progress-bar.e2e.ts-snapshots/Should-render-progress-bars-1-Google-Chrome-linux.png b/e2e/progress-bar.e2e.ts-snapshots/Should-render-progress-bars-1-Google-Chrome-linux.png index c8f52b18..6e4e4673 100644 Binary files a/e2e/progress-bar.e2e.ts-snapshots/Should-render-progress-bars-1-Google-Chrome-linux.png and b/e2e/progress-bar.e2e.ts-snapshots/Should-render-progress-bars-1-Google-Chrome-linux.png differ diff --git a/e2e/progress-steps.e2e.ts-snapshots/All-steps-are-completed-1-Google-Chrome-linux.png b/e2e/progress-steps.e2e.ts-snapshots/All-steps-are-completed-1-Google-Chrome-linux.png index 13f29888..4d1eaba2 100644 Binary files a/e2e/progress-steps.e2e.ts-snapshots/All-steps-are-completed-1-Google-Chrome-linux.png and b/e2e/progress-steps.e2e.ts-snapshots/All-steps-are-completed-1-Google-Chrome-linux.png differ diff --git a/e2e/progress-steps.e2e.ts-snapshots/Second-step-is-in-progress-1-Google-Chrome-linux.png b/e2e/progress-steps.e2e.ts-snapshots/Second-step-is-in-progress-1-Google-Chrome-linux.png index c5e8afeb..4d0631e1 100644 Binary files a/e2e/progress-steps.e2e.ts-snapshots/Second-step-is-in-progress-1-Google-Chrome-linux.png and b/e2e/progress-steps.e2e.ts-snapshots/Second-step-is-in-progress-1-Google-Chrome-linux.png differ diff --git a/e2e/qr-code-generator.e2e.ts-snapshots/QR-code-renders-https-identity-ic0-app-1-Google-Chrome-linux.png b/e2e/qr-code-generator.e2e.ts-snapshots/QR-code-renders-https-identity-ic0-app-1-Google-Chrome-linux.png index 6b863e1d..bb802724 100644 Binary files a/e2e/qr-code-generator.e2e.ts-snapshots/QR-code-renders-https-identity-ic0-app-1-Google-Chrome-linux.png and b/e2e/qr-code-generator.e2e.ts-snapshots/QR-code-renders-https-identity-ic0-app-1-Google-Chrome-linux.png differ diff --git a/e2e/qr-code-generator.e2e.ts-snapshots/QR-code-renders-https-nns-ic0-app-1-Google-Chrome-linux.png b/e2e/qr-code-generator.e2e.ts-snapshots/QR-code-renders-https-nns-ic0-app-1-Google-Chrome-linux.png index 92dd1d76..a77a4d34 100644 Binary files a/e2e/qr-code-generator.e2e.ts-snapshots/QR-code-renders-https-nns-ic0-app-1-Google-Chrome-linux.png and b/e2e/qr-code-generator.e2e.ts-snapshots/QR-code-renders-https-nns-ic0-app-1-Google-Chrome-linux.png differ diff --git a/e2e/qr-code-reader.e2e.ts-snapshots/Read-QR-code-display-a-mirrored-video-1-Google-Chrome-linux.png b/e2e/qr-code-reader.e2e.ts-snapshots/Read-QR-code-display-a-mirrored-video-1-Google-Chrome-linux.png index 76ad3934..52270f60 100644 Binary files a/e2e/qr-code-reader.e2e.ts-snapshots/Read-QR-code-display-a-mirrored-video-1-Google-Chrome-linux.png and b/e2e/qr-code-reader.e2e.ts-snapshots/Read-QR-code-display-a-mirrored-video-1-Google-Chrome-linux.png differ diff --git a/e2e/qr-code-reader.e2e.ts-snapshots/Read-QR-code-value-with-camera-1-Google-Chrome-linux.png b/e2e/qr-code-reader.e2e.ts-snapshots/Read-QR-code-value-with-camera-1-Google-Chrome-linux.png index eb6e3bda..e408c814 100644 Binary files a/e2e/qr-code-reader.e2e.ts-snapshots/Read-QR-code-value-with-camera-1-Google-Chrome-linux.png and b/e2e/qr-code-reader.e2e.ts-snapshots/Read-QR-code-value-with-camera-1-Google-Chrome-linux.png differ diff --git a/e2e/qr-code-reader.e2e.ts-snapshots/Read-QR-throws-error-Google-Chrome-linux.png b/e2e/qr-code-reader.e2e.ts-snapshots/Read-QR-throws-error-Google-Chrome-linux.png index 0134f795..ff1f989b 100644 Binary files a/e2e/qr-code-reader.e2e.ts-snapshots/Read-QR-throws-error-Google-Chrome-linux.png and b/e2e/qr-code-reader.e2e.ts-snapshots/Read-QR-throws-error-Google-Chrome-linux.png differ diff --git a/e2e/segment.e2e.ts-snapshots/First-segment-is-selected-1-Google-Chrome-linux.png b/e2e/segment.e2e.ts-snapshots/First-segment-is-selected-1-Google-Chrome-linux.png index 1fd8e8f4..9b0bf0cb 100644 Binary files a/e2e/segment.e2e.ts-snapshots/First-segment-is-selected-1-Google-Chrome-linux.png and b/e2e/segment.e2e.ts-snapshots/First-segment-is-selected-1-Google-Chrome-linux.png differ diff --git a/e2e/segment.e2e.ts-snapshots/Second-segment-is-selected-1-Google-Chrome-linux.png b/e2e/segment.e2e.ts-snapshots/Second-segment-is-selected-1-Google-Chrome-linux.png index 27e7d4a6..81cc0f82 100644 Binary files a/e2e/segment.e2e.ts-snapshots/Second-segment-is-selected-1-Google-Chrome-linux.png and b/e2e/segment.e2e.ts-snapshots/Second-segment-is-selected-1-Google-Chrome-linux.png differ diff --git a/e2e/segment.e2e.ts-snapshots/Third-segment-is-selected-1-Google-Chrome-linux.png b/e2e/segment.e2e.ts-snapshots/Third-segment-is-selected-1-Google-Chrome-linux.png index 52a06020..482a1680 100644 Binary files a/e2e/segment.e2e.ts-snapshots/Third-segment-is-selected-1-Google-Chrome-linux.png and b/e2e/segment.e2e.ts-snapshots/Third-segment-is-selected-1-Google-Chrome-linux.png differ diff --git a/e2e/tag.e2e.ts-snapshots/Should-render-tags-1-Google-Chrome-linux.png b/e2e/tag.e2e.ts-snapshots/Should-render-tags-1-Google-Chrome-linux.png index 34e0fab4..865a2ccc 100644 Binary files a/e2e/tag.e2e.ts-snapshots/Should-render-tags-1-Google-Chrome-linux.png and b/e2e/tag.e2e.ts-snapshots/Should-render-tags-1-Google-Chrome-linux.png differ diff --git a/e2e/toasts.e2e.ts-snapshots/Should-close-toast-1-Google-Chrome-linux.png b/e2e/toasts.e2e.ts-snapshots/Should-close-toast-1-Google-Chrome-linux.png index dbb5ff84..61fed962 100644 Binary files a/e2e/toasts.e2e.ts-snapshots/Should-close-toast-1-Google-Chrome-linux.png and b/e2e/toasts.e2e.ts-snapshots/Should-close-toast-1-Google-Chrome-linux.png differ diff --git a/e2e/toasts.e2e.ts-snapshots/Should-display-multiple-toasts-and-user-is-able-to-close-one-1-Google-Chrome-linux.png b/e2e/toasts.e2e.ts-snapshots/Should-display-multiple-toasts-and-user-is-able-to-close-one-1-Google-Chrome-linux.png index d8beac67..4d76ac14 100644 Binary files a/e2e/toasts.e2e.ts-snapshots/Should-display-multiple-toasts-and-user-is-able-to-close-one-1-Google-Chrome-linux.png and b/e2e/toasts.e2e.ts-snapshots/Should-display-multiple-toasts-and-user-is-able-to-close-one-1-Google-Chrome-linux.png differ diff --git a/e2e/toasts.e2e.ts-snapshots/Should-display-multiple-toasts-for-the-top-position-1-Google-Chrome-linux.png b/e2e/toasts.e2e.ts-snapshots/Should-display-multiple-toasts-for-the-top-position-1-Google-Chrome-linux.png index 454cb249..a94710df 100644 Binary files a/e2e/toasts.e2e.ts-snapshots/Should-display-multiple-toasts-for-the-top-position-1-Google-Chrome-linux.png and b/e2e/toasts.e2e.ts-snapshots/Should-display-multiple-toasts-for-the-top-position-1-Google-Chrome-linux.png differ diff --git a/e2e/toasts.e2e.ts-snapshots/Toast-error-1-Google-Chrome-linux.png b/e2e/toasts.e2e.ts-snapshots/Toast-error-1-Google-Chrome-linux.png index 7d37bf45..0555d4f1 100644 Binary files a/e2e/toasts.e2e.ts-snapshots/Toast-error-1-Google-Chrome-linux.png and b/e2e/toasts.e2e.ts-snapshots/Toast-error-1-Google-Chrome-linux.png differ diff --git a/e2e/toasts.e2e.ts-snapshots/Toast-info-1-Google-Chrome-linux.png b/e2e/toasts.e2e.ts-snapshots/Toast-info-1-Google-Chrome-linux.png index ce91a821..94c7a90a 100644 Binary files a/e2e/toasts.e2e.ts-snapshots/Toast-info-1-Google-Chrome-linux.png and b/e2e/toasts.e2e.ts-snapshots/Toast-info-1-Google-Chrome-linux.png differ diff --git a/e2e/toasts.e2e.ts-snapshots/Toast-message-1-Google-Chrome-linux.png b/e2e/toasts.e2e.ts-snapshots/Toast-message-1-Google-Chrome-linux.png index d2d921b0..e8c09773 100644 Binary files a/e2e/toasts.e2e.ts-snapshots/Toast-message-1-Google-Chrome-linux.png and b/e2e/toasts.e2e.ts-snapshots/Toast-message-1-Google-Chrome-linux.png differ diff --git a/e2e/toasts.e2e.ts-snapshots/Toast-success-1-Google-Chrome-linux.png b/e2e/toasts.e2e.ts-snapshots/Toast-success-1-Google-Chrome-linux.png index 581c2ba1..52ab8577 100644 Binary files a/e2e/toasts.e2e.ts-snapshots/Toast-success-1-Google-Chrome-linux.png and b/e2e/toasts.e2e.ts-snapshots/Toast-success-1-Google-Chrome-linux.png differ diff --git a/e2e/toasts.e2e.ts-snapshots/Toast-warn-1-Google-Chrome-linux.png b/e2e/toasts.e2e.ts-snapshots/Toast-warn-1-Google-Chrome-linux.png index e3525ea1..625dcae3 100644 Binary files a/e2e/toasts.e2e.ts-snapshots/Toast-warn-1-Google-Chrome-linux.png and b/e2e/toasts.e2e.ts-snapshots/Toast-warn-1-Google-Chrome-linux.png differ diff --git a/src/lib/styles/global.scss b/src/lib/styles/global.scss index d02ea168..22589daf 100644 --- a/src/lib/styles/global.scss +++ b/src/lib/styles/global.scss @@ -1,3 +1,4 @@ +@import "./global/reset.scss"; @import "./global/colors.scss"; @import "./global/variables"; @import "./global/fonts.scss"; diff --git a/src/lib/styles/global/reset.scss b/src/lib/styles/global/reset.scss new file mode 100644 index 00000000..dfc198c5 --- /dev/null +++ b/src/lib/styles/global/reset.scss @@ -0,0 +1,109 @@ +/*** + The new CSS reset - version 1.11 (last updated 20.9.2023) + GitHub page: https://github.com/elad2412/the-new-css-reset + + Modified to remove the box-sizing: border-box; part. Because it is better to stick + to the standard box-sizing: content-box; and use the border-box only when needed. +***/ + +/* + Remove all the styles of the "User-Agent-Stylesheet", except for the 'display' property + - The "symbol *" part is to solve Firefox SVG sprite bug + - The "html" element is excluded, otherwise a bug in Chrome breaks the CSS hyphens property (https://github.com/elad2412/the-new-css-reset/issues/36) + */ +*:where( + :not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *) + ) { + all: unset; + display: revert; +} + +/* Fix mobile Safari increase font-size on landscape mode */ +html { + -moz-text-size-adjust: none; + -webkit-text-size-adjust: none; + text-size-adjust: none; +} + +/* Reapply the pointer cursor for anchor tags */ +a, +button { + cursor: revert; +} + +/* Remove list styles (bullets/numbers) */ +ol, +ul, +menu { + list-style: none; +} + +/* For images to not be able to exceed their container */ +img { + max-inline-size: 100%; + max-block-size: 100%; +} + +/* removes spacing between cells in tables */ +table { + border-collapse: collapse; +} + +/* Safari - solving issue when using user-select:none on the text input doesn't working */ +input, +textarea { + -webkit-user-select: auto; +} + +/* revert the 'white-space' property for textarea elements on Safari */ +textarea { + white-space: revert; +} + +/* minimum style to allow to style meter element */ +meter { + -webkit-appearance: revert; + appearance: revert; +} + +/* preformatted text - use only for this feature */ +:where(pre) { + all: revert; +} + +/* reset default text opacity of input placeholder */ +::placeholder { + color: unset; +} + +/* remove default dot (•) sign */ +::marker { + content: initial; +} + +/* fix the feature of 'hidden' attribute. + display:revert; revert to element instead of attribute */ +:where([hidden]) { + display: none; +} + +/* revert for bug in Chromium browsers + - fix for the content editable attribute will work properly. + - webkit-user-select: auto; added for Safari in case of using user-select:none on wrapper element*/ +:where([contenteditable]:not([contenteditable="false"])) { + -moz-user-modify: read-write; + -webkit-user-modify: read-write; + overflow-wrap: break-word; + -webkit-line-break: after-white-space; + -webkit-user-select: auto; +} + +/* apply back the draggable feature - exist only in Chromium and Safari */ +:where([draggable="true"]) { + -webkit-user-drag: element; +} + +/* Revert Modal native behavior */ +:where(dialog:modal) { + all: revert; +}