From 1d9ec9be58cc0e6ab4000a37fb7b9afd4a0dfde6 Mon Sep 17 00:00:00 2001 From: "zaccaria.majid" Date: Mon, 22 May 2023 08:47:34 +0200 Subject: [PATCH] fix grafico --- WebDoorCreator.UI/Pages/OrdersHomePage.razor | 73 +------------------ .../Pages/OrdersHomePage.razor.css | 58 ++++----------- .../Pages/OrdersHomePage.razor.less | 59 +++++---------- .../Pages/OrdersHomePage.razor.min.css | 2 +- 4 files changed, 38 insertions(+), 154 deletions(-) diff --git a/WebDoorCreator.UI/Pages/OrdersHomePage.razor b/WebDoorCreator.UI/Pages/OrdersHomePage.razor index 4b67a11..612b53f 100644 --- a/WebDoorCreator.UI/Pages/OrdersHomePage.razor +++ b/WebDoorCreator.UI/Pages/OrdersHomePage.razor @@ -1,72 +1,5 @@ @page "/OrdersHomePage" -@* - - - @if (ord2Show == null) - { -
-
-
- WEB DOOR CREATOR -
-
- - -
-
-
- -
- -
- -
-
- - - } - else - { - - } - - @if (currDoor != null) - { - - } - -
-
*@
@@ -97,7 +30,7 @@ {
-
+
ORDER LIST
@@ -150,7 +83,7 @@ @if (ord2Show != null) {
-
+
ORDER LIST
@@ -196,7 +129,7 @@
-
+
DOORS LIST
diff --git a/WebDoorCreator.UI/Pages/OrdersHomePage.razor.css b/WebDoorCreator.UI/Pages/OrdersHomePage.razor.css index 1474738..41c84b2 100644 --- a/WebDoorCreator.UI/Pages/OrdersHomePage.razor.css +++ b/WebDoorCreator.UI/Pages/OrdersHomePage.razor.css @@ -1,28 +1,4 @@ .cardOrders { - width: 100%; - border-radius: 18px; - padding: 1rem 4rem 0.5rem 4rem; - box-shadow: rgba(0, 0, 0, 0.45) 0px 20px 22px 3px; - /*box-shadow: rgba(0, 0, 0, 0.45) 0px 20px 22px -9px;*/ - margin-top: 0.5rem; - margin-bottom: 1rem; -} -/*div { - background-color: red; - animation-name: example; - animation-duration: 4s; -} - -@keyframes example { - from { - background-color: transparent; - } - - to { - background-color: yellow; - } -}*/ -.cardOrders { width: 100%; border-radius: 18px; padding: 1rem 4rem 0.5rem 4rem; @@ -32,7 +8,6 @@ position: relative; } .cardOrders01 { - /*box-shadow: rgba(0, 0, 0, 0.45) 0px 20px 22px -9px;*/ width: 100%; border-radius: 18px; padding: 1rem 4rem 0.5rem 4rem; @@ -41,11 +16,10 @@ margin-bottom: 1rem; position: relative; background-color: #FFFFFF; - /*background-image: linear-gradient(to bottom, rgba(145,215,55,1), rgba(145,215,55,50%));*/ + color: #000; z-index: 10; } .cardOrders02 { - /*box-shadow: rgba(0, 0, 0, 0.45) 0px 20px 22px -9px;*/ width: 100%; border-radius: 18px; padding: 1rem 4rem 0.5rem 4rem; @@ -54,11 +28,9 @@ margin-bottom: 1rem; position: relative; background-color: #FFFFFF; - /*background-image: linear-gradient(to bottom, rgba(245,115,15,1), rgba(245,115,15,50%));*/ z-index: 20; } .cardOrders03 { - /*box-shadow: rgba(0, 0, 0, 0.45) 0px 20px 22px -9px;*/ width: 100%; border-radius: 18px; padding: 1rem 4rem 0.5rem 4rem; @@ -67,49 +39,51 @@ margin-bottom: 1rem; position: relative; background-color: #FFFFFF; - /*background-image: linear-gradient(to bottom, rgba(35,245,135,1), rgba(35,245,135,50%));*/ z-index: 30; } .wRed01 { width: 95%; margin-bottom: -1.5rem; + background-color: #696969; + color: #FFF; animation-name: shrink01; animation-duration: 0.6s; - background-color: #696969; - background-image: none; } .wRed02 { width: 90%; margin-bottom: -1.5rem; + background-color: #333333; + color: white; animation-name: shrink02; animation-duration: 0.6s; - background-color: #333333; - background-image: none; - color: white; } @keyframes shrink01 { 0% { width: 100%; - /*background-image: linear-gradient(to bottom, rgba(145,215,55,1), rgba(145,215,55,50%));*/ + background-color: #FFF; + color: black; } - 99% { + 80% { width: 95%; + /*background-color: #FFF;*/ background-color: #696969; - /*background-image: linear-gradient(to bottom, rgba(145,215,55,100%), rgba(145,215,55,50%));*/ + color: black; } 100% { width: 95%; - background-color: #696969; + color: #FFF; } } @keyframes shrink02 { - from { + 0% { width: 95%; background-color: #696969; } - to { + 80% { width: 90%; - color: white; background-color: #333333; } + 100% { + width: 90%; + } } \ No newline at end of file diff --git a/WebDoorCreator.UI/Pages/OrdersHomePage.razor.less b/WebDoorCreator.UI/Pages/OrdersHomePage.razor.less index ee7bb4a..2727c72 100644 --- a/WebDoorCreator.UI/Pages/OrdersHomePage.razor.less +++ b/WebDoorCreator.UI/Pages/OrdersHomePage.razor.less @@ -1,29 +1,4 @@ -.cardOrders { - width: 100%; - border-radius: 18px; - padding: 1rem 4rem 0.5rem 4rem; - box-shadow: rgba(0, 0, 0, 0.45) 0px 20px 22px 3px; - /*box-shadow: rgba(0, 0, 0, 0.45) 0px 20px 22px -9px;*/ - margin-top: 0.5rem; - margin-bottom: 1rem; -} - -/*div { - background-color: red; - animation-name: example; - animation-duration: 4s; -} - -@keyframes example { - from { - background-color: transparent; - } - - to { - background-color: yellow; - } -}*/ -@animTime: 0.6s; +@animTime: 0.6s; @w01: 100%; @w02: 95%; @w03: 90%; @@ -42,21 +17,19 @@ .cardOrders01 { .cardOrders; background-color: #FFFFFF; - /*background-image: linear-gradient(to bottom, rgba(145,215,55,1), rgba(145,215,55,50%));*/ + color: #000; z-index: 10; } .cardOrders02 { .cardOrders; background-color: #FFFFFF; - /*background-image: linear-gradient(to bottom, rgba(245,115,15,1), rgba(245,115,15,50%));*/ z-index: 20; } .cardOrders03 { .cardOrders; background-color: #FFFFFF; - /*background-image: linear-gradient(to bottom, rgba(35,245,135,1), rgba(35,245,135,50%));*/ z-index: 30; } @@ -64,49 +37,53 @@ .wRed01 { width: @w02; margin-bottom: -1.5rem; + background-color: #696969; + color: #FFF; animation-name: shrink01; animation-duration: @animTime; - background-color: #696969; - background-image: none; } .wRed02 { width: @w03; margin-bottom: -1.5rem; + background-color: #333333; + color: white; animation-name: shrink02; animation-duration: @animTime; - background-color: #333333; - background-image: none; - color: white; } @keyframes shrink01 { 0% { width: @w01; - /*background-image: linear-gradient(to bottom, rgba(145,215,55,1), rgba(145,215,55,50%));*/ + background-color: #FFF; + color: black; } - 99% { + 80% { width: @w02; + /*background-color: #FFF;*/ background-color: #696969; - /*background-image: linear-gradient(to bottom, rgba(145,215,55,100%), rgba(145,215,55,50%));*/ + color: black; } 100% { width: @w02; - background-color: #696969; + color: #FFF; } } @keyframes shrink02 { - from { + 0% { width: @w02; background-color: #696969; } - to { + 80% { width: @w03; - color: white; background-color: #333333; } + + 100% { + width: @w03; + } } diff --git a/WebDoorCreator.UI/Pages/OrdersHomePage.razor.min.css b/WebDoorCreator.UI/Pages/OrdersHomePage.razor.min.css index ee17310..eb5ecbb 100644 --- a/WebDoorCreator.UI/Pages/OrdersHomePage.razor.min.css +++ b/WebDoorCreator.UI/Pages/OrdersHomePage.razor.min.css @@ -1 +1 @@ -.cardOrders{width:100%;border-radius:18px;padding:1rem 4rem .5rem 4rem;box-shadow:rgba(0,0,0,.45) 0 20px 22px 3px;margin-top:.5rem;margin-bottom:1rem;}.cardOrders{width:100%;border-radius:18px;padding:1rem 4rem .5rem 4rem;box-shadow:rgba(0,0,0,.45) 0 20px 22px 3px;margin-top:.5rem;margin-bottom:1rem;position:relative;}.cardOrders01{width:100%;border-radius:18px;padding:1rem 4rem .5rem 4rem;box-shadow:rgba(0,0,0,.45) 0 20px 22px 3px;margin-top:.5rem;margin-bottom:1rem;position:relative;background-color:#fff;z-index:10;}.cardOrders02{width:100%;border-radius:18px;padding:1rem 4rem .5rem 4rem;box-shadow:rgba(0,0,0,.45) 0 20px 22px 3px;margin-top:.5rem;margin-bottom:1rem;position:relative;background-color:#fff;z-index:20;}.cardOrders03{width:100%;border-radius:18px;padding:1rem 4rem .5rem 4rem;box-shadow:rgba(0,0,0,.45) 0 20px 22px 3px;margin-top:.5rem;margin-bottom:1rem;position:relative;background-color:#fff;z-index:30;}.wRed01{width:95%;margin-bottom:-1.5rem;animation-name:shrink01;animation-duration:.6s;background-color:#696969;background-image:none;}.wRed02{width:90%;margin-bottom:-1.5rem;animation-name:shrink02;animation-duration:.6s;background-color:#333;background-image:none;color:#fff;}@keyframes shrink01{0%{width:100%;}99%{width:95%;background-color:#696969;}100%{width:95%;background-color:#696969;}}@keyframes shrink02{from{width:95%;background-color:#696969;}to{width:90%;color:#fff;background-color:#333;}} \ No newline at end of file +.cardOrders{width:100%;border-radius:18px;padding:1rem 4rem .5rem 4rem;box-shadow:rgba(0,0,0,.45) 0 20px 22px 3px;margin-top:.5rem;margin-bottom:1rem;position:relative;}.cardOrders01{width:100%;border-radius:18px;padding:1rem 4rem .5rem 4rem;box-shadow:rgba(0,0,0,.45) 0 20px 22px 3px;margin-top:.5rem;margin-bottom:1rem;position:relative;background-color:#fff;color:#000;z-index:10;}.cardOrders02{width:100%;border-radius:18px;padding:1rem 4rem .5rem 4rem;box-shadow:rgba(0,0,0,.45) 0 20px 22px 3px;margin-top:.5rem;margin-bottom:1rem;position:relative;background-color:#fff;z-index:20;}.cardOrders03{width:100%;border-radius:18px;padding:1rem 4rem .5rem 4rem;box-shadow:rgba(0,0,0,.45) 0 20px 22px 3px;margin-top:.5rem;margin-bottom:1rem;position:relative;background-color:#fff;z-index:30;}.wRed01{width:95%;margin-bottom:-1.5rem;background-color:#696969;color:#fff;animation-name:shrink01;animation-duration:.6s;}.wRed02{width:90%;margin-bottom:-1.5rem;background-color:#333;color:#fff;animation-name:shrink02;animation-duration:.6s;}@keyframes shrink01{0%{width:100%;background-color:#fff;color:#000;}80%{width:95%;background-color:#696969;color:#000;}100%{width:95%;color:#fff;}}@keyframes shrink02{0%{width:95%;background-color:#696969;}80%{width:90%;background-color:#333;}100%{width:90%;}} \ No newline at end of file