Initial commit

This commit is contained in:
2021-10-23 19:59:20 +10:00
commit ba4c9a7d7a
1851 changed files with 1250444 additions and 0 deletions

591
wwwroot/styles/screen.css Normal file
View File

@@ -0,0 +1,591 @@
body{
overflow:hidden;
}
#pageContainer{
display:flex;
overflow:hidden;
height:100vh !important;
}
#leftColumn{
display:flex;
flex-direction:column;
height:100%;
flex-basis:35%;
}
#tableDetails{
display:flex;
flex-basis:10%;
flex-direction:column;
}
#tableDetails h2{
flex-basis:50%;
display:flex;
align-items:center;
justify-content:center;
}
#tableDetails div{
display:flex;
flex-basis:50%;
}
#tableDetails div a{
display:flex;
align-items:center;
justify-content:center;
flex-basis:50%;
height:100%;
}
#orderBoxContainer{
flex-basis:80%;
background-color:#000;
overflow-y:auto;
scroll-behavior: smooth;
}
#leftColumnFooter{
display:flex;
flex-direction:column;
flex-basis:10%;
background-color:#777;
}
#leftColumnFooter .messageBox{
border-top:inset 3px #ccc;
border-bottom:inset 3px #ccc;
flex-basis:30%;
background-color:#FFF;
text-align:center;
}
#leftColumnFooter h2,
#leftColumnFooter .selectedTotal{
flex-basis:30%;
padding-right:1em;
text-align:right;
}
#rightColumn{
display:flex;
flex-basis:65%;
flex-direction:column;
overflow:hidden;
}
#topBar{
flex-basis:10%;
display:flex;
background:#666;
}
#topBar .exit{
flex-basis:15%;
font-size:3em;
display:flex;
align-items:center;
justify-content:center;
}
#topBar a{
flex:1;
height:100%;
display:flex;
align-items:center;
justify-content:center;
}
#topHalf{
flex-basis:25%;
display:flex;
align-items:center;
justify-content:center;
}
#topHalf div{
display:flex;
height:100%;
}
.endFunctionColumn{
flex-basis:15%;
flex-direction:column;
}
.functionColumn{
flex:1;
flex-direction:column;
}
.functionColumn *{
display:flex;
flex:1;
justify-content:center;
align-items:center;
}
#middleHalf{
background-color:#666;
flex-basis:10%;
display:flex;
align-items:center;
justify-content:center;
overflow-x:auto;
overflow-y:hidden;
}
#middleHalf a{
height:100%;
flex:1;
display:flex;
align-items:center;
justify-content:center;
}
#bottomHalf{
flex:1;
overflow-x:auto;
overflow-y:hidden;
scroll-behavior: smooth;
}
.pageControls{
flex-basis:10%;
width:100%;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
}
.pageControls a{
height:100%;
flex:1;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
}
#bottomHalf::-webkit-scrollbar {
display: none;
}
#pageWrapper{
height:100%;
width:100%;
display:flex;
}
.itemPage{
flex-basis:100%;
height:100%;
}
.itemPage table{
table-layout:fixed;
}
.itemPage td{
}
td .itemCellWrapper{
position:relative;
height:100%;
}
td .posButton{
position:absolute;
display:flex;
align-items:center;
justify-content:center;
overflow:hidden;
}
td .posButton.normal{
font-size:0.9em;
gap:2%;
align-items:center;
}
td .posButton.normal a:first-of-type{
font-size:0.9em;
flex-basis:100%;
text-align:center;
align-items:center;
}
td .posButton.normal.hasImage a:first-of-type{
margin-left:2%;
height:100%;
flex-basis:24%;
background-size:contain;
background-repeat:no-repeat;
background-position:center;
align-items:center;
}
td .posButton.normal.hasImage a:nth-of-type(2){
flex-basis:70%;
}
td .posButton.doubleHeight{
flex-direction:column;
}
td .posButton.doubleHeight.hasImage a:first-of-type{
margin-top:5%;
display:flex;
align-items:center;
justify-content:center;
width:100%;
flex-basis:66%;
background-size:contain;
background-repeat:no-repeat;
background-position:center 20%;
}
.mobile td .posButton.doubleHeight.hasImage a:first-of-type{
background-position:center bottom;
}
td .posButton.doubleHeight.hasImage a:nth-of-type(2){
display:flex;
align-items:center;
justify-content:center;
flex-basis:33%;
}
td .posButton.doubleWidth.hasImage a:first-of-type{
margin-left:2%;
height:100%;
flex-basis:24%;
background-size:contain;
background-repeat:no-repeat;
background-position:0 center;
display:flex;
align-items:center;
}
td .posButton.doubleWidth.hasImage a:nth-of-type(2){
flex-basis:74%;
}
td .posButton.doubleWidth.doubleHeight{
flex-direction:row;
gap:4%;
}
td .posButton.doubleWidth.doubleHeight.hasImage a:first-of-type{
margin-left:2%;
flex-basis:48%;
height:100%;
background-size:contain;
background-repeat:no-repeat;
background-position:center;
}
td .posButton.doubleWidth.doubleHeight.hasImage a:nth-of-type(2){
flex-basis:48%;
}
#orderBoxItem{
width:50%;
}
#orderBox{
width:100%;
}
#orderBox th{
text-align:center;
font-weight:bold;
}
#orderBox th,
#orderBox td{
height:3em;
vertical-align:middle;
text-align:center;
font-weight:bold;
}
.instructionRow td{
font-weight:lighter !important;
font-size:1em !important;
}
td.itemCell{
text-align:left !important;
}
.rtl td.itemCell{
text-align:right !important;
}
.instructionRow .itemCell{
padding-left:2em;
}
.rtl .instructionRow .itemCell{
padding-right:2em !important;
}
#positions{
position:relative;
flex-wrap:wrap;
width: 306px;
height:max-content;
left:-100px;
top:0;
border:solid 2px #ccc;
background-color:#666;
z-index:1000 !important;
display:none !important;;
}
#positions .posButton{
float:left;
width:100px;
height:50px;
line-height:50px;
}
.instructionRow .invisibleText{
color:rgba(0,0,0,0);
}
#tableDetails{
text-align:center;
background-color:#ccc;
color:#444;
}
.qtyCell{
width:15%;
}
.totalPriceCell{
width:15%;
}
.printGroupCell{
width:15%;
}
.itemCell{
width:55%;
}
th.itemCell{
text-align:center;
}
.numPad{
width:260px;
padding-left:1em;
}
.numPad a{
float:left;
height:68px;
line-height:68px;
margin:2px;
width:80px;
}
.posHeader{
background-color:#666;
color:#ccc;
}
/*Begin Styling for Table Map Screen*/
#areaMenu{
display:flex;
}
#areaMenu a{
height:80px;
padding:0 5px;
text-align:center;
line-height:80px;
width:140px;
}
#tableScreen{
overflow:hidden;
display:flex;
min-height: 100%;
width: 100%;
height: 100%; /* NEW */
}
#tablemapLeftColumn{
display:flex;
flex-direction:column;
align-items:center;
flex-basis:10%;
background-color:#333;
}
#tablemapRightColumn{
display:flex;
flex-basis:10%;
flex-direction:column;
background-color:#333;
}
.topCell{
display:flex;
flex-basis:10%;
width:100%;
}
.mobile #pageContainer{
font-size:0.5em !important;
}
.topCell a{
height:100%;
flex-basis:100%;
}
a.logOut{
font-size:3em;
}
.middleCell{
width:100%;
flex-basis:80%;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
}
.middleCell a.editModeButton{
width:100%;
flex-basis:33%;
}
.bottomCell{
flex-basis:10%;
width:100%;
}
#tablemapCenterColumn{
display:flex;
flex-direction:column;
flex-basis:80%;
}
#tablemapLeftColumn a,
#tablemapRightColumn a{
display:flex;
align-items:center;
justify-content:center;
text-align:center;
}
#centerTopRow{
display:flex;
flex-basis:10%;
align-items:center;
justify-content:center;
background-color:#333;
}
#mapContainer{
display:flex;
align-items:center;
justify-content:center;
flex-basis:80%;
}
#tableMap{
background-repeat:no-repeat;
}
#centerBottomRow{
display:flex;
flex-basis:10%;
background-color:#333;
}
#centerTopRow a{
height:100%;
display:flex;
flex:1;
align-items:center;
justify-content:center;
}
.editControls{
display:flex;
height:100%;
flex-basis:100%;
align-items:center;
justify-content:center;
}
.floorplanControls,
.mergeControls{
visibility:hidden;
width:100%;
flex-basis:33%;
display:flex;
flex-direction:column;
}
.editControls a{
height:100%;
display:flex;
flex-wrap:wrap;
flex:1;
align-items:center;
justify-content:center;
text-align:center;
}
.editControls .posHeader{
flex-direction:column;
}
.floorplanControls a,
.mergeControls a{
display:flex;
flex-basis:33%;
width:100%;
justify-content:center;
align-items:center;
}
#editControls{
display:none;
align-items:center;
justify-content:center;
}

