{{#if hasBreadcrumb}}
diff --git a/packages/fiori/src/themes/DynamicPage.css b/packages/fiori/src/themes/DynamicPage.css
index 60bce09f5c24..e33e794f3d48 100644
--- a/packages/fiori/src/themes/DynamicPage.css
+++ b/packages/fiori/src/themes/DynamicPage.css
@@ -48,7 +48,7 @@
/* TODO css vars? */
border: 1px solid;
border-radius: 0.25rem;
- background-color: #fff;
+ background-color: var(--_ui5_dynamic_page_header_background_color);
box-sizing: border-box;
width: auto;
margin: 0 0.5rem 0.5rem 0.5rem;
@@ -82,27 +82,50 @@
/* Responsive paddings */
-:host([media-range="S"]) .ui5-dynamic-page-content,
-:host([media-range="S"]) ::slotted([slot="titleArea"]),
-:host([media-range="S"]) ::slotted([slot="headerArea"]) {
- padding: 0 1rem;
+:host([media-range="S"]) .ui5-dynamic-page-content {
+ padding: var(--_ui5_dynamic_page_content_padding_S);
+}
+
+:host([media-range="S"]) ::slotted([slot="titleArea"]) {
+ padding: var(--_ui5_dynamic_page_title_padding_S);
}
:host([media-range="S"]) ::slotted([slot="headerArea"]) {
- padding-top: 0.5rem;
+ padding: var(--_ui5_dynamic_page_header_padding_S);
+}
+
+:host([media-range="M"]) .ui5-dynamic-page-content {
+ padding: var(--_ui5_dynamic_page_content_padding_M);
+}
+
+:host([media-range="M"]) ::slotted([slot="titleArea"]) {
+ padding: var(--_ui5_dynamic_page_title_padding_M);
+}
+
+:host([media-range="M"]) ::slotted([slot="headerArea"]) {
+ padding: var(--_ui5_dynamic_page_header_padding_M);
+}
+
+:host([media-range="L"]) .ui5-dynamic-page-content {
+ padding: var(--_ui5_dynamic_page_content_padding_L);
+}
+
+:host([media-range="L"]) ::slotted([slot="titleArea"]) {
+ padding: var(--_ui5_dynamic_page_title_padding_L);
}
-:host([media-range="M"]) .ui5-dynamic-page-content,
-:host([media-range="M"]) ::slotted([slot="titleArea"]),
-:host([media-range="M"]) ::slotted([slot="headerArea"]),
-:host([media-range="L"]) .ui5-dynamic-page-content,
-:host([media-range="L"]) ::slotted([slot="titleArea"]),
:host([media-range="L"]) ::slotted([slot="headerArea"]) {
- padding: 0 2rem;
+ padding: var(--_ui5_dynamic_page_header_padding_L);
+}
+
+:host([media-range="XL"]) .ui5-dynamic-page-content {
+ padding: var(--_ui5_dynamic_page_content_padding_XL);
+}
+
+:host([media-range="XL"]) ::slotted([slot="titleArea"]) {
+ padding: var(--_ui5_dynamic_page_title_padding_XL);
}
-:host([media-range="XL"]) .ui5-dynamic-page-content,
-:host([media-range="XL"]) ::slotted([slot="titleArea"]),
:host([media-range="XL"]) ::slotted([slot="headerArea"]) {
- padding: 0 3rem;
+ padding: var(--_ui5_dynamic_page_header_padding_XL);
}
\ No newline at end of file
diff --git a/packages/fiori/src/themes/DynamicPageHeader.css b/packages/fiori/src/themes/DynamicPageHeader.css
index fbd4d846e593..a94d243237a2 100644
--- a/packages/fiori/src/themes/DynamicPageHeader.css
+++ b/packages/fiori/src/themes/DynamicPageHeader.css
@@ -1,6 +1,7 @@
:host {
- background: #fff;
+ background-color: var(--_ui5_dynamic_page_header_background_color);
display: block;
+ box-shadow: var(--_ui5-v1-20-0-rc-3_dynamic_page_header-boxshadow);
}
.ui5-dynamic-page-header-root {
diff --git a/packages/fiori/src/themes/DynamicPageHeaderActions.css b/packages/fiori/src/themes/DynamicPageHeaderActions.css
index ad67776feb4c..a378fa7c863a 100644
--- a/packages/fiori/src/themes/DynamicPageHeaderActions.css
+++ b/packages/fiori/src/themes/DynamicPageHeaderActions.css
@@ -11,7 +11,7 @@
height: 1.5rem;
background-color: var(--sapObjectHeader_Background);
border: 1px solid var(--sapButton_BorderColor);
- box-shadow: var(--sapContent_Shadow0);
+ /*box-shadow: var(--_ui5_dynamic_page_header-actions-boxshadow);*/
}
.ui5-dynamic-page-header-actions--wrapper {
@@ -32,12 +32,12 @@
&:before {
right: 50%;
- background: linear-gradient(to right, transparent, var(--sapObjectHeader_BorderColor));
+ /*background: linear-gradient(to right, transparent, var(--sapObjectHeader_BorderColor));*/
}
&::after {
left: 50%;
- background: linear-gradient(to left, transparent, var(--sapObjectHeader_BorderColor));
+ /*background: linear-gradient(to left, transparent, var(--sapObjectHeader_BorderColor));*/
}
}
}
diff --git a/packages/fiori/src/themes/DynamicPageTitle.css b/packages/fiori/src/themes/DynamicPageTitle.css
index 99456b7c663b..4261d40cede3 100644
--- a/packages/fiori/src/themes/DynamicPageTitle.css
+++ b/packages/fiori/src/themes/DynamicPageTitle.css
@@ -2,11 +2,12 @@
display: flex;
flex-direction: column;
width: 100%;
- background-color: var(--sapObjectHeader_Background);
+ background-color: var(--_ui5_dynamic_page_header_background_color);
min-height: var(--_ui5_dynamic_page_title_min_height);
word-wrap: break-word;
padding-top: var(--_ui5_dynamic_page_title_padding_top);
padding-bottom: var(--_ui5_dynamic_page_title_padding_bottom);
+ border-bottom: var(--_ui5_dynamic_page_title_border);
}
:host .ui5-dynamic-page-title-root {
@@ -19,6 +20,7 @@
:host(:hover) {
background-color: var(--sapObjectHeader_Hover_Background);
cursor: pointer;
+ border-bottom: var(--_ui5_dynamic_page_title_hover_border);
}
:host([snapped]) {
@@ -38,6 +40,7 @@
font-family: var(--sapObjectHeader_Title_FontFamily);
color: var(--sapObjectHeader_Title_TextColor);
padding: var(--_ui5_dynamic_page_title_heading_padding_top) 0 0 0;
+ margin: var(--_ui5_dynamic_page_title_heading_margin);
}
::slotted([ui5-title][slot="expandedHeading"]),
@@ -61,7 +64,7 @@
/* actions */
::slotted([ui5-toolbar][slot="actions"]) {
- /* padding: 0 0 0 1rem; */
+ padding: 0 0 0 1rem;
}
.ui5-dynamic-page-title--wrapper {
@@ -85,6 +88,7 @@
min-width: 3rem;
flex-grow: 1;
display: flex;
+ align-items: center;
}
.ui5-dynamic-page-title--actions ::slotted([slot="actions"]) {
@@ -102,13 +106,14 @@
width: 0.0625rem;
vertical-align: middle;
background: var(--sapToolbar_SeparatorColor);
- margin: 0 0.5rem;
+ margin: 0 0.5rem 0 0.25rem;
}
}
::slotted([slot="navigationActions"]) {
border: none;
flex: 0 1;
+ padding-left: 0;
}
.ui5-dynamic-page-title--top-area {
diff --git a/packages/fiori/src/themes/base/DynamicPage-parameters.css b/packages/fiori/src/themes/base/DynamicPage-parameters.css
index 2169196ba13c..d2ddc02d5759 100644
--- a/packages/fiori/src/themes/base/DynamicPage-parameters.css
+++ b/packages/fiori/src/themes/base/DynamicPage-parameters.css
@@ -1,3 +1,14 @@
:root {
- --_ui5_dynamic_page_title_content_padding_left: 1rem;
+ --_ui5_dynamic_page_title_padding_S: 0.5rem 1rem;
+ --_ui5_dynamic_page_title_padding_M: 0.5rem 2rem;
+ --_ui5_dynamic_page_title_padding_L: 0.5rem 2rem;
+ --_ui5_dynamic_page_title_padding_XL: 0.5rem 3rem;
+ --_ui5_dynamic_page_header_padding_S: 0.5rem 1rem 0;
+ --_ui5_dynamic_page_header_padding_M: 1rem 2rem;
+ --_ui5_dynamic_page_header_padding_L: 1rem 3rem;
+ --_ui5_dynamic_page_header_padding_XL: 1rem 3rem;
+ --_ui5_dynamic_page_content_padding_S: 2rem 1rem 0;
+ --_ui5_dynamic_page_content_padding_M: 2rem 2rem 0;
+ --_ui5_dynamic_page_content_padding_L: 1rem 2rem 0;
+ --_ui5_dynamic_page_content_padding_XL: 1rem 3rem 0;
}
\ No newline at end of file
diff --git a/packages/fiori/src/themes/base/DynamicPageHeader-parameters.css b/packages/fiori/src/themes/base/DynamicPageHeader-parameters.css
index e930737f274e..a89577be39da 100644
--- a/packages/fiori/src/themes/base/DynamicPageHeader-parameters.css
+++ b/packages/fiori/src/themes/base/DynamicPageHeader-parameters.css
@@ -1,4 +1,8 @@
:root {
--_ui5_dynamic_page_header_padding_top: 1rem;
--_ui5_dynamic_page_header_padding_bottom: 1rem;
+
+ --_ui5_dynamic_page_header_background_color: var(--sapObjectHeader_Background);
+ --_ui5_dynamic_page_header-actions-boxshadow: var(--sapContent_HeaderShadow);
+ --_ui5-v1-20-0-rc-3_dynamic_page_header-boxshadow: var(--sapContent_HeaderShadow);
}
\ No newline at end of file
diff --git a/packages/fiori/src/themes/base/DynamicPageTitle-parameters.css b/packages/fiori/src/themes/base/DynamicPageTitle-parameters.css
index 60e2f63bc4ed..fe912634bd32 100644
--- a/packages/fiori/src/themes/base/DynamicPageTitle-parameters.css
+++ b/packages/fiori/src/themes/base/DynamicPageTitle-parameters.css
@@ -1,7 +1,7 @@
:root {
--_ui5_dynamic_page_title_padding_top: 0.5rem;
--_ui5_dynamic_page_title_padding_bottom: 0.5rem;
- --_ui5_dynamic_page_title_min_height: 3rem;
+ --_ui5_dynamic_page_title_min_height: 4rem;
--_ui5_dynamic_page_title_breadcrumbs_padding_top: 0.5rem;
--_ui5_dynamic_page_title_breadcrumbs_padding_bottom: 0.25rem;
@@ -9,4 +9,7 @@
--_ui5_dynamic_page_title_heading_padding_top: 0.3125rem;
--_ui5_dynamic_page_title_subheading_margin_top: 0.25rem;
+
+ --_ui5_dynamic_page_title_content_padding_left: 1rem;
+
}
\ No newline at end of file
diff --git a/packages/fiori/src/themes/sap_belize/DynamicPage-parameters.css b/packages/fiori/src/themes/sap_belize/DynamicPage-parameters.css
new file mode 100644
index 000000000000..42c46db7b609
--- /dev/null
+++ b/packages/fiori/src/themes/sap_belize/DynamicPage-parameters.css
@@ -0,0 +1,16 @@
+:root {
+ /* paddings */
+ --_ui5_dynamic_page_title_padding_S: 0.5rem 0rem 0.5rem 1rem;
+ --_ui5_dynamic_page_title_padding_M: 0.5rem 1rem 0.5rem 2rem;
+ --_ui5_dynamic_page_title_padding_L: 0.5rem 2rem 0.5rem 3rem;
+ --_ui5_dynamic_page_title_padding_XL: 0.5rem 2rem 0.5rem 3rem;
+ --_ui5_dynamic_page_header_padding_S: 0.5rem 1rem 1rem 1rem;
+ --_ui5_dynamic_page_header_padding_M: 1rem 2rem;
+ --_ui5_dynamic_page_header_padding_L: 1rem 3rem;
+ --_ui5_dynamic_page_header_padding_XL: 1rem 3rem;
+ --_ui5_dynamic_page_content_padding_S: 2rem 1rem 0 1rem;
+ --_ui5_dynamic_page_content_padding_M: 2rem 2rem 0 2rem;
+ --_ui5_dynamic_page_content_padding_L: 1rem 3rem 0 3rem;
+ --_ui5_dynamic_page_content_padding_XL: 1rem 3rem 0 3rem;
+
+}
\ No newline at end of file
diff --git a/packages/fiori/src/themes/sap_belize/parameters-bundle.css b/packages/fiori/src/themes/sap_belize/parameters-bundle.css
index 617e604eae32..cfe35a1711e5 100644
--- a/packages/fiori/src/themes/sap_belize/parameters-bundle.css
+++ b/packages/fiori/src/themes/sap_belize/parameters-bundle.css
@@ -1,5 +1,5 @@
@import "../base/sizes-parameters.css";
-@import "../base/DynamicPage-parameters.css";
+@import "./DynamicPage-parameters.css";
@import "../base/DynamicPageTitle-parameters.css";
@import "../base/DynamicPageHeader-parameters.css";
@import "../base/Bar-parameters.css";
diff --git a/packages/fiori/src/themes/sap_belize_hcb/DynamicPageTitle-parameters.css b/packages/fiori/src/themes/sap_belize_hcb/DynamicPageTitle-parameters.css
new file mode 100644
index 000000000000..ec881c8c719d
--- /dev/null
+++ b/packages/fiori/src/themes/sap_belize_hcb/DynamicPageTitle-parameters.css
@@ -0,0 +1,6 @@
+@import "../base/DynamicPageTitle-parameters.css";
+
+:root {
+ --_ui5_dynamic_page_title_border: 0.0625rem solid transparent;
+ --_ui5_dynamic_page_title_hover_border: 0.0625rem solid var(--sapObjectHeader_BorderColor);
+}
\ No newline at end of file
diff --git a/packages/fiori/src/themes/sap_belize_hcb/parameters-bundle.css b/packages/fiori/src/themes/sap_belize_hcb/parameters-bundle.css
index 7a6127a914b3..e2128c795535 100644
--- a/packages/fiori/src/themes/sap_belize_hcb/parameters-bundle.css
+++ b/packages/fiori/src/themes/sap_belize_hcb/parameters-bundle.css
@@ -1,6 +1,6 @@
@import "../base/sizes-parameters.css";
@import "../base/DynamicPage-parameters.css";
-@import "../base/DynamicPageTitle-parameters.css";
+@import "./DynamicPageTitle-parameters.css";
@import "../base/DynamicPageHeader-parameters.css";
@import "../base/Bar-parameters.css";
@import "./FlexibleColumnLayout-parameters.css";
diff --git a/packages/fiori/src/themes/sap_belize_hcw/DynamicPageTitle-parameters.css b/packages/fiori/src/themes/sap_belize_hcw/DynamicPageTitle-parameters.css
new file mode 100644
index 000000000000..ec881c8c719d
--- /dev/null
+++ b/packages/fiori/src/themes/sap_belize_hcw/DynamicPageTitle-parameters.css
@@ -0,0 +1,6 @@
+@import "../base/DynamicPageTitle-parameters.css";
+
+:root {
+ --_ui5_dynamic_page_title_border: 0.0625rem solid transparent;
+ --_ui5_dynamic_page_title_hover_border: 0.0625rem solid var(--sapObjectHeader_BorderColor);
+}
\ No newline at end of file
diff --git a/packages/fiori/src/themes/sap_belize_hcw/parameters-bundle.css b/packages/fiori/src/themes/sap_belize_hcw/parameters-bundle.css
index 7a6127a914b3..e2128c795535 100644
--- a/packages/fiori/src/themes/sap_belize_hcw/parameters-bundle.css
+++ b/packages/fiori/src/themes/sap_belize_hcw/parameters-bundle.css
@@ -1,6 +1,6 @@
@import "../base/sizes-parameters.css";
@import "../base/DynamicPage-parameters.css";
-@import "../base/DynamicPageTitle-parameters.css";
+@import "./DynamicPageTitle-parameters.css";
@import "../base/DynamicPageHeader-parameters.css";
@import "../base/Bar-parameters.css";
@import "./FlexibleColumnLayout-parameters.css";
diff --git a/packages/fiori/src/themes/sap_fiori_3/DynamicPageTitle-parameters.css b/packages/fiori/src/themes/sap_fiori_3/DynamicPageTitle-parameters.css
new file mode 100644
index 000000000000..9bb9aea9f221
--- /dev/null
+++ b/packages/fiori/src/themes/sap_fiori_3/DynamicPageTitle-parameters.css
@@ -0,0 +1,3 @@
+:root {
+ --_ui5_dynamic_page_title_min_height: 3rem;
+}
\ No newline at end of file
diff --git a/packages/fiori/src/themes/sap_fiori_3/parameters-bundle.css b/packages/fiori/src/themes/sap_fiori_3/parameters-bundle.css
index 67ebf4269608..2da5386cbf6c 100644
--- a/packages/fiori/src/themes/sap_fiori_3/parameters-bundle.css
+++ b/packages/fiori/src/themes/sap_fiori_3/parameters-bundle.css
@@ -1,6 +1,6 @@
@import "../base/sizes-parameters.css";
@import "../base/DynamicPage-parameters.css";
-@import "../base/DynamicPageTitle-parameters.css";
+@import "./DynamicPageTitle-parameters.css";
@import "../base/DynamicPageHeader-parameters.css";
@import "../base/Bar-parameters.css";
@import "../base/FlexibleColumnLayout-parameters.css";
diff --git a/packages/fiori/src/themes/sap_fiori_3_hcb/DynamicPageTitle-parameters.css b/packages/fiori/src/themes/sap_fiori_3_hcb/DynamicPageTitle-parameters.css
new file mode 100644
index 000000000000..b154c618635d
--- /dev/null
+++ b/packages/fiori/src/themes/sap_fiori_3_hcb/DynamicPageTitle-parameters.css
@@ -0,0 +1,6 @@
+@import "../sap_fiori_3/DynamicPageTitle-parameters.css";
+
+:root {
+ --_ui5_dynamic_page_title_border: 0.0625rem solid transparent;
+ --_ui5_dynamic_page_title_hover_border: 0.0625rem solid var(--sapObjectHeader_BorderColor);
+}
\ No newline at end of file
diff --git a/packages/fiori/src/themes/sap_fiori_3_hcb/parameters-bundle.css b/packages/fiori/src/themes/sap_fiori_3_hcb/parameters-bundle.css
index 7a6127a914b3..e2128c795535 100644
--- a/packages/fiori/src/themes/sap_fiori_3_hcb/parameters-bundle.css
+++ b/packages/fiori/src/themes/sap_fiori_3_hcb/parameters-bundle.css
@@ -1,6 +1,6 @@
@import "../base/sizes-parameters.css";
@import "../base/DynamicPage-parameters.css";
-@import "../base/DynamicPageTitle-parameters.css";
+@import "./DynamicPageTitle-parameters.css";
@import "../base/DynamicPageHeader-parameters.css";
@import "../base/Bar-parameters.css";
@import "./FlexibleColumnLayout-parameters.css";
diff --git a/packages/fiori/src/themes/sap_fiori_3_hcw/DynamicPageTitle-parameters.css b/packages/fiori/src/themes/sap_fiori_3_hcw/DynamicPageTitle-parameters.css
new file mode 100644
index 000000000000..b154c618635d
--- /dev/null
+++ b/packages/fiori/src/themes/sap_fiori_3_hcw/DynamicPageTitle-parameters.css
@@ -0,0 +1,6 @@
+@import "../sap_fiori_3/DynamicPageTitle-parameters.css";
+
+:root {
+ --_ui5_dynamic_page_title_border: 0.0625rem solid transparent;
+ --_ui5_dynamic_page_title_hover_border: 0.0625rem solid var(--sapObjectHeader_BorderColor);
+}
\ No newline at end of file
diff --git a/packages/fiori/src/themes/sap_fiori_3_hcw/parameters-bundle.css b/packages/fiori/src/themes/sap_fiori_3_hcw/parameters-bundle.css
index 7a6127a914b3..e2128c795535 100644
--- a/packages/fiori/src/themes/sap_fiori_3_hcw/parameters-bundle.css
+++ b/packages/fiori/src/themes/sap_fiori_3_hcw/parameters-bundle.css
@@ -1,6 +1,6 @@
@import "../base/sizes-parameters.css";
@import "../base/DynamicPage-parameters.css";
-@import "../base/DynamicPageTitle-parameters.css";
+@import "./DynamicPageTitle-parameters.css";
@import "../base/DynamicPageHeader-parameters.css";
@import "../base/Bar-parameters.css";
@import "./FlexibleColumnLayout-parameters.css";
diff --git a/packages/fiori/src/themes/sap_horizon_hcb/DynamicPageTitle-parameters.css b/packages/fiori/src/themes/sap_horizon_hcb/DynamicPageTitle-parameters.css
new file mode 100644
index 000000000000..0889d694e55e
--- /dev/null
+++ b/packages/fiori/src/themes/sap_horizon_hcb/DynamicPageTitle-parameters.css
@@ -0,0 +1,9 @@
+@import "../base/DynamicPageTitle-parameters.css";
+
+:root {
+ /*text-shadow of titles, breadcrumbs*/
+ --sapContent_TextShadow: none;
+
+ --_ui5_dynamic_page_title_border: 0.0625rem solid transparent;
+ --_ui5_dynamic_page_title_hover_border: 0.0625rem solid var(--sapObjectHeader_BorderColor);
+}
\ No newline at end of file
diff --git a/packages/fiori/src/themes/sap_horizon_hcb/parameters-bundle.css b/packages/fiori/src/themes/sap_horizon_hcb/parameters-bundle.css
index 94e705a03bb1..e504c3e7ff96 100644
--- a/packages/fiori/src/themes/sap_horizon_hcb/parameters-bundle.css
+++ b/packages/fiori/src/themes/sap_horizon_hcb/parameters-bundle.css
@@ -1,6 +1,6 @@
@import "../base/sizes-parameters.css";
@import "../base/DynamicPage-parameters.css";
-@import "../base/DynamicPageTitle-parameters.css";
+@import "./DynamicPageTitle-parameters.css";
@import "../base/DynamicPageHeader-parameters.css";
@import "../base/Bar-parameters.css";
@import "./FlexibleColumnLayout-parameters.css";
diff --git a/packages/fiori/src/themes/sap_horizon_hcw/DynamicPageTitle-parameters.css b/packages/fiori/src/themes/sap_horizon_hcw/DynamicPageTitle-parameters.css
new file mode 100644
index 000000000000..0889d694e55e
--- /dev/null
+++ b/packages/fiori/src/themes/sap_horizon_hcw/DynamicPageTitle-parameters.css
@@ -0,0 +1,9 @@
+@import "../base/DynamicPageTitle-parameters.css";
+
+:root {
+ /*text-shadow of titles, breadcrumbs*/
+ --sapContent_TextShadow: none;
+
+ --_ui5_dynamic_page_title_border: 0.0625rem solid transparent;
+ --_ui5_dynamic_page_title_hover_border: 0.0625rem solid var(--sapObjectHeader_BorderColor);
+}
\ No newline at end of file
diff --git a/packages/fiori/src/themes/sap_horizon_hcw/parameters-bundle.css b/packages/fiori/src/themes/sap_horizon_hcw/parameters-bundle.css
index 60b43b5e0f3d..4505d1e7d36d 100644
--- a/packages/fiori/src/themes/sap_horizon_hcw/parameters-bundle.css
+++ b/packages/fiori/src/themes/sap_horizon_hcw/parameters-bundle.css
@@ -3,6 +3,7 @@
@import "../base/DynamicPageTitle-parameters.css";
@import "../base/DynamicPageHeader-parameters.css";
@import "../base/Bar-parameters.css";
+@import "./DynamicPageTitle-parameters.css";
@import "./FlexibleColumnLayout-parameters.css";
@import "../base/IllustratedMessage-parameters.css";
@import "./MediaGallery-parameters.css";
diff --git a/packages/main/src/themes/Toolbar.css b/packages/main/src/themes/Toolbar.css
index 1ec02191e74d..b24c87cd354a 100644
--- a/packages/main/src/themes/Toolbar.css
+++ b/packages/main/src/themes/Toolbar.css
@@ -52,6 +52,10 @@
margin-inline-start: var(--_ui5-toolbar-item-margin-left);
}
+/* .ui5-tb-items > ui5-button:nth-last-child(2) {
+ margin-inline-end: 0;
+} */
+
.ui5-tb-separator {
height: var(--_ui5-toolbar-separator-height);
width: 0.0625rem;