465 lines
6.7 KiB
CSS
465 lines
6.7 KiB
CSS
/****************/
|
|
/* Basic layout */
|
|
/****************/
|
|
|
|
input {
|
|
background: transparent;
|
|
border: 1px solid transparent;
|
|
height: 24px;
|
|
font-size: 16px;
|
|
}
|
|
|
|
input[type="checkbox"] {
|
|
-webkit-appearance: none;
|
|
background-color: transparent;
|
|
border-radius: 50%;
|
|
cursor: pointer;
|
|
outline: none;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
input[type="checkbox"]:checked {
|
|
background-color: black;
|
|
}
|
|
|
|
.sheet-character-1,
|
|
.sheet-character-2,
|
|
.sheet-character-3 {
|
|
width: 992px;
|
|
height: 1403px;
|
|
display: none;
|
|
}
|
|
|
|
.sheet-character-1 {
|
|
background: url("https://i.imgur.com/kqEfC3i.png") top left no-repeat;
|
|
padding-top: 44px;
|
|
}
|
|
|
|
.sheet-character-2 {
|
|
background: url("https://i.imgur.com/kbkAGkS.png") top left no-repeat;
|
|
padding-top: 60px;
|
|
}
|
|
|
|
.sheet-character-3 {
|
|
background: url("https://i.imgur.com/rUpDZWZ.png") top left no-repeat;
|
|
padding-top: 60px;
|
|
}
|
|
|
|
/* show the selected tab */
|
|
.sheet-tabstoggle[value="character-1"] ~ div.sheet-character-1,
|
|
.sheet-tabstoggle[value="character-2"] ~ div.sheet-character-2,
|
|
.sheet-tabstoggle[value="character-3"] ~ div.sheet-character-3 {
|
|
display: block;
|
|
}
|
|
|
|
/**************/
|
|
/* Basic info */
|
|
/**************/
|
|
.sheet-basic-data {
|
|
margin-top: 135px;
|
|
margin-left: 168px;
|
|
}
|
|
|
|
.sheet-row {
|
|
margin-bottom: 1px;
|
|
}
|
|
|
|
.sheet-row:nth-child(3),
|
|
.sheet-row:nth-child(5) {
|
|
margin-top: 3px;
|
|
}
|
|
|
|
.sheet-row:nth-child(4) {
|
|
margin-top: 1px;
|
|
}
|
|
|
|
.sheet-name {
|
|
width: 230px;
|
|
}
|
|
|
|
.sheet-culture {
|
|
margin-left: 170px;
|
|
width: 220px;
|
|
}
|
|
|
|
.sheet-age {
|
|
margin-left: 50px;
|
|
text-align: center;
|
|
width: 50px;
|
|
}
|
|
|
|
.sheet-height {
|
|
width: 130px;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-skin {
|
|
margin-left: 34px;
|
|
width: 210px;
|
|
}
|
|
|
|
.sheet-clothes {
|
|
width: 265px;
|
|
margin-left: 80px;
|
|
}
|
|
|
|
.sheet-weight {
|
|
margin-left: -25px;
|
|
text-align: center;
|
|
width: 150px;
|
|
}
|
|
|
|
.sheet-hair {
|
|
margin-left: 87px;
|
|
width: 166px;
|
|
}
|
|
|
|
.sheet-eyes {
|
|
margin-left: 50px;
|
|
width: 292px;
|
|
}
|
|
|
|
.sheet-marks {
|
|
margin-left: 97px;
|
|
width: 529px;
|
|
}
|
|
|
|
.sheet-gender {
|
|
width: 50px;
|
|
margin-left: 45px;
|
|
}
|
|
|
|
.sheet-player {
|
|
margin-left: 10px;
|
|
width: 252px;
|
|
}
|
|
|
|
.sheet-campaign {
|
|
margin-left: 81px;
|
|
width: 224px;
|
|
}
|
|
|
|
.sheet-experience {
|
|
width: 50px;
|
|
margin-left: 102px;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-attributes-and-professions {
|
|
display: flex;
|
|
}
|
|
|
|
.sheet-attributes-row {
|
|
margin-left: 123px;
|
|
}
|
|
|
|
.sheet-attributes-row:nth-child(1) {
|
|
margin-top: 95px;
|
|
}
|
|
|
|
.sheet-attributes-row:nth-child(2) {
|
|
margin-top: 57px;
|
|
}
|
|
|
|
.sheet-attribute-value {
|
|
height: 58px !important;
|
|
width: 58px;
|
|
margin-right: 81px;
|
|
text-align: center;
|
|
font-size: 20px;
|
|
}
|
|
|
|
.sheet-professions {
|
|
margin-top: 69px;
|
|
margin-left: -30px;
|
|
}
|
|
|
|
.sheet-professions-row {
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.sheet-profession-name {
|
|
width: 333px;
|
|
}
|
|
|
|
.sheet-profession-value {
|
|
width: 25px;
|
|
margin-top: -16px;
|
|
margin-left: -2px;
|
|
text-align: center;
|
|
font-size: 14px;
|
|
}
|
|
|
|
.sheet-conditions-and-character {
|
|
display: flex;
|
|
}
|
|
|
|
.sheet-conditions {
|
|
margin-top: 73px;
|
|
margin-left: 120px;
|
|
display: flex;
|
|
}
|
|
|
|
.sheet-condition {
|
|
width: 39px;
|
|
height: 38px !important;
|
|
margin-right: 30px;
|
|
}
|
|
|
|
.sheet-condition:nth-child(2),
|
|
.sheet-condition:nth-child(4) {
|
|
margin-top: 39px;
|
|
}
|
|
|
|
.sheet-character {
|
|
display: flex;
|
|
flex-direction: column;
|
|
margin-left: 24px;
|
|
margin-top: 69px;
|
|
}
|
|
|
|
.sheet-character-trait {
|
|
margin-bottom: 3px;
|
|
width: 284px;
|
|
}
|
|
|
|
.sheet-character-trait:nth-child(2) {
|
|
margin-bottom: 2px;
|
|
}
|
|
|
|
.sheet-points-value {
|
|
font-size: 26px;
|
|
margin-top: 83px;
|
|
margin-left: 27px;
|
|
width: 58px;
|
|
height: 58px !important;
|
|
text-align: center;
|
|
}
|
|
|
|
/* Conditions and character */
|
|
.sheet-combat {
|
|
display: flex;
|
|
padding-top: 90px;
|
|
padding-left: 117px;
|
|
}
|
|
|
|
.sheet-combat-stats {
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.sheet-combat-stats-row {
|
|
display: flex;
|
|
flex-direction: row;
|
|
margin-bottom: 27px;
|
|
}
|
|
|
|
.sheet-combat-big-box {
|
|
width: 70px;
|
|
height: 70px !important;
|
|
margin-right: 30px;
|
|
text-align: center;
|
|
font-size: 24px;
|
|
}
|
|
|
|
.sheet-combat-small-box,
|
|
.sheet-combat-small-box-2 {
|
|
margin-left: 20px;
|
|
margin-top: 29px;
|
|
width: 55px;
|
|
height: 55px !important;
|
|
text-align: center;
|
|
font-size: 24px;
|
|
}
|
|
|
|
.sheet-combat-small-box-2 {
|
|
margin-top: 10px;
|
|
}
|
|
|
|
.sheet-weapons-and-armour {
|
|
display: flex;
|
|
flex-direction: column;
|
|
padding-left: 47px;
|
|
}
|
|
|
|
.sheet-combat-weapon {
|
|
margin-bottom: 2px;
|
|
width: 456px;
|
|
}
|
|
|
|
.sheet-combat-weapon:nth-child(1) {
|
|
margin-top: -5px;
|
|
}
|
|
|
|
.sheet-combat-weapon:nth-child(4) {
|
|
margin-bottom: 41px;
|
|
}
|
|
|
|
/* Goals */
|
|
.sheet-goals {
|
|
padding-top: 62px;
|
|
padding-left: 91px;
|
|
display: flex;
|
|
}
|
|
|
|
.sheet-short-goals,
|
|
.sheet-long-goals {
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.sheet-long-goals {
|
|
padding-left: 50px;
|
|
}
|
|
|
|
.sheet-goal {
|
|
width: 377px;
|
|
}
|
|
|
|
/* Passions */
|
|
.sheet-passions {
|
|
display: flex;
|
|
padding-top: 51px;
|
|
padding-left: 119px;
|
|
}
|
|
|
|
.sheet-passion-point {
|
|
width: 39px;
|
|
height: 38px !important;
|
|
margin-right: 2px;
|
|
}
|
|
|
|
.sheet-passion-point:nth-child(2) {
|
|
margin-right: 3px;
|
|
}
|
|
|
|
.sheet-tag-line-block {
|
|
padding-left: 110px;
|
|
padding-top: 6px;
|
|
}
|
|
|
|
.sheet-tag-line-box {
|
|
width: 264px;
|
|
height: 72px;
|
|
background-color: transparent;
|
|
border-color: transparent;
|
|
resize: none;
|
|
}
|
|
|
|
.sheet-passion-block.sheet-second {
|
|
padding-left: 105px;
|
|
}
|
|
|
|
/* History */
|
|
.sheet-history {
|
|
display: flex;
|
|
flex-direction: column;
|
|
padding-left: 94px;
|
|
padding-top: 183px;
|
|
}
|
|
|
|
.sheet-history-line {
|
|
margin-bottom: -4px;
|
|
width: 800px;
|
|
}
|
|
|
|
.sheet-history-line:nth-child(6) {
|
|
margin-top: 37px;
|
|
}
|
|
|
|
.sheet-history-line:nth-child(12),
|
|
.sheet-history-line:nth-child(18) {
|
|
margin-top: 35px;
|
|
}
|
|
|
|
/* Magic */
|
|
.sheet-magic {
|
|
display: flex;
|
|
padding-top: 59px;
|
|
padding-left: 115px;
|
|
}
|
|
|
|
.sheet-magic-list {
|
|
display: flex;
|
|
flex-direction: column;
|
|
padding-right: 57px;
|
|
}
|
|
|
|
.sheet-magic-descriptor {
|
|
width: 327px;
|
|
}
|
|
|
|
.sheet-magic-level {
|
|
width: 20px;
|
|
text-align: center;
|
|
}
|
|
|
|
.sheet-magic-level.sheet-second {
|
|
margin-top: -6px;
|
|
}
|
|
|
|
.sheet-magic-list-row {
|
|
margin-bottom: 3px;
|
|
}
|
|
|
|
/* Wealth */
|
|
.sheet-wealth {
|
|
display: flex;
|
|
flex-direction: column;
|
|
margin-top: 50px;
|
|
margin-left: 94px;
|
|
}
|
|
|
|
.sheet-wealth-line {
|
|
width: 800px;
|
|
margin-bottom: -3px;
|
|
}
|
|
|
|
.sheet-wealth-line:nth-child(1) {
|
|
margin-left: 89px;
|
|
width: 711px;
|
|
}
|
|
|
|
.sheet-wealth-line:nth-child(4) {
|
|
margin-top: 2px;
|
|
}
|
|
|
|
.sheet-wealth-line:nth-child(5) {
|
|
margin-left: 117px;
|
|
margin-top: -2px;
|
|
margin-bottom: 1px;
|
|
width: 683px;
|
|
}
|
|
|
|
/* Diary */
|
|
.sheet-diary {
|
|
display: flex;
|
|
flex-direction: column;
|
|
padding-top: 183px;
|
|
padding-left: 96px;
|
|
}
|
|
|
|
.sheet-diary-line {
|
|
width: 800px;
|
|
margin-bottom: -4px;
|
|
}
|
|
|
|
.sheet-diary-line:nth-child(4) {
|
|
margin-top: 2px;
|
|
}
|
|
|
|
.sheet-diary-line:nth-child(7),
|
|
.sheet-diary-line:nth-child(19),
|
|
.sheet-diary-line:nth-child(13) {
|
|
margin-top: 45px;
|
|
}
|
|
|
|
.sheet-diary-line:nth-child(23),
|
|
.sheet-diary-line:nth-child(35) {
|
|
margin-top: -1px;
|
|
}
|
|
|
|
.sheet-diary-line:nth-child(29) {
|
|
margin-top: 37px;
|
|
}
|