mirror of
https://github.com/Nighthawk42/roll20-character-sheets.git
synced 2026-08-30 03:40:32 +00:00
Matt Quinn
c9456aa4ef
Recently the ability tables stopped showing up in 2 columns, instead always showing up stacked (no matter how wide the character sheet window is). Changing the tables' box-sizing makes them show side by side again.
127 lines
2.7 KiB
CSS
127 lines
2.7 KiB
CSS
.charsheet .sheet-header {
|
|
background: url("https://raw.githubusercontent.com/Roll20/roll20-character-sheets/master/Ashen_Stars/images/header.png") no-repeat, linear-gradient(to left, transparent, #f4f4f5, transparent), #d7ddd9;
|
|
background-size: 100% 100%;
|
|
background-position: top center;
|
|
min-height: 257px;
|
|
}
|
|
.charsheet .sheet-header, .charsheet .sheet-main {
|
|
width: 100%;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.charsheet label, .charsheet input {
|
|
width: auto;
|
|
display: inline-block;
|
|
}
|
|
|
|
.charsheet .sheet-header label {
|
|
position: relative;
|
|
top: 45px;
|
|
left: 2.5%;
|
|
}
|
|
|
|
.charsheet .sheet-main {
|
|
background: linear-gradient(to left, transparent, #f4f4f5, transparent), linear-gradient(#d7ddd9, #e2e5e7);
|
|
}
|
|
|
|
.charsheet .sheet-section {
|
|
margin: 0 46px 46px 46px;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.charsheet .sheet-section:not(.sheet-character_info) {
|
|
padding: 0 86px 0 86px;
|
|
border: 4px double #467781;
|
|
border-radius: 21px;
|
|
background: linear-gradient(#bfd7d7, #e2e5e7);
|
|
}
|
|
|
|
.charsheet h1 {
|
|
margin: -18px 0 0 0;
|
|
text-align: center;
|
|
color: #fff;
|
|
background: #0e322a;
|
|
border: 4px double #467781;
|
|
border-radius: 21px;
|
|
}
|
|
|
|
.charsheet input:not([type="checkbox"]), .charsheet textarea, .charsheet select {
|
|
border: dotted #000;
|
|
border-width: 0 0 2px 0;
|
|
background: none;
|
|
}
|
|
|
|
.charsheet .sheet-character_info span, .charsheet .sheet-character_info input, .charsheet .sheet-character_info select {
|
|
flex: 1 0 auto;
|
|
border: 0;
|
|
}
|
|
|
|
.charsheet .sheet-character_info {
|
|
display: flex;
|
|
flex-flow: row wrap;
|
|
justify-content: center;
|
|
}
|
|
|
|
.charsheet .sheet-character_info label, .charsheet h2 {
|
|
background: #fff;
|
|
border: 4px solid #467781;
|
|
border-radius: 21px;
|
|
box-shadow: inset 0 0 8px#000;
|
|
padding: 9px 21px 9px 21px;
|
|
}
|
|
|
|
.charsheet .sheet-character_info label {
|
|
width: 50%;
|
|
box-sizing: border-box;
|
|
margin-bottom: 22px;
|
|
display: flex;
|
|
}
|
|
|
|
.charsheet table {
|
|
width: 50%;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.charsheet table:nth-of-type(2n-1) {
|
|
border-right: 4px double #467781;
|
|
float: left;
|
|
clear: left;
|
|
}
|
|
|
|
.charsheet th, .charsheet td {
|
|
text-align: left;
|
|
width:25%;
|
|
}
|
|
|
|
.charsheet .sheet-float_container {
|
|
overflow: auto;
|
|
}
|
|
|
|
.charsheet fieldset {
|
|
border: 0;
|
|
}
|
|
|
|
.charsheet legend {
|
|
float:left;
|
|
}
|
|
|
|
.charsheet h2 {
|
|
margin: -28px 0 0 0;
|
|
width: 25%;
|
|
text-align: center;
|
|
min-width: -moz-max-content;
|
|
min-width: -webkit-max-content;
|
|
}
|
|
|
|
.charsheet .sheet-equipment div {
|
|
margin-bottom: 46px;
|
|
}
|
|
|
|
.charsheet .sheet-equipment:not(:first-child) {
|
|
border-top: 4px double #467781;
|
|
margin: 28px 0 28px 0;
|
|
}
|
|
|
|
.charsheet .sheet-backstory textarea, .charsheet .sheet-personal_arc textarea {
|
|
width: 100%;
|
|
} |