Restyle actor-owned identity cards

patrickburk1988 · Jan 25, 2024 · ff28ebb · ff28ebb
1 parent eb246cb
commit ff28ebb
Show file tree

Hide file tree

Showing 5 changed files with 39 additions and 5 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,3 +1,7 @@
+## v1.1.8
+
+- Restyled actor-owned identity cards.
+
 ## v1.1.7
 
 - Added custom pause icon.

diff --git a/image/d10.svg b/image/d10.svg
diff --git a/style/unknown-armies.css b/style/unknown-armies.css
@@ -226,18 +226,34 @@
   margin-top:.3125rem;
 }
 .unknownarmies.sheet.character .identity__upper-content{
-  grid-template-columns:min-content 1fr 7.625rem;
+  grid-template-columns:2rem 1fr 2rem;
   position:relative;
 }
 .unknownarmies.sheet.character .identity [data-action=roll]{
-  width:7.625rem;
+  width:2rem;
+}
+.unknownarmies.sheet.character .identity .fa-d10{
+  height:.875rem;
+  width:.875rem;
+}
+.unknownarmies.sheet.character .identity .fa-d10:before{
+  content:url(../image/d10.svg);
 }
 .unknownarmies.sheet.character .identity__name-percentage{
   align-items:center;
   display:flex;
   font-size:22px;
   font-size:1.375rem;
   justify-content:center;
+  text-align:center;
+}
+.unknownarmies.sheet.character .identity__type{
+  left:0;
+  line-height:1;
+  position:absolute;
+  right:0;
+  text-align:center;
+  top:-1em;
 }
 .unknownarmies.sheet.character .identity__obsession-experience{
   display:flex;
@@ -431,7 +447,7 @@
   text-overflow:ellipsis;
 }
 
-.unknownarmies.sheet .item-list__column span,.unknownarmies.sheet .label,.unknownarmies.sheet button[data-action=improve],.unknownarmies.sheet button[data-action=open-cabal],.unknownarmies.sheet button[data-action=roll],.unknownarmies.sheet.character .identity__obsession-experience span,.unknownarmies.sheet.character .shock-meter p,.unknownarmies.sheet.character .status span,.unknownarmies.sheet.identity .stats-features__details{
+.unknownarmies.sheet .item-list__column span,.unknownarmies.sheet .label,.unknownarmies.sheet button[data-action=improve],.unknownarmies.sheet button[data-action=open-cabal],.unknownarmies.sheet button[data-action=roll],.unknownarmies.sheet.character .identity__obsession-experience span,.unknownarmies.sheet.character .identity__type,.unknownarmies.sheet.character .shock-meter p,.unknownarmies.sheet.character .status span,.unknownarmies.sheet.identity .stats-features__details{
   font-size:10px;
   font-size:.625rem;
   text-transform:uppercase;
@@ -499,6 +515,7 @@
 .unknownarmies.sheet button[data-action=roll]{
   background-color:#002fa7;
   color:#fbfbfb;
+  line-height:1;
   transition:filter .1s;
 }
 .unknownarmies.sheet button[data-action=roll]:focus,.unknownarmies.sheet button[data-action=roll]:hover{
@@ -887,4 +904,15 @@
 .directory .directory-item img{
   -o-object-position:center;
      object-position:center;
+}
+@keyframes a{
+  0%{
+    transform:rotate(0deg);
+  }
+  to{
+    transform:rotate(1turn);
+  }
+}
+.identity [data-action=roll]:hover i{
+  animation:a 2s linear infinite;
 }
diff --git a/system.json b/system.json
@@ -1,6 +1,6 @@
 {
     "id": "unknownarmies",
-    "version": "1.1.7",
+    "version": "1.1.8",
     "title": "Unknown Armies",
     "description": "An occult game about broken people conspiring to fix the world.",
     "background": "systems/unknownarmies/image/system-background.webp",

diff --git a/template/actor/character-sheet.hbs b/template/actor/character-sheet.hbs
@@ -125,8 +125,9 @@
                     <ul class="item-list__list">{{#each actor.items as |item itemId|}}{{#if (equals item.type 'identity')}}
                         <li class="item-list__item identity" data-item-id="{{item.id}}">
                             <div class="identity__upper-content">
-                                <button data-action="roll" data-roll-label="{{localize (concat 'UA.' item.system.type 'Identity')}} ({{item.name}})" data-roll-target="{{item.system.percentage}}">{{localize (concat 'UA.' item.system.type 'Identity')}}</button>
+                                <button data-action="roll" data-roll-label="{{localize (concat 'UA.' item.system.type 'Identity')}} ({{item.name}})" data-roll-target="{{item.system.percentage}}"><i class="fas fa-d10"></i></button>
                                 <span class="identity__name-percentage">{{item.name}} {{item.system.percentage}}%</span>
+                                {{#if item.system.type}}<span class="identity__type">{{localize (concat 'UA.' item.system.type 'Identity')}}</span>{{/if}}
                                 <div class="identity__obsession-experience">
                                     {{#if item.system.isObsession}}<span>{{localize 'UA.Obsession'}}</span>{{/if}}
                                     {{#if item.system.hasExperience}}<span>{{localize 'UA.Experience'}}</span>{{/if}}