REX Barcode Mode by thegamesmendev

/* ==UserStyle==
@name         REX Barcode Mode
@version      20220512.02.21
@namespace    userstyles.world/user/thegamesmendev
@description  RetailExpress style sheet designed to work with a barcode scanner. Trimmed down to essential information and view from long distances.
@author       thegamesmendev
@license      No License
==/UserStyle== */

@-moz-document regexp(".*\\/Admin\\/Inventory\\/ProductMaint\\/prodEdit\\.asp.*") {
html { zoom:0.85; }

body > .page-wrap > h1 { font-size: 3vw !important; }
body > .page-wrap > #tabsJ { display: none !important; }
body > .page-wrap { padding: 0; margin: 0; }
.page-wrap { min-width: initial !important; }
form[name=thisForm], form[name=thisForm] div { padding: 0; margin: 0; }

form[name=thisForm] { display: flex; flex-flow: column-reverse; } /* Moves location to top cleanly */
body * { font-size: 3vw !important; } /* Scale font relative to root font size */
form[name=thisForm] h2 { font-size: 0 !important; }

form[name=thisForm] #mainDiv h2::after { content:'Bin History'; display: block; font-size: 3vw; }
form[name=thisForm] #inventoryDiv h2::after { content:'Inventory'; display: block; font-size: 3vw; }

#mainDiv { display: block !important; float: right !important; }

#mainDiv .row > div:nth-child(1) { width: 100% !important; }
#mainDiv .row > div:nth-child(1) > * { display: none; }
/*#mainDiv .row > div:nth-child(1) > div:nth-child(1) { display: block; } /* Description & Codes */
/*#mainDiv .row > div:nth-child(1) > div:nth-child(2) { display: block; } /* Properties */
#mainDiv .row > div:nth-child(1) > div:nth-child(2) tbody > tr:nth-child(4) { display: none !important; }
#mainDiv .row > div:nth-child(1) > div:nth-child(2) tbody > tr:nth-child(5) { display: none !important; }
#mainDiv .row > div:nth-child(1) > div:nth-child(2) tbody > tr:nth-child(6) { display: none !important; }
#mainDiv .row > div:nth-child(1) > div:nth-child(2) tbody > tr:nth-child(7) { display: none !important; }

#mainDiv .row > div:nth-child(1) > div:nth-child(4) { display: block; } /* Long Description */
#mainDiv .row > div:nth-child(1) > div:nth-child(4) textarea { height: 500px;}
#mainDiv .row > div:nth-child(1) > div:nth-child(4) tbody > tr:nth-child(1) { display: none !important; }
#mainDiv .row > div:nth-child(1) > div:nth-child(4) tbody > tr:nth-child(2) { display: none !important; }
#mainDiv .row > div:nth-child(1) > div:nth-child(4) tbody > tr:nth-child(3) > td:nth-child(1) { display: none !important; }

#mainDiv .row > div:nth-child(2) { display: none; }

#inventoryDiv { display: block !important; float: left !important; max-width: 89%;}
#inventoryDiv .row > * { display: none !important; }
#inventoryDiv .row > div:nth-child(2) { width: 100% !important; display: block !important; }
#inventoryDiv .row > div:nth-child(2) tbody td { padding-top:0; padding-bottom:0; }
#inventoryDiv .row > div:nth-child(2) tfoot > tr:nth-child(2) { display: none; }

/* Hide unneccessary stock columns */
#inventoryDiv .row > div:nth-child(2) tbody td:nth-child(1), 
#inventoryDiv .row > div:nth-child(2) thead th:nth-child(1),
#inventoryDiv .row > div:nth-child(2) tfoot td:nth-child(1),
#inventoryDiv .row > div:nth-child(2) tbody td:nth-child(5), 
#inventoryDiv .row > div:nth-child(2) thead th:nth-child(5),
#inventoryDiv .row > div:nth-child(2) tfoot td:nth-child(5),
#inventoryDiv .row > div:nth-child(2) tbody td:nth-child(6), 
#inventoryDiv .row > div:nth-child(2) thead th:nth-child(6),
#inventoryDiv .row > div:nth-child(2) tfoot td:nth-child(6),
#inventoryDiv .row > div:nth-child(2) tbody td:nth-child(7), 
#inventoryDiv .row > div:nth-child(2) thead th:nth-child(7),
#inventoryDiv .row > div:nth-child(2) tfoot td:nth-child(7),
#inventoryDiv .row > div:nth-child(2) tbody td:nth-child(8), 
#inventoryDiv .row > div:nth-child(2) thead th:nth-child(8),
#inventoryDiv .row > div:nth-child(2) tfoot td:nth-child(8),
#inventoryDiv .row > div:nth-child(2) tbody td:nth-child(9), 
#inventoryDiv .row > div:nth-child(2) thead th:nth-child(9),
#inventoryDiv .row > div:nth-child(2) tfoot td:nth-child(9),
#inventoryDiv .row > div:nth-child(2) tbody td:nth-child(10), 
#inventoryDiv .row > div:nth-child(2) thead th:nth-child(10),
#inventoryDiv .row > div:nth-child(2) tfoot td:nth-child(10),
#inventoryDiv .row > div:nth-child(2) tbody td:nth-child(11), 
#inventoryDiv .row > div:nth-child(2) thead th:nth-child(11),
#inventoryDiv .row > div:nth-child(2) tfoot td:nth-child(11) { display: none; }

/* Expand BIN column */
#inventoryDiv .row > div:nth-child(2) tbody td:nth-child(12), 
#inventoryDiv .row > div:nth-child(2) thead th:nth-child(12),
#inventoryDiv .row > div:nth-child(2) tfoot td:nth-child(12) { width: 33%; }

#NotificationBanner { display: none; }

select { height: 100% !important; } /* Select element font size fix */

#salesDiv { display: block !important; float:right; max-width:10%; position: absolute; top:15%; right:0; }
#invneotryDiv > div { max-width: 80%; }
#salesDiv .hybrid-table-grid th,
#salesDiv .hybrid-table-grid tr:nth-child(1),
#salesDiv .hybrid-table-grid tr:nth-child(2),
#salesDiv .hybrid-table-grid tr:nth-child(3),
#salesDiv .hybrid-table-grid tr:nth-child(4),
#salesDiv .hybrid-table-grid tr:nth-child(5),
#salesDiv .hybrid-table-grid tr:nth-child(6),
#salesDiv .hybrid-table-grid tr:nth-child(7),
#salesDiv .hybrid-table-grid tr:nth-child(8),
#salesDiv .hybrid-table-grid tr:nth-child(9),
#salesDiv .hybrid-table-grid tr td:nth-child(1),
#salesDiv .hybrid-table-grid tr td:nth-child(2),
#salesDiv .hybrid-table-grid tr td:nth-child(4),
#salesDiv .hybrid-table-grid tr td:nth-child(5),
#salesDiv .hybrid-table-grid tr td:nth-child(6),
#salesDiv .hybrid-table-grid tr td:nth-child(7) { display: none; }

@media screen and (orientation: landscape) {
    body * { font-size: 3vw !important; }
    body > .page-wrap > h1 { font-size: 3vw !important; }
    form[name=thisForm] #mainDiv h2::after { font-size: 3vw; }
    form[name=thisForm] #inventoryDiv h2::after { font-size: 3vw; }
}

@media screen and (orientation: portrait) {
    body * { font-size: 3vh !important; }
    body > .page-wrap > h1 { font-size: 3vh !important; }
    form[name=thisForm] #mainDiv h2::after { font-size: 3vh; }
    form[name=thisForm] #inventoryDiv h2::after { font-size: 3vh; }
}
}