Add core styles to stepper.scss & update imports, fixes #121

primefaces · Apr 19, 2024 · fbfb09e · fbfb09e
1 parent 85bb81b
commit fbfb09e
Show file tree

Hide file tree

Showing 2 changed files with 66 additions and 1 deletion.
diff --git a/theme-base/_components.scss b/theme-base/_components.scss
@@ -59,7 +59,6 @@
   @import "./components/panel/_panel";
   @import "./components/panel/_scrollpanel";
   @import "./components/panel/_splitter";
-  @import "./components/panel/_stepper";
   @import "./components/panel/_tabview";
   @import "./components/panel/_toolbar";
   @import "./components/panel/_stepper";

diff --git a/theme-base/components/panel/_stepper.scss b/theme-base/components/panel/_stepper.scss
@@ -1,5 +1,71 @@
 @use "sass:math";
 
+//core
+.p-stepper .p-stepper-nav {
+    position: relative;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    margin: 0;
+    padding: 0;
+    list-style-type: none;
+    overflow-x: auto;
+}
+
+.p-stepper-vertical .p-stepper-nav {
+    flex-direction: column;
+}
+
+.p-stepper-header {
+    position: relative;
+    display: flex;
+    flex: 1 1 auto;
+    align-items: center;
+
+    &:last-of-type {
+        flex: initial;
+    }
+}
+
+.p-stepper-header .p-stepper-action {
+    border: 0 none;
+    display: inline-flex;
+    align-items: center;
+    text-decoration: none;
+    cursor: pointer;
+
+    &:focus-visible {
+        @include focused();
+    }
+}
+
+.p-stepper.p-stepper-readonly .p-stepper-header {
+    cursor: auto;
+}
+
+.p-stepper-header.p-highlight .p-stepper-action {
+    cursor: default;
+}
+
+.p-stepper-title {
+    display: block;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    max-width: 100%;
+}
+
+.p-stepper-number {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.p-stepper-separator {
+    flex: 1 1 0;
+}
+
+//theme
 .p-stepper {
     .p-stepper-nav {
         display: flex;