summaryrefslogtreecommitdiff
path: root/talermerchantdemos/static
diff options
context:
space:
mode:
Diffstat (limited to 'talermerchantdemos/static')
-rw-r--r--talermerchantdemos/static/blog.css131
-rw-r--r--talermerchantdemos/static/colors-blog.css14
-rw-r--r--talermerchantdemos/static/colors-donations.css3
-rw-r--r--talermerchantdemos/static/colors-survey.css8
-rw-r--r--talermerchantdemos/static/demo.css41
-rw-r--r--talermerchantdemos/static/noun-info-2691045.svg1
-rw-r--r--talermerchantdemos/static/noun-pay-2281424.svg1
-rw-r--r--talermerchantdemos/static/noun-shopping-cart-5195508.svg1
-rw-r--r--talermerchantdemos/static/taler-fallback.css18
-rw-r--r--talermerchantdemos/static/theme.css79
10 files changed, 268 insertions, 29 deletions
diff --git a/talermerchantdemos/static/blog.css b/talermerchantdemos/static/blog.css
index c288119..a406f31 100644
--- a/talermerchantdemos/static/blog.css
+++ b/talermerchantdemos/static/blog.css
@@ -1,20 +1,141 @@
+@charset "UTF-8";
+@import url(/static/theme.css);
+
.notice {
border-radius: 1em;
- background: rgb(228, 228, 228);
- border-left: 0.3em solid #1e2739;
+ background: var(--quote-background-colour);
+ border-left: 0.3em solid var(--demo-common-dark-blue);
padding-left: 1em;
+ padding-right: 1em;
padding-top: 0.5em;
padding-bottom: 0.5em;
margin-top: 2em;
margin-bottom: 2em;
-}
-.notice {
position: relative;
left: 0;
}
+
#main a:link,
#main a:visited,
#main a:hover,
#main a:active {
- color: black;
+ color: var(--link-colour, var(--default-link-colour, black));
+}
+
+/* Licensing Information */
+.essay-shop-title {
+ display: inline-block;
+}
+.fsfs-license {
+ /* by default, hide it until users interact with it */
+ display: none;
+ /* when shown, it should stay at a fixed position on screen */
+ position: fixed;
+ /* Center it on screen */
+ top: 50vh;
+ left: 50vw;
+ transform: translate(-50%,-50%);
+ /* Set Minimum Size Requirements */
+ min-width: 50vw;
+ min-height: 20vh;
+ /* Padding */
+ padding: 25px 25px;
+ /* Border Rounding */
+ border-radius: 25px;
+ /* Always On-Top */
+ z-index: 500000;
+ /* Background */
+ color: #ffffff;
+ background: #1a1a1a66;
+ backdrop-filter: blur(8px) brightness(0.5);
+ /* Cursor */
+ cursor: text;
+ /* Interactions */
+ pointer-events: visibleStroke;
+}
+.info-icon::before {
+ content: ' ';
+ /* Size & Positioning */
+ display: inline-block;
+ width: 1.2em;
+ height: 1.2em;
+ margin-right: 5px;
+ /* Set Icon */
+ background-image: url(/static/noun-info-2691045.svg);
+ /* Ensure Icon is rendered correctly */
+ background-size: contain;
+ background-position: center center;
+ background-repeat: no-repeat;
+ /* Invert it by default unless otherwise specified */
+ filter: var(--license-info-icon-filter, invert());
+ /* Use Pointer Cursor */
+ cursor: pointer;
+}
+.info-icon:active > .fsfs-license,
+.info-icon:focus > .fsfs-license,
+.info-icon:focus-within > .fsfs-license,
+.fsfs-license:focus,
+.fsfs-license:focus-within {
+ display: block;
+}
+
+/* Pay Icon */
+.payLink > .icon::before {
+ content: '​'; /* Blank = CSS Won't render, which is why we put a Zero-Width-Space */
+ /* Size & Positioning */
+ display: inline-block;
+ width: 1.2em;
+ margin-right: 5px;
+ /* Set Icon */
+ background-image: url(/static/noun-shopping-cart-5195508.svg);
+ /* Ensure Icon is rendered correctly */
+ background-size: contain;
+ background-position: center center;
+ background-repeat: no-repeat;
+ /* Invert it by default unless otherwise specified */
+ filter: var(--paylink-icon-filter, invert());
+}
+/* Pay Button */
+.payLink {
+ /* Variables */
+ --link-colour: var(--button-confirm-foreground);
+ --background: var(--button-confirm-background);
+ --bottom-line: 6px;
+ /* General */
+ display: block;
+ border-radius: 10px;
+ color: var(--link-colour);
+ background: var(--background);
+ text-decoration: none;
+ /* Size */
+ max-width: max-content;
+ padding: 10px 10px;
+ /* Positioning */
+ margin-top: 10px;
+ margin-bottom: 0;
+ /* Transitions */
+ transition: background 1s, box-shadow 1s, transform 1s;
+ /* Border */
+ box-shadow: 0px var(--bottom-line) 0px 0 var(--demo-common-dark-blue);
+ -webkit-box-shadow: 0px var(--bottom-line) 0px 0 var(--demo-common-dark-blue);
+ -moz-box-shadow: 0px var(--bottom-line) 0px 0 var(--demo-common-dark-blue);
+ /* Transformations */
+ transform: none;
+}
+
+/* Hover */
+.payLink:hover {
+ --background: var(--button-confirm-hovering-background);
+ --link-colour: var(--button-confirm-hovering-foreground);
+ --bottom-line: 0;
+ transform: translateY(6px);
}
+
+/* Active */
+.payLink:active,
+.payLink:focus,
+.payLink:focus-within,
+.payLink:focus-visible {
+ --background: var(--button-confirm-active-background);
+ --link-colour: var(--button-confirm-active-foreground);
+} \ No newline at end of file
diff --git a/talermerchantdemos/static/colors-blog.css b/talermerchantdemos/static/colors-blog.css
index 59890af..b0b4731 100644
--- a/talermerchantdemos/static/colors-blog.css
+++ b/talermerchantdemos/static/colors-blog.css
@@ -1,24 +1,30 @@
+@import url(/static/theme.css);
+/* General Navigation Bar Styles */
nav,
nav a,
nav span,
.navcontainer,
.demobar,
+nav button,
.navbtn {
- color: white;
- background: #385723;
+ color: var(--navbar-foreground);
+ background: var(--navbar-background);
+ transition: background 0.2s, color 0.2s;
}
+/* Currently Visible Page */
nav a.active,
nav span.active,
.navbtn.active {
- background-color: #233a13;
+ background-color: var(--navbar-button-selected);
}
nav a.active:hover,
nav span.active:hover,
.navbtn.active:hover,
nav a:hover,
+nav button:hover,
nav span:hover,
.navbtn:hover {
- background: #568636;
+ background: var(--navbar-button-hovering);
}
diff --git a/talermerchantdemos/static/colors-donations.css b/talermerchantdemos/static/colors-donations.css
index bf96697..c6ddc03 100644
--- a/talermerchantdemos/static/colors-donations.css
+++ b/talermerchantdemos/static/colors-donations.css
@@ -1,8 +1,10 @@
+@import url(/static/theme.css);
nav,
nav a,
nav span,
.navcontainer,
.demobar,
+nav button,
.navbtn {
color: white;
background: #843c0c;
@@ -18,6 +20,7 @@ nav a.active:hover,
nav span.active:hover,
.navbtn.active:hover,
nav a:hover,
+nav button:hover,
nav span:hover,
.navbtn:hover {
background: #b15213;
diff --git a/talermerchantdemos/static/colors-survey.css b/talermerchantdemos/static/colors-survey.css
index 9377331..0d265bb 100644
--- a/talermerchantdemos/static/colors-survey.css
+++ b/talermerchantdemos/static/colors-survey.css
@@ -3,22 +3,24 @@ nav a,
nav span,
.navcontainer,
.demobar,
+nav button,
.navbtn {
color: white;
- background: #ffaf00;
+ background: #3b000f;
}
nav a.active,
nav span.active,
.navbtn.active {
- background-color: #6e5e3c;
+ background-color: #4f0014;
}
nav a.active:hover,
nav span.active:hover,
.navbtn.active:hover,
nav a:hover,
+nav button:hover,
nav span:hover,
.navbtn:hover {
- background: #b88d31;
+ background: #6e001c;
}
diff --git a/talermerchantdemos/static/demo.css b/talermerchantdemos/static/demo.css
index 53ec986..3c74bfa 100644
--- a/talermerchantdemos/static/demo.css
+++ b/talermerchantdemos/static/demo.css
@@ -1,12 +1,22 @@
@charset "UTF-8";
-/*
-Style common to all demo pages.
+@import url(/static/theme.css);
-Colors (Taler / landing):
-- #1e2739 (dark blue)
-- #0042b2 (default blue)
-- #3daee9 (highlight blue)
-*/
+
+.skip {
+ position: absolute;
+ left: -10000px;
+ top: auto;
+ width: 1px;
+ height: fit-content;
+ overflow: hidden;
+}
+
+.skip:focus {
+ position: static;
+ width: auto;
+ background: black;
+ padding: 5px;
+}
.demobar h1 {
text-align: center;
@@ -18,7 +28,7 @@ Colors (Taler / landing):
.demobar a,
.demobar a:visited {
- color: inherit;
+ color: white;
}
.tt {
@@ -39,6 +49,7 @@ Colors (Taler / landing):
.content {
margin-left: 2em;
+ margin-right: 2em;
overflow-x: auto;
}
@@ -80,6 +91,7 @@ nav {
}
nav a,
+nav button,
nav span,
.navbtn {
border: none;
@@ -92,6 +104,7 @@ nav span,
}
nav a,
+nav button,
nav span,
.navbtn {
padding: 15px 32px;
@@ -106,7 +119,7 @@ nav span:hover,
nav a.active,
nav span.active,
.navbtn.active {
- background-color: #1e2739;
+ background-color: var(--demo-common-dark-blue);
}
nav a.active:hover,
@@ -125,13 +138,7 @@ nav .right {
float: right;
margin-right: 5vw;
}
-nav .right div.nav {
- display: none;
-}
-nav .right div.nav:hover {
- display: block;
-}
-nav .right:hover div.nav {
- display: block;
+nav .hide div.nav {
+ display: none;
}
diff --git a/talermerchantdemos/static/noun-info-2691045.svg b/talermerchantdemos/static/noun-info-2691045.svg
new file mode 100644
index 0000000..37844de
--- /dev/null
+++ b/talermerchantdemos/static/noun-info-2691045.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 100 100" x="0px" y="0px"><title>Info</title><path d="M50,0a50,50,0,1,0,50,50A50,50,0,0,0,50,0Zm-1,18.5a8.33,8.33,0,0,1,8.28,8.32A8.23,8.23,0,0,1,49,35a8.1,8.1,0,0,1-8.16-8.21A8.22,8.22,0,0,1,49.05,18.5ZM64.67,80.78a.72.72,0,0,1-.72.72H36.77a.72.72,0,0,1-.72-.72v-4a.73.73,0,0,1,.72-.73h5.64a2.5,2.5,0,0,0,.71-1.45,12.17,12.17,0,0,0,.09-1.71V52.17c0-3-1-4-4-4.13-1.26,0-2.52,0-3.85,0V44.51l22.5-.8v1.52q0,14.16,0,28.32A3,3,0,0,0,58.56,76H64a.73.73,0,0,1,.72.73Z"></path></svg> \ No newline at end of file
diff --git a/talermerchantdemos/static/noun-pay-2281424.svg b/talermerchantdemos/static/noun-pay-2281424.svg
new file mode 100644
index 0000000..b426e2a
--- /dev/null
+++ b/talermerchantdemos/static/noun-pay-2281424.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 2" viewBox="0 0 100 100" x="0px" y="0px"><defs><style>.cls-1{fill:none;}</style></defs><title>Buy</title><polygon class="cls-1" points="7.25 29.71 15.19 29.71 15.19 54.63 15.19 54.63 15.19 29.71 7.25 29.71 7.25 29.71"></polygon><path class="cls-1" d="M64,43.32l.14-.14a1.85,1.85,0,0,0-.14.14Z"></path><path class="cls-1" d="M71.17,38.75A57.94,57.94,0,0,0,56.94,30a58,58,0,0,1,14.22,8.73Z"></path><path class="cls-1" d="M64.34,51.06a19.33,19.33,0,0,0-3.09-1.42c-.5-.17-1-.34-1.5-.48.5.15,1,.3,1.5.48A20.25,20.25,0,0,1,64.34,51.06Z"></path><path class="cls-1" d="M64.46,42.91l.19-.19.67-.61-.67.61Z"></path><path class="cls-1" d="M56.58,38.52a1,1,0,0,0-.52-.32,20.31,20.31,0,0,0-4.51-.52,20.31,20.31,0,0,1,4.51.52,1,1,0,0,1,.52.32A16.23,16.23,0,0,0,63.27,43,16.29,16.29,0,0,1,56.58,38.52Z"></path><path class="cls-1" d="M67.38,56.48a3,3,0,0,1-2.31,1.78,7.41,7.41,0,0,1-1,.13h0a7.41,7.41,0,0,0,1-.13,3,3,0,0,0,2.31-1.78,3,3,0,0,0-.73-3.66A3,3,0,0,1,67.38,56.48Z"></path><path class="cls-1" d="M66.12,41.46l.47-.35.14-.1-.14.1Z"></path><path class="cls-1" d="M68.85,39.74c-.28.14-.57.3-.84.46l-.35.21L68,40.2c.27-.16.56-.32.84-.46l.27-.14h0Z"></path><path class="cls-1" d="M78.06,60h.21a1.7,1.7,0,1,0,0-3.4h-.21Zm0-3.4h.21a1.7,1.7,0,1,1,0,3.4h-.21Z"></path><path class="cls-1" d="M63,48.17l.05,0-.05,0Z"></path><path class="cls-1" d="M61.81,60.34h0l.82,0Z"></path><path class="cls-1" d="M92.75,55.63a16.07,16.07,0,0,0-.45-3.69,16.07,16.07,0,0,1,.45,3.69Z"></path><path class="cls-1" d="M46.7,42.88a3.24,3.24,0,0,1,.06-.64,3.24,3.24,0,0,0-.06.64,2.83,2.83,0,0,0,1.64,2.72A2.83,2.83,0,0,1,46.7,42.88Z"></path><path class="cls-1" d="M76.92,71.46h0a15.75,15.75,0,0,1-9.07-2.9A15.75,15.75,0,0,0,76.92,71.46Z"></path><path class="cls-1" d="M65.9,49.68l.41.26A9.88,9.88,0,0,1,68,51.41a9.88,9.88,0,0,0-1.73-1.47Z"></path><path class="cls-1" d="M75.57,60h0a1.69,1.69,0,0,1-1.42-.78A1.69,1.69,0,0,0,75.57,60Z"></path><path class="cls-1" d="M75.57,56.63A3.69,3.69,0,0,1,73,50.27a3.69,3.69,0,0,0,2.54,6.36h0Z"></path><polygon class="cls-1" points="78.06 49.24 78.06 49.24 78.06 47.55 76.06 47.55 76.06 47.55 78.06 47.55 78.06 49.24"></polygon><path class="cls-1" d="M78.27,51.24a1.7,1.7,0,0,1,1.7,1.7h0a1.7,1.7,0,0,0-1.7-1.7h-.21v3.39h0V51.24Z"></path><path class="cls-1" d="M74.17,52a1.69,1.69,0,0,1,1.4-.75h0A1.69,1.69,0,0,0,74.17,52Z"></path><path class="cls-1" d="M71.88,58.33A3.67,3.67,0,0,0,73,60.94a3.67,3.67,0,0,1-1.08-2.61Z"></path><polygon class="cls-1" points="78.06 63.72 76.06 63.72 76.06 63.72 78.06 63.72 78.06 62.03 78.06 62.03 78.06 63.72"></polygon><path class="cls-1" d="M64.1,60.38l.32,0h0l-.32,0c-.29,0-.58,0-.88,0h0C63.52,60.4,63.81,60.4,64.1,60.38Z"></path><path class="cls-1" d="M63.88,48.58l.26.12.29.14-.29-.14Z"></path><path class="cls-1" d="M52.07,39.7a10.37,10.37,0,0,0-2.81.24A10.37,10.37,0,0,1,52.07,39.7Z"></path><path class="cls-1" d="M69.72,41.54a15.53,15.53,0,0,0-3.79,2.71l-.21.22.21-.22A15.81,15.81,0,0,1,69.72,41.54Z"></path><path class="cls-1" d="M66.25,60a6.15,6.15,0,0,1-.76.25h0A5.21,5.21,0,0,0,66.25,60Z"></path><path class="cls-1" d="M69.62,55.91a5.43,5.43,0,0,1-.43,1.41,5,5,0,0,1-.64,1,5,5,0,0,0,.64-1A5.43,5.43,0,0,0,69.62,55.91Z"></path><path class="cls-1" d="M74.32,40.05c-.3,0-.59.08-.89.14a16.45,16.45,0,0,0-2.2.67,16,16,0,0,1,2.2-.67C73.72,40.13,74,40.09,74.32,40.05Z"></path><path class="cls-1" d="M37.11,30.62c5.83-1.07,11.33-2.08,14.15-2.08h0c-2.82,0-8.32,1-14.15,2.08-6.06,1.11-12.31,2.26-16.4,2.43V51.44h0V33.05C24.8,32.88,31.05,31.73,37.11,30.62Z"></path><path class="cls-1" d="M26.35,54l.48.28a26.16,26.16,0,0,0,8.23,3.52,26.16,26.16,0,0,1-8.23-3.52Z"></path><path class="cls-1" d="M58.47,58l1.66.16.31,0-.31,0Z"></path><path class="cls-1" d="M62.66,45h0c-.24.31-.45.64-.67,1C62.21,45.59,62.42,45.26,62.66,45Z"></path><path class="cls-1" d="M70.26,39.1c-.38.15-.74.31-1.1.48.36-.17.72-.34,1.1-.48l.28-.11h0Z"></path><path class="cls-1" d="M62.16,44.75a18,18,0,0,1-6.88-4.68L54.66,40l.62.11A18,18,0,0,0,62.16,44.75Z"></path><path class="cls-1" d="M61.08,47.49c.2-.4.43-.79.66-1.18-.23.39-.46.78-.66,1.18Z"></path><path d="M63.67,58.39h.41a7.41,7.41,0,0,0,1-.13,3,3,0,0,0,2.31-1.78,3,3,0,0,0-.73-3.66,8.54,8.54,0,0,0-1.47-1.23c-.26-.18-.54-.36-.84-.53a20.25,20.25,0,0,0-3.09-1.42c-.49-.18-1-.33-1.5-.48l-.13,0a16,16,0,0,0-3.14-.39l-.46,0-.9,0-.72,0-1.75-.1c-3.89-.3-7.95-1.25-7.95-5.66a4.66,4.66,0,0,1,1.73-3.81,8.52,8.52,0,0,1,5.12-1.39,20.31,20.31,0,0,1,4.51.52,1,1,0,0,1,.52.32A16.29,16.29,0,0,0,63.27,43l.77.28a1.85,1.85,0,0,1,.14-.14l.19-.19.09-.08.19-.19.67-.61.17-.15.1-.09.53-.41.47-.35.14-.1.16-.11.76-.49h0L68,40.2c.27-.16.56-.32.84-.46l.27-.14h0l0,0c.36-.17.72-.33,1.1-.48l.28-.11h0l.59-.23A58,58,0,0,0,56.94,30a16.47,16.47,0,0,0-5.68-1.48c-2.82,0-8.32,1-14.15,2.08-6.06,1.11-12.31,2.26-16.4,2.43V51.44A22.58,22.58,0,0,1,26.35,54l.48.28a26.16,26.16,0,0,0,8.23,3.52c4.12.94,10,1.26,19.32.16a20,20,0,0,1,4.09,0l1.66.16.31,0h.14c.83.09,1.65.16,2.41.18C63.23,58.41,63.44,58.4,63.67,58.39Z"></path><path d="M55.28,40.07,54.66,40a18.24,18.24,0,0,0-2.59-.26,10.37,10.37,0,0,0-2.81.24,4.13,4.13,0,0,0-1.59.71,2.43,2.43,0,0,0-.91,1.59,3.24,3.24,0,0,0-.06.64,2.83,2.83,0,0,0,1.64,2.72c1.47.77,3.87.95,6.87,1.07l1.34.06,1.52.11a13.37,13.37,0,0,1,2.09.35c.31.09.61.2.92.3.2-.4.43-.79.66-1.18l.25-.39c.22-.33.43-.66.67-1l-.5-.2A18,18,0,0,1,55.28,40.07Z"></path><path d="M76.92,39.81a16.43,16.43,0,0,0-2.6.24c-.3,0-.6.08-.89.14a16,16,0,0,0-2.2.67,16,16,0,0,0-5.3,3.39l-.21.22c-.22.22-.45.45-.65.69a15.62,15.62,0,0,0-2.1,3l.05,0,0,0,.35.15.46.22.26.12.29.14.06,0,.68.36.28.16.45.29.41.26A9.88,9.88,0,0,1,68,51.41a5.19,5.19,0,0,1,1.58,4.5,5.43,5.43,0,0,1-.43,1.41,5,5,0,0,1-.64,1A4.84,4.84,0,0,1,66.25,60a5.21,5.21,0,0,1-.76.25h0a7.77,7.77,0,0,1-1,.14h0l-.32,0c-.29,0-.58,0-.88,0h-.29l-.3,0-.82,0a15.83,15.83,0,0,0,30.94-4.71,16.07,16.07,0,0,0-.45-3.69A15.85,15.85,0,0,0,76.92,39.81Zm1.35,14.82a3.7,3.7,0,1,1,0,7.4h-.21v1.69h-2V62h-.49a3.7,3.7,0,0,1-3.69-3.7h2a1.71,1.71,0,0,0,.27.92,1.69,1.69,0,0,0,1.42.78h.49v-3.4h-.49a3.7,3.7,0,0,1,0-7.39h.49V47.55h2v1.69h.21a3.7,3.7,0,0,1,3.7,3.7H80a1.7,1.7,0,0,0-1.7-1.7h-.21v3.39Z"></path><path d="M74.17,52a1.72,1.72,0,0,0-.29.95,1.69,1.69,0,0,0,1.69,1.69h.49V51.24h-.49A1.69,1.69,0,0,0,74.17,52Z"></path><path d="M80,58.33a1.7,1.7,0,0,0-1.7-1.7h-.21V60h.21A1.7,1.7,0,0,0,80,58.33Z"></path><rect x="7.25" y="29.71" width="7.94" height="24.92"></rect></svg> \ No newline at end of file
diff --git a/talermerchantdemos/static/noun-shopping-cart-5195508.svg b/talermerchantdemos/static/noun-shopping-cart-5195508.svg
new file mode 100644
index 0000000..a737212
--- /dev/null
+++ b/talermerchantdemos/static/noun-shopping-cart-5195508.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 100 100" x="0px" y="0px"><path d="M95.1,27a3.3684,3.3684,0,0,0-2.8-1.4H23.6l-3.2-9.1a5.58277,5.58277,0,0,0-5.3-3.9H6.7a2.4,2.4,0,0,0,0,4.8h8.4a.76042.76042,0,0,1,.8.6L33.4,67.1A5.58277,5.58277,0,0,0,38.7,71H81.4a2.4,2.4,0,0,0,0-4.8H38.7a.76042.76042,0,0,1-.8-.6l-3.5-9.8H84.1a3.24319,3.24319,0,0,0,3.2-2.3l8.2-23.8A2.99008,2.99008,0,0,0,95.1,27ZM83.5,51.8H32.9L25.1,29.9h66Z"></path><path d="M43.4,72.5a7.4,7.4,0,1,0,7.4,7.4A7.3833,7.3833,0,0,0,43.4,72.5Zm0,10a2.7,2.7,0,1,1,2.7-2.7A2.68877,2.68877,0,0,1,43.4,82.5Z"></path><path d="M75.1,72.5a7.4,7.4,0,1,0,7.4,7.4A7.3833,7.3833,0,0,0,75.1,72.5Zm0,10a2.7,2.7,0,1,1,2.7-2.7A2.68877,2.68877,0,0,1,75.1,82.5Z"></path></svg> \ No newline at end of file
diff --git a/talermerchantdemos/static/taler-fallback.css b/talermerchantdemos/static/taler-fallback.css
new file mode 100644
index 0000000..fac25c3
--- /dev/null
+++ b/talermerchantdemos/static/taler-fallback.css
@@ -0,0 +1,18 @@
+/* Fallback stylesheet. Should be included in the document as follows:
+ *
+ * <link rel="stylesheet"
+ * href="taler-fallback.css"
+ * id="taler-presence-stylesheet />
+ *
+ * When either the taler-wallet-lib is included or the wallet is presence,
+ * it will take over this stylesheet for presence detection.
+ *
+ * This fallback stylesheet makes sure that classes for presence detection
+ * are displayed correctly, even if JavaScript is disabled and the wallet
+ * is not present.
+ */
+.taler-installed-show {
+ display: none;
+}
+
+/*# sourceMappingURL=taler-fallback.css.map */
diff --git a/talermerchantdemos/static/theme.css b/talermerchantdemos/static/theme.css
new file mode 100644
index 0000000..ea89011
--- /dev/null
+++ b/talermerchantdemos/static/theme.css
@@ -0,0 +1,79 @@
+/* This file contains colour-scheme- & theme-related stuffs */
+
+/* Light Theme (Default) */
+:root {
+ /* Common Green (treat as private vars if possible) */
+ --green-0: #233a13;
+ --green-1: #385723;
+ --green-2: #457a22;
+ --green-3: #568636;
+
+ /* Black/Grey/White */
+ --grey-0: #000000;
+ --grey-1: #1a1a1a;
+ --grey-2: #2b2b2b;
+ --grey-3: #4a4a4a;
+ --grey-4: #6d6d6d;
+ --grey-5: #8e8e8e;
+ --grey-6: #a0a0a0;
+ --grey-7: #b3b3b3;
+ --grey-8: #e4e4e4;
+ --grey-9: #ffffff;
+ --black: var(--grey-0);
+ --white: var(--grey-9);
+
+ /* Demo Commons */
+ --demo-common-dark-blue: #1e2739;
+ --demo-common-blue: #0042b2;
+ --demo-common-highlight-blue: #3daee9;
+
+ /* Navigation Bar */
+ --navbar-foreground: var(--white);
+ --navbar-background: var(--green-1);
+ --navbar-button-selected: var(--green-0);
+ --navbar-button-hovering: var(--green-3);
+
+ /* Main Content */
+ --main-text-colour: var(--black);
+ --main-background-colour: var(--white);
+
+ /* Misc */
+ --default-link-colour: var(--black);
+ --quote-background-colour: var(--grey-8);
+
+ /* Buttons */
+ --button-confirm-background: var(--green-2);
+ --button-confirm-foreground: var(--white);
+ --button-confirm-hovering-background: var(--green-1);
+ --button-confirm-hovering-foreground: var(--white);
+ --button-confirm-active-background: var(--green-1);
+ --button-confirm-active-foreground: var(--white);
+
+ /* Info Icon */
+ --license-info-icon-filter: none;
+}
+
+/* Dark Theme Overwrites (UA can choose to enable this selector if it wants) */
+@media (prefers-color-scheme: dark) {
+ /* Modify core colour scheme */
+ html:not([data-force-light-theme]) {
+ /* Link-related */
+ --default-link-colour: var(--white);
+
+ /* Main Content */
+ --main-background-colour: var(--grey-2);
+ --main-text-colour: var(--grey-8);
+
+ /* Misc */
+ --quote-background-colour: var(--grey-3);
+
+ /* Info Icon */
+ --license-info-icon-filter: invert() hue-rotate(180deg);
+ }
+}
+
+/* Universal theming, keep this minimal! */
+html {
+ background: var(--main-background-colour);
+ color: var(--main-text-colour);
+}
generated by cgit v1.2.3 (git 2.39.1) at 2024-04-26 09:15:24 +0000