From b7823407c04958b143c2c37d7b7e465bdd7d4895 Mon Sep 17 00:00:00 2001 From: Sebastian Date: Wed, 12 Jul 2023 15:42:27 -0300 Subject: mobile friendly --- packages/demobank-ui/src/scss/bank.scss | 5 ++++ packages/demobank-ui/src/scss/demo.scss | 25 ++++++++++++------ packages/demobank-ui/src/scss/pure.scss | 46 ++++++++++++++++----------------- 3 files changed, 45 insertions(+), 31 deletions(-) (limited to 'packages/demobank-ui/src/scss') diff --git a/packages/demobank-ui/src/scss/bank.scss b/packages/demobank-ui/src/scss/bank.scss index 16370227b..0089b9734 100644 --- a/packages/demobank-ui/src/scss/bank.scss +++ b/packages/demobank-ui/src/scss/bank.scss @@ -310,3 +310,8 @@ h1.nav { background: rgb(66, 184, 221); /* this is a light blue */ } + +[name=wire-transfer-form] > input { + margin-bottom: 1em; + +} \ No newline at end of file diff --git a/packages/demobank-ui/src/scss/demo.scss b/packages/demobank-ui/src/scss/demo.scss index cd676f8d9..c2d9fa903 100644 --- a/packages/demobank-ui/src/scss/demo.scss +++ b/packages/demobank-ui/src/scss/demo.scss @@ -39,8 +39,8 @@ Colors: } .content { - margin-left: 2em; - margin-right: 2em; + margin-left: 1em; + margin-right: 1em; overflow-x: auto; } @@ -60,8 +60,8 @@ body { margin-bottom: 50px; width: 100%; color: white; - position: -webkit-sticky; - position: sticky; + // position: -webkit-sticky; + // position: sticky; top: 0px; width: 100vw; backdrop-filter: blur(10px); @@ -70,7 +70,7 @@ body { } nav { - left: 1vw; + // left: 1vw; position: relative; background: #0042b2; z-index: 100; @@ -83,7 +83,7 @@ nav span, border: none; color: white; text-align: center; - text-decoration: none; + // text-decoration: none; display: inline-block; font-size: 16px; background: #0042b2; @@ -94,8 +94,9 @@ nav a, nav button, nav span, .navbtn { - padding: 15px 32px; + padding: 8px; } + nav a:hover, nav span:hover, @@ -138,7 +139,7 @@ nav .hide div.nav { // } .langbtn { - width: 100%; + width: 100px; text-align: left; } @@ -156,3 +157,11 @@ nav .hide div.nav { width: auto; height: auto; } + +.demolist > a { + margin: 8px; +} + +.buttons-account input.pure-button { + margin: 8px; +} \ No newline at end of file diff --git a/packages/demobank-ui/src/scss/pure.scss b/packages/demobank-ui/src/scss/pure.scss index 652d20edf..25a261a5f 100644 --- a/packages/demobank-ui/src/scss/pure.scss +++ b/packages/demobank-ui/src/scss/pure.scss @@ -1091,29 +1091,29 @@ since IE8 won't execute CSS that contains a CSS3 selector. } @media only screen and (max-width: 480px) { - .pure-form button[type="submit"] { - margin: 0.7em 0 0; - } - - .pure-form input:not([type]), - .pure-form input[type="text"], - .pure-form input[type="password"], - .pure-form input[type="email"], - .pure-form input[type="url"], - .pure-form input[type="date"], - .pure-form input[type="month"], - .pure-form input[type="time"], - .pure-form input[type="datetime"], - .pure-form input[type="datetime-local"], - .pure-form input[type="week"], - .pure-form input[type="number"], - .pure-form input[type="search"], - .pure-form input[type="tel"], - .pure-form input[type="color"], - .pure-form label { - margin-bottom: 0.3em; - display: block; - } + // .pure-form button[type="submit"] { + // margin: 0.7em 0 0; + // } + + // .pure-form input:not([type]), + // .pure-form input[type="text"], + // .pure-form input[type="password"], + // .pure-form input[type="email"], + // .pure-form input[type="url"], + // .pure-form input[type="date"], + // .pure-form input[type="month"], + // .pure-form input[type="time"], + // .pure-form input[type="datetime"], + // .pure-form input[type="datetime-local"], + // .pure-form input[type="week"], + // .pure-form input[type="number"], + // .pure-form input[type="search"], + // .pure-form input[type="tel"], + // .pure-form input[type="color"], + // .pure-form label { + // margin-bottom: 0.3em; + // display: block; + // } .pure-group input:not([type]), .pure-group input[type="text"], -- cgit v1.2.3