POSUI

/* MICROTHEMER STYLES */ /*= Tool CSS (Do not remove) == */ /** Tool CSS (Do not remove) >> .admin_page **/ .admin_page { font-family: “Open Sans”, “Microsoft JhengHei”, “PingFangHK-Regular”, “Heiti TC”; font-size: 16px; background-color: rgb(255, 255, 255); padding-right: 16px; padding-left: 16px; } /** Tool CSS (Do not remove) >> .admin_page #header **/ .admin_page #header { display: none; } /** Tool CSS (Do not remove) >> .admin_page .post-edit-link **/ .admin_page .post-edit-link { display: none; } /** Tool CSS (Do not remove) >> .admin_page .entry-title **/ .admin_page .entry-title { font-size: 24px; text-align: left; margin-top: 16px; margin-bottom: 16px; } /** Tool CSS (Do not remove) >> .admin_page .entry-content ul **/ .admin_page .entry-content ul { margin-bottom: 32px; } /** Tool CSS (Do not remove) >> .admin_page .entry-content li **/ .admin_page .entry-content li { list-style-type: disc; list-style-position: inside; margin-top: 4px; margin-bottom: 4px; } /** Tool CSS (Do not remove) >> .single .html_page > header **/ .single .html_page > header { display: none; } /** Tool CSS (Do not remove) >> .single-html_page #wrapper #header **/ .single-html_page #wrapper #header { display: none; } /** Tool CSS (Do not remove) >> .single-html_page footer.footer 1 **/ .single-html_page footer.footer { display: none; } /** Tool CSS (Do not remove) >> .single .html_page footer.entry-footer **/ .single .html_page footer.entry-footer { display: none; } /** Tool CSS (Do not remove) >> .single-html_page footer#footer **/ .single-html_page footer#footer { display: none; } /** Tool CSS (Do not remove) >> .single-html_page #included_html **/ .single-html_page #included_html { background-color: rgb(255, 255, 255); } /** Tool CSS (Do not remove) >> .single-html_page #included_content **/ .single-html_page #included_content { background-color: rgb(97, 49, 49); padding-top: 32px; } /*= Common ==================== */ /** Common >> html, select **/ html, select { font-family: “Open Sans”, “Microsoft JhengHei”, “PingFangHK-Regular”, “Heiti TC”; font-size: 2vw; } /** Common >> body **/ body { background-color: rgb(127, 127, 127); margin: 0; } /** Common >> .middle_col **/ .middle_col { text-align: center; } /** Common >> input:focus **/ input:focus { outline: none; } /** Common >> .btn **/ .btn { font-size: 1rem; text-align: center; box-sizing: border-box; border: 0.2vw solid rgb(142, 36, 36); -webkit-flex-direction: column; -moz-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-justify-content: center; justify-content: center; display: inline-block; cursor: pointer; -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } /** Common >> .btn::before **/ .btn::before { vertical-align: middle; width: 0; height: 100%; display: inline-block; content: ” “; } /** Common >> .btn p **/ .btn p { vertical-align: middle; width: 90%; padding: 0; margin: 0; display: inline-block; -webkit-margin-before: 0; -webkit-margin-after: 0; } /** Common >> button p **/ button p { margin-block-start: 0; margin-block-end: 0; } /** Common >> .btns_scroll **/ .btns_scroll { overflow-y: scroll; } /** Common >> table **/ table { border-spacing: 0; -webkit-border-horizontal-spacing: 0; -webkit-border-vertical-spacing: 0; } /** Common >> th **/ th { font-weight: 400; } /** Common >> #select_date **/ #select_date { font-size: 1.5vw; } /** Common >> .ui-widget **/ .ui-widget { font-family: “Open Sans”, “Microsoft JhengHei”, “PingFangHK-Regular”, “Heiti TC” !important; } /** Common >> .ui-datepicker table **/ .ui-datepicker table { margin: 0 0 0.2em 0 !important; } /** Common >> .btn_highlight **/ .btn_highlight { color: rgb(255, 255, 255); background-color: rgba(142, 36, 36, 0.5); } /** Common >> .btns_modal2 **/ .btns_modal2 { width: 30vw; } /*= Start Screen ============== */ /** Start Screen >> .start_screen **/ .start_screen { font-size: 0; vertical-align: top; height: 56.25vw; } /** Start Screen >> .start_screen .modal **/ .start_screen .modal { width: 100%; height: 56.25vw; position: absolute; top: 0; left: 0; } /** Start Screen >> .start_screen .modal_wrapper **/ .start_screen .modal_wrapper { background-color: rgb(255, 255, 255); } /** Start Screen >> .start_screen .logo **/ .start_screen .logo { text-align: center; margin-bottom: 2vw; } /** Start Screen >> .start_screen .logo img **/ .start_screen .logo img { width: auto; max-width: 20vw; height: auto; max-height: 7.5vw; margin-right: auto; margin-left: auto; } /** Start Screen >> .start_screen input **/ .start_screen input { font-size: 2.5vw; text-align: center; width: 100%; box-sizing: border-box; margin-top: 1vw; margin-bottom: 1vw; border-width: 0.1vw; display: block; } /** Start Screen >> label **/ label { font-size: 2vw; width: 30%; display: inline-block; } /** Start Screen >> .login_wrapper input **/ .login_wrapper input { width: 70%; display: inline-block; } /** Start Screen >> .start_screen .loading_wrapper **/ .start_screen .loading_wrapper { background-color: rgba(255, 255, 255, 0); } /** Start Screen >> .onoff_button **/ .onoff_button { font-size: 2vw; line-height: 3vw; text-align: center; width: 8vw; position: absolute; bottom: 3vw; right: 4vw; z-index: 9999; } /** Start Screen >> .onoff_button img **/ .onoff_button img { width: 8vw; } /*= Customer Screen =========== */ /** Customer Screen >> .cust_left_col **/ .cust_left_col { width: 70.3125vw; display: inline-block; } /** Customer Screen >> .cust_right_col **/ .cust_right_col { vertical-align: top; background-color: rgb(255, 255, 255); width: calc(100% – 70.3125vw); height: 56.25vw; box-sizing: border-box; padding: 1vw; display: inline-block; } /** Customer Screen >> .ad_spacer **/ .ad_spacer { width: 100%; height: 37.5vw; } /** Customer Screen >> .screen_ad **/ .screen_ad { background-color: rgb(255, 255, 255); background-image: url(“/wp-content/uploads/2019/03/background.png”); background-position: center center; background-repeat: no-repeat; background-size: contain; width: 70.3125vw; height: 56.25vw; position: absolute; top: 0; left: 0; } /** Customer Screen >> .cols_wrapper **/ .cols_wrapper { font-size: 0; height: 56.25vw; } /** Customer Screen >> .customer_screen ::-webkit-scrollbar **/ .customer_screen ::-webkit-scrollbar { width: 0; } /** Customer Screen >> .customer_screen .trans_items **/ .customer_screen .trans_items { height: 51.75vw; } /*= Cashier Screen ============ */ /** Cashier Screen >> .cashier_screen ::-webkit-scrollbar **/ .cashier_screen ::-webkit-scrollbar { width: 0; } /** Cashier Screen >> .cashier_screen **/ .cashier_screen { font-size: 0; vertical-align: top; background-color: rgb(255, 255, 255); background-image: url(“/wp-content/uploads/2019/03/background-1.png”); background-position: center top; background-repeat: no-repeat; background-size: contain; height: 56.25vw; overflow: hidden; } /** Cashier Screen >> .cashier_left **/ .cashier_left { vertical-align: top; width: calc(30% – 0.0vw); height: 56.25vw; box-sizing: border-box; padding: 0.5vw; display: inline-block; } /** Cashier Screen >> .cashier_right **/ .cashier_right { vertical-align: top; width: 70%; box-sizing: border-box; display: inline-block; overflow: hidden; } /** Cashier Screen >> .btns_right **/ .btns_right { padding-right: 0.3%; padding-left: 0.3%; overflow-y: scroll; } /** Cashier Screen >> .btn_right **/ .btn_right { font-size: 1.5vw; font-weight: normal; width: 11.5%; height: 6vw; margin: 0.5vw 0.5% 0.5vw 0.5%; border-width: 0.15vw 0.15vw 0.6vw 0.15vw; border-radius: 0.5vw; display: inline-block; } /** Cashier Screen >> .sec_divider **/ .sec_divider { border-bottom: 0.2vw solid rgb(142, 36, 36); } /** Cashier Screen >> .cashier_background **/ .cashier_background { background-color: rgb(255, 255, 255); } /** Cashier Screen >> .cashier_background_arrow **/ .cashier_background_arrow { border-left-color: rgb(255, 255, 255); } /** Cashier Screen >> .cashier_dark_background **/ .cashier_dark_background { background-color: rgb(221, 221, 221); } /** Cashier Screen >> .cashier_dark_background_arrow **/ .cashier_dark_background_arrow { border-left-color: rgb(221, 221, 221); } /** Cashier Screen >> .gray_background **/ .gray_background { background-color: rgb(238, 238, 238); } /** Cashier Screen >> .info_box **/ .info_box { color: rgb(255, 128, 0); font-size: 0.75rem; font-weight: bold; background-color: rgba(255, 128, 0, 0.5); padding: 1.5vh 2vw 1.5vh 2vw; border: 0.1vw solid rgb(255, 128, 0); border-radius: 0.5vw; position: absolute; top: 2vh; right: 2vh; cursor: pointer; } /** Cashier Screen >> .info_hidden **/ .info_hidden { display: none; } /*= Transaction Details (Common) = */ /** Transaction Details (Common) >> .warning_text **/ .warning_text { color: rgb(255, 255, 255); background-color: rgb(255, 0, 0); margin-top: 0.25vw; margin-bottom: 0.25vw; } /** Transaction Details (Common) >> span.info_text **/ span.info_text { background-color: rgb(0, 255, 0); padding: 0.15vw 0.5vw 0.15vw 0.5vw; margin-top: 0.25vw; margin-bottom: 0.25vw; } /** Transaction Details (Common) >> .trans_details **/ .trans_details { width: 100%; box-sizing: border-box; display: inline-block; } /** Transaction Details (Common) >> .trans_items **/ .trans_items { height: 42.125vw; overflow-y: scroll; } /** Transaction Details (Common) >> .trans_heads **/ .trans_heads { background-color: rgb(142, 36, 36); overflow-y: scroll; } /** Transaction Details (Common) >> .trans_head **/ .trans_head { color: rgb(255, 255, 255); font-size: 1.5vw; line-height: 2.5vw; text-align: center; vertical-align: middle; background-color: rgb(142, 36, 36); -webkit-background-clip: padding-box; background-clip: padding-box; height: 2.5vw; box-sizing: border-box; border-right: 0.1vw solid rgb(255, 255, 255); display: inline-block; } /** Transaction Details (Common) >> .item_buffer_col **/ .item_buffer_col { vertical-align: top; width: 0.2vw; border-width: 0; border-style: none; } /** Transaction Details (Common) >> .item_name_col **/ .item_name_col { width: calc((100% – .4vw) * 0.65); } /** Transaction Details (Common) >> .item_price_col **/ .item_price_col { width: calc((100% – .4vw) * 0.175); } /** Transaction Details (Common) >> .item_total_col **/ .item_total_col { width: calc((100% – .4vw) * 0.175); border-right-style: none; } /** Transaction Details (Common) >> .trans_item **/ .trans_item { padding: 0.5vw 0.2vw 0.5vw 0.2vw; margin-top: 0.5vw; border: 0.1vw solid rgb(142, 36, 36); border-radius: 0.25vw; } /** Transaction Details (Common) >> .trans_details .trans_item **/ .trans_details .trans_item { cursor: pointer; } /** Transaction Details (Common) >> .item_num **/ .item_num { vertical-align: top; width: 6%; display: inline-block; } /** Transaction Details (Common) >> .item_num_num **/ .item_num_num { color: rgb(255, 255, 255); font-size: 1vw; line-height: 1.2vw; text-align: center; vertical-align: top; background-color: rgb(142, 36, 36); width: 1.25vw; height: 1.25vw; margin-right: 0.25vw; border-radius: 50%; display: inline-block; } /** Transaction Details (Common) >> .item_body **/ .item_body { vertical-align: top; width: 57.5%; padding-right: 1.5%; display: inline-block; } /** Transaction Details (Common) >> .item_name **/ .item_name { font-size: 1.25vw; display: inline-block; } /** Transaction Details (Common) >> .item_qty **/ .item_qty { font-size: 1.25vw; font-weight: bold; display: inline-block; } /** Transaction Details (Common) >> .item_price **/ .item_price { font-size: 1.25vw; text-align: right; vertical-align: top; width: 16%; padding-right: 1.5%; display: inline-block; } /** Transaction Details (Common) >> .item_total **/ .item_total { font-size: 1.25vw; text-align: right; vertical-align: top; width: 16%; padding-right: 1.5%; display: inline-block; } /** Transaction Details (Common) >> .item_addon_bullet **/ .item_addon_bullet { font-size: 1.25vw; vertical-align: top; width: 5%; display: inline-block; content: “►”; } /** Transaction Details (Common) >> .item_addon_text **/ .item_addon_text { font-size: 1.25vw; vertical-align: top; width: 52.5%; margin-top: 0.2vw; margin-right: 1.5%; display: inline-block; } /** Transaction Details (Common) >> .item_each **/ .item_each { font-size: 1.25vw; margin-top: 0.6vw; display: inline-block; } /** Transaction Details (Common) >> .item_total_price **/ .item_total_price { padding-top: 0.25vw; margin-top: 0.25vw; border-top-width: 0.1vw; border-top-style: solid; } /** Transaction Details (Common) >> .item_promotion_applied **/ .item_promotion_applied { font-size: 1.25vw; display: inline-block; } /** Transaction Details (Common) >> .line_total_price **/ .line_total_price { padding-top: 0.25vw; margin-top: 0.35vw; } /** Transaction Details (Common) >> .trans_total_head **/ .trans_total_head { font-size: 1.5vw; vertical-align: top; width: 62.5%; display: inline-block; } /** Transaction Details (Common) >> .trans_total_value **/ .trans_total_value { font-size: 1.5vw; text-align: right; width: 37.5%; display: inline-block; } /** Transaction Details (Common) >> .trans_total_line **/ .trans_total_line { padding-right: 0.4vw; padding-left: 0.4vw; margin-top: 0.4vw; margin-bottom: 0.2vw; } /** Transaction Details (Common) >> .trans_total **/ .trans_total { padding-right: 0.2vw; padding-left: 0.2vw; } /** Transaction Details (Common) >> .grand_total **/ .grand_total { color: rgb(255, 255, 255); font-size: 2vw; background-color: rgb(142, 36, 36); width: 100%; box-sizing: border-box; padding: 0.5vw; border-radius: 0.3vw; } /** Transaction Details (Common) >> .cashier_screen .selected_line_item **/ .cashier_screen .selected_line_item { background-color: rgba(142, 36, 36, 0.25); } /** Transaction Details (Common) >> .cashier_screen .selected_add_on **/ .cashier_screen .selected_add_on { color: rgb(255, 255, 255); background-color: rgba(142, 36, 36, 0.75); } /** Transaction Details (Common) >> .trans_total_value_long **/ .trans_total_value_long { width: 67.5%; } /** Transaction Details (Common) >> .trans_total_head_short **/ .trans_total_head_short { width: 32.5%; } /*= Info Section ============== */ /** Info Section >> .sec_info **/ .sec_info { margin-bottom: 0.5vw; } /** Info Section >> .info_company **/ .info_company { color: rgb(255, 255, 255); font-size: 2vw; line-height: 3vw; text-align: center; vertical-align: middle; background-color: rgb(142, 36, 36); width: 100%; height: 3vw; } /** Info Section >> .info_branch **/ .info_branch { font-size: 1.25vw; line-height: 2.5vw; width: 100%; height: 2.25vw; display: inline-block; overflow-x: hidden; } /** Info Section >> .order_num **/ .order_num { font-size: 1.5vw; line-height: 2vw; text-align: right; width: 100%; height: 1.75vw; display: inline-block; } /*= Breadcrumbs =============== */ /** Breadcrumbs >> .breadcrumbs **/ .breadcrumbs { height: 6.65vw; padding-right: 0.3%; padding-left: 0.3%; overflow-y: scroll; } /** Breadcrumbs >> .btn_breadcrumbs **/ .btn_breadcrumbs { font-size: 1.25vw; text-align: right; background-color: rgb(142, 36, 36); width: 12.5%; height: 5.5vw; margin-top: 0.55vw; margin-left: -1vw; border-color: rgb(142, 36, 36); border-width: .15vw 0 .15vw 0; } /** Breadcrumbs >> .btn_breadcrumbs_outer:nth-of-type(1) .btn_breadcrumbs **/ .btn_breadcrumbs_outer:nth-of-type(1) .btn_breadcrumbs { width: 11.5%; margin-left: 0.5%; border-left-width: 0.15vw; } /** Breadcrumbs >> .btn_breadcrumbs_outer:nth-of-type(8) .btn_breadcrumbs **/ .btn_breadcrumbs_outer:nth-of-type(8) .btn_breadcrumbs { border-right-color: rgb(142, 36, 36); border-right-width: 0.15vw; } /** Breadcrumbs >> .btn_breadcrumbs p, .btn_breadcrumbs_inner p **/ .btn_breadcrumbs p, .btn_breadcrumbs_inner p { text-align: center; width: 6.5vw; margin-right: 0.5vw; position: relative; top: 50%; -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); transform: translateY(-50%); } /** Breadcrumbs >> .btn_arrow **/ .btn_arrow { vertical-align: top; width: 0; height: 0; box-sizing: border-box; margin-top: 0.55vw; border-top: 2.75vw solid rgba(0, 0, 0, 0); border-right: 0 none rgba(238, 238, 238, 0); border-bottom: 2.75vw solid rgba(0, 0, 0, 0); border-left: 1vw solid rgb(142, 36, 36); position: relative; z-index: 1000; display: inline-block; } /** Breadcrumbs >> .btn_arrow_inner **/ .btn_arrow_inner { vertical-align: middle; border-top: 2.6vw solid rgba(0, 0, 0, 0); border-bottom: 2.6vw solid rgba(0, 0, 0, 0); border-left: .9454vw solid rgb(255, 255, 255); border-width: 2.6vw 0 2.6vw .9454vw; border-style: solid none solid solid; position: relative; right: 1.2vw; display: inline; } /** Breadcrumbs >> .btn_breadcrumbs_outer:nth-of-type(8) .btn_arrow_inner, .btn_breadcrumbs_outer:nth-of-type(8) .btn_arrow **/ .btn_breadcrumbs_outer:nth-of-type(8) .btn_arrow_inner, .btn_breadcrumbs_outer:nth-of-type(8) .btn_arrow { display: none; } /** Breadcrumbs >> .btn_breadcrumbs_inner **/ .btn_breadcrumbs_inner { text-align: right; vertical-align: middle; background-color: rgb(255, 255, 255); width: calc(100% – 0.2vw); height: 5.2vw; position: relative; left: -0.2vw; display: inline-block; } /** Breadcrumbs >> .btn_breadcrumbs_outer:nth-of-type(8) .btn_breadcrumbs_inner **/ .btn_breadcrumbs_outer:nth-of-type(8) .btn_breadcrumbs_inner { width: 100%; left: 0; } /*= Products ================== */ /** Products >> .btns_prd_cat **/ .btns_prd_cat { height: 7vw; } /** Products >> .btns_prd **/ .btns_prd { height: 28vw; } /** Products >> .btns_func **/ .btns_func { height: 14vw; } /** Products >> .btn_prd_cat **/ .btn_prd_cat { color: rgb(255, 255, 255); background-color: rgba(142, 36, 36, 0.68); } /** Products >> .btn_prd_item **/ .btn_prd_item { font-size: 1.25vw; } /*= Modal (Common) ============ */ /** Modal (Common) >> .modal **/ .modal { background-color: rgba(142, 36, 36, 0.5); width: 100%; height: 56.25vw; position: absolute; top: 0; left: 0; z-index: 1000; } /** Modal (Common) >> .modal_hidden **/ .modal_hidden { display: none; } /** Modal (Common) >> .modal_wrapper **/ .modal_wrapper { background-color: rgba(255, 255, 255, 0.85); width: 30%; padding: 4vw 4vw 3.5vw 4vw; border-radius: 2vw; position: relative; top: 50%; left: 50%; transform: translate(-50%, -50%); } /** Modal (Common) >> .cashier_screen input **/ .cashier_screen input { font-size: 3vw; text-align: center; width: 100%; box-sizing: border-box; padding-top: 0.25vw; padding-bottom: 0.25vw; margin-top: 1vw; margin-bottom: 1vw; border-width: 0.1vw; display: block; } /** Modal (Common) >> .modal_title **/ .modal_title { font-size: 1.2rem; font-weight: bold; text-align: center; margin-bottom: 1vw; } /** Modal (Common) >> .modal_message **/ .modal_message { font-size: 2vw; text-align: center; padding-top: 1vw; padding-bottom: 2vw; } /** Modal (Common) >> .modal_btns_wrapper_single **/ .modal_btns_wrapper_single { width: 20vw; margin-right: auto; margin-left: auto; } /** Modal (Common) >> .btns_modal **/ .btns_modal { margin-top: 1.5vw; margin-right: auto; margin-left: auto; } /** Modal (Common) >> .btn_modal **/ .btn_modal { padding-top: 0.75vw; padding-bottom: 0.75vw; margin-top: 0.5vw; margin-bottom: 0.5vw; border-radius: 0.5vw; } /** Modal (Common) >> .btn_modal_full **/ .btn_modal_full { width: 100%; } /** Modal (Common) >> .btn_modal2 **/ .btn_modal2 { width: 48%; height: 5vw; margin-right: 4%; } /** Modal (Common) >> .btn_modal3 **/ .btn_modal3 { width: 32%; height: 5vw; margin-right: 2%; } /** Modal (Common) >> .btn_modal3_2 **/ .btn_modal3_2 { width: 66%; height: 5vw; margin-right: 2%; } /** Modal (Common) >> .btn_modal4 **/ .btn_modal4 { font-size: 1.5vw; line-height: 1.5vw; width: 23.5%; height: 4.5vw; margin-right: 2%; } /** Modal (Common) >> .btn_modal5 **/ .btn_modal5 { font-size: 1.5vw; line-height: 1.5vw; width: 18.4%; height: 4.5vw; margin-right: 2%; } /** Modal (Common) >> .btn_yesno **/ .btn_yesno { height: 8vw; } /** Modal (Common) >> .btn_modal52 **/ .btn_modal52 { width: 38.8%; } /*= Test Mode ================= */ /** Test Mode >> div.cashier_test_mode **/ div.cashier_test_mode { background-color: rgb(255, 255, 170); } /** Test Mode >> .text_test_mode **/ .text_test_mode { color: rgb(255, 255, 255); font-size: 1.5vw; font-weight: bold; background-color: rgba(0, 0, 0, 0.25); box-sizing: border-box; padding: 1vw 2vw 1vw 2vw; margin: 1vw; position: absolute; display: inline-block; visibility: hidden; } /** Test Mode >> .left_corner **/ .left_corner { margin-right: 0; left: 0; } /** Test Mode >> .right_corner **/ .right_corner { margin-left: 0; right: 0; } /** Test Mode >> .upper_corner **/ .upper_corner { margin-bottom: 0; top: 0; } /** Test Mode >> .lower_corner **/ .lower_corner { bottom: 0; } /** Test Mode >> .cashier_test_mode .text_test_mode **/ .cashier_test_mode .text_test_mode { visibility: visible; } /*= Receive Cash ============== */ /** Receive Cash >> .receive_cash_wrapper **/ .receive_cash_wrapper { width: 35%; } /** Receive Cash >> .btns_cash_note **/ .btns_cash_note { vertical-align: top; width: 23%; box-sizing: border-box; margin-right: 2%; display: inline-block; } /** Receive Cash >> .btn_cash_note **/ .btn_cash_note { font-size: 1.75vw; line-height: 1.75vw; width: 100%; height: 4vw; } /** Receive Cash >> .btns_cash_numpad **/ .btns_cash_numpad { vertical-align: top; width: 75%; box-sizing: border-box; display: inline-block; } /*= Transaction List ========== */ /** Transaction List >> .discount_wrapper **/ .discount_wrapper { width: 35%; } /** Transaction List >> .trans_hist_heads, .stored_drafts_heads **/ .trans_hist_heads, .stored_drafts_heads { overflow-y: scroll; } /** Transaction List >> .trans_hist_head, .stored_drafts_head **/ .trans_hist_head, .stored_drafts_head { color: rgb(255, 255, 255); font-size: 1.5vw; line-height: 2.5vw; text-align: center; background-color: rgb(142, 36, 36); -webkit-background-clip: padding-box; background-clip: padding-box; box-sizing: border-box; border-right: 0.1vw solid rgb(255, 255, 255); display: inline-block; } /** Transaction List >> .trans_hist_items, .stored_drafts_items **/ .trans_hist_items, .stored_drafts_items { font-size: 1.75vw; height: 33.33vw; overflow-y: scroll; } /** Transaction List >> .trans_hist_item, .stored_drafts_item **/ .trans_hist_item, .stored_drafts_item { font-size: 0; cursor: pointer; } /** Transaction List >> .trans_show:nth-of-type(even), .stored_drafts_item:nth-of-type(even) **/ .trans_show:nth-of-type(even), .stored_drafts_item:nth-of-type(even) { background-color: rgba(142, 36, 36, 0.27); } /** Transaction List >> .trans_hist_cell, .stored_drafts_cell **/ .trans_hist_cell, .stored_drafts_cell { font-size: 1.75vw; box-sizing: border-box; padding-top: 1vw; padding-bottom: 1vw; display: inline-block; } /** Transaction List >> .trans_hist_details **/ .trans_hist_details { vertical-align: top; width: 35%; margin-right: 2.5%; display: inline-block; } /** Transaction List >> .trans_hist_details .trans_items **/ .trans_hist_details .trans_items { height: 30vw; } /** Transaction List >> .trans_hist_wrapper **/ .trans_hist_wrapper { width: 75%; } /** Transaction List >> .trans_hist_table_wrapper **/ .trans_hist_table_wrapper { width: 100%; } /** Transaction List >> .trans_hist_num_col **/ .trans_hist_num_col { width: 45%; } /** Transaction List >> .trans_hist_time_col **/ .trans_hist_time_col { width: 17.5%; } /** Transaction List >> .trans_hist_type_col **/ .trans_hist_type_col { width: 15%; } /** Transaction List >> .trans_hist_amt_col **/ .trans_hist_amt_col { width: 22.5%; border-right-style: none; } /** Transaction List >> .search_wrapper **/ .search_wrapper { margin-top: 2vw; } /** Transaction List >> .search_str_wrapper **/ .search_str_wrapper { vertical-align: top; width: 48.5%; margin-right: 1.5%; display: inline-block; } /** Transaction List >> .btns_trans_hist_search **/ .btns_trans_hist_search { vertical-align: top; width: 50%; display: inline-block; } /** Transaction List >> .btn_trans_hist_search **/ .btn_trans_hist_search { font-size: 1.25vw; height: 4vw; margin-top: 0; margin-right: 3%; margin-bottom: 0; } /** Transaction List >> .btn_trans_hist_func **/ .btn_trans_hist_func { font-size: 1.25vw; height: 4vw; padding-top: 0; padding-bottom: 0; margin-top: 0; margin-bottom: 0; } /** Transaction List >> .trans_hist_search **/ .trans_hist_search { vertical-align: top; width: 62.5%; display: inline-block; } /** Transaction List >> .cashier_screen input.search_str **/ .cashier_screen input.search_str { font-size: 2vw; line-height: 4vw; height: 4vw; margin-top: 0; margin-bottom: 0; } /** Transaction List >> .trans_hist_func **/ .trans_hist_func { margin-top: 2vw; } /** Transaction List >> .trans_hist_items .selected_trans_hist_item **/ .trans_hist_items .selected_trans_hist_item { color: rgb(255, 255, 255); background-color: rgba(142, 36, 36, 0.75); } /** Transaction List >> .trans_hidden **/ .trans_hidden { display: none; } /** Transaction List >> .search_highlight **/ .search_highlight { color: rgb(0, 0, 0); background-color: rgb(255, 255, 0); } /** Transaction List >> .canceled_order **/ .canceled_order { text-decoration: line-through; } /** Transaction List >> .stored_drafts_table_wrapper **/ .stored_drafts_table_wrapper { width: 100%; } /** Transaction List >> .stored_drafts_wrapper **/ .stored_drafts_wrapper { width: 70%; } /** Transaction List >> .stored_drafts_product_col **/ .stored_drafts_product_col { width: 50%; } /** Transaction List >> .stored_drafts_qty_col, .stored_drafts_amt_col, .stored_drafts_time_col, .stored_drafts_user_col **/ .stored_drafts_qty_col, .stored_drafts_amt_col, .stored_drafts_time_col, .stored_drafts_user_col { width: 12.5%; } /** Transaction List >> .trans_hist_biz_date **/ .trans_hist_biz_date { font-size: 0; height: 3.33vw; } /** Transaction List >> .trans_hist_select_label **/ .trans_hist_select_label { font-size: 1.5vw; vertical-align: top; width: 30%; display: inline-block; } /** Transaction List >> #trans_hist_select_date **/ #trans_hist_select_date { font-size: 1.5vw; width: 70%; margin-top: 0; display: inline-block; } /*= Settings ================== */ /** Settings >> .setting_wrapper **/ .setting_wrapper { width: 60%; } /** Settings >> .list_settings **/ .list_settings { height: 32vw; overflow-y: scroll; } /** Settings >> .setting_label **/ .setting_label { font-size: 1.5vw; line-height: 3vw; vertical-align: top; width: 25%; height: 3vw; margin-top: 1vw; margin-right: 2%; display: inline-block; } /** Settings >> input.setting_input **/ input.setting_input { font-size: 1.5vw; width: 61%; height: 3vw; margin-right: 2%; display: inline-block; } /** Settings >> .btn_setting_show_popup **/ .btn_setting_show_popup { font-size: 1.5vw; line-height: 1vw; vertical-align: top; width: 10%; height: 3vw; margin-top: 1vw; } /** Settings >> .update_setting_wrapper **/ .update_setting_wrapper { width: 60%; } /** Settings >> .update_setting_wrapper label **/ .update_setting_wrapper label { width: 25%; } /** Settings >> .update_setting_wrapper input **/ .update_setting_wrapper input { font-size: 2.5vw; width: 75%; display: inline-block; } /** Settings >> .btns_update_setting **/ .btns_update_setting { width: 80%; } /** Settings >> .btn_setting_confirm **/ .btn_setting_confirm { color: rgb(255, 255, 255); background-color: rgba(142, 36, 36, 0.5); } /** Settings >> .current_date_time **/ .current_date_time { font-size: 1.5vw; line-height: 2.5vw; text-align: center; width: calc(30% – 1vw); box-sizing: border-box; margin-top: 0.5vw; border: 0.1vw solid rgb(142, 36, 36); border-radius: .25vw; position: absolute; } /** Settings >> .current_date **/ .current_date { margin-right: 1vw; display: inline-block; } /** Settings >> .current_time **/ .current_time { height: 1.5vw; display: inline-block; } /** Settings >> .current_date_time p **/ .current_date_time p { margin-block-start: 0; margin-block-end: 0; } /*= Report Body =============== */ /** Report Body >> .rpt_html **/ .rpt_html { font-size: 1.33vw; background-color: rgb(255, 255, 255); height: 56.25vw; box-sizing: border-box; padding: 1vw; border-style: none; -webkit-print-color-adjust: exact !important; } /** Report Body >> .rpt_title **/ .rpt_title { font-size: 2vw; font-weight: bold; text-align: center; margin-bottom: 0.5vw; } /** Report Body >> .btns_admin **/ .btns_admin { font-size: 1em; margin-top: 0.6vw; } /** Report Body >> .btn_admin **/ .btn_admin { font-family: “Open Sans”, “Microsoft JhengHei”, “PingFangHK-Regular”, “Heiti TC”; color: rgb(255, 255, 255); background-color: rgb(142, 36, 36); height: 3vw; padding-right: 1vw; padding-left: 1vw; margin-right: 0.5vw; } /** Report Body >> .btn_admin p **/ .btn_admin p { -webkit-margin-before: 0 !important; -webkit-margin-after: 0 !important; } /** Report Body >> .btn_admin:last-of-type **/ .btn_admin:last-of-type { margin-right: 0; } /** Report Body >> .rpt_header **/ .rpt_header { width: 80%; height: 9vw; box-sizing: border-box; margin-right: auto; margin-bottom: 1vw; margin-left: auto; } /** Report Body >> .rpt_wrapper **/ .rpt_wrapper { text-align: center; } /** Report Body >> .rpt_body **/ .rpt_body { max-width: 90%; max-height: 38.75vw; box-sizing: border-box; left: 50%; display: inline-block; overflow-x: auto; overflow-y: auto; } /** Report Body >> .rpt_details_head **/ .rpt_details_head { width: 6em; display: inline-block; } /** Report Body >> .rpt_details_value **/ .rpt_details_value { display: inline-block; } /** Report Body >> .rpt_body table **/ .rpt_body table { margin-right: auto; margin-left: auto; overflow-x: auto; overflow-y: scroll; border-collapse: collapse !important; } /** Report Body >> .rpt_thead **/ .rpt_thead { color: rgb(255, 255, 255); vertical-align: bottom; box-shadow: 0 0.2em rgba(255, 255, 255, 0.5); background-color: rgb(142, 36, 36); padding: 0.25em; border-right: 0.05em solid rgb(255, 255, 255); border-left: 0.05em solid rgb(255, 255, 255); position: -webkit-sticky; position: sticky; top: 0; } /** Report Body >> .rpt_col:first **/ .rpt_col:first { border-right-color: rgb(142, 36, 36); } /** Report Body >> .rpt_col:last **/ .rpt_col:last { border-left-color: rgb(142, 36, 36); } /** Report Body >> .narrow_col **/ .narrow_col { width: 2.5em; min-width: 2.5em; max-width: 2.5em; } /** Report Body >> .medium_col **/ .medium_col { width: 4em; min-width: 4em; max-width: 4em; } /** Report Body >> .wide_col **/ .wide_col { width: 6em; min-width: 6em; max-width: 6em; } /** Report Body >> .superwide_col **/ .superwide_col { width: 12em; min-width: 12em; max-width: 12em; } /** Report Body >> .rpt_cell **/ .rpt_cell { vertical-align: top; padding: 0.25em; } /** Report Body >> .rpt_body tr:nth-of-type(even):not(.rpt_bottom_spacer tr) **/ .rpt_body tr:nth-of-type(even):not(.rpt_bottom_spacer tr) { background-color: rgba(142, 36, 36, 0.2); } /** Report Body >> .rpt_total **/ .rpt_total { font-weight: bold; box-shadow: 0 -0.1em rgb(0, 0, 0); padding: 0.25em; border-bottom-width: 0.2em; } /** Report Body >> .rpt_bottom **/ .rpt_bottom { font-weight: bold; background-color: rgb(255, 255, 255); height: 0.75rem; padding: 0.5em 0.25em 0.5em 0.25em; position: -webkit-sticky; position: sticky; bottom: 0.35em; } /** Report Body >> .cft_left **/ .cft_left { text-align: left; padding-right: 0.5em; padding-left: 0.5em; } /** Report Body >> .cft_center **/ .cft_center { text-align: center; } /** Report Body >> .cft_comma **/ .cft_comma { text-align: right; padding-right: 0.5em; } /** Report Body >> .rpt_bottom_spacer **/ .rpt_bottom_spacer { background-color: rgb(255, 255, 255); height: 0.25em; overflow-y: hidden; } /** Report Body >> .rpt_bottom_spacer td p **/ .rpt_bottom_spacer td p { font-size: 0.5em; height: 0.5em; margin-block-start: 0; margin-block-end: 0; } /** Report Body >> .rpt_line_td **/ .rpt_line_td { background-color: rgb(255, 255, 255); height: 0.35em; padding: 0; position: -webkit-sticky; position: sticky; bottom: 0; } /** Report Body >> .rpt_double_line **/ .rpt_double_line { border-bottom-width: 0.3em; border-bottom-style: double; } /** Report Body >> .webonly **/ .webonly { display: none; } /** Report Body >> .rpt_selectors **/ .rpt_selectors { line-height: 3.75vw; width: 80%; height: 4.5vw; box-sizing: border-box; padding-right: 1vw; padding-left: 1vw; margin-right: auto; margin-bottom: 1vw; margin-left: auto; border: 0.2vw solid rgb(142, 36, 36); border-radius: 0.5vw; } /** Report Body >> .rpt_select_label **/ .rpt_select_label { font-size: 1.33vw; line-height: 1.33vw; vertical-align: middle; width: auto; } /** Report Body >> #select_date **/ #select_date { vertical-align: middle; width: 8vw; margin-right: 1vw; } /** Report Body >> .rpt_select **/ .rpt_select { font-size: 1.33vw; line-height: 1.33vw; vertical-align: middle; margin-right: 1vw; } /** Report Body >> .rpt_selectors .btn_admin **/ .rpt_selectors .btn_admin { line-height: 1em; vertical-align: middle; height: 2.5vw; padding-top: 0; padding-bottom: 0; } /** Report Body >> .rpt_hidden **/ .rpt_hidden { display: none; } /** Report Body >> .rpt_not_first_table **/ .rpt_not_first_table { margin-top: 3em; } /** Report Body >> .rpt_bottom_spacer td **/ .rpt_bottom_spacer td { background-color: rgb(255, 255, 255); height: 0.5em; position: -webkit-sticky; position: sticky; bottom: 2.1em; } /** Report Body >> .btn_back **/ .btn_back { width: 6vw; position: absolute; } /*= Report Body _2 ============ */ /** Report Body _2 >> .rpt_html ::-webkit-scrollbar **/ .rpt_html ::-webkit-scrollbar { width: 0; } /** Report Body _2 >> .sortable_col **/ .sortable_col { cursor: s-resize; } /** Report Body _2 >> .sort_desc_col::after **/ .sort_desc_col::after { color: rgba(255, 255, 255, 0.5); font-size: 1vw; line-height: 1.5vw; vertical-align: middle; content: ” ▼”; } /** Report Body _2 >> .sort_asc_col::after **/ .sort_asc_col::after { color: rgba(255, 255, 255, 0.5); font-size: 1vw; line-height: 1.5vw; vertical-align: middle; content: ” ▲”; } /** Report Body _2 >> .btn_back p **/ .btn_back p { font-size: 1.5vw; line-height: 1.5vw; vertical-align: middle; } /** Report Body _2 >> .btns_subrpt **/ .btns_subrpt { margin-bottom: 1vw; } /** Report Body _2 >> .select_subrpt **/ .select_subrpt { margin-bottom: 1vw; } /** Report Body _2 >> .btn_subrpt **/ .btn_subrpt { min-width: 5vw; height: 2.75vw; } /** Report Body _2 >> .rpt_select_item_subreport **/ .rpt_select_item_subreport { margin-right: 0; } /** Report Body _2 >> .rpt_table tfoot **/ .rpt_table tfoot { background-color: rgb(255, 255, 255); } /*= jQuery UI ================= */ /** jQuery UI >> .ui-datepicker .ui-widget-header **/ .ui-datepicker .ui-widget-header { color: rgb(255, 255, 255); background-color: rgb(142, 36, 36); } /** jQuery UI >> .ui-datepicker-calendar th **/ .ui-datepicker-calendar th { width: 14.2857%; } /** jQuery UI >> .ui-datepicker-header .ui-datepicker-prev, .ui-datepicker-header .ui-datepicker-next **/ .ui-datepicker-header .ui-datepicker-prev, .ui-datepicker-header .ui-datepicker-next { color: rgb(255, 255, 255); background-color: rgba(255, 255, 255, 0.7); width: 1.9em !important; height: 1.9em !important; } /** jQuery UI >> .ui-widget-content .ui-state-highlight **/ .ui-widget-content .ui-state-highlight { color: rgb(0, 0, 0) !important; border: 0.1vw solid rgba(142, 36, 36, 0.25) !important; background: rgba(142, 36, 36, 0.5) !important; } /** jQuery UI >> .ui-widget-content .ui-state-active **/ .ui-widget-content .ui-state-active { color: rgb(255, 255, 255) !important; border: 0.1vw solid rgba(142, 36, 36, 0.5) !important; background: rgb(142, 36, 36) !important; } /*= Report Definition ========= */ /** Report Definition >> .rpt_html .rpt_body_business_day **/ .rpt_html .rpt_body_business_day { font-size: 1.3vw; } /** Report Definition >> .rpt_html .rpt_body_voided_orders **/ .rpt_html .rpt_body_voided_orders { font-size: 1.3vw; } /** Report Definition >> .rpt_html .rpt_body_categories **/ .rpt_html .rpt_body_categories { font-size: 1.5vw; } /** Report Definition >> .rpt_html .rpt_body_analysis **/ .rpt_html .rpt_body_analysis { font-size: 1.5vw; } /** Report Definition >> .rpt_html .rpt_body_by_hour **/ .rpt_html .rpt_body_by_hour { font-size: 1.5vw; } /** Report Definition >> .rpt_html .rpt_body_products **/ .rpt_html .rpt_body_products { font-size: 1.5vw; } /** Report Definition >> .rpt_html .rpt_body_subitems **/ .rpt_html .rpt_body_subitems { font-size: 1.5vw; } /** Report Definition >> .rpt_html .rpt_body_cashiers **/ .rpt_html .rpt_body_cashiers { font-size: 1.5vw; } /** Report Definition >> .rpt_html .rpt_body_payments **/ .rpt_html .rpt_body_payments { font-size: 1.5vw; } /*= Backend Report ============ */ /** Backend Report >> .rpt_backend_html **/ .rpt_backend_html { font-size: 14px; padding: 24px 40px 24px 40px; } /** Backend Report >> .rpt_backend_html .rpt_title **/ .rpt_backend_html .rpt_title { font-size: 1.5em; text-align: left; margin-bottom: 0.5em; } /** Backend Report >> .rpt_backend_html .btn_admin **/ .rpt_backend_html .btn_admin { font-size: 14px; height: 36px; } /** Backend Report >> .rpt_backend_html .rpt_header **/ .rpt_backend_html .rpt_header { width: auto; height: auto; margin-bottom: 1em; } /** Backend Report >> .rpt_backend_html .rpt_body table **/ .rpt_backend_html .rpt_body table { margin-right: 0; margin-left: 0; } /** Backend Report >> .rpt_backend_html .rpt_body **/ .rpt_backend_html .rpt_body { font-size: 14px; max-width: 100%; max-height: 88vh; } /** Backend Report >> .rpt_backend_html .webonly **/ .rpt_backend_html .webonly { display: block; } /** Backend Report >> .rpt_backend_html .rpt_selectors **/ .rpt_backend_html .rpt_selectors { width: auto; height: auto; padding-top: 0; padding-bottom: 0; margin-bottom: 1.5em; } /** Backend Report >> .rpt_backend_html .rpt_select_label **/ .rpt_backend_html .rpt_select_label { font-size: 14px; line-height: 14px; } /** Backend Report >> .rpt_backend_html #select_date **/ .rpt_backend_html #select_date { font-size: 14px; line-height: 14px; width: 6em; margin-right: 1em; } /** Backend Report >> .rpt_backend_html .rpt_select **/ .rpt_backend_html .rpt_select { font-size: 14px; line-height: 14px; } /** Backend Report >> .rpt_backend_html .rpt_selectors .btn_admin **/ .rpt_backend_html .rpt_selectors .btn_admin { height: 24px; } /** Backend Report >> .rpt_backend_html .ui-widget, .postid-279 .ui-widget **/ .rpt_backend_html .ui-widget, .postid-279 .ui-widget { font-size: 14px !important; } /** Backend Report >> .rpt_backend_html th **/ .rpt_backend_html th { text-align: center; } /** Backend Report >> .rpt_backend_html .rpt_bottom_spacer td **/ .rpt_backend_html .rpt_bottom_spacer td { bottom: 2.2em; } /** Backend Report >> .rpt_backend_html .btn_back **/ .rpt_backend_html .btn_back { width: 120px; margin-bottom: 12px; position: relative; } /** Backend Report >> .rpt_backend_html .rpt_wrapper **/ .rpt_backend_html .rpt_wrapper { text-align: left; } /*= List Table ================ */ /** List Table >> .list_table_wrapper **/ .list_table_wrapper { overflow-x: auto; overflow-y: auto; } /** List Table >> .list_table **/ .list_table { width: auto; overflow-y: scroll; } /** List Table >> .list_thead **/ .list_thead { color: rgb(255, 255, 255); box-shadow: 0 0.2vw rgba(255, 255, 255, 0.5); background-color: rgb(142, 36, 36); padding-top: 0.5vw; padding-bottom: 0.5vw; margin-bottom: 0.2vw; border-right: 0.2vw solid rgba(255, 255, 255, 0.5); position: -webkit-sticky; position: sticky; top: 0; } /** List Table >> .list_thead:last-of-type **/ .list_thead:last-of-type { border-right-style: none; } /** List Table >> .list_narrow_col **/ .list_narrow_col { width: 3em; min-width: 3em; max-width: 3em; } /** List Table >> .list_medium_col **/ .list_medium_col { width: 5em; min-width: 5em; max-width: 5em; } /** List Table >> .list_wide_col **/ .list_wide_col { width: 8em; min-width: 8em; max-width: 8em; } /** List Table >> .list_superwide_col **/ .list_superwide_col { width: 12em; min-width: 12em; max-width: 12em; } /** List Table >> .list_td **/ .list_td { padding-top: 0.5vw; padding-bottom: 0.5vw; } /** List Table >> .list_td_touch **/ .list_td_touch { padding-top: 1vw; padding-bottom: 1vw; } /** List Table >> .list_tr:nth-of-type(even):not(.selected_list_tr) **/ .list_tr:nth-of-type(even):not(.selected_list_tr) { background-color: rgba(142, 36, 36, 0.25); } /** List Table >> tr.selected_list_tr **/ tr.selected_list_tr { color: rgb(255, 255, 255); background-color: rgba(142, 36, 36, 0.75); } /** List Table >> .list_tr_touch **/ .list_tr_touch { cursor: pointer; } /*= Sessions ================== */ /** Sessions >> .list_sessions_wrapper **/ .list_sessions_wrapper { width: 90%; } /** Sessions >> .session_summary **/ .session_summary { vertical-align: top; width: 30%; height: 36vw; box-sizing: border-box; margin-right: 2.5%; display: inline-block; overflow-x: visible; overflow-y: scroll; } /** Sessions >> .session_summary_item **/ .session_summary_item { vertical-align: top; width: 100%; box-sizing: border-box; padding-top: 1vw; padding-right: 1vw; padding-left: 1vw; margin-bottom: 1vw; border: 0.1vw solid rgb(142, 36, 36); border-radius: 1vw; display: inline-block; } /** Sessions >> .session_summary_head **/ .session_summary_head { font-size: 1.5vw; vertical-align: top; padding-bottom: 1vw; display: inline-block; } /** Sessions >> .session_summary_value **/ .session_summary_value { font-size: 1.5vw; text-align: right; vertical-align: top; padding-bottom: 1vw; display: inline-block; } /** Sessions >> .session_summary_header_head **/ .session_summary_header_head { width: 30%; } /** Sessions >> .session_summary_header_value **/ .session_summary_header_value { width: 70%; } /** Sessions >> .session_summary_stat_head **/ .session_summary_stat_head { width: 60%; } /** Sessions >> .session_summary_stat_value **/ .session_summary_stat_value { vertical-align: top; width: 40%; } /** Sessions >> .session_summary_value_full **/ .session_summary_value_full { text-align: right; width: 100%; } /** Sessions >> .session_list **/ .session_list { font-size: 2vw; vertical-align: top; width: 67.5%; height: 36vw; box-sizing: border-box; display: inline-block; } /** Sessions >> .btns_list_sessions **/ .btns_list_sessions { width: 80%; } /** Sessions >> .session_details_wrapper **/ .session_details_wrapper { width: 80%; } /** Sessions >> .session_details **/ .session_details { font-size: 1.5vw; height: 36vw; overflow-x: auto; overflow-y: auto; } /** Sessions >> .sessions_biz_date_col **/ .sessions_biz_date_col { width: 30%; } /** Sessions >> .session_list .list_table **/ .session_list .list_table { width: 100%; } /** Sessions >> .sessions_station_id_col **/ .sessions_station_id_col { width: 10%; } /** Sessions >> .sessions_status_col **/ .sessions_status_col { width: 15%; } /** Sessions >> .sessions_start_time_col **/ .sessions_start_time_col { width: 45%; } /*= Payment =================== */ /** Payment >> .tabs **/ .tabs { margin-top: 2vw; } /** Payment >> .tab **/ .tab { font-size: 2vw; text-align: center; width: 33.33%; box-sizing: border-box; padding-top: 1vw; padding-bottom: 1vw; border-bottom: 0.1vw solid rgb(142, 36, 36); border-top-left-radius: 0.5vw; border-top-right-radius: 0.5vw; display: inline-block; cursor: pointer; } /** Payment >> .active_tab **/ .active_tab { font-weight: bold; border-top: 0.1vw solid rgb(142, 36, 36); border-right: 0.1vw solid rgb(142, 36, 36); border-left: 0.1vw solid rgb(142, 36, 36); border-style: solid solid hidden solid; } /** Payment >> .tab_panes **/ .tab_panes { padding: 1vw 1.5vw 1vw 1.5vw; border-top: 0.1vw none rgb(142, 36, 36); border-right: 0.1vw solid rgb(142, 36, 36); border-bottom: 0.1vw solid rgb(142, 36, 36); border-left: 0.1vw solid rgb(142, 36, 36); border-bottom-right-radius: 0.5vw; border-bottom-left-radius: 0.5vw; } /** Payment >> .tab_pane **/ .tab_pane { height: 22vw; display: none; overflow-y: scroll; } /** Payment >> .active_tab_pane **/ .active_tab_pane { display: block; visibility: visible; } /** Payment >> .payment_wrapper **/ .payment_wrapper { width: 50%; } /** Payment >> .btn_payment **/ .btn_payment { height: 10vw; } /** Payment >> .tab_pane .btn_payment:nth-of-type(3n) **/ .tab_pane .btn_payment:nth-of-type(3n) { margin-right: 0; } /** Payment >> .trans_promotion_payments **/ .trans_promotion_payments { width: 100%; } /** Payment >> .trans_promotion_name **/ .trans_promotion_name { color: rgb(0, 0, 0); font-size: 1.25vw; box-sizing: border-box; padding: 0.5vw 0.75vw 0.5vw 0.75vw; margin-top: 0.5vw; margin-right: 0.5vw; border: 0.2vw solid rgb(142, 36, 36); border-radius: 0.5vw; display: inline-block; cursor: pointer; } /** Payment >> .cashier_screen .selected_payment **/ .cashier_screen .selected_payment { color: rgb(255, 255, 255); background-color: rgba(142, 36, 36, 0.75); border-radius: 0.5vw; } /*= Day End =================== */ /** Day End >> .dayend_wrapper **/ .dayend_wrapper { width: 40%; } /** Day End >> .dayend_summary_head **/ .dayend_summary_head { font-size: 2vw; width: 60%; display: inline-block; } /** Day End >> .dayend_summary_value **/ .dayend_summary_value { font-size: 2vw; text-align: right; width: 40%; display: inline-block; } /** Day End >> .btns_dayend **/ .btns_dayend { width: 80%; } /** Day End >> .dayend_summary **/ .dayend_summary { padding: 1.25vw 2vw 1.25vw 2vw; border: 0.1vw solid rgb(142, 36, 36); border-radius: 2vw; } /*= Loading =================== */ /** Loading >> .scr_loading **/ .scr_loading { background-color: rgba(128, 128, 128, 0.4); } /** Loading >> .loading_wrapper **/ .loading_wrapper { text-align: center; background-color: rgba(255, 255, 255, 0); } /** Loading >> .loading_img **/ .loading_img { width: 25vw; margin-right: auto; margin-left: auto; } /*= Approval ================== */ /** Approval >> .approval_wrapper input **/ .approval_wrapper input { width: 70%; display: inline-block; } /** Approval >> .scr_approval input **/ .scr_approval input { font-size: 2.5vw; text-align: center; box-sizing: border-box; margin-top: 1vw; margin-bottom: 1vw; border-width: 0.1vw; } /*= Admin ===================== */ /** Admin >> .admin_wrapper **/ .admin_wrapper { width: 60%; } /** Admin >> .btns_manage **/ .btns_manage { padding-bottom: 1.5vw; border-bottom: 0.15vw solid rgb(142, 36, 36); } /** Admin >> .btn_manage **/ .btn_manage { height: 6vw; } /** Admin >> div.btn_manage:nth-of-type(4n) **/ div.btn_manage:nth-of-type(4n) { margin-right: 0; } /*= Report Print ============== */ /** Report Print >> tr **/ tr { page-break-inside: avoid; page-break-after: auto; } /*= Progress Bar ============== */ /** Progress Bar >> .update_progress_wrapper **/ .update_progress_wrapper { width: 40%; } /** Progress Bar >> .update_progress_message **/ .update_progress_message { text-align: left; text-indent: 5%; padding-bottom: 0.25vw; } /** Progress Bar >> .progress_bar_frame **/ .progress_bar_frame { height: 4vw; margin-top: 1.25vw; border: 0.1vw solid rgb(142, 36, 36); } /** Progress Bar >> .progress_bar_value **/ .progress_bar_value { background-color: rgb(142, 36, 36); width: 50%; height: 4vw; } /*= Overrides (Must Place at End) = */ /** Overrides (Must Place at End) >> .btn_modal_last **/ .btn_modal_last { margin-right: 0; } /*= Derek’s Backend Report ==== */ /** Derek’s Backend Report >> .rpt_backend_html .rpt_bottom_2 **/ .rpt_backend_html .rpt_bottom_2 { bottom: 2.15em; } /** Derek’s Backend Report >> .rpt_backend_html .rpt_bottom_3 **/ .rpt_backend_html .rpt_bottom_3 { bottom: 4.05em; } /** Derek’s Backend Report >> .rpt_backend_html .rpt_bottom_4 td **/ .rpt_backend_html .rpt_bottom_4 td { bottom: 5.8em; } /*= Octopus =================== */ /** Octopus >> .elapsed_time **/ .elapsed_time { font-size: 1.25rem; text-align: center; } /** Octopus >> .elapsed_time_value **/ .elapsed_time_value { font-size: 1.75rem; background-color: rgba(204, 204, 204, 0.5); padding: 0.5vw 1.25vw 0.5vw 1.25vw; display: inline-block; } /** Octopus >> .elapsed_time_text **/ .elapsed_time_text { font-size: 1.5rem; display: inline-block; } /** Octopus >> .time_alert **/ .time_alert { color: rgb(255, 255, 255); background-color: rgb(255, 0, 0); } /** Octopus >> .oct_info_wrapper **/ .oct_info_wrapper { width: 70%; } /** Octopus >> .oct_info_header **/ .oct_info_header { font-size: 1rem; margin-top: 3vw; margin-bottom: 2vw; } /** Octopus >> .oct_info_heading **/ .oct_info_heading { width: 30%; margin-bottom: 0.75vw; display: inline-block; } /** Octopus >> .oct_info_value **/ .oct_info_value { width: 70%; display: inline-block; } /** Octopus >> .oct_info_col **/ .oct_info_col { font-size: 1rem; text-align: center; padding-top: 0.75vw; padding-bottom: 0.75vw; display: inline-block; } /** Octopus >> .oct_info_num **/ .oct_info_num { width: 15%; } /** Octopus >> .oct_info_datetime **/ .oct_info_datetime { width: 40%; } /** Octopus >> .oct_info_amt **/ .oct_info_amt { width: 25%; } /** Octopus >> .oct_info_devID **/ .oct_info_devID { width: 20%; } /** Octopus >> .oct_info_tbl_row:nth-of-type(odd) **/ .oct_info_tbl_row:nth-of-type(odd) { background-color: rgba(142, 36, 36, 0.2); } /** Octopus >> .oct_info_tbl_header **/ .oct_info_tbl_header { } /*= Member Info =============== */ /** Member Info >> .meminfo_wrapper **/ .meminfo_wrapper { width: 60%; } /** Member Info >> .meminfo_label **/ .meminfo_label { width: 30%; display: inline-block; } /** Member Info >> input.meminfo_input **/ input.meminfo_input { width: 70%; display: inline-block; } /** Member Info >> .btns_meminfo **/ .btns_meminfo { width: 50%; } /** Member Info >> .meminfo_fields **/ .meminfo_fields { max-height: 30vw; overflow-y: scroll; } /*= Member Details ============ */ /** Member Details >> .memdetails_left **/ .memdetails_left { width: 37.5%; padding: 1vw 2vw 1vw 2vw; margin-right: 2.5%; margin-bottom: 1vw; border: 0.25vw solid rgb(142, 36, 36); border-radius: 2vw; } /** Member Details >> .memdetails_wrapper **/ .memdetails_wrapper { width: 70%; } /** Member Details >> .memdetails_left_label **/ .memdetails_left_label { font-size: 1.5vw; width: 35%; margin-top: 0.25vw; margin-bottom: 0.25vw; display: inline-block; } /** Member Details >> .memdetails_left_value **/ .memdetails_left_value { font-size: 1.5vw; width: 65%; margin-top: 0.25vw; margin-bottom: 0.25vw; display: inline-block; } /** Member Details >> .memdetails_right_head **/ .memdetails_right_head { color: rgb(255, 255, 255); font-size: 1.5vw; text-align: center; background-color: rgb(142, 36, 36); box-sizing: border-box; padding-top: 0.5vw; padding-bottom: 0.5vw; border-right: 0.2vw solid rgb(255, 255, 255); display: inline-block; } /** Member Details >> .memdetails_right_value **/ .memdetails_right_value { font-size: 1.5vw; text-align: center; box-sizing: border-box; padding-top: 0.5vw; padding-bottom: 0.5vw; border-color: rgba(255, 255, 255, 0); border-right: 0.2vw solid rgba(255, 255, 255, 0); display: inline-block; } /** Member Details >> .memdetails_right_superwide **/ .memdetails_right_superwide { width: 30%; } /** Member Details >> .memdetails_right_short **/ .memdetails_right_short { width: 15%; } /** Member Details >> .memdetails_right_medium **/ .memdetails_right_medium { width: 25%; } /** Member Details >> .memdetails_left_value:last-of-type **/ .memdetails_left_value:last-of-type { margin-bottom: 0; } /*= Notifications ============= */ /** Notifications >> .notif_list_wrapper **/ .notif_list_wrapper { width: 80%; } /** Notifications >> .notif_full_msg **/ .notif_full_msg { font-size: 1rem; vertical-align: top; width: 67.5%; height: 35vw; box-sizing: border-box; padding: 2vw 4vw 2vw 4vw; margin-top: 1vw; border-width: 0.2vw; border-style: solid; border-radius: 1vw; display: inline-block; overflow-y: hidden; } /** Notifications >> .full_msg_title **/ .full_msg_title { font-size: 2.5vw; line-height: 2.5vw; font-weight: 600; margin-bottom: 0.75vw; } /** Notifications >> .full_msg_date **/ .full_msg_date { font-size: 1.5vw; padding-bottom: 1.5vw; margin-bottom: 2vw; border-bottom-width: 0.2vw; border-bottom-style: solid; } /** Notifications >> .full_msg_message **/ .full_msg_message { line-height: 1.25rem; height: 21.5vw; box-sizing: border-box; overflow-y: scroll; } /** Notifications >> .notif_list **/ .notif_list { font-size: 1rem; width: 30%; height: 35vw; box-sizing: border-box; padding: 1vw; margin-top: 1vw; margin-right: 2.5%; border-width: 0.2vw; border-style: solid; border-radius: 1vw; display: inline-block; } /** Notifications >> .notif_list_body **/ .notif_list_body { height: 32.5vw; overflow-y: scroll; } /** Notifications >> .notif_block **/ .notif_block { font-size: 0; padding: 1vw; margin: 0.5vw; cursor: pointer; } /** Notifications >> .notif_date **/ .notif_date { font-size: 1vw; vertical-align: middle; display: inline-block; } /** Notifications >> .notif_read_icon **/ .notif_read_icon { vertical-align: middle; background-image: url(“/wp-content/uploads/2019/11/NewMsg.png”); background-position: center center; background-repeat: no-repeat; background-size: contain; width: 1vw; height: 1vw; margin-right: 0.5vw; display: inline-block; } /** Notifications >> .notif_title **/ .notif_title { font-size: 1.75vw; line-height: 2.25vw; margin-bottom: 0.25vw; } /** Notifications >> .notif_preview **/ .notif_preview { font-size: 1vw; line-height: 1.5vw; } /** Notifications >> .read_msg .notif_read_icon **/ .read_msg .notif_read_icon { background-image: url(“/wp-content/uploads/2019/11/ReadMsg.png”); } /** Notifications >> .selected_msg .notif_read_icon **/ .selected_msg .notif_read_icon { background-image: url(“/wp-content/uploads/2019/11/ReadMsg_Reverse.png”); } /** Notifications >> .selected_msg **/ .selected_msg { color: rgb(255, 255, 255); background-color: rgba(44, 142, 36, 0.75); } /** Notifications >> .notif_block:not(.read_msg) **/ .notif_block:not(.read_msg) { background-color: rgba(44, 142, 36, 0.25); } /** Notifications >> .new_notif_num **/ .new_notif_num { box-shadow: 0 0 rgb(0, 0, 0); background-image: url(“/wp-content/uploads/2019/11/NewMsg.png”); background-position: 0vw 2vw; background-repeat: no-repeat; background-size: 60% 60%; width: 5vw; height: 5vw; position: absolute; top: 7.9vw; left: 93%; cursor: pointer; } /** Notifications >> .notif_num **/ .notif_num { font-size: 2vw; line-height: 2.5vw; text-align: center; background-color: rgba(142, 36, 36, 0.48); width: 2.5vw; height: 2.5vw; padding: 0.25vw; border-radius: 50%; position: relative; left: 2vw; display: inline-block; } /** Notifications >> .notif_plus **/ .notif_plus { font-size: 1.25vw; margin-right: -0.2vw; margin-left: -0.2vw; display: inline; } /** Notifications >> .full_msg_message img **/ .full_msg_message img { max-width: 100%; height: auto; } /** Notifications >> .full_msg_message p **/ .full_msg_message p { margin-top: 0; } /*= Color Scheme ============== */ /** Color Scheme >> .btn, .theme_border **/ .btn, .theme_border { color: rgb(0, 0, 0); border-color: rgb(44, 142, 36); } .btn, .theme_border, .theme_border { /* MT [ sub: 1 ] */ } /** Color Scheme >> .theme_back **/ .theme_back { color: rgb(255, 255, 255); background-color: rgb(44, 142, 36); } /** Color Scheme >> .modal **/ .modal { background-color: rgba(44, 142, 36, 0.5); } /** Color Scheme >> .btn_highlight **/ .btn_highlight { color: rgb(255, 255, 255); background-color: rgba(44, 142, 36, 0.75); } /** Color Scheme >> .theme_boxtext **/ .theme_boxtext { color: rgb(0, 0, 0); } /** Color Scheme >> .item_row:nth-of-type(2n), tr.item_row:nth-of-type(2n) **/ .item_row:nth-of-type(2n), tr.item_row:nth-of-type(2n) { color: rgb(0, 0, 0); background-color: rgba(44, 142, 36, 0.25); } /** Color Scheme >> .cashier_screen .selected_light **/ .cashier_screen .selected_light { color: rgb(0, 0, 0); background-color: rgba(44, 142, 36, 0.25); } /** Color Scheme >> .cashier_screen .selected_dark **/ .cashier_screen .selected_dark { color: rgb(255, 255, 255); background-color: rgba(44, 142, 36, 0.75); } /*( Tablet & Phone )*/ @media (max-width: 767px) { /*= Tool CSS (Do not remove) == */ /** Tool CSS (Do not remove) >> .single-html_page #included_content **/ .single-html_page #included_content { padding-top: 46px; } } /*( Phone )*/ @media (max-width: 480px) { /*= Report Body =============== */ /** Report Body >> .webonly **/ .webonly { display: none; } /*= Backend Report ============ */ /** Backend Report >> .rpt_backend_html **/ .rpt_backend_html { padding: 12px; } /** Backend Report >> .rpt_backend_html .webonly **/ .rpt_backend_html .webonly { display: none; } } /*( Print )*/ @media print { /*= Report Body =============== */ /** Report Body >> .btns_admin **/ .btns_admin { display: none; } /** Report Body >> .btn_admin **/ .btn_admin { display: none; } /** Report Body >> .rpt_body **/ .rpt_body { max-height: none; } /** Report Body >> .rpt_thead **/ .rpt_thead { position: static; top: auto; } /** Report Body >> .rpt_bottom **/ .rpt_bottom { position: static; bottom: auto; } /** Report Body >> .rpt_line_td **/ .rpt_line_td { position: static; bottom: auto; } /** Report Body >> .rpt_selectors **/ .rpt_selectors { display: none; } /** Report Body >> .rpt_bottom_spacer td **/ .rpt_bottom_spacer td { position: static; bottom: auto; } /*= Backend Report ============ */ /** Backend Report >> .rpt_backend_html **/ .rpt_backend_html { padding: 0; -webkit-print-color-adjust: exact !important; } /** Backend Report >> .rpt_backend_html .rpt_body **/ .rpt_backend_html .rpt_body { max-height: none; display: block; } /** Backend Report >> .rpt_backend_html .rpt_selectors **/ .rpt_backend_html .rpt_selectors { display: none; } /** Backend Report >> .rpt_backend_html .btn_back **/ .rpt_backend_html .btn_back { display: none; } /*= Report Print ============== */ /** Report Print >> tr **/ tr { page-break-inside: avoid; page-break-after: auto; } /** Report Print >> thead **/ thead { display: table-header-group; page-break-before: always; } }
Categories: