diff options
author | Christian Grothoff <christian@grothoff.org> | 2020-10-10 22:55:31 +0200 |
---|---|---|
committer | Christian Grothoff <christian@grothoff.org> | 2020-10-10 22:55:31 +0200 |
commit | 2e665813a44988bfd906c0fab773f82652047841 (patch) | |
tree | abb09bb226ec904d23592edbc8372634f5b7a31b /talermerchantdemos/static | |
parent | ad45c1d0d6152d6eddde39881461a3472f799ab7 (diff) | |
parent | 58af97724593e6d9cf423035f46da8f88c29526c (diff) | |
download | taler-merchant-demos-2e665813a44988bfd906c0fab773f82652047841.tar.gz taler-merchant-demos-2e665813a44988bfd906c0fab773f82652047841.tar.bz2 taler-merchant-demos-2e665813a44988bfd906c0fab773f82652047841.zip |
merge torsten-redesign branch, implement i18n support
Diffstat (limited to 'talermerchantdemos/static')
-rw-r--r-- | talermerchantdemos/static/__init__.py | 1 | ||||
-rw-r--r-- | talermerchantdemos/static/demo.scss (renamed from talermerchantdemos/static/demo.css) | 27 | ||||
-rw-r--r-- | talermerchantdemos/static/navbar.css | 75 | ||||
-rw-r--r-- | talermerchantdemos/static/navbar.css.map | 1 | ||||
-rw-r--r-- | talermerchantdemos/static/navbar.scss | 103 | ||||
-rw-r--r-- | talermerchantdemos/static/pure.scss (renamed from talermerchantdemos/static/pure.css) | 2 | ||||
-rw-r--r-- | talermerchantdemos/static/taler-fallback.scss (renamed from talermerchantdemos/static/taler-fallback.css) | 0 |
7 files changed, 201 insertions, 8 deletions
diff --git a/talermerchantdemos/static/__init__.py b/talermerchantdemos/static/__init__.py new file mode 100644 index 0000000..6b61bdc --- /dev/null +++ b/talermerchantdemos/static/__init__.py @@ -0,0 +1 @@ +app.static_folder = 'static' diff --git a/talermerchantdemos/static/demo.css b/talermerchantdemos/static/demo.scss index b2688ad..7733515 100644 --- a/talermerchantdemos/static/demo.css +++ b/talermerchantdemos/static/demo.scss @@ -44,26 +44,39 @@ } body { - overflow-y: scroll; + overflow-x: hidden; + overflow-y: auto; +} + +body * { + /* margin-left: 0.5vw; */ + left: 0.1vw; } @media (min-width: 500px) { .content { - margin-left: 25%; + /* margin-left: 0vw; */ padding-left: 2em; margin-right: 1em; - overflow-x: auto; + overflow-x: hidden; + overflow-y: auto; } .demobar { - height: 100%; + /* height: 100%; */ + /* width: 25%; */ + /* NOTE: Please use "vh"/"vw" instead of "%" when possible, in the future. */ + height: min-content; + width: 100vw; margin: 0; top: 0; left: 0; background-color: #033; color: white; - position: fixed; - width: 25%; + position: relative; padding-right: 1em; - overflow: auto; + overflow-x: hidden; + overflow-y: auto; + text-align: center; } } + diff --git a/talermerchantdemos/static/navbar.css b/talermerchantdemos/static/navbar.css new file mode 100644 index 0000000..aabacc3 --- /dev/null +++ b/talermerchantdemos/static/navbar.css @@ -0,0 +1,75 @@ +/** + * @author Torsten Grothoff + * @name navbar.css + * @description Makes the navigation bar have styles + * @license LGPL-3.0-or-later + */ +.navcontainer { + overflow: hidden; + background: #144; + margin-bottom: 50px; + width: 100%; + color: white; + position: -webkit-sticky; + position: sticky; + top: 0px; + width: 100vw; + backdrop-filter: blur(10px); + opacity: 1; + z-index: 10000; +} + +nav { + left: 1vw; + position: relative; + background: #144; + z-index: 10000; +} + +nav a, nav span, .navbtn { + border: none; + color: white; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 16px; + background: #00000000; + height: inherit; +} + +nav a, nav span, .navbtn { + padding: 15px 32px; +} + +nav a:hover, nav span:hover, .navbtn:hover { + background: #00000022; +} + +nav a.active, nav span.active, .navbtn.active { + background-color: #4CAF50; +} + +nav a.active:hover, nav span.active:hover, .navbtn.active:hover { + background: #377c39; +} + +nav a, nav span, .navbtn { + cursor: pointer; +} + +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; +} + +/*# sourceMappingURL=navbar.css.map */ diff --git a/talermerchantdemos/static/navbar.css.map b/talermerchantdemos/static/navbar.css.map new file mode 100644 index 0000000..1725bd6 --- /dev/null +++ b/talermerchantdemos/static/navbar.css.map @@ -0,0 +1 @@ +{"version":3,"sourceRoot":"","sources":["navbar.scss"],"names":[],"mappings":"AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAQA;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEJ;EACI;EACA;EACA;EACA;;;AAGJ;EACI;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEJ;EACI;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;EACI;;;AAGJ;EACI;;;AAEJ;EAiCI;EACA;;AAPA;EACI;;AAEJ;EACI;;;AAMJ;EACI","file":"navbar.css"}
\ No newline at end of file diff --git a/talermerchantdemos/static/navbar.scss b/talermerchantdemos/static/navbar.scss new file mode 100644 index 0000000..312bf0c --- /dev/null +++ b/talermerchantdemos/static/navbar.scss @@ -0,0 +1,103 @@ +/** + * @author Torsten Grothoff + * @name navbar.css + * @description Makes the navigation bar have styles + * @license LGPL-3.0-or-later + */ + + +.navcontainer{ + overflow:hidden; + background:#144; + margin-bottom:50px; + width:100%; + color:white; + position:-webkit-sticky; + position:sticky; + top:0px; + width: 100vw; + backdrop-filter: blur(10px); + opacity: 1; + z-index: 10000; +} +nav { + left: 1vw; + position: relative; + background:#144; + z-index: 10000; +} + +nav a, nav span,.navbtn { + border: none; + color: white; + text-align: center; + text-decoration: none; + display: inline-block; + font-size: 16px; + background: #00000000; + height: inherit; +} +nav a, nav span,.navbtn{ + padding: 15px 32px; +} + +nav a:hover, nav span:hover,.navbtn:hover { + background: #00000022; +} + +nav a.active, nav span.active,.navbtn.active { + background-color: #4CAF50; +} + +nav a.active:hover, nav span.active:hover,.navbtn.active:hover { + background: #377c39; +} + +nav a, nav span,.navbtn { + cursor: pointer; +} +nav .right { + // input[type=checkbox] { + // // // opacity: 0; + // // // position: absolute; + // // position: relative; + // // left:0.5vw; + // // // top:0; + // // width: inherit; + // // height: inherit; + + // // $sx: 1.5; + // // $sy: 1.5; + + // // -ms-transform: scale($sx,$sy); /* IE */ + // // -moz-transform: scale($sx,$sy); /* FF */ + // // -webkit-transform: scale($sx,$sy); /* Safari and Chrome */ + // // -o-transform: scale($sx,$sy); /* Opera */ + // // transform: scale($sx,$sy); + // // float:right; + // opacity: 0; + // } + // input[type=checkbox]:checked + div.nav { + // display: block; + // } + // input[type=checkbox] + div.nav { + // display: none; + // } + div.nav { + display: none; + } + div.nav:hover { + display: block; + } + float:right; + margin-right: 5vw; +} +nav .right:hover { + div.nav { + display:block; + } +} + +// input[type=checkbox]:checked + label { +// color: red; +// }
\ No newline at end of file diff --git a/talermerchantdemos/static/pure.css b/talermerchantdemos/static/pure.scss index 7391139..9b555ed 100644 --- a/talermerchantdemos/static/pure.css +++ b/talermerchantdemos/static/pure.scss @@ -821,7 +821,7 @@ this the same font stack that Normalize.css sets for the `body`. .pure-button-active, .pure-button:active { box-shadow: 0 0 0 1px rgba(0,0,0, 0.15) inset, 0 0 6px rgba(0,0,0, 0.20) inset; - border-color: #000\9; + border-color: #000; } .pure-button[disabled], diff --git a/talermerchantdemos/static/taler-fallback.css b/talermerchantdemos/static/taler-fallback.scss index e403d71..e403d71 100644 --- a/talermerchantdemos/static/taler-fallback.css +++ b/talermerchantdemos/static/taler-fallback.scss |