basic setup to use less for css compilation

This commit is contained in:
Nathanael Phillips 2020-10-21 07:15:47 -07:00
parent 088aa386ad
commit f90b2f2605
6 changed files with 4701 additions and 1863 deletions

1
.gitignore vendored
View file

@ -25,3 +25,4 @@ hs_err_pid*
# IDE Folders
.idea/
.vs/
node_modules

View file

@ -87,8 +87,7 @@
height: 18px;
line-height: 16px;
margin: 4px 8px 2px;
.modesto();
font-size: 18px;
.russoOne(14px);
color: @colorOlive;
border-bottom: 1px solid @colorFaint;
}
@ -124,7 +123,7 @@
align-items: center;
height: 28px;
line-height: 28px;
.modesto();
.russoOne();
> * {
font-weight: 400;
@ -157,7 +156,7 @@
list-style: none;
margin: 0;
padding: 0;
.modesto();
.russoOne();
border: @borderGroove;
border-radius: 3px;
@ -493,7 +492,7 @@
h3 {
margin: 0 -5px 0 0;
padding-left: 5px;
.modesto();
.russoOne();
font-size: 16px;
}

View file

@ -114,7 +114,7 @@
padding: 2px 0;
border-top: @borderGroove;
border-bottom: @borderGroove;
.modesto();
.russoOne();
}
/* Tags */
@ -216,7 +216,7 @@
border-bottom: @borderGroove;
.header-details {
.modesto();
.russoOne();
}
/* Character Name */
@ -278,7 +278,7 @@
.sheet-navigation {
flex: 0 0 @navHeight;
margin-bottom: 5px;
.modesto();
.russoOne(14px);
.item {
height: 30px;

View file

@ -14,9 +14,9 @@
font-weight: 400;
src: url('./fonts/RussoOne.ttf');
}
.russoOne {
.russoOne(@font-size: 20px) {
font-family: 'Russo One';
font-size: 20px;
font-size: @font-size;
font-weight: 400;
}
/* bungee-inline-regular - latin */
@ -55,7 +55,23 @@
@colorOlive: #4b4a44;
@colorCrimson: #44191A;
@borderGroove: 2px groove #eeede0;
@sheetBackground: url("ui/parchment.jpg") repeat;
//@sheetBackground: url("ui/parchment.jpg") repeat;
//SW5e Colors
@colorBlack: #1C1C1C;
@colorDarkGray: #363636;
@colorGray: #4f4f4f;
@colorLightGray: #828282;
@colorPaleGray: #D6D6D6;
@colorRed: #c40f0f;
@colorPaleRed: #FBF4F4;
@colorLightRed: #F6E1E1;
@colorBlue: #0d99cc;
@colorLightBlue: #7ed6f7;
@colorPaleBlue: #afc6d6;
@sheetBackground: linear-gradient(90deg, @colorPaleBlue 0%, @colorPaleGray 30%, @colorPaleGray 70%, @colorPaleBlue); //url("ui/parchment.webp") repeat;
/* ----------------------------------------- */
/* Flexbox */

3101
package-lock.json generated Normal file

File diff suppressed because it is too large Load diff

401
sw5e.css
View file

@ -2,7 +2,6 @@
/* ----------------------------------------- */
/* Fonts */
/* ----------------------------------------- */
/* russo-one-regular - latin */
@font-face {
font-family: 'Russo One';
@ -10,11 +9,6 @@
font-weight: 400;
src: url('./fonts/RussoOne.ttf');
}
.russoOne {
font-family: 'Russo One';
font-size: 20px;
font-weight: 400;
}
/* bungee-inline-regular - latin */
@font-face {
font-family: 'Bungee Inline';
@ -39,8 +33,6 @@
font-size: 20px;
font-weight: 400;
}
/* ----------------------------------------- */
/* Sheet Styles */
/* ----------------------------------------- */
@ -89,7 +81,7 @@
flex: 4;
}
/* ----------------------------------------- */
/* All SW5e Apps */
/* All DnD5e Apps */
/* ----------------------------------------- */
.sw5e {
/* ----------------------------------------- */
@ -99,7 +91,7 @@
/* Tags */
}
.sw5e .window-content {
background: url("ui/parchment.webp") repeat;
background: linear-gradient(90deg, #afc6d6 0%, #D6D6D6 30%, #D6D6D6 70%, #afc6d6);
font-size: 13px;
color: #191813;
}
@ -195,18 +187,14 @@
flex: auto;
text-align: left;
}
.sw5e .form-group.stacked label.text {
flex: 0 0;
text-align: right;
}
.sw5e .form-header {
margin: 0 0 0.25em 0;
padding: 0 2px;
font-family: "Russo One";
font-size: 8px;
font-size: 12px;
padding: 2px 0;
border-top: 2px groove #eeede0;
border-bottom: 2px groove #eeede0;
font-family: 'Russo One';
font-size: 20px;
font-weight: 400;
}
.sw5e .tag {
display: inline-block;
@ -247,7 +235,7 @@
.sw5e.sheet .window-content {
overflow-y: hidden;
padding: 5px;
background: url("ui/parchment.webp") repeat;
background: linear-gradient(90deg, #afc6d6 0%, #D6D6D6 30%, #D6D6D6 70%, #afc6d6);
font-size: 13px;
color: #191813;
}
@ -300,16 +288,17 @@
.sw5e.sheet .sheet-header {
flex: 0 0 100px;
border-bottom: 2px groove #eeede0;
font-family: "Russo One";
font-size: 14px;
/* Character Name */
/* Profile Image */
/* Header Summary Details */
}
.sw5e.sheet .sheet-header .header-details {
font-family: 'Russo One';
font-size: 20px;
font-weight: 400;
}
.sw5e.sheet .sheet-header h1 {
flex: 2; /*changed*/
flex: 1;
border-bottom: none;
height: 60px;
margin: 0;
@ -318,9 +307,8 @@
.sw5e.sheet .sheet-header h1 input {
display: block;
height: 50px;
font-size: 22px; /*changed*/
font-size: 32px;
margin: 0;
text-transform: uppercase; /*changed*/
}
.sw5e.sheet .sheet-header img.profile {
flex: 0 0 100px;
@ -354,8 +342,9 @@
.sw5e.sheet .sheet-navigation {
flex: 0 0 30px;
margin-bottom: 5px;
font-family: "Russo One";
font-size: 12px;
font-family: 'Russo One';
font-size: 14px;
font-weight: 400;
}
.sw5e.sheet .sheet-navigation .item {
height: 30px;
@ -369,24 +358,6 @@
.sw5e.sheet .sheet-body {
flex: 1;
overflow: hidden;
font-family: "Open Sans";
}
.sw5e.sheet .sheet-body h2 { /*changed*/
font-family: "Russo One";
font-size: 18px;
text-transform: uppercase;
color: #c40f0f;
}
.sw5e.sheet .sheet-body th {
font-family: "Russo One";
text-transform: uppercase;
color: #c40f0f;
}
.sw5e.sheet .sheet-body tr:nth-child(odd) {
background-color: #c9d6db;
}
.sw5e.sheet .sheet-body tr:nth-child(even) {
background-color: #bdc8cc;
}
.sw5e.sheet .filter-list {
list-style: none;
@ -506,7 +477,7 @@
.sw5e.sheet.actor .sheet-header .summary {
height: 30px;
border-bottom: 2px groove #eeede0;
font-size: 14px;
font-size: 18px;
}
.sw5e.sheet.actor .sheet-header .summary input,
.sw5e.sheet.actor .sheet-header .summary span {
@ -539,8 +510,11 @@
height: 18px;
line-height: 16px;
margin: 4px 8px 2px;
font-size: 14px; /*changed*/
border-bottom: 1px solid #b5b3a4;
font-family: 'Russo One';
font-size: 14px;
font-weight: 400;
color: #4b4a44;
border-bottom: 1px solid #c9c7b8;
}
.sw5e.sheet.actor .tab.attributes {
overflow: hidden;
@ -556,8 +530,6 @@
margin: 0 5px 0 0;
border: 2px groove #eeede0;
border-radius: 4px;
font-family: "Russo One";
font-size: 12px;
text-align: center;
}
.sw5e.sheet.actor ul.attributes li.attribute:last-child {
@ -569,25 +541,16 @@
align-items: center;
height: 28px;
line-height: 28px;
font-family: 'Russo One';
font-size: 20px;
font-weight: 400;
}
.sw5e.sheet.actor ul.attributes li.attribute .attribute-value > * {
display: inline;
max-width: 80%;
height: 28px;
margin: 0;
font-size: 14px; /*changed*/
text-align: center;
}
.sw5e.sheet.actor ul.attributes li.attribute .attribute-value span.sep {
display: inline;
position: relative;
top: 2px;
font-size: 28px;
color: #7a7971;
font-weight: 400;
font-size: 24px;
}
.sw5e.sheet.actor ul.attributes li.attribute .attribute-value.multiple input {
flex: 0 0 33%;
max-width: 2em;
}
.sw5e.sheet.actor ul.attributes li.attribute .attribute-footer {
flex: 0 0 18px;
@ -603,8 +566,11 @@
list-style: none;
margin: 0;
padding: 0;
font-family: "Russo One";
font-size: 8px;
font-family: 'Russo One';
font-size: 20px;
font-weight: 400;
border: 2px groove #eeede0;
border-radius: 3px;
}
.sw5e.sheet.actor .ability-scores .ability {
height: 70px;
@ -618,10 +584,9 @@
.sw5e.sheet.actor .ability-scores .ability input.ability-score {
height: 30px;
width: 36px;
text-align: center;
margin: 0 auto;
line-height: 32px;
font-size: 16px; /*changed*/
font-size: 24px;
}
.sw5e.sheet.actor .ability-scores .ability .ability-modifiers {
height: 24px;
@ -643,10 +608,6 @@
}
.sw5e.sheet.actor .ability-scores .ability .ability-modifiers span.ability-save {
border-left: 2px groove #eeede0;
}
/* Hide modifier box on hover */
.sw5e.sheet.actor .ability-scores .ability input.ability-score:hover + .ability-modifiers {
visibility: hidden;
}
.sw5e.sheet.actor .proficiency-toggle {
color: #b5b3a4;
@ -661,7 +622,7 @@
cursor: default;
}
.sw5e.sheet.actor ul.skills-list {
flex: 0 0 190px; /*changed*/
flex: 0 0 180px;
height: 440px;
list-style: none;
margin: 0 5px 0;
@ -711,9 +672,9 @@
.sw5e.sheet.actor .counters .counter h4 {
flex: auto;
margin: 0;
font-family: "Russo One";
font-size: 14px;
font-size: 10px; /*changed*/
font-size: 13px;
font-weight: bold;
color: #4b4a44;
}
.sw5e.sheet.actor .counters .counter .counter-value {
flex: none;
@ -789,17 +750,6 @@
flex: 0 0 20px;
justify-content: flex-end;
}
.sw5e.sheet.actor .inventory-filters h3,
.sw5e.sheet.actor .inventory-filters .filter-title {
font-family: "Russo One";
font-size: 10px; /*changed*/
color: #4b4a44;
font-size: 12px; /*changed*/
margin: 0;
}
.sw5e.sheet.actor .inventory-filters.powerbook-filters {
flex: 0 0 40px;
}
.sw5e.sheet.actor .inventory-filters .currency {
flex: 0 0 100%;
list-style: none;
@ -840,7 +790,6 @@
cursor: pointer;
max-height: 30px;
overflow: hidden;
color: #191813
}
.sw5e.sheet.actor .inventory-list .item .item-name .item-image {
flex: 0 0 30px;
@ -887,8 +836,10 @@
.sw5e.sheet.actor .inventory-list .inventory-header h3 {
margin: 0 -5px 0 0;
padding-left: 5px;
font-size: 13px;
font-weight: bold;
font-family: 'Russo One';
font-size: 20px;
font-weight: 400;
font-size: 16px;
}
.sw5e.sheet.actor .inventory-list .inventory-header .item-controls a.item-create {
flex: 0 0 100%;
@ -1026,7 +977,6 @@
.sw5e.sheet.actor .powercasting-ability input,
.sw5e.sheet.actor .powercasting-ability span {
flex: 0 0 32px;
height: 24px;
text-align: center;
}
.sw5e.sheet.actor .powercasting-ability select {
@ -1119,8 +1069,7 @@
padding: 0 8px;
}
.sw5e.sheet.item {
min-height: 520px; /*changed*/
min-width: 700px; /*changed*/
min-height: 420px;
/* ----------------------------------------- */
/* Sheet Header */
/* ----------------------------------------- */
@ -1141,7 +1090,7 @@
border: 2px solid #000;
}
.sw5e.sheet.item .sheet-header .item-subtitle {
flex: 1 0 80px; /*changed*/
flex: 0 0 80px;
height: 60px;
margin: 0;
padding: 5px;
@ -1149,7 +1098,7 @@
color: #7a7971;
}
.sw5e.sheet.item .sheet-header .item-subtitle .item-type {
font-size: 16px; /*changed*/
font-size: 24px;
line-height: 26px;
margin: 0;
}
@ -1161,21 +1110,10 @@
margin-bottom: 5px;
}
.sw5e.sheet.item .sheet-navigation .item {
font-size: 14px; /*changed*/
font-size: 18px;
}
.sw5e.sheet.item .sheet-body {
overflow: hidden;
font-family: "Open Sans";
}
.sw5e.sheet.item .sheet-body h2 { /*changed*/
font-family: "Russo One";
font-size: 18px;
border-bottom: 2px solid #0d99cc;
}
.sw5e.sheet.item .sheet-body h3 { /*changed*/
font-family: "Russo One";
color: #c40f0f;
text-transform: uppercase;
}
.sw5e.sheet.item .sheet-body .tab {
padding: 0 5px;
@ -1307,75 +1245,8 @@
height: 16px;
top: 4px;
}
.sw5e.sheet.item h4.armorproperties-header { /*changed*/
margin: 0;
padding: 0;
font-weight: bold;
line-height: 24px;
color: #4b4a44;
}
.sw5e.sheet.item .armorproperties-parts { /*changed*/
list-style: none;
margin: 0;
padding: 0;
}
.sw5e.sheet.item .armorproperties-parts .armorproperties-part { /*changed*/
flex: 0 0 100%;
padding: 0;
}
.sw5e.sheet.item .armorproperties-parts .armorproperties-part input { /*changed*/
flex: 3;
}
.sw5e.sheet.item .armorproperties-parts .armorproperties-part select { /*changed*/
margin-left: 5px;
flex: 1;
}
.sw5e.sheet.item .armorproperties-control { /*changed*/
width: 18px;
flex: 0 0 18px;
line-height: 24px;
float: right;
text-align: right;
color: #7a7971;
}
.sw5e.sheet.item h4.weaponproperties-header { /*changed*/
margin: 0;
padding: 0;
font-weight: bold;
line-height: 24px;
color: #4b4a44;
}
.sw5e.sheet.item .weaponproperties-parts { /*changed*/
list-style: none;
margin: 0;
padding: 0;
}
.sw5e.sheet.item .weaponproperties-parts .weaponproperties-part { /*changed*/
flex: 0 0 100%;
padding: 0;
}
.sw5e.sheet.item .weaponproperties-parts .weaponproperties-part input { /*changed*/
flex: 3;
}
.sw5e.sheet.item .weaponproperties-parts .weaponproperties-part select { /*changed*/
margin-left: 5px;
flex: 1;
}
.sw5e.sheet.item .weaponproperties-control { /*changed*/
width: 18px;
flex: 0 0 18px;
line-height: 24px;
float: right;
text-align: right;
color: #7a7971;
}
.sw5e.sheet.item .weapon-properties label.checkbox {
flex: 0 0 110px;
}
.sw5e.sheet.item .armor-properties label.checkbox {
flex: 0 0 110px;
flex: 0 0 98px;
}
.sw5e.sheet.item .loot-header {
margin-bottom: 10px;
@ -1400,8 +1271,9 @@
flex: 1;
margin: 0;
line-height: 36px;
font-family: "Russo One";
font-size: 10px; /*changed*/
font-family: 'Bungee Inline';
font-size: 20px;
font-weight: 400;
color: #4b4a44;
}
.sw5e.chat-card .card-header h3:hover {
@ -1470,8 +1342,8 @@
/* Basic Structure */
/* ----------------------------------------- */
.sw5e.sheet.actor.character {
min-width: 700px; /*changed*/
min-height: 680px; /*changed*/
min-width: 720px;
min-height: 680px;
/* ----------------------------------------- */
/* Sheet Header */
/* ----------------------------------------- */
@ -1481,7 +1353,7 @@
/* ----------------------------------------- */
/* Item Controls */
/* ----------------------------------------- */
/* ----------------------------------------- */
/* ----------------------------------------- */
/* Biography */
/* ----------------------------------------- */
}
@ -1532,7 +1404,7 @@
margin: 0 3px;
}
.sw5e.sheet.actor.character .sheet-header .attributes .hit-dice {
font-size: 16px; /*changed*/
font-size: 24px;
}
.sw5e.sheet.actor.character .sheet-header .attributes .initiative .attribute-footer input {
width: 32px;
@ -1543,7 +1415,6 @@
}
.sw5e.sheet.actor.character .resource .attribute-value input {
flex: 0 0 25%;
width: 2em;
}
.sw5e.sheet.actor.character .resource .attribute-value label.recharge {
height: 32px;
@ -1602,7 +1473,7 @@
}
.sw5e.sheet.actor.character .characteristics label {
flex: 0 0 20px;
font-family: "Open Sans";
font-family: 'Bungee Inline';
font-size: 20px;
font-weight: 400;
font-size: 16px;
@ -1611,16 +1482,21 @@
text-align: center;
}
.sw5e.sheet.actor.character .characteristics textarea {
font-family: "Signika", serif;
font-family: 'Open Sans';
font-size: 20px;
font-weight: 400;
border: 1px solid #c9c7b8;
resize: none;
}
.sw5e.sheet.actor.character .biography {
max-width: calc(100% - 180px);
}
/* ----------------------------------------- */
/* Basic Structure */
/* ----------------------------------------- */
.sw5e.sheet.actor.npc {
min-width: 800px; /*changed*/
min-height: 680px; /*changed*/
min-width: 600px;
min-height: 680px;
}
.sw5e.sheet.actor.npc .header-exp {
flex: 0 0 80px;
@ -1668,161 +1544,6 @@
max-width: 40px;
text-align: right;
}
/* ----------------------------------------- */ /*changed*/
/* Journal Entry
/* ----------------------------------------- */
.journal-sheet .window-content {
padding: 0;
background: url("ui/parchment.webp") repeat;
}
.journal-sheet form {
overflow: hidden;
padding: 5px;
font-family: "Open Sans";
background: url("ui/parchment.webp") repeat;
}
.journal-sheet form h2 {
font-family: "Russo One";
font-size: 18px;
text-transform: uppercase;
color: #c40f0f;
}
.journal-sheet form input[name="name"] {
height: 36px;
font-family: "Russo One";
font-size: 24px;
text-transform: uppercase;
color: #c40f0f;
line-height: 36px;
}
.journal-sheet form select {
width: 100%;
height: 30px;
margin: 5px 0;
}
.journal-sheet form .editor {
height: calc(100% - 115px);
}
.journal-sheet form button[type="submit"] {
margin-top: 5px;
}
.journal-sheet form img {
border: none
}
.journal-sheet form table {
border: none;
background-color: none;
}
/* ---------------------------------------- */ /*changed*/
/* Roll Table Sheet */
/* ---------------------------------------- */
.roll-table-config .window-content {
background: url("ui/parchment.webp") repeat;
}
.roll-table-config form {
background: url("ui/parchment.webp") repeat;
}
.roll-table-config h1.name input {
width: 100%;
height: 36px;
margin: 0 0 5px;
font-family: "Russo One";
font-size: 24px;
text-transform: uppercase;
color: #c40f0f;
}
.roll-table-config textarea {
resize: none;
min-height: 44px;
font-family: "Open Sans";
background: url("ui/parchment.webp") repeat;
}
.roll-table-config ol.table-results {
list-style: none;
margin: 0;
padding: 0;
max-height: 600px;
overflow-y: auto;
}
.roll-table-config ol.table-results .table-result {
padding: 2px 0;
border-top: 1px solid transparent;
border-bottom: 1px solid transparent;
}
.roll-table-config ol.table-results .table-result input[type="text"] {
width: 100%;
height: 28px;
}
.roll-table-config ol.table-results .table-result > div {
line-height: 36px;
margin-right: 5px;
}
.roll-table-config ol.table-results .table-result .result-image {
flex: 0 0 36px;
width: 36px;
height: 36px;
text-align: center;
margin: 0;
}
.roll-table-config ol.table-results .table-result .result-image img {
border: none;
object-fit: cover;
object-position: 50% 0;
}
.roll-table-config ol.table-results .table-result .result-type {
flex: 0 0 110px;
}
.roll-table-config ol.table-results .table-result .result-details {
flex: 1;
}
.roll-table-config ol.table-results .table-result .result-details select {
width: 40%;
}
.roll-table-config ol.table-results .table-result .result-details .result-target {
width: 58%;
margin-left: 3px;
}
.roll-table-config ol.table-results .table-result .result-weight {
flex: 0 0 50px;
text-align: center;
}
.roll-table-config ol.table-results .table-result .result-range {
flex: 0 0 92px;
text-align: center;
}
.roll-table-config ol.table-results .table-result .result-range input {
width: 36px;
}
.roll-table-config ol.table-results .table-result .result-controls {
flex: 0 0 40px;
margin: 0;
text-align: center;
}
.roll-table-config ol.table-results .table-result .result-controls a {
width: 20px;
}
.roll-table-config ol.table-results .table-result .result-controls .lock-result {
color: #b5b3a4;
}
.roll-table-config ol.table-results .table-result.roulette {
background: url("ui/parchment.webp") repeat;
border-top: 1px solid #000;
border-bottom: 1px solid #000;
}
.roll-table-config ol.table-results .table-result.drawn {
background: rgba(0, 0, 0, 0.15);
}
.roll-table-config ol.table-results .table-result.drawn .lock-result {
color: #111;
}
.roll-table-config ol.table-results .table-header {
background: url("ui/parchment.webp") repeat;
border: 1px solid #7a7971;
line-height: 24px;
font-weight: bold;
}
/* Text Input */
input[type="number"] {
width: calc(100% - 2px);
min-width: 20px;