View File

@@ -0,0 +1,92 @@
#tableScreen{
height:100vh !important;
}
#decorator{
display:none;
position:absolute;
margin:auto;
top:0;
bottom:0;
right:0;
left:0;
width:30%;
height:50%;
background-color:#333;
border:solid 2px;
flex-direction:column;
}
.mobile #decorator{
width:90%;
height:90%;
}
.deleteDecoration{
display:none;
}
#decoratorHeader{
background-color:#666;
display:flex;
flex-basis:10%
}
#decoratorHeader *{
display:flex;
align-items:center;
justify-content:center;
}
#decoratorHeader h2{
flex-basis:90%;
}
#decoratorHeader a{
flex-basis:10%;
}
#decoratorContent{
flex-basis:90%;
width:100%;
overflow-y:auto;
display:block;
margin:auto;
}
.decoratorRow{
display:flex;
height:30%;
width:100%;
}
.decoratorItem{
display:flex;
flex-direction:column;
height:100%;
flex-basis:25%;
text-align:center;
}
.decoratorRow:nth-child(odd) .decoratorItem:nth-child(even),
.decoratorRow:nth-child(even) .decoratorItem:nth-child(odd){
background-color:#ccc;
color:#333;
}
.decoratorItem a{
display:flex;
align-items:center;
justify-content:center;
font-weight:bold;
}
.decoratorItem a:first-of-type{
flex-basis:70%;
background-size:contain;
background-repeat:no-repeat;
background-position:center center;
}
.decoratorItem a:nth-of-type(2){
flex-basis:30%;
}

