UI Improvements. Incluing result limiting

This commit is contained in:
Mike Young
2019-11-23 01:05:03 -05:00
parent 205e91a2ba
commit b7c2680e60
12 changed files with 107 additions and 24 deletions

View File

@@ -1,56 +1,113 @@
body{
margin: 0px 10px 0px 10px;
margin: 0px;
padding: 0px;
background-color: #DCDCDD;
color: #46494C
color: #fff;
overflow: hidden;
}
#app{
display: grid;
grid-template-areas: "app_header"
"app_body"
"app_footer";
grid-template-rows: 5vh 90vh 5vh;
max-height: 100%
grid-template-rows: auto 90vh 5vh;
max-height: 100%;
position: relative;
}
.clear{
clear: both;
}
.app_header{
grid-area: app_header;
margin: 0px;
display: grid;
grid-template-areas: "title slogan";
grid-template-areas: "title slogan subhdr";
align-items: center;
background-color: #2b2b2b;
padding: 0px;
}
.app_hdr{
grid-area: title;
margin: 0;
font-family: 'Audiowide', cursive;
font-size: 25px;
font-family: 'Gruppo', cursive;
font-size: 36px;
text-align: start;
padding: 0px 0px 0px 5px;
}
.shadow{
text-shadow: #4c5c68 -5px 3px 5px;
}
.app_subhdr{
grid-area: slogan;
grid-area: subhdr;
margin: 0;
font-family: 'Audiowide', cursive;
font-family: 'Gruppo', cursive;
font-size: 18px;
text-shadow: #4c5c68 -5px 3px 5px;
text-align: end;
}
.app_slogan{
grid-area: slogan;
margin: 0;
fontsize: 18px;
font-family: 'Gruppo', cursive;
text-align: center;
}
.app_body{
display: grid;
grid-area: app_body;
grid-template-rows: 5vh auto;
grid-template-rows: auto;
grid-template-areas: "nav_top"
"shelf";
justify-items: center;
overflow: scroll;
background-color: dimgray;
}
.app_footer{
grid-area: app_footer;
position: fixed;
bottom: 0px;
min-width: 100%;
background-color: #2b2b2b;
}
.nav_top{
grid-area: nav_top
grid-area: nav_top;
display: grid;
grid-template-areas: "left center right";
grid-template-rows: 1vw auto 1vw;
}
.navbar{
list-style-type: none;
display: inline-flex;
align-items: first baseline;
margin: 5px 0px;
}
.top{
}
.inline{
}
.inline_txt{
}
.button{
}
.nav_button{
background-color:darkgray;
border-radius: 5px;
border: 1px solid #999;
min-width: 110px;
margin: 0px 5px 0px 0px;
padding-top: 2px;
padding-bottom: 2px;
}
.nav_search{
margin: 0px 5px 0px 0px;
border-radius: 5px;
border: 1px solid #999;
}
.search{
}
.shelf{
grid-area: shelf;
@@ -80,6 +137,7 @@ body{
font-family: 'Audiowide', cursive;
font-size: 25px;
padding: 0;
margin: 0px;
}
.shelf_item{
background-color: burlywood;