Feb 13, 2023 6:27 pm
I was learning about Mork Borg recently and was enjoying the creativity of the art/design and thought it would be great if we could include the art/design of physical character sheets with our digital custom sheets.
I've managed to create an interesting hybrid (HERE).Updated Screenshot in response to comments:
It uses an image of the physical character sheet with fillable text fields layered on top and linked roll tables and extra details in spoilers underneath. I adapted some of nezzeraj's awesome design for the digital portion (HERE).
I've tested it in various conditions (light, dark, desktop, mobile) and it seems usable, but it's a pretty new format for me, so could have some bugs.
One issue is that it overflows if your browser window is significantly wider than GP's layout width (i.e. the width of posts/sheets), which happens on my desktop when I have my browser window maximized. It's still completely usable like that, just not as pretty. You can avoid this by adjusting the width of your browser window or zoom, but it would be nicer if it scaled properly. On my mobile, it seems to scale reasonably well. (Issue Solved by TheGenerator!)
I'm not sure it's complete/working enough to be a template, but I thought I'd share, so if anyone's interested in using or adapting any of the character sheet layout ideas inside, here's the code (updated with TheGenerator's CSS fix and nezzeraj's fillable empty slots):
Katla
From the heretic isle of Crëlut, two nautical miles east of Grift.
Occult Herbmaster
✴ Portable Laboratory
✴ Decoctions
✴
✴
2
3
+1
+1
+0
+2
2 (d2)
Shortsword
Empty (ranged)
Empty (armor)
✴ Waterskin
✴ Blanket
✴ Caltrops
✴
✴
✴
✴
✴
✴ Food (1 day's)
✴
✴
✴
✴
✴
✴
✴
95
*Details from Random Character Generator (HERE)
Rolls for Tests
Rolls for Combat
Notes
✴ Class Origin
Born of the mushroom, raised in the glade, watched by the eye of the moon in a silverblack pool.
✴ Terrible Traits
Wasteful and Nihilistic.
✴ Broken Bodies
Chronic athlete's foot. Stinks.
✴ Bad Habits
Permanent phlegm deposit in throat. Continuously coughs, snorts, spits and swallows.
✴ Troubling Tales
✴ Add extra info here.
✴
✴
✴
✴
✴
✴
✴
✴
✴
Unfortunately, it's a bit complicated with lots of nested f tags. It was a lot of trial and error, so I'm not even sure I fully understand how/why some of the code works, but if you have questions I can try to explain.
Regarding the overflow issue, if you set the width in the f tag on the fourth line to 100% instead of 80vw, then the image of the physical character sheet scales properly in all conditions, but the overlaying text fields don't, which is why I've kept it relative to the browser width for now. This is because the only way I've found to scale the text properly is relative to the browser width (i.e. viewport width).
But, if anyone knows how to scale font-size based on the character sheet width (i.e. container), let me know because that would fix the issue! (Solved by TheGenerator)
I've managed to create an interesting hybrid (HERE).Updated Screenshot in response to comments:
It uses an image of the physical character sheet with fillable text fields layered on top and linked roll tables and extra details in spoilers underneath. I adapted some of nezzeraj's awesome design for the digital portion (HERE).
I've tested it in various conditions (light, dark, desktop, mobile) and it seems usable, but it's a pretty new format for me, so could have some bugs.
One issue is that it overflows if your browser window is significantly wider than GP's layout width (i.e. the width of posts/sheets), which happens on my desktop when I have my browser window maximized. It's still completely usable like that, just not as pretty. You can avoid this by adjusting the width of your browser window or zoom, but it would be nicer if it scaled properly. On my mobile, it seems to scale reasonably well. (Issue Solved by TheGenerator!)
I'm not sure it's complete/working enough to be a template, but I thought I'd share, so if anyone's interested in using or adapting any of the character sheet layout ideas inside, here's the code (updated with TheGenerator's CSS fix and nezzeraj's fillable empty slots):
[ +- ] Mork Borg Art
Create character
Katla
From the heretic isle of Crëlut, two nautical miles east of Grift.
Occult Herbmaster
✴ Portable Laboratory
✴ Decoctions
✴
✴
2
3
+1
+1
+0
+2
2 (d2)
Shortsword
Empty (ranged)
Empty (armor)
✴ Waterskin
✴ Blanket
✴ Caltrops
✴
✴
✴
✴
✴
✴ Food (1 day's)
✴
✴
✴
✴
✴
✴
✴
95
*Details from Random Character Generator (HERE)
Rolls for Tests
Ability | Roll |
Strength | 1d20+ |
Agility | 1d20+ |
Presence | 1d20+ |
Toughness | 1d20+ |
Rolls for Combat
Name | Attack | Damage |
1d20 | 1d6 | |
1d20 | 1d | |
1d20 | 1d |
Miseries
Details
You carry a portable laboratory and continually search for frequently expended ingredients. Daily you have the materials to create two randomly determined decoctions and can brew a total of d4 doses. If unused they lose vitality after 24 hours.
Red Poison Toughness DR12 or -d10 HP.
Ezumiel's Vapor Pass a DR14 test or severe hallucinations for d4 hours.
Southern Frog Stew Vomit for d4 hours, pass a DR14 test or you can do nothing else.
Elixir Vitalis Heals d6 HP and stops infection. Can be habit-forming.
Spider-Owl Soup See in darkness, climb on walls for 30 minutes.
Fernor’s Philtre Translucent oil, must be dabbed right into the eye. Heals infection and gives +2 on Presence tests for d4 hours.
Hyphos’ Enervating Snuff Berserk! Two attacks per round but defend with DR14. Lasts one fight. Must be snorted, causes sneezing.
Black Poison Toughness DR14 or -d6 HP and blinded for one hour.
d4 damage + infection on 1 in 6
Details
[ +- ] Portable Laboratory
You carry a portable laboratory and continually search for frequently expended ingredients. Daily you have the materials to create two randomly determined decoctions and can brew a total of d4 doses. If unused they lose vitality after 24 hours.
[ +- ] List of Decoctions
Red Poison Toughness DR12 or -d10 HP.
Ezumiel's Vapor Pass a DR14 test or severe hallucinations for d4 hours.
Southern Frog Stew Vomit for d4 hours, pass a DR14 test or you can do nothing else.
Elixir Vitalis Heals d6 HP and stops infection. Can be habit-forming.
Spider-Owl Soup See in darkness, climb on walls for 30 minutes.
Fernor’s Philtre Translucent oil, must be dabbed right into the eye. Heals infection and gives +2 on Presence tests for d4 hours.
Hyphos’ Enervating Snuff Berserk! Two attacks per round but defend with DR14. Lasts one fight. Must be snorted, causes sneezing.
Black Poison Toughness DR14 or -d6 HP and blinded for one hour.
[ +- ] Caltrops
d4 damage + infection on 1 in 6
Notes
[ +- ] Background
✴ Class Origin
Born of the mushroom, raised in the glade, watched by the eye of the moon in a silverblack pool.
✴ Terrible Traits
Wasteful and Nihilistic.
✴ Broken Bodies
Chronic athlete's foot. Stinks.
✴ Bad Habits
Permanent phlegm deposit in throat. Continuously coughs, snorts, spits and swallows.
✴ Troubling Tales
[ +- ] Additional Information
✴ Add extra info here.
✴
✴
✴
✴
✴
✴
✴
✴
✴
Regarding the overflow issue, if you set the width in the f tag on the fourth line to 100% instead of 80vw, then the image of the physical character sheet scales properly in all conditions, but the overlaying text fields don't, which is why I've kept it relative to the browser width for now. This is because the only way I've found to scale the text properly is relative to the browser width (i.e. viewport width).
But, if anyone knows how to scale font-size based on the character sheet width (i.e. container), let me know because that would fix the issue! (Solved by TheGenerator)
Last edited February 16, 2023 7:15 am