uberwald/l5rx-chiaroscuro
0
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add css trick border + Style for equiped and review for npc input.

Browse Source
This commit is contained in:
Mandar
2021-01-20 04:33:07 +01:00
parent 8fbf7f9005
commit 289ec720de
12 changed files with 129 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
system/styles/l5r5e.css
View File

File diff suppressed because one or more lines are too long

2
system/styles/scss/cursors.scss
View File

@@ -47,11 +47,13 @@ form .form-group .form-fields button,
.dialog .dialog-buttons button,
.item-edit,
.item-delete,
.item-equip,
.technique-edit,
.technique-delete,
.peculiarity-edit,
.peculiarity-delete,
.attribute-dtype,
.equip-readied-control,
form button,
label {
cursor: url("../assets/cursors/pointer.webp"), pointer !important;

11
system/styles/scss/global.scss
View File

@@ -188,7 +188,7 @@ fieldset {
flex: 1;
display: flex;
margin: 0 0.25rem;
padding: 0.25rem 0.5rem;
padding: 0.5rem;
border: 1px solid $l5r5e-title;
legend {
color: $l5r5e-label;
@@ -203,16 +203,21 @@ input[type="text"],
input[type="number"],
input[type="password"],
input[type="date"],
input[type="time"] {
text-align: center;
input[type="time"],
textarea {
padding: 0.25rem;
background: $l5r5e-white;
border: 1px solid $l5r5e-title;
color: $l5r5e-bold;
resize: vertical;
border-radius: 0;
&[disabled] {
background: $l5r5e-white-light;
}
}
input[type="number"] {
text-align: center;
}
// Editors
.editor,

10
system/styles/scss/items.scss
View File

@@ -19,6 +19,7 @@
}
.item-edit,
.item-delete,
.item-equip,
.technique-edit,
.technique-delete,
.peculiarity-edit,
@@ -29,6 +30,7 @@
font-size: 0.75rem;
flex: 0 0 1rem;
padding: 0 0.1rem;
color: $black-light;
}
.icon-stat-container {
line-height: 1rem;
@@ -38,6 +40,7 @@
}
.item-edit,
.item-delete,
.item-equip,
.technique-edit,
.technique-delete,
.peculiarity-edit,
@@ -46,6 +49,7 @@
.property-delete {
&:hover {
text-shadow: 0 0 3px $red;
color: $black;
}
}
}
@@ -68,6 +72,12 @@
margin-right: 0;
}
}
.equip-readied-control {
&:hover {
color: $l5r5e-red;
background: $white;
}
}
}
p {
font-size: 0.85rem;

7
system/styles/scss/npc.scss
View File

@@ -96,6 +96,7 @@
width: 100%;
line-height: 2rem;
font-size: 0.75rem;
margin: 0.25rem 0.25rem 0.5rem;
text-align: center;
li {
flex: 1;
@@ -144,6 +145,12 @@
flex: 0 0 calc(100% - 0.5rem);
margin: 1rem 0.25rem 0;
}
.initiative-wrapper {
margin-bottom: 0.5rem;
}
&:last-child {
padding-bottom: 1rem;
}
}
.npc-note {
.editor {

103
system/styles/scss/sheets.scss
View File

@@ -34,12 +34,6 @@
line-height: 2rem;
font-size: 1rem;
}
.compromised {
input {
border: 1px solid $l5r5e-red;
box-shadow: 0 1px 5px $l5r5e-red;
}
}
}
form {
display: flex;
@@ -107,6 +101,12 @@
0% calc(100% - var(--notchSize))
);
}
.compromised {
input {
border: 1px solid $l5r5e-red;
box-shadow: 0 1px 5px $l5r5e-red;
}
}
.header-fields {
position: relative;
flex: 0 0 100%;
@@ -293,23 +293,20 @@
}
label {
flex-direction: row;
width: 100%;
strong {
text-align: right;
}
&:nth-child(2) {
position: relative;
flex: 50%;
right: 1.5rem;
strong {
position: absolute;
top: 0;
left: 0;
font-size: 0.65rem;
width: 3rem;
color: $l5r5e-black;
color: $l5r5e-black-light;
}
input {
border-top: 0 none;
font-size: 1.25rem;
padding-top: 0.75rem;
}
@@ -317,12 +314,20 @@
}
.endurance-content,
.composure-content {
input {
&[disabled] {
flex: 0 0 5rem;
label:nth-child(1) {
strong {
flex: 0 0 calc(100% - 6rem);
}
input {
flex: 0 0 5.5rem;
padding-right: 3rem;
}
}
label:nth-child(2) {
position: absolute;
right: 0;
width: 3.5rem;
}
}
.void-content {
display: flex;
@@ -396,6 +401,66 @@
}
}
}
.attribute-label {
position: relative;
&:before {
z-index: -1;
content: "";
position: absolute;
height: calc(100% - 0.85rem);
width: 3.1rem;
border: 1px solid $l5r5e-title;
border-radius: 0;
top: 0.15rem;
left: 0.15rem;
}
}
.identity-content {
.attribute-label {
&:before {
height: calc(100% - 0.6rem);
width: calc(100% - 0.65rem);
left: auto;
top: 0.15rem;
right: 0.85rem;
}
}
li:nth-child(3),
li:nth-child(5) {
.attribute-label {
&:before {
height: calc(100% - 0.6rem);
width: calc(100% + 0.25rem);
left: auto;
top: 0.15rem;
right: -0.15rem;
}
}
}
}
.attributes-wrapper {
.attribute-label {
&:nth-child(2) {
&:before {
left: auto;
right: 2.65rem;
}
}
&:before {
left: auto;
right: 0.15rem;
}
}
}
.void-content {
.attribute-label {
&:before {
left: auto;
right: 1.85rem;
width: 2.9rem;
}
}
}
}
article {
background: $l5r5e-white;
@@ -457,7 +522,9 @@
}
}
.stances-content {
flex: 0 0 100%;
flex: 100%;
height: 100%;
align-self: flex-start;
.item-list {
position: relative;
padding-top: 2rem;
@@ -510,7 +577,7 @@
}
.xp,
.money-wrapper {
flex: 0 0 5rem;
flex: 0 0 6rem;
flex-direction: column;
color: $black-light;
label {
@@ -575,9 +642,11 @@
&.npc {
.initiative {
&-wrapper {
display: block;
flex: 100%;
height: 100%;
align-self: flex-start;
text-align: center;
display: block;
}
button {
width: 22%;

6
system/styles/scss/twentyquestions.scss
View File

@@ -60,8 +60,6 @@
article {
padding: 2% 2% 2% 18%;
label {
font-size: 0.85rem;
line-height: 2rem;
&.full {
display: block;
width: 100%;
@@ -79,6 +77,10 @@
> label {
font-size: 1rem;
padding: 0 0 0 1rem;
line-height: 2rem;
> * {
line-height: 1rem;
}
}
table {
width: 100%;