diff --git a/styles/v3/index.scss b/styles/v3/index.scss
index 85ec4bf..4c321c5 100644
--- a/styles/v3/index.scss
+++ b/styles/v3/index.scss
@@ -19,6 +19,7 @@
/* Sheet Layouts */
@use "./layouts/datasheet.scss";
+@use "./layouts/items/common.scss";
@use "./layouts/items/untyped/v2.scss";
/* Sheet Options */
diff --git a/styles/v3/layouts/items/common.scss b/styles/v3/layouts/items/common.scss
new file mode 100644
index 0000000..93c25dd
--- /dev/null
+++ b/styles/v3/layouts/items/common.scss
@@ -0,0 +1,71 @@
+@use "../../mixins/material";
+@use "../../mixins/utils";
+
+.dotdungeon.style-v3 .item {
+ --gap: 8px;
+
+ .nav-bar {
+ @include material.elevate(8, $base: var(--surface));
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ right: 6px;
+
+ nav {
+ display: flex;
+ flex-direction: row;
+ gap: var(--gap);
+ padding: var(--gap);
+ }
+ }
+
+ .page-content {
+ padding: calc(var(--gap) * 1);
+ padding-bottom: 60px;
+ height: 100%;
+
+ > .tab {
+ height: 100%;
+ gap: var(--gap);
+ }
+ }
+
+ @include utils.tab("general") {
+ display: grid;
+ --height: 50px;
+ grid-template-columns: var(--height) 1fr;
+ grid-template-rows: var(--height) 1fr;
+
+ .description {
+ grid-column: 1 / -1;
+ }
+ }
+
+ %flex-col {
+ display: flex;
+ flex-direction: column;
+ gap: 8px;
+ }
+
+ @include utils.tab("effects") {
+ @extend %flex-col;
+ }
+
+ @include utils.tab("settings") {
+ @extend %flex-col;
+
+ .capacity-usage, .quantity-capacity, .combat-relevant {
+ display: flex;
+ align-items: center;
+ }
+
+ .capacity {
+ &--calculated {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ gap: 8px;
+ }
+ }
+ }
+}
diff --git a/styles/v3/layouts/items/untyped/v2.scss b/styles/v3/layouts/items/untyped/v2.scss
index 5a5a767..1b6097f 100644
--- a/styles/v3/layouts/items/untyped/v2.scss
+++ b/styles/v3/layouts/items/untyped/v2.scss
@@ -2,53 +2,10 @@
@use "../../../mixins/utils";
.dotdungeon.style-v3 .item--untyped {
- --gap: 8px;
-
- .nav-bar {
- @include material.elevate(8, $base: var(--surface));
- position: absolute;
- bottom: 0;
- left: 0;
- right: 6px;
-
- nav {
- display: flex;
- flex-direction: row;
- gap: var(--gap);
- padding: var(--gap);
- }
- }
-
- .page-content {
- padding: calc(var(--gap) * 1);
- padding-bottom: 60px;
- height: 100%;
-
- > .tab {
- height: 100%;
- gap: var(--gap);
- }
- }
-
- @include utils.tab("general") {
- display: grid;
- --height: 50px;
- grid-template-columns: var(--height) 1fr;
- grid-template-rows: var(--height) 1fr;
-
- .description {
- grid-column: 1 / -1;
- }
- }
-
- %flex-col {
+ @include utils.tab("details") {
display: flex;
flex-direction: column;
- gap: 8px;
- }
-
- @include utils.tab("details") {
- @extend %flex-col;
+ gap: var(--gap);
.number {
display: grid;
@@ -56,26 +13,4 @@
align-items: center;
}
}
-
- @include utils.tab("effects") {
- @extend %flex-col;
- }
-
- @include utils.tab("settings") {
- @extend %flex-col;
-
- .capacity-usage, .quantity-capacity, .combat-relevant {
- display: flex;
- align-items: center;
- }
-
- .capacity {
- &--calculated {
- display: flex;
- flex-direction: row;
- align-items: center;
- gap: 8px;
- }
- }
- }
}
diff --git a/templates/items/untyped/v2/index.hbs b/templates/items/untyped/v2/index.hbs
index c8509ac..bad820a 100644
--- a/templates/items/untyped/v2/index.hbs
+++ b/templates/items/untyped/v2/index.hbs
@@ -1,4 +1,4 @@
-