first commit
This commit is contained in:
191
styles/actors.css
Normal file
191
styles/actors.css
Normal file
@@ -0,0 +1,191 @@
|
||||
.kopparhavet .character {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.kopparhavet .adversary {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.actor-avatar-img {
|
||||
max-width: 200px;
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.charname {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.skill-value {
|
||||
max-width: 50px;
|
||||
text-align: center !important;
|
||||
}
|
||||
|
||||
/*
|
||||
.kopparhavet .note .editor {
|
||||
min-height: 302px;
|
||||
}
|
||||
*/
|
||||
|
||||
.kopparhavet .scroll-y {
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
.item-list-header {
|
||||
/* border: 0 none; */
|
||||
font-family: var(--font-special);
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
line-height: initial;
|
||||
margin: 0;
|
||||
padding: 4px 4px;
|
||||
text-align: center;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.kopparhavet .item-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
font-family: var(--font-table);
|
||||
font-size: 12px;
|
||||
line-height: 16px;
|
||||
min-height: 0;
|
||||
height: calc(100% - 20px);
|
||||
}
|
||||
|
||||
.kopparhavet .item-list .header {
|
||||
align-items: flex-end;
|
||||
border-bottom: 2px solid var(--color-border);
|
||||
font-size: 10px;
|
||||
font-weight: bold;
|
||||
margin: 0 8px;
|
||||
padding: 4px 8px;
|
||||
text-transform: uppercase;
|
||||
width: calc(100% - 16px);
|
||||
}
|
||||
|
||||
.kopparhavet .item-list .items {
|
||||
overflow-y: scroll;
|
||||
padding: 0 2px 0 8px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.kopparhavet .flex {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.kopparhavet .skills-tab .skills h1 {
|
||||
margin-bottom: 0;
|
||||
grid-column: 1/4;
|
||||
font-family: var(--font-special);
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
line-height: initial;
|
||||
margin: 0;
|
||||
padding: 4px 4px;
|
||||
text-align: center;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.kopparhavet .talent-tab {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.kopparhavet .talent-tab .talents {
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.kopparhavet .talent-tab .spells {
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.kopparhavet .item-list .items {
|
||||
overflow-y: scroll;
|
||||
padding: 0 2px 0 8px;
|
||||
width: 100%;
|
||||
height: calc(100% - 20px);
|
||||
}
|
||||
|
||||
.kopparhavet .item-list .items .item:nth-child(odd) {
|
||||
background: var(--color-secondary);
|
||||
}
|
||||
|
||||
.kopparhavet .item-list .items .item {
|
||||
border-bottom: 1px solid var(--color-border);
|
||||
padding: 1px 8px;
|
||||
}
|
||||
|
||||
.kopparhavet .item-list .items .item .image-container {
|
||||
background: radial-gradient(closest-side, var(--color-highlight) 0%, transparent 100%);
|
||||
}
|
||||
|
||||
.kopparhavet .item-list .items .item .image {
|
||||
background-size: 32px;
|
||||
background-repeat: no-repeat;
|
||||
height: 32px;
|
||||
width: 32px;
|
||||
}
|
||||
|
||||
.kopparhavet .character .talents .talent .name {
|
||||
align-items: center;
|
||||
flex-basis: 100%;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.kopparhavet .character .spells .spell {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.kopparhavet .character .spells .spell .name {
|
||||
align-items: center;
|
||||
flex-basis: 60%;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.kopparhavet .character .spells .spell .cost {
|
||||
flex-basis: 15%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.kopparhavet .character .spells .spell .difficulty {
|
||||
flex-basis: 25%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.kopparhavet .character .bio-background h1 {
|
||||
margin-bottom: 0;
|
||||
grid-column: 1/5;
|
||||
font-family: var(--font-special);
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
line-height: initial;
|
||||
margin: 0;
|
||||
padding: 4px 4px;
|
||||
text-align: center;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.kopparhavet .character .bio-background .name {
|
||||
align-items: center;
|
||||
flex-basis: 100%;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.kopparhavet .character .bio-background .name-top {
|
||||
align-items: self-start;
|
||||
flex-basis: 100%;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.sheet-tabs {
|
||||
}
|
||||
140
styles/common.css
Normal file
140
styles/common.css
Normal file
@@ -0,0 +1,140 @@
|
||||
:root {
|
||||
--color-foreground: #221f20;
|
||||
--color-background: #fff;
|
||||
--color-highlight: #d1d2d4;
|
||||
--color-secondary: #e1e2e4;
|
||||
--color-border: #939598;
|
||||
--font-editor: "IM Fell Great Primer", serif;
|
||||
--font-input: "Poppins", sans-serif;
|
||||
--font-special: "IM Fell DW Pica", serif;
|
||||
--font-subheader: "IM Fell DW Pica SC", serif;
|
||||
--font-table: "Poppins", sans-serif;
|
||||
}
|
||||
|
||||
.kopparhavet.sheet .window-content form {
|
||||
min-height: 0;
|
||||
}
|
||||
|
||||
/********* Grid / Flex *********/
|
||||
.grid-container {
|
||||
display: grid;
|
||||
grid-gap: 5px;
|
||||
}
|
||||
|
||||
.flexrow {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
/********* Editor *********/
|
||||
.editor,
|
||||
editor-content {
|
||||
font-family: var(--font-editor);
|
||||
height: 100%;
|
||||
padding: 5px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.info-small,
|
||||
.info-small .description,
|
||||
.info-small .description .editor {
|
||||
height: 166px;
|
||||
}
|
||||
|
||||
.info,
|
||||
.info .description,
|
||||
.info .description .editor {
|
||||
height: 180px;
|
||||
}
|
||||
|
||||
.info-bio,
|
||||
.info-bio .description,
|
||||
.info-bio .description .editor {
|
||||
height: 190px;
|
||||
}
|
||||
|
||||
.info-mid,
|
||||
.info-mid .description,
|
||||
.info-mid .description .editor {
|
||||
height: 238px;
|
||||
}
|
||||
|
||||
.info-high,
|
||||
.info-high .description,
|
||||
.info-high .description .editor {
|
||||
height: 380px;
|
||||
}
|
||||
|
||||
/********* Headers *********/
|
||||
h5 {
|
||||
border-bottom: 1px solid #782e22;
|
||||
font-size: 1.15em;
|
||||
margin-bottom: 5px;
|
||||
margin-top: 10px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/********* Text *********/
|
||||
.center-text {
|
||||
text-align: center !important;
|
||||
}
|
||||
|
||||
/********* Button *********/
|
||||
.kopparhavet button {
|
||||
background: transparent;
|
||||
border: 0 none;
|
||||
border-radius: 3px;
|
||||
box-shadow: none;
|
||||
color: var(--color-foreground);
|
||||
cursor: pointer;
|
||||
font-family: inherit;
|
||||
font-size: inherit;
|
||||
font-weight: bold;
|
||||
height: auto;
|
||||
line-height: inherit;
|
||||
padding: 2px 4px;
|
||||
width: auto;
|
||||
}
|
||||
.kopparhavet button:focus,
|
||||
.kopparhavet button:hover {
|
||||
background: var(--color-highlight);
|
||||
}
|
||||
|
||||
/********* Border *********/
|
||||
.kopparhavet .border {
|
||||
border: 1px solid #00000f;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
/********* Tabs *********/
|
||||
.kopparhavet .sheet-body {
|
||||
overflow: hidden;
|
||||
flex-grow: 1;
|
||||
}
|
||||
|
||||
.kopparhavet .tab {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.tabs .item.active {
|
||||
border-bottom: none;
|
||||
text-shadow: 0 0 10px red;
|
||||
}
|
||||
.tabs .item {
|
||||
border: solid #333333 1px;
|
||||
border-top-right-radius: 5px;
|
||||
border-top-left-radius: 5px;
|
||||
text-align: center;
|
||||
/* margin: auto; */
|
||||
}
|
||||
|
||||
/********* Dice rolls *********/
|
||||
.rollable:hover,
|
||||
.rollable:focus {
|
||||
color: #000;
|
||||
text-shadow: 0 0 10px red;
|
||||
cursor: pointer;
|
||||
}
|
||||
65
styles/dice-roller.css
Normal file
65
styles/dice-roller.css
Normal file
@@ -0,0 +1,65 @@
|
||||
.roll-item h2,
|
||||
.roll-item h3 {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.dice-formula-kh {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
|
||||
.kh-dice-roller-popup {
|
||||
/* margin: -46px 0 0 46px; */
|
||||
box-sizing: content-box;
|
||||
font-size: 18px;
|
||||
line-height: 36px;
|
||||
background: rgba(0, 0, 0, 0.5);
|
||||
box-shadow: 0 0 10px #000;
|
||||
color: #BBB;
|
||||
border: 1px solid #000;
|
||||
border-radius: 5px;
|
||||
z-index: 30;
|
||||
}
|
||||
|
||||
.kh-dice-roller-popup ul {
|
||||
list-style-type: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border-bottom: 1px solid #333;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.kh-dice-roller-popup .sdr-lastrow {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.kh-dice-roller-popup .sdr-lastcol {
|
||||
border-right: none;
|
||||
}
|
||||
|
||||
.kh-dice-roller-popup .sdr-col1 {
|
||||
width: 110px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.kh-dice-roller-popup li {
|
||||
display: inline-block;
|
||||
width: 48px;
|
||||
text-align: center;
|
||||
padding: 5px;
|
||||
border-right: 1px solid #333;
|
||||
height: 48px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.kh-dice-roller-popup li:hover {
|
||||
color: #FFF;
|
||||
border: 1px solid red;
|
||||
border-bottom: 1px solid #ff6400;
|
||||
box-shadow: 0 0 10px #ff6400;
|
||||
}
|
||||
|
||||
.kh-dice-roller-popup li i {
|
||||
font-size: 24px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
113
styles/items.css
Normal file
113
styles/items.css
Normal file
@@ -0,0 +1,113 @@
|
||||
.item-avatar-img {
|
||||
max-width: 200px;
|
||||
display: block;
|
||||
margin-left: auto;
|
||||
margin-right: auto;
|
||||
}
|
||||
|
||||
.item-weapon-cat-select {
|
||||
width: calc(100% - 2px);
|
||||
min-width: 20px;
|
||||
}
|
||||
|
||||
.chat-item h2,
|
||||
.chat-item h4 {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.modification-value {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.kopparhavet .gear-tab h1 {
|
||||
margin-bottom: 0;
|
||||
grid-column: 1/4;
|
||||
font-family: var(--font-special);
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
line-height: initial;
|
||||
margin: 0;
|
||||
padding: 4px 4px;
|
||||
text-align: center;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.items {
|
||||
margin: 0 0 10px 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.items .items-header {
|
||||
text-align: center;
|
||||
padding: 3px;
|
||||
/* border-bottom: 1px solid rgba(0, 0, 0, 0.25); */
|
||||
/* background-color: #490c0b; */
|
||||
/* color: white; */
|
||||
/* font-size: 12px; */
|
||||
border-bottom: 2px solid #782e22;
|
||||
/* font-weight: normal; */
|
||||
}
|
||||
|
||||
.items .items-header .header-name {
|
||||
flex: 1 0 100px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.items .items-list {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.items .items-list .item-name {
|
||||
margin: 0;
|
||||
/* cursor: pointer; */
|
||||
flex: 1 0 100px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.item-quantity {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.quantity.increase {
|
||||
right: 25%;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.quantity.decrease {
|
||||
left: 25%;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.quantity {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.item-weapon-skill-select {
|
||||
width: calc(100% - 2px);
|
||||
min-width: 20px;
|
||||
text-align: center !important;
|
||||
}
|
||||
|
||||
.items .items-list .item-controls {
|
||||
z-index: 500;
|
||||
width: 20px;
|
||||
text-align: end;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.items .items-list .item {
|
||||
line-height: 24px;
|
||||
padding: 3px 0;
|
||||
border-bottom: 1px solid #bbb;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.items .items-list .item .toggle-equipped {
|
||||
color: #888;
|
||||
}
|
||||
|
||||
.items .items-list .item .toggle-equipped.active {
|
||||
color: #191813;
|
||||
}
|
||||
Reference in New Issue
Block a user