{"id":404,"date":"2024-09-05T07:18:20","date_gmt":"2024-09-05T07:18:20","guid":{"rendered":"https:\/\/orchidasia.com.my\/erp\/?page_id=404"},"modified":"2024-09-14T12:43:46","modified_gmt":"2024-09-14T12:43:46","slug":"demo-sign-in","status":"publish","type":"page","link":"https:\/\/orchidasia.com.my\/erp\/demo-sign-in\/","title":{"rendered":"Demo Sign In"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"404\" class=\"elementor elementor-404\">\n\t\t\t\t<div class=\"elementor-element elementor-element-32d067f e-con-full e-flex e-con e-parent\" data-id=\"32d067f\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t<div class=\"elementor-element elementor-element-242dcbc e-con-full e-flex e-con e-child\" data-id=\"242dcbc\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-46daf4a elementor-widget elementor-widget-site-logo\" data-id=\"46daf4a\" data-element_type=\"widget\" data-settings=\"{&quot;align&quot;:&quot;left&quot;,&quot;width&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:208,&quot;sizes&quot;:[]},&quot;width_tablet&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:190,&quot;sizes&quot;:[]},&quot;width_mobile&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:180,&quot;sizes&quot;:[]},&quot;space_mobile&quot;:{&quot;unit&quot;:&quot;%&quot;,&quot;size&quot;:100,&quot;sizes&quot;:[]},&quot;space&quot;:{&quot;unit&quot;:&quot;%&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;space_tablet&quot;:{&quot;unit&quot;:&quot;%&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;image_border_radius&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;top&quot;:&quot;&quot;,&quot;right&quot;:&quot;&quot;,&quot;bottom&quot;:&quot;&quot;,&quot;left&quot;:&quot;&quot;,&quot;isLinked&quot;:true},&quot;image_border_radius_tablet&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;top&quot;:&quot;&quot;,&quot;right&quot;:&quot;&quot;,&quot;bottom&quot;:&quot;&quot;,&quot;left&quot;:&quot;&quot;,&quot;isLinked&quot;:true},&quot;image_border_radius_mobile&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;top&quot;:&quot;&quot;,&quot;right&quot;:&quot;&quot;,&quot;bottom&quot;:&quot;&quot;,&quot;left&quot;:&quot;&quot;,&quot;isLinked&quot;:true},&quot;caption_padding&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;top&quot;:&quot;&quot;,&quot;right&quot;:&quot;&quot;,&quot;bottom&quot;:&quot;&quot;,&quot;left&quot;:&quot;&quot;,&quot;isLinked&quot;:true},&quot;caption_padding_tablet&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;top&quot;:&quot;&quot;,&quot;right&quot;:&quot;&quot;,&quot;bottom&quot;:&quot;&quot;,&quot;left&quot;:&quot;&quot;,&quot;isLinked&quot;:true},&quot;caption_padding_mobile&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;top&quot;:&quot;&quot;,&quot;right&quot;:&quot;&quot;,&quot;bottom&quot;:&quot;&quot;,&quot;left&quot;:&quot;&quot;,&quot;isLinked&quot;:true},&quot;caption_space&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:0,&quot;sizes&quot;:[]},&quot;caption_space_tablet&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;caption_space_mobile&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]}}\" data-widget_type=\"site-logo.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"hfe-site-logo\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t<a data-elementor-open-lightbox=\"\"  class='elementor-clickable' href=\"https:\/\/orchidasia.com.my\/erp\">\n\t\t\t\t\t\t\t<div class=\"hfe-site-logo-set\">           \n\t\t\t\t<div class=\"hfe-site-logo-container\">\n\t\t\t\t\t\t\t\t\t<img decoding=\"async\" class=\"hfe-site-logo-img elementor-animation-\"  src=\"https:\/\/orchidasia.com.my\/erp\/wp-content\/uploads\/2024\/09\/logo1-300x71.png\" alt=\"default-logo\"\/>\n\t\t\t\t<\/div>\n\t\t\t<\/div>\n\t\t\t\t\t\t\t<\/a>\n\t\t\t\t\t\t<\/div>  \n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-f6723d2 e-con-full e-flex e-con e-child\" data-id=\"f6723d2\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-e194cea elementor-widget-mobile__width-initial elementor-widget elementor-widget-button\" data-id=\"e194cea\" data-element_type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"elementor-button-wrapper\">\n\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"\/erp\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t<span class=\"elementor-button-icon\">\n\t\t\t\t<svg aria-hidden=\"true\" class=\"e-font-icon-svg e-fas-arrow-left\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M257.5 445.1l-22.2 22.2c-9.4 9.4-24.6 9.4-33.9 0L7 273c-9.4-9.4-9.4-24.6 0-33.9L201.4 44.7c9.4-9.4 24.6-9.4 33.9 0l22.2 22.2c9.5 9.5 9.3 25-.4 34.3L136.6 216H424c13.3 0 24 10.7 24 24v32c0 13.3-10.7 24-24 24H136.6l120.5 114.8c9.8 9.3 10 24.8.4 34.3z\"><\/path><\/svg>\t\t\t<\/span>\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">Back<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-69a975b e-flex e-con-boxed e-con e-parent\" data-id=\"69a975b\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-13bcec7 e-con-full e-flex e-con e-child\" data-id=\"13bcec7\" data-element_type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ef6014f elementor-widget elementor-widget-heading\" data-id=\"ef6014f\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Demo Sign In<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-51caf73 elementor-widget elementor-widget-heading\" data-id=\"51caf73\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Please login to your account<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-0f6ced2 elementor-widget elementor-widget-shortcode\" data-id=\"0f6ced2\" data-element_type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"elementor-shortcode\">\t\t<!-- Styles -->\n\t\t<style>\n\n\n.signin-container {\n    background-color: #fff;\n    border-radius: 8px;\n    padding: 50px;\n    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);\n\tmargin-top:30px;\n}\n\n.sign-in-form {\n    display: flex;\n    flex-direction: column;\n}\n\n.sign-in-form label {\n    font-size: 16px;\n}\n\ninput[type=date], input[type=email], input[type=number], input[type=password], input[type=search], input[type=tel], input[type=text], input[type=url], select, textarea {\n    padding: 10px 0px 5px 0px;\n    border: none;\n    border-bottom: 1px solid #ccc;\n    margin-bottom: 20px;\n    width: 100%;\n    font-size: 16px;\n\tborder-radius: 0px !important;\n    transition: all .3s;\n}\n\n\n.sign-in-form input[type=\"email\"],\n.sign-in-form input[type=\"password\"],\n{\n    padding: 10px 0px 5px 0px;\n    border: none;\n    border-bottom: 1px solid #ccc;\n    margin-bottom: 20px;\n    width: 100%;\n    font-size: 16px;\n\tborder-radius: 0px !important;\n\ttransition: all .3s ;\n}\n\ninput[type=\"email\"]:focus,\ninput[type=\"password\"]:focus {\n    outline: none;\n\tborder-color: #465a69;\n    box-shadow: none;\n}\n\n\n.password-container {\n    position: relative;\n}\n\n.toggle-password {\n    position: absolute;\n    right: 10px;\n    top: 40%;\n    transform: translateY(-50%);\n    cursor: pointer;\n\tdisplay: flex;\n    align-items: center;\n}\n\n.password-container .toggle-password:focus {\n    outline: none;\n}\n\n.remember-container {\n    display: flex;\n    align-items: center;\n    margin-bottom: 20px;\n}\n\n.remember-container input {\n    margin-right: 5px;\n}\n\n\n.sign-in-button {\n    background-color: #465a69;\n    color: white;\n    padding: 10px;\n    border: none;\n    border-radius: 8px;\n    cursor: pointer;\n    font-size: 18px;\n}\n\n.sign-in-button:hover {\n    background-color: #31465c;\n}\n\n.signup-text {\n    text-align: left;\n    margin-top: 20px;\n}\n\n.signup-text a {\n    color: #28aaeb;\n    text-decoration: none;\n}\n\n.signup-text a:hover {\n    text-decoration: underline;\n}\n@media (max-width: 760px) {\n    .signin-container {\n    padding: 30px;\n}\n}\n\n\n\n.table-container {\n    background: #cdebff;\n    padding: 20px;\n    border-radius: 10px;\n    width: fit-content;\n    margin: auto;\n\tmargin-top: 40px;\n\tmargin-bottom: 40px;\n\twidth: 100%;\n\tfont-size: 16px;\n\toverflow-x: auto;\n}\n\n.user-table {\n    width: 100%;\n    border-collapse: collapse;\n\tmin-width: 390px;\n}\n\n.user-table th, .user-table td {\n    text-align: left;\n    padding: 5px 10px;\n}\n\n.user-table thead th {\n    border-bottom: 2px solid #000 !important;\n}\n.user-table thead tr {\n    border: none !important;\n}\n\n.user-table tbody{\n    padding-top: 20px !important;\n}\n.user-table tbody tr {\n    border: none !important;\n}\n\n\n.user-table th {\n    font-weight: bold;\n    color: #000;\n\tfont-size: 16px;\n}\n\n.user-table td {\n    color: #6e7378;\n\tfont-size: 16px;\n}\n\ntable tbody>tr>td, table tbody>tr>th {\n    background-color: transparent !important;\n\tborder: none;\n}\n\ntable td, table th {\n    border: none !important;\n}\n\n\t\t<\/style>\n\n\t\t<!-- Form HTML -->\n\t\t \n\n    <div class=\"signin-container\">\n        <form class=\"sign-in-form\">\n            \n            <label for=\"email\">Email<\/label>\n            <input type=\"email\" id=\"email\" placeholder=\"company@gmail.com\" required>\n            \n            <label for=\"password\">Password<\/label>\n            <div class=\"password-container\">\n\t\t\t\t<input type=\"password\" id=\"password\"  placeholder=\"\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022\" required>\n\t\t\t\t<span id=\"togglePassword\" class=\"toggle-password\">\n\t\t\t\t\t<i class=\"fa fa-eye-slash\" aria-hidden=\"true\"><\/i>\n\t\t\t\t<\/span>\n\t\t\t<\/div>\n\n            <div class=\"remember-container\">\n                <input type=\"checkbox\" id=\"remember\">\n                <label for=\"remember\">Remember<\/label>\n            <\/div>\n            \n            <button type=\"submit\" class=\"sign-in-button\">Sign in<\/button>\n            \n            <p class=\"signup-text\">\n                Don't have an account? <a href=\"#\">Sign up<\/a>\n            <\/p>\n        <\/form>\n    <\/div>\n\n\n\n\n\n\n\t<div class=\"table-container\">\n    <table class=\"user-table\">\n        <thead>\n            <tr>\n                <th>User<\/th>\n                <th>Password<\/th>\n                <th>Role<\/th>\n            <\/tr>\n        <\/thead>\n        <tbody>\n            <tr>\n                <td>company@gmail.com<\/td>\n                <td>000000a@A<\/td>\n                <td>Admin<\/td>\n            <\/tr>\n            <tr>\n                <td>user@gmail.com<\/td>\n                <td>000000a@A<\/td>\n                <td>User<\/td>\n            <\/tr>\n            <tr>\n                <td>pos@gmail.com<\/td>\n                <td>000000a@A<\/td>\n                <td>Pos<\/td>\n            <\/tr>\n            <tr>\n                <td>accountant@gmail.com<\/td>\n                <td>000000a@A<\/td>\n                <td>Accountant<\/td>\n            <\/tr>\n        <\/tbody>\n    <\/table>\n<\/div>\n\n\n\n\n\n\n\n\t\t<!-- JavaScript -->\n\n\t\t<script>\n\t\tconst passwordInput = document.getElementById('password');\nconst togglePassword = document.getElementById('togglePassword');\n\ntogglePassword.addEventListener('click', function () {\n    \/\/ Toggle the type attribute\n    const type = passwordInput.getAttribute('type') === 'password' ? 'text' : 'password';\n    passwordInput.setAttribute('type', type);\n\n    \/\/ Toggle the eye and eye-slash icons\n    if (type === 'password') {\n        this.innerHTML = '<i class=\"fa fa-eye-slash\" aria-hidden=\"true\"><\/i>';\n    } else {\n        this.innerHTML = '<i class=\"fa fa-eye\" aria-hidden=\"true\"><\/i>';\n    }\n});\n\n\n\n\t\t<\/script>\n\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Back Demo Sign In Please login to your account<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-404","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/orchidasia.com.my\/erp\/wp-json\/wp\/v2\/pages\/404","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/orchidasia.com.my\/erp\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/orchidasia.com.my\/erp\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/orchidasia.com.my\/erp\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/orchidasia.com.my\/erp\/wp-json\/wp\/v2\/comments?post=404"}],"version-history":[{"count":46,"href":"https:\/\/orchidasia.com.my\/erp\/wp-json\/wp\/v2\/pages\/404\/revisions"}],"predecessor-version":[{"id":499,"href":"https:\/\/orchidasia.com.my\/erp\/wp-json\/wp\/v2\/pages\/404\/revisions\/499"}],"wp:attachment":[{"href":"https:\/\/orchidasia.com.my\/erp\/wp-json\/wp\/v2\/media?parent=404"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}