[simple theme] update to ion icons 5 and drop webfont

* update from ionicons-npm to ionicons ver.5
* drop the webfont built by grunt for icons
* built icons.html template for inlining icons with jinja2 into html
* update icon to use mostly the outline version
* add icons to categories and do not display them on mobile to save space
* remove all legacy ion icon font files from simple theme
* icons.html is added in this commit since make statc.build.restore requires git to know the file already
* cleanup error-dialog
This commit is contained in:
MrPaulBlack 2021-11-13 10:42:07 +01:00
parent 8877512e20
commit 566dfe3330
27 changed files with 260 additions and 868 deletions

View file

@ -16,6 +16,40 @@
"spacer categories";
}
.category {
display: inline-block;
position: relative;
margin-right: 1rem;
padding: 0;
input {
display: none;
}
label {
svg {
padding-right: 0.2rem;
}
cursor: pointer;
padding: 0.2rem 0;
display: inline-flex;
text-transform: capitalize;
font-size: 0.9em;
border-bottom: 2px solid transparent;
.disable-user-select;
div.category_name {
margin: auto 0;
}
}
input[type="checkbox"]:checked + label {
color: var(--color-categories-item-selected-font);
border-bottom: 2px solid var(--color-categories-item-border-selected);
}
}
#search_logo {
grid-area: logo;
display: flex;
@ -79,7 +113,7 @@
border-collapse: separate;
box-sizing: border-box;
margin: 0;
padding: 8px;
padding: 10px;
background: none repeat scroll 0 0 var(--color-search-background);
border: 1px solid var(--color-search-border);
border-radius: 0;
@ -156,7 +190,6 @@
#categories {
width: 100%;
margin: 0;
text-align: left;
overflow-x: scroll;
overflow-y: hidden;
@ -188,7 +221,7 @@
}
.search_box {
// hack, should bew 100% ?
// hack, should be 100% ?
width: 99%;
margin: 0.1em;
padding: 0 0.1em 0 0;
@ -219,9 +252,15 @@
.category {
display: block;
width: 100%;
margin: 0;
label {
padding: 10px !important;
padding: 0.8rem !important;
margin: 0 !important;
svg {
display: none;
}
}
}
}
@ -239,7 +278,6 @@
}
#categories {
margin: 0 10px 0 0;
.disable-user-select;
&::-webkit-scrollbar {
@ -248,33 +286,6 @@
}
}
.category {
display: inline-block;
position: relative;
margin: 0 3px;
padding: 0;
input {
display: none;
}
label {
cursor: pointer;
padding: 0.3rem 0.75rem 0.5rem 0.75rem;
margin: 0;
display: block;
text-transform: capitalize;
font-size: 0.9em;
border-bottom: 2px solid transparent;
.disable-user-select;
}
input[type="checkbox"]:checked + label {
color: var(--color-categories-item-selected-font);
border-bottom: 2px solid var(--color-categories-item-border-selected);
}
}
#categories_container {
position: relative;
}