mirror of
https://github.com/Nighthawk42/roll20-character-sheets.git
synced 2026-08-30 03:40:32 +00:00
281 lines
7.3 KiB
CSS
281 lines
7.3 KiB
CSS
/* Smaller margins - remove these if you want the huge default left margin */
|
|
.sheet-rolltemplate-custom {
|
|
margin-left: -37px;
|
|
}
|
|
.withoutavatars .sheet-rolltemplate-custom {
|
|
margin-left: -7px;
|
|
}
|
|
|
|
.sheet-rolltemplate-custom .sheet-container {
|
|
border: 1px solid;
|
|
/* by default, the border is the same color as the header. You can change this here, e.g. to black */
|
|
border-color: var(--header-bg-color);
|
|
}
|
|
|
|
/* Header formatting - title and subtitle */
|
|
.sheet-rolltemplate-custom .sheet-header {
|
|
background-color: var(--header-bg-color);
|
|
/* change text-align to center to center the header text */
|
|
text-align: left;
|
|
color: var(--header-text-color);
|
|
padding: 5px;
|
|
}
|
|
.sheet-rolltemplate-custom .sheet-title {
|
|
font-size:1.1em;
|
|
}
|
|
.sheet-rolltemplate-custom .sheet-subtitle {
|
|
font-size:.9em;
|
|
}
|
|
|
|
/* example colors */
|
|
.sheet-rolltemplate-custom .sheet-container {
|
|
/* this is the default color */
|
|
--header-bg-color: rgba(112,32,130,1);
|
|
--header-text-color: #FFF;
|
|
}
|
|
|
|
.sheet-rolltemplate-custom .sheet-container.sheet-color-red {
|
|
--header-bg-color: #F00;
|
|
}
|
|
|
|
.sheet-rolltemplate-custom .sheet-container.sheet-color-green {
|
|
--header-bg-color: rgb(1, 148, 1);
|
|
}
|
|
|
|
.sheet-rolltemplate-custom .sheet-container.sheet-color-blue {
|
|
--header-bg-color: rgb(83, 86, 254);
|
|
}
|
|
|
|
.sheet-rolltemplate-custom .sheet-container.sheet-color-purple {
|
|
--header-bg-color: rgb(107, 0, 174);
|
|
}
|
|
|
|
.sheet-rolltemplate-custom .sheet-color-text-red {
|
|
color: #F00;
|
|
}
|
|
|
|
.sheet-rolltemplate-custom .sheet-color-text-green {
|
|
color: rgb(1, 148, 1);
|
|
}
|
|
|
|
.sheet-rolltemplate-custom .sheet-color-text-blue {
|
|
color: rgb(83, 86, 254);
|
|
}
|
|
|
|
.sheet-rolltemplate-custom .sheet-color-text-purple {
|
|
color: rgb(107, 0, 174);
|
|
}
|
|
|
|
|
|
/* Allprops part */
|
|
.sheet-rolltemplate-custom .sheet-content {
|
|
display: grid;
|
|
background: #FFF;
|
|
/* Header formatting - modify the column layout below */
|
|
grid-template-columns: auto auto;
|
|
/* Line height to match default roll template */
|
|
line-height:1.4em;
|
|
}
|
|
.sheet-rolltemplate-custom .sheet-content > div {
|
|
padding: 5px;
|
|
}
|
|
|
|
/* Left column */
|
|
.sheet-rolltemplate-custom .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-custom .sheet-value {
|
|
}
|
|
*/
|
|
|
|
/* Make even-numbered rows grey */
|
|
.sheet-rolltemplate-custom .sheet-content :nth-child(2n) {
|
|
background:#EEE;
|
|
}
|
|
|
|
/* Description field */
|
|
.sheet-rolltemplate-custom .sheet-desc {
|
|
grid-column: span 2;
|
|
padding: 5px;
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.sheet-rolltemplate-custom2 {
|
|
margin-left: -37px;
|
|
}
|
|
.withoutavatars .sheet-rolltemplate-custom2 {
|
|
margin-left: -7px;
|
|
}
|
|
|
|
.sheet-rolltemplate-custom2 .sheet-container {
|
|
border: 1px solid;
|
|
/* by default, the border is the same color as the header. You can change this here, e.g. to black */
|
|
border-color: var(--header-bg-color);
|
|
}
|
|
|
|
/* Header formatting - title and subtitle */
|
|
.sheet-rolltemplate-custom2 .sheet-header {
|
|
background-color: var(--header-bg-color);
|
|
/* change text-align to center to center the header text */
|
|
text-align: left;
|
|
color: var(--header-text-color);
|
|
padding: 5px;
|
|
}
|
|
.sheet-rolltemplate-custom2 .sheet-title {
|
|
font-size:1.1em;
|
|
}
|
|
.sheet-rolltemplate-custom2 .sheet-subtitle {
|
|
font-size:.9em;
|
|
}
|
|
|
|
/* example colors */
|
|
.sheet-rolltemplate-custom2 .sheet-container {
|
|
/* this is the default color */
|
|
--header-bg-color: rgba(112,32,130,1);
|
|
--header-text-color: #FFF;
|
|
}
|
|
|
|
.sheet-rolltemplate-custom2 .sheet-container.sheet-color-red {
|
|
--header-bg-color: #F00;
|
|
}
|
|
|
|
.sheet-rolltemplate-custom2 .sheet-container.sheet-color-green {
|
|
--header-bg-color: rgb(1, 148, 1);
|
|
}
|
|
|
|
.sheet-rolltemplate-custom2 .sheet-container.sheet-color-blue {
|
|
--header-bg-color: rgb(83, 86, 254);
|
|
}
|
|
|
|
.sheet-rolltemplate-custom2 .sheet-container.sheet-color-purple {
|
|
--header-bg-color: rgb(107, 0, 174);
|
|
}
|
|
|
|
.sheet-rolltemplate-custom2 .sheet-color-text-red {
|
|
color: #F00;
|
|
}
|
|
|
|
.sheet-rolltemplate-custom2 .sheet-color-text-green {
|
|
color: rgb(1, 148, 1);
|
|
}
|
|
|
|
.sheet-rolltemplate-custom2 .sheet-color-text-blue {
|
|
color: rgb(83, 86, 254);
|
|
}
|
|
|
|
.sheet-rolltemplate-custom2 .sheet-color-text-purple {
|
|
color: rgb(107, 0, 174);
|
|
}
|
|
|
|
|
|
|
|
/* Allprops part */
|
|
.sheet-rolltemplate-custom2 .sheet-content {
|
|
display: grid;
|
|
background: #FFF;
|
|
/* Header formatting - modify the column layout below */
|
|
grid-template-columns: auto auto;
|
|
/* Line height to match default roll template */
|
|
line-height:1.4em;
|
|
}
|
|
.sheet-rolltemplate-custom2 .sheet-content > div {
|
|
padding: 5px;
|
|
}
|
|
|
|
/* Left column */
|
|
.sheet-rolltemplate-custom2 .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-custom2 .sheet-value {
|
|
}
|
|
*/
|
|
|
|
/* Make even-numbered rows grey */
|
|
.sheet-rolltemplate-custom2 .sheet-content :nth-child(2n) {
|
|
background:#EEE;
|
|
}
|
|
|
|
/* Description field */
|
|
.sheet-rolltemplate-custom2 .sheet-desc {
|
|
grid-column: span 2;
|
|
padding: 5px;
|
|
}
|
|
|
|
|
|
|
|
|
|
.charsheet .width-10 { width: 10px; }
|
|
.charsheet .width-20 { width: 20px; }
|
|
.charsheet .width-30 { width: 30px; }
|
|
.charsheet .width-40 { width: 40px; }
|
|
.charsheet .width-45 { width: 45px; }
|
|
.charsheet .width-50 { width: 50px; }
|
|
.charsheet .width-60 { width: 60px; }
|
|
.charsheet .width-70 { width: 70px; }
|
|
.charsheet .width-80 { width: 80px; }
|
|
.charsheet .width-90 { width: 90px; }
|
|
.charsheet .width-100 { width: 100px; }
|
|
.charsheet .width-110 { width: 110px; }
|
|
.charsheet .width-120 { width: 120px; }
|
|
.charsheet .width-130 { width: 130px; }
|
|
.charsheet .width-140 { width: 140px; }
|
|
.charsheet .width-150 { width: 150px; }
|
|
.charsheet .width-160 { width: 160px; }
|
|
.charsheet .width-170 { width: 170px; }
|
|
.charsheet .width-180 { width: 180px; }
|
|
.charsheet .width-190 { width: 190px; }
|
|
.charsheet .width-200 { width: 200px; }
|
|
.charsheet .width-210 { width: 210px; }
|
|
.charsheet .width-220 { width: 220px; }
|
|
.charsheet .width-230 { width: 230px; }
|
|
.charsheet .width-240 { width: 240px; }
|
|
.charsheet .width-250 { width: 250px; }
|
|
.charsheet .width-260 { width: 260px; }
|
|
.charsheet .width-270 { width: 270px; }
|
|
.charsheet .width-280 { width: 280px; }
|
|
.charsheet .width-290 { width: 290px; }
|
|
.charsheet .width-295 { width: 295px; }
|
|
.charsheet .width-300 { width: 300px; }
|
|
.charsheet .width-310 { width: 310px; }
|
|
.charsheet .width-320 { width: 320px; }
|
|
.charsheet .width-350 { width: 350px; }
|
|
.charsheet .width-375 { width: 375px; }
|
|
.charsheet .width-380 { width: 380px; }
|
|
.charsheet .width-400 { width: 400px; }
|
|
.charsheet .width-420 { width: 420px; }
|
|
.charsheet .width-450 { width: 450px; }
|
|
.charsheet .width-500 { width: 500px; }
|
|
.charsheet .width-600 { width: 600px; }
|
|
.charsheet .width-630 { width: 630px; }
|
|
.charsheet .width-650 { width: 650px; }
|
|
.charsheet .width-680 { width: 680px; }
|
|
.charsheet .width-750 { width: 750px; }
|
|
|
|
.charsheet .hidden{
|
|
display: none;
|
|
}
|
|
|
|
.charsheet .line{
|
|
display: block;
|
|
}
|
|
|
|
.charsheet .cell{
|
|
display: table-cell;
|
|
}
|
|
|