New sheet for Darkness of the Demimonde

Roll20 · Oct 13, 2023 · a559c12 · a559c12
1 parent 440552d
commit a559c12
Show file tree

Hide file tree

Showing 5 changed files with 830 additions and 0 deletions.
diff --git a/Darkness Of The Demimonde/DOTD_preview.png b/Darkness Of The Demimonde/DOTD_preview.png
diff --git a/Darkness Of The Demimonde/darknessofthedemimonde.css b/Darkness Of The Demimonde/darknessofthedemimonde.css
@@ -0,0 +1,301 @@
+@import url('https://fonts.googleapis.com/css2?family=Macondo&display=swap');
+
+
+/* Set the min-width so that when the window is resized the look will stay consistant */
+
+.charsheet {
+	background-color:#FFFFFF;
+	color:black;
+    background-size: cover;
+	width:825px;
+	min-width:825px;
+	min-height:400px;
+	margin:0;
+	border:10px solid #4d4d4d;
+}
+
+
+/* Universal styling applied to all elements of these types */
+
+.charsheet h2 {
+	font-size: 2em;
+	margin-bottom: 10px;
+	margin-top: 5px;
+	text-align: center;
+	width:100%;
+	background: #d9d9d9;
+	color:black;
+	font-family: 'Macondo', sans-serif;
+	border-top:3px solid black;
+	border-bottom:3px solid black;
+	padding:2px;
+}
+.charsheet h3 {
+	font-size:1.2em;
+	margin-bottom: 10px;
+	text-align: center;
+	display:inline-block;
+}
+
+.charsheet input, .charsheet textarea, .charsheet select {
+	background-color:#F5F5F5;
+	width:100%;
+}
+.charsheet textarea {
+	resize: none;
+	box-sizing: border-box;
+}
+.charsheet .charsheetcontent label {
+	color:black;
+}
+
+.charsheet .hidden {
+	display:none;
+}
+
+/* LAYOUT */
+
+.charsheet .charsheetcontent {
+  display: grid;
+  grid-template-columns: 295px 510px;
+  grid-template-rows: auto;
+  gap: 20px;
+  grid-template-areas:
+    "details stats"
+}
+
+.charsheet .stats {
+	grid-area: stats;
+}
+
+.charsheet .details {
+	grid-area: details;
+}
+
+/* CHARACTER DETAILS */
+
+.details label {
+	display: inline-block;
+	width: 100px;
+	vertical-align:top;
+	margin-top:2px;
+	margin-bottom:0px;
+}
+.details label.points {
+	width: 192px;
+	padding-right:0;
+}
+
+
+.details input {
+	display: inline-block;
+	width: 185px;
+	margin-top:2px;
+}
+
+.details input.name {
+	display: inline-block;
+	font-size: 2em;
+	font-family: 'Macondo', sans-serif;
+	font-weight:bold;
+	margin-bottom: 10px;
+	margin-top: 5px;
+	text-align: center;
+	width:100%;
+	background: #d9d9d9;
+	color:black;
+	border-top:3px solid black;
+	border-bottom:3px solid black;
+	border-left: 0;
+	border-right: 0;
+	border-radius: 0;
+	padding:2px;
+}
+
+.details select {
+	display: inline-block;
+	width: 103px;
+	margin-bottom:0;
+	margin-top:2px;
+}
+
+.details textarea {
+	display: inline-block;
+	width: 185px;
+	margin-top:2px;
+	height:85px;
+}
+
+.details input[type=radio] {
+	width:22px;
+	margin-top:0;
+}
+
+.details div.stresslabels {
+	margin-left:110px;
+}
+
+.details div.stresslabels span {
+	display:inline-block;
+	width:22px;
+	text-align:center;
+}
+
+.charsheet .details button[type="roll"] {
+	margin-left:8px;
+	margin-right:0px;
+	margin-top:3px;
+}
+
+
+/* INVENTORY */
+
+.inventory label {
+	width:10px;
+	display:inline-block;
+	text-align:center;
+}
+
+.inventory input {
+	display: inline-block;
+	width: 275px;
+}
+.inventory h2 input {
+	background-color:white;
+	font-weight:bold;
+	font-size:15px;
+	margin-top:0;
+}
+
+
+/* ARCHETYPES */
+
+.archetypes label {
+	font-weight: bold;
+	font-size:1em;
+	display: inline-block;
+	width:90px;
+}
+.archetypes input {
+	display: inline-block;
+	/*width: 40px;*/
+}
+.archetypes label.archetype_uses {
+	width:320px;
+	font-weight:normal;
+	margin-left:5px;
+}
+
+/* PATHS */
+
+.affliction_occupation select {
+	font-weight:bold;
+}
+
+.affliction_occupation .enlightened textarea {
+	height:46px;
+}
+
+.affliction_occupation .afflicted textarea {
+	height:137px;
+}
+
+.affliction_occupation label {
+	margin-bottom:3px;
+	font-weight: bold;
+	font-size:1em;
+}
+
+.affliction_occupation input {
+	margin-bottom:10px;
+}
+
+/* KNACKS */
+
+.knacks textarea {
+	height:66px;
+}
+
+.knacks select {
+	font-weight:bold;
+}
+
+
+
+
+/* ROLL TEMPLATE */
+.sheet-rolltemplate-dotd {
+  margin-left: -37px;
+}
+.withoutavatars .sheet-rolltemplate-dotd {
+  margin-left: -7px;
+}
+
+.sheet-rolltemplate-dotd .sheet-container {
+  border-top:3px solid black;
+  border-bottom: 3px solid black;
+}
+
+/* Header formatting - title and subtitle */
+.sheet-rolltemplate-dotd .sheet-header {
+  background-color: #d9d9d9;
+  text-align: left;
+  color: black;
+  padding: 5px;
+  border-bottom:3px solid black;
+}
+.sheet-rolltemplate-dotd .sheet-title {
+    font-size:1.5em;
+	font-family: 'Macondo', sans-serif;
+}
+.sheet-rolltemplate-dotd .sheet-subtitle {
+  font-size:.9em;
+}
+
+
+/* Allprops part */
+.sheet-rolltemplate-dotd div.sheet-content {
+  display: grid;
+  background: #FFF;
+  color: #404040;
+  /* Header formatting - modify the column layout below */
+  grid-template-columns: auto auto;
+  /* Line height to match default roll template */
+  line-height:1.4em;
+  padding: 5px;
+}
+.sheet-rolltemplate-dotd .sheet-content > div {
+  padding: 5px;
+}
+
+/* Left column */
+.sheet-rolltemplate-dotd .sheet-content .sheet-key {
+  font-weight: bold;
+  padding-right: 10px;
+  text-align: right;
+}
+
+/* Empty rule, use this if you want to change the right column 
+.sheet-rolltemplate-dotd .sheet-value {
+}
+*/
+
+/* Make even-numbered rows grey */
+.sheet-rolltemplate-dotd .sheet-content :nth-child(4n+3),
+.sheet-rolltemplate-dotd .sheet-content :nth-child(4n) {
+  background:#EEE;
+}
+
+/* Description field */
+.sheet-rolltemplate-dotd .sheet-desc {
+  grid-column: span 2;
+  padding: 5px;
+  text-align: center;
+}
+
+/* set the inline roll result so it doesn't look awful in dark mode */
+.sheet-rolltemplate-dotd .sheet-container .inlinerollresult  {
+	background-color:#d9d9d9;
+	border: 1px solid #333;
+	color: black;
+}