diff --git a/assets/dbp-signature.html.ejs b/assets/dbp-signature.html.ejs
index 9ca6fc2614f2abec4c48c56ba7bd204402a53f23..bacdf98a092f89027b848c747beb0aa21f77ec24 100644
--- a/assets/dbp-signature.html.ejs
+++ b/assets/dbp-signature.html.ejs
@@ -41,18 +41,37 @@
font-family: 'Source Sans Pro', 'Calibri', 'Arial', 'sans-serif';
font-weight: 300;
margin: 0;
+ background-color: var(--dbp-override-base-light);
+ color: var(--dbp-override-text-dark);
}
/* TU-Graz style override */
html {
- --dbp-override-primary-bg-color: #245b78;
- --dbp-override-primary-button-border: solid 1px #245b78;
- --dbp-override-info-bg-color: #245b78;
- --dbp-override-danger-bg-color: #e4154b;
- --dbp-override-warning-bg-color: #ffe183;
- --dbp-override-warning-text-color: black;
- --dbp-override-success-bg-color: #259207;
- /* --dbp-override-downloaded-bg-color: #9fdf9f; */
+ --dbp-override-base-light: #ffffff;
+ --dbp-override-base-dark: #000000;
+ --dbp-override-text-light: #ffffff;
+ --dbp-override-text-dark: #000000;
+ --dbp-override-text-muted-light: #afaca7;
+ --dbp-override-text-muted-dark: #5c5856;
+ --dbp-override-accent-light: #e4154b;
+ --dbp-override-accent-dark: #e4154b;
+ --dbp-override-primary-light: #73899e;
+ --dbp-override-primary-dark: #245b78;
+ --dbp-override-secondary-light: #ffffff;
+ --dbp-override-secondary-dark: #000000;
+ --dbp-override-info-light: #73899e;
+ --dbp-override-info-dark: #245b78;
+ --dbp-override-success-light: #75c438;
+ --dbp-override-success-dark: #148800;
+ --dbp-override-warning-light: #ffad4d;
+ --dbp-override-warning-dark: #af6405;
+ --dbp-override-danger-light: #ff5d79;
+ --dbp-override-danger-dark: #e4154b;
+ --dbp-override-border-light: 1px solid #ffffff;
+ --dbp-override-border-dark: 1px solid #000000;
+ --dbp-override-hover-base: #000000;
+ --dbp-override-hover-text: #ffffff;
+
--dbp-override-image-nextcloud: url(<%= getUrl('') %>images/nextcloud.svg);
}
</style>
@@ -114,18 +133,18 @@
}
.footer-links a {
- border-bottom: 1px solid rgba(0, 0, 0, 0.3);
+ border-bottom: var(--dbp-border-dark);
padding: 0;
margin-left: 1em;
transition: background-color 0.15s ease 0s, color 0.15s ease 0s;
- color: #6c757d;
+ color: var(--dbp-text-dark);
cursor: pointer;
text-decoration: none;
}
.footer-links a:hover {
- color: #fff;
- background-color: #000;
+ color: var(--dbp-hover-text);
+ background-color: var(--dbp-hover-base);
}
</style>
<dbp-translated subscribe="lang">
@@ -159,12 +178,12 @@
<style>
.int-link-internal{
transition: background-color 0.15s, color 0.15s;
- border-bottom: 1px solid rgba(0,0,0,0.3);
+ border-bottom: var(--dbp-border-dark);
}
.int-link-internal:hover{
- background-color: black;
- color: white;
+ background-color: var(--dbp-hover-base);
+ color: var(--dbp-hover-text);
}
.int-link-internal:after{
diff --git a/src/dbp-pdf-annotation-view.js b/src/dbp-pdf-annotation-view.js
index 901f322522326124487a2fd466030fa3896e1e49..93e55bb5529420f74cd1464efdad6e7f37d008bb 100644
--- a/src/dbp-pdf-annotation-view.js
+++ b/src/dbp-pdf-annotation-view.js
@@ -232,11 +232,11 @@ export class PdfAnnotationView extends ScopedElementsMixin(DBPLitElement) {
}
.border {
- border-top: 1px solid #888;
+ border-top: var(--dbp-border-dark);
padding-bottom: .5em;
}
.border-wrapper {
- border: 1px solid black;
+ border: var(--dbp-border-dark);
border-bottom-width: 0;
border-top-width: 0;
@@ -272,23 +272,17 @@ export class PdfAnnotationView extends ScopedElementsMixin(DBPLitElement) {
#fields-wrapper {
position: relative;
- border-color: #000;
- border-width: 1px;
- border-style: solid;
+ border: var(--dbp-border-dark);
padding: 0.5em;
padding-bottom: 0.8em;
-
border-top-width: 0;
}
#pdf-meta {
- border-color: #000;
- border-width: 1px;
- border-style: solid;
+ border: var(--dbp-border-dark);
padding: 0.5em;
border-bottom-width: 0;
border-top-width: 0;
-
padding-bottom: 1em;
}
@@ -296,7 +290,8 @@ export class PdfAnnotationView extends ScopedElementsMixin(DBPLitElement) {
padding-left: 8px;
font-weight: 300;
color: inherit;
- border: 1px solid #aaa;
+ border: var(--dbp-border-dark);
+ border-color: var(--dbp-text-muted-dark);
line-height: 100%;
height: 28px;
width: 100%;
diff --git a/src/dbp-pdf-preview.js b/src/dbp-pdf-preview.js
index ad8dcb9b6b889ddb9586c1da8726ce5bc1eb5a9f..3efaf7010c1fdbeb537a4d5a96639520ed8d522d 100644
--- a/src/dbp-pdf-preview.js
+++ b/src/dbp-pdf-preview.js
@@ -499,8 +499,7 @@ export class PdfPreview extends ScopedElementsMixin(DBPLitElement) {
position: absolute;
top: 0;
left: 0;
- border: solid 1px black;
- border-top-color: #888;
+ border: var(--dbp-border-dark);
}
#annotation-layer {
@@ -548,21 +547,19 @@ export class PdfPreview extends ScopedElementsMixin(DBPLitElement) {
}
input[type=number] {
- border: 1px solid #000;
+ border: var(--dbp-border-dark);
padding: 0 0.3em;
}
#pdf-meta {
- border-color: #000;
- border-width: 1px;
- border-style: solid;
+ border: var(--dbp-border-dark);
padding: 0.54em;
border-bottom-width: 0;
border-top-width: 0;
}
.button.is-cancel {
- color: #e4154b;
+ color: var(--dbp-danger-dark);
}
.error-message{
diff --git a/src/dbp-qualified-signature-pdf-upload.js b/src/dbp-qualified-signature-pdf-upload.js
index 994f1335d42c8c80a39b3fa34beddc56752d1cc9..4272d632fe612344671866d2745c9682254baeba 100644
--- a/src/dbp-qualified-signature-pdf-upload.js
+++ b/src/dbp-qualified-signature-pdf-upload.js
@@ -424,7 +424,7 @@ class QualifiedSignaturePdfUpload extends ScopedElementsMixin(DBPSignatureLitEle
}
#external-auth .button.is-cancel {
- color: #e4154b;
+ color: var(--dbp-danger-dark);
}
#iframe {
diff --git a/src/dbp-signature-verification.js b/src/dbp-signature-verification.js
index 6e9c78b26d76ac2e5eb73e0e1bc6e0502ddb2b41..0c2bcb993d15b5c76c01b9ec4cb34a4511ce7fd2 100644
--- a/src/dbp-signature-verification.js
+++ b/src/dbp-signature-verification.js
@@ -45,13 +45,13 @@ class SignatureVerification extends ScopedElementsMixin(DBPSignatureLitElement)
${commonStyles.getGeneralCSS(false)}
a {
- border-bottom: 1px solid rgba(0,0,0,0.3);
+ border-bottom: var(--dbp-border-dark);
padding: 0;
}
a:hover {
- color: #fff;
- background-color: #000;
+ background-color: var(--dbp-hover-base);
+ color: var(--dbp-hover-text);
}
h2:first-child {
@@ -61,12 +61,12 @@ class SignatureVerification extends ScopedElementsMixin(DBPSignatureLitElement)
.int-link-internal{
transition: background-color 0.15s, color 0.15s;
- border-bottom: 1px solid rgba(0,0,0,0.3);
+ border-bottom: var(--dbp-border-dark);
}
.int-link-internal:hover{
- background-color: black;
- color: white;
+ background-color: var(--dbp-hover-base);
+ color: var(--dbp-hover-text);
}
.int-link-internal:after{
diff --git a/src/styles.js b/src/styles.js
index b578e15e63302cfe4050f13be4c4159cc028b84a..355e2652a0831c4066722a71f2807c6d03c8982b 100644
--- a/src/styles.js
+++ b/src/styles.js
@@ -8,7 +8,7 @@ export function getSignatureCss() {
background: transparent;
border: none;
font-size: 1.5rem;
- color: var(--dbp-override-danger-bg-color);
+ color: var(--dbp-accent-dark);
cursor: pointer;
padding: 0px;
padding-right: 2px;
@@ -41,7 +41,7 @@ export function getSignatureCss() {
}
#pdf-preview .box-header, #annotation-view .box-header {
- border: 1px solid #000;
+ border: var(--dbp-border-dark);
border-bottom-width: 0;
padding: 0.5em 0.5em 0 0.5em;
}
@@ -85,11 +85,12 @@ export function getSignatureCss() {
}
.error, #cancel-signing-process {
- color: #e4154b;
+ color: var(--dbp-danger-dark);
}
#cancel-signing-process:hover {
- color: white;
+ color: var(--dbp-hover-text);
+ background-color: var(--dbp-hover-base);
}
/* using dbp-icon doesn't work */
@@ -98,7 +99,7 @@ export function getSignatureCss() {
}
a > [name=close] {
- color: red;
+ color: var(--dbp-accent-dark);
}
.empty-queue {
@@ -120,7 +121,7 @@ export function getSignatureCss() {
}
.file-block, .box {
- border: solid 1px black;
+ border: var(--dbp-border-dark);
padding: 10px;
}
@@ -159,7 +160,7 @@ export function getSignatureCss() {
.file-block .error-line {
margin-top: 6px;
- color: var(--dbp-override-danger-bg-color);
+ color: var(--dbp-danger-dark);
}
.file-block.error div.bottom-line {
@@ -184,7 +185,7 @@ export function getSignatureCss() {
}
#pdf-preview .button.is-cancel {
- color: #e4154b;
+ color: var(--dbp-accent-dark);
}
.is-right {
@@ -232,13 +233,14 @@ export function getSignatureCss() {
}
.border{
- border-top: 1px solid black;
+ border-top: var(--dbp-border-dark);
margin-top: 2rem;
padding-top: 2rem;
}
.placement-missing {
- border: solid 2px var(--dbp-override-danger-bg-color);
+ border: solid 2px var(--dbp-danger-dark);
+ border-radius: var(--dbp-border-radius);
}
.subheadline{
@@ -261,7 +263,8 @@ export function getSignatureCss() {
left: 0;
right: 0;
bottom: 0;
- background-color: white;
+ background-color: var(--dbp-base-light);
+ color: var(--dbp-text-dark);
overflow-y: scroll;
}
diff --git a/src/textswitch.js b/src/textswitch.js
index 475a277849180cff786025ddb389d621c44941c2..608d9c0868f7c6b182e2daead7690754b2cfdab0 100644
--- a/src/textswitch.js
+++ b/src/textswitch.js
@@ -55,10 +55,18 @@ export class TextSwitch extends LitElement {
#button1 {
border-right-width: 0;
}
+
+ .button:first-child{
+ border-radius: var(--dbp-border-radius) 0 0 var(--dbp-border-radius);
+ }
+
+ .button:last-child{
+ border-radius: 0 var(--dbp-border-radius) var(--dbp-border-radius) 0;
+ }
.active {
- background-color: black !important;
- color: var(--dbp-primary-text-color) !important;
+ background-color: var(--dbp-secondary-dark) !important;
+ color: var(--dbp-text-light) !important;
}
.button {
@@ -66,7 +74,8 @@ export class TextSwitch extends LitElement {
}
.button:hover {
- background-color: var(--dbp-secondary-bg-color) !important;
+ background-color: var(--dbp-hover-base) !important;
+ color: var(--dbp-hover-text) !important;
}
`;
}