411
wwwroot/styles/theme.css Normal file
View File

@@ -0,0 +1,411 @@
*,body{
padding:0;
margin:0;
font-family: Arial, Helvetica, sans-serif;
}
.rtl{
direction:rtl;
}
body{
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.rtl td.itemCell{
text-align:right !important;
}
.rtl .instructionRow .itemCell{
padding-right:2em !important;
}
body.darkMode{
background-image: linear-gradient(137deg, #242424 25%, #2e2e2e 25%, #2e2e2e 50%, #242424 50%, #242424 75%, #2e2e2e 75%, #2e2e2e 100%);
background-size: 58.65px 54.69px;
color:#eee;
}
body.lightMode{
background-color:#eee;
color:#0f59b1
}
.hide{
display:none;
}
#pageContainer{
background-color:#333;
}
.darkMode #orderBox tbody tr.selected{
background-color:#aaa !important;
}
.lightMode #orderBox tbody tr.selected{
background-color:#0f59b1 !important;
color:#eee;
}
.darkMode #orderBox th{
color:#eee;
background-color:#999;
}
.lightMode #orderBox th{
color:#0f59b1;
background-color:#eee;
}
.darkMode #orderBox tbody tr{
background: #777;
color:#eee;
}
.lightMode #orderBox tbody tr{
background: #eee;
color:#0f59b1;
}
.darkMode .posButton{
color: #eee;
background: #232B30 -webkit-linear-gradient(top, #3D4850 3%, #000 4%, #333 100%);
text-shadow: 1px 1px #1f272b;
}
.lightMode .posButton{
color: #0f59b1;
background: linear-gradient(0deg, rgba(172,172,172,1) 0%, rgba(255,255,255,1) 100%);
text-shadow: 1px 1px #fff;
border-color:#ddd
}
.posButton.void{
background: #232B30 -webkit-linear-gradient(270deg, rgba(255,0,0,1) 0%, #b94141 100%);
color:#000;
}
.darkMode .posButton:active,
.darkMode .posButton.active{
border-color:#eee;
border-style: inset;
background-position: 0 top;
color: #fff;
background: #20282D -webkit-gradient(linear, left top, left bottom, color-stop(3%,#20282D), color-stop(51%,#252E34), color-stop(100%,#222A30)); /* webkit */
box-shadow: 1px 1px 1px rgba(255,255,255,0.1); /* CSS3 */
}
.lightMode .posButton:active,
.lightMode .posButton.active{
border-color:#000 !important;
border-style: inset;
background-position: 0 top;
color: #333;
background: linear-gradient(0deg, rgba(15,89,177,1) 0%, rgba(249,249,249,1) 100%);
box-shadow: 0; /* CSS3 */
}
.posButton.void.active,
.void:active{
color:#000;
background: #232B30 -webkit-linear-gradient(90deg, rgba(255,0,0,1) 0%, #b94141 100%) !important;
border:inset 2px #fff;
}
.posButton{
text-align:center;
display: block;
font-weight: bold;
border: 1px solid #1c252b;
border-radius: 3px;
box-shadow: 1px 1px 1px rgba(0,0,0,0.2);
}
/*VirtualNumpad*/
#virtualNumpad{
display:none;
flex-direction:column;
background-color:#666;
width:33%;
max-width:400px;
height:640px;
margin: auto;
position: absolute;
z-index:1200;
top: 0; left: 0; bottom: 0; right: 0;
border:solid 5px #333;
}
.mobile #virtualNumpad{
width:90%;
max-width:100%;
height:90%;
font-size:3em;
}
@media (max-width: 800px){
body{
font-size:0.6em;
}
}
#virtualNumpadInput{
display:flex;
justify-content:center;
align-items:center;
flex-basis:10%;
background-color:#888;
color:#eee;
font-weight:bold;
font-size:4em;
overflow-x:auto;
overflow-y:hidden;
}
.headingRow{
display:flex;
flex-basis:10%;
}
#virtualNumpadHeading{
display:flex;
align-items:center;
flex:1;
justify-content:center;
text-align:center;
}
#virtualNumpadButtons{
display:flex;
flex-basis:80%;
flex-direction:column;
align-items:center;
justify-content:center;
}
.virtualNumpadRow{
flex-basis:20%;
width:100%;
display:flex;
}
.virtualNumpadButton{
display:flex;
justify-content:center;
align-items:center;
flex-basis:33%;
height:100%;
}
.virtualNumpadSubmit{
flex-basis:99%;
}
/*Virtual Keyboard*/
#virtualKeyboard{
position:absolute;
margin:auto;
height:50%;
width:75%;
z-index:1200;
top: 0; left: 0; bottom: 0; right: 0;
border:solid 5px #eee;
background-color:#666;
display:none;
flex-direction:column;
}
.mobile #virtualKeyboard{
width:100%;
height:33%;
font-size:2em;
}
#virtualKeyboardHeading{
display:flex;
flex-basis: 80%;
align-items:center;
justify-content:center;
text-align:center;
}
#virtualKeyboardInput{
display:flex;
justify-content:center;
align-items:center;
flex-basis: 15%;
background-color:#888;
color:#eee;
font-weight:bold;
font-size:2em;
overflow-x:auto;
overflow-y:hidden;
}
#virtualKeyboardButtons{
display:flex;
flex-basis:75%;
flex-direction:column;
flex-wrap:wrap;
}
.virtualKeyboardRow{
display:flex;
flex-basis:20%;
align-items:center;
justify-content:center;
}
.virtualKeyboardButton{
flex:1;
display:flex;
height:100%;
justify-content:center;
align-items:center;
}
.virtualKeyboardButton[data-value="space"]{
flex:0 0 80%!important;
}
.closeKeyboards{
display:flex;
align-items:center;
justify-content:center;
flex-basis:20%;
background-color:#000;
}
.popupBox{
position:absolute;
z-index:1000;
display:none;
border:solid 1px;
background-color:#666;
flex-direction:column;
}
.popupBox a{
flex:1;
display:flex;
justify-content:center;
align-items:center;
}
.popupBox a.flexWide{
flex-basis:100%;
}
.popupBoxRow{
flex:1;
display:flex;
}
/*Virtual Keyboard*/
#gridContainer{
position:absolute;
margin:auto;
height:50%;
width:75%;
z-index:1200;
top: 0; left: 0; bottom: 0; right: 0;
border:solid 5px #eee;
background-color:#666;
display:none;
flex-direction:column;
}
#gridBody{
display:flex;
}
#gridHeader{
display:flex;
flex:1;
justify-content:center;
align-items:center;
}
#gridHeader a{
flex-basis:15%;
}
#gridHeader h3{
flex:1
}
#gridHeader *{
display:flex;
justify-content:center;
align-items:center;
height:100%;
}
#gridBody{
}
#alert{
color:#eee;
background-color:#333;
flex-direction:column;
border:solid 5px;
display:none;
position:absolute;
width:30%;
height:30%;
top:0;right:0;left:0;bottom:0;
margin:auto;
z-index:1300;
}
.mobile #alert{
height:33%;
width:95%;
}
#alertHeading{
color:#eee;
display:flex;
flex-basis:20%;
font-size:1.5em;
align-items:center;
text-align:center;
justify-content:center;
background-color:#666;
border-bottom:solid 3px;
}
#alertMessage{
display:flex;
flex-basis:60%;
justify-content:center;
text-align:center;
align-items:center;
font-size:1.2em;
}
#alertButtons{
flex-basis:20%;
width:100%;
display:flex;
justify-content:center;
}
#alertButtons a{
display:flex;
align-items:center;
justify-content:center;
text-align:center;
flex:1;
height:100%;
}