update TWA Management v0.0.1

2025-11-05 10:08:06 +07:00
parent d4e91c7960
commit b4b191f829
73 changed files with 2249 additions and 418 deletions
--- a/TWASys-App/wwwroot/css/pages/login.css
+++ b/TWASys-App/wwwroot/css/pages/login.css
@ -0,0 +1,165 @@
+.con-img {
+    width: 100%;
+    min-height: 100%;
+    overflow-x: hidden;
+}
+
+    .con-img > img {
+        height: 100%;
+        width: auto;
+        min-height: 100vw;
+    }
+
+@media (min-width: 1400px) {
+    .con-img > img {
+        width: 100% !important;
+        max-width: 100vw;
+        height: auto;
+        min-height: auto;
+        max-height: 100vh;
+    }
+}
+
+.c-login {
+    position: absolute;
+    width: 100%;
+    transform: translateY(-50%);
+    top: 50%;
+    right: 0;
+    margin: 0 auto
+}
+
+.frm-login {
+    max-width: 100%;
+    margin: 0 25px;
+}
+
+
+
+@media (min-width: 568px) {
+    .frm-login {
+        max-width: 380px !important;
+        margin: 0 auto !important;
+    }
+}
+
+@media (min-width: 768px) {
+    .c-login {
+        right: 100px;
+        width: 420px;
+    }
+
+    .frm-login {
+        max-width: 100% !important
+    }
+}
+
+.ws-login {
+    box-shadow: 0 2px 3px rgba(96, 96, 96, 0.1);
+    background-color: #fff;
+    border-radius: var(--radius);
+    padding: 55px 35px;
+}
+
+    .ws-login .c_logo {
+        height: 60px
+    }
+
+    .ws-login .title {
+        color: var(--color-primary)
+    }
+
+    .ws-login .ico {
+        position: absolute;
+        top: 40%;
+        transform: translateY(-50%)
+    }
+
+    .ws-login input {
+        padding-left: 25px;
+    }
+
+    .ws-login .title, .ws-login .desc {
+    }
+
+    .ws-login .hint {
+        font-size: .82rem;
+    }
+
+
+.frm-inline.search button {
+    padding: 4px 15px;
+}
+
+.frm-inline button {
+    margin-left: calc(var(--radius) * -1);
+}
+
+.frm-inline input {
+    border-radius: var(--radius);
+    border: 1px solid var(--border-color);
+    padding: 10px 12px;
+    width: 100%;
+    font-weight: 500;
+    color: var(--text-color-primary)
+}
+
+.frm-group {
+    margin-left: -15px;
+    margin-right: -15px;
+}
+
+.frm-input, .frm-header {
+    padding: 0 15px;
+    margin-bottom: 25px;
+}
+
+.frm-input {
+    font-weight: 500;
+}
+
+    .frm-input label {
+        color: var(--text-color-primary);
+        font-size: .92rem;
+        margin-bottom: 2px;
+        font-weight: 500
+    }
+
+    .frm-input input, .frm-input .aselect {
+        width: 100%;
+        border-bottom: 1px solid #444C6185;
+        background-color: #fff;
+        transition: .3s all ease-in-out;
+        font-size: .9rem;
+        font-weight: 400
+    }
+
+    .frm-input .con-aselect input {
+        border-radius: var(--radius);
+        padding: 0 15px;
+        border: 1px solid #444C6185
+    }
+
+    .frm-input input {
+        min-height: 35px;
+        line-height: 35px;
+    }
+
+    .frm-input .line {
+        position: absolute;
+        height: 1px;
+        bottom: 0;
+        left: 0;
+        z-index: 2;
+        width: 0;
+        background-color: var(--color-primary);
+        transition: width .4s cubic-bezier( 0.19, 0.6, 0.86, 0.01 )
+    }
+
+    .frm-input input:focus + .line, .frm-input input:hover + .line {
+        width: 100%;
+    }
+
+    .frm-input .c-input:not(.line) input:hover, .frm-input .c-input:not(.line) input:focus, .frm-input .con-aselect.active .aselect {
+        border-color: var(--color-primary);
+    }