Adds mod calculation

2022-07-13 02:44:14 +02:00
parent c8d59588e0
commit c827693e72
15 changed files with 497 additions and 131 deletions
@@ -1,4 +1,6 @@
 // main: midgard5.less
+@borderGroove: 2px groove #eeede0;
+@attributeBorderColor: rgba(0, 0, 0, 0.5);

 .midgard5 {
 	.flexrow {
@@ -83,4 +85,69 @@
 		color:rgb(93, 93, 93);
 		font-style: italic;
 	}
+
+	.filler {
+		flex: 1 1 auto;
+	}
+
+	.attributes {
+		display: flex;
+		flex-direction: row;
+		margin-bottom: 0.5rem;
+
+		.attribute {
+			flex: 0 0 7rem;
+			margin: 0;
+			border: 1px solid @attributeBorderColor;
+			//border-bottom: none;
+			border-radius: 10;
+			
+			display: flex;
+			flex-direction: column;
+
+			.attribute-header {
+				display: flex;
+				align-items: center;
+				text-align: center;
+				justify-content: center;
+
+				font-weight: bold;
+				background-color: @attributeBorderColor;
+				color:rgba(255, 255, 255, 1);
+
+				//font-size: 1.0rem;
+				height: 2.5rem;
+			}
+
+			.attribute-main {
+				padding: 0.2rem;
+
+				.attribute-main-value {
+					text-align: center;
+					vertical-align: middle;
+					font-size: 2rem;
+				}
+
+				.attribute-main-bonus {
+					text-align: center;
+					vertical-align: middle;
+					font-size: 1rem;
+				}
+			}
+
+			.attribute-footer {
+				display: flex;
+				flex-direction: row;
+				gap: 0.3rem;
+				padding: 0.3rem;
+				background-color: @attributeBorderColor;
+
+				input {
+					flex-grow: 1;
+					text-align: center;
+					background-color: rgba(255, 255, 255, 0.8);
+				}
+			}
+		}
+	}
 }