diff --git a/styles/global/design-v2.scss b/styles/global/design-v2.scss new file mode 100644 index 0000000..2fbceae --- /dev/null +++ b/styles/global/design-v2.scss @@ -0,0 +1,55 @@ +.item--custom, +.actor--mob { + input { + border: 2px solid black; + background: none; + box-shadow: none; + + &.left { text-align: left; } + &.center { text-align: center; } + &.right { text-align: right; } + + &:focus { + transform: scale(102%); + } + } + + label.masked-input.masked-input { + display: flex; + flex-direction: row; + align-items: center; + transition: all ease-in-out 50ms; + + &:focus-within { + transform: scale(102%); + } + + > input { + border: none; + background: none; + border-radius: 0; + border: none; + &:focus, &:focus-visible { + box-shadow: none; + } + } + } + + label.masked-textarea.masked-textarea { + display: flex; + flex-direction: column; + transition: all ease-in-out 50ms; + + &:focus-within { + transform: scale(102%); + } + + textarea { + flex-grow: 1; + resize: none; + border: none; + box-shadow: none; + background: none; + } + } +} \ No newline at end of file diff --git a/styles/root.scss b/styles/root.scss index 5ee2a84..11398a3 100644 --- a/styles/root.scss +++ b/styles/root.scss @@ -6,6 +6,7 @@ @use "./global/icons.scss"; @use "./global/buttons.scss"; +@use "./global/design-v2.scss"; @use "./dialog/DiceList.scss"; diff --git a/styles/sheets/actor/mob/mob.scss b/styles/sheets/actor/mob/mob.scss index 0a0f68c..fd3e063 100644 --- a/styles/sheets/actor/mob/mob.scss +++ b/styles/sheets/actor/mob/mob.scss @@ -34,55 +34,10 @@ } } - label.mask-input { - display: flex; - flex-direction: row; - align-items: center; - transition: all ease-in-out 50ms; - - &:focus-within { - transform: scale(102%); - } - - input { - text-align: right; - border: none; - background: none; - border-radius: 0; - border-bottom: 1px solid black; - &:focus, &:focus-visible { - box-shadow: none; - } - } - - input.left { - text-align: left; - } - } - .wide { grid-column: span 2; } - .mask-textarea { - display: flex; - flex-direction: column; - transition: all ease-in-out 50ms; - - &:focus-within { - transform: scale(102%); - } - - textarea { - flex-grow: 1; - resize: none; - border: none; - box-shadow: none; - background: none; - } - } - - // Area-specific stylings .name { diff --git a/templates/actors/mobs/main.hbs b/templates/actors/mobs/main.hbs index 10ae5cd..fcd9635 100644 --- a/templates/actors/mobs/main.hbs +++ b/templates/actors/mobs/main.hbs @@ -6,23 +6,25 @@ name="name" value="{{actor.name}}" > -