DebaucheryLibrarian/traxxx
2
1
Fork 1
Code Issues 39 Pull Requests 1 Releases Wiki Activity

Added expand/collapse to compact network sites.

Browse Source
This commit is contained in:
ThePendulum
2020-01-09 02:40:02 +01:00
parent 2f4a227437
commit 419e098282
27 changed files with 238 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

61
public/css/style.css
View File

@@ -665,7 +665,7 @@
margin: 0 1rem 0 0;
}
.sites.expanded .tiles[data-v-7bebaa3e] {
grid-template-columns: repeat(2, 0.5fr);
grid-template-columns: repeat(auto-fit, minmax(15rem, 0.5fr));
}
.tiles[data-v-7bebaa3e] {
display: grid;
@@ -677,9 +677,6 @@
grid-template-columns: 1fr;
overflow-y: auto;
}
.logo[data-v-7bebaa3e] {
width: 15rem;
}
/* $primary: #ff886c; */
/* $logo-highlight: drop-shadow(1px 0 0 $highlight-weak) drop-shadow(-1px 0 0 $highlight-weak) drop-shadow(0 1px 0 $highlight-weak) drop-shadow(0 -1px 0 $highlight-weak); */
@@ -755,21 +752,52 @@
height: 100%;
padding: .5rem;
}
.expand[data-v-e2e12602] {
display: -webkit-box;
display: flex;
-webkit-box-pack: center;
justify-content: center;
-webkit-box-align: center;
align-items: center;
padding: .5rem 0 0 0;
font-weight: bold;
font-size: .9rem;
cursor: pointer;
}
.expand .icon[data-v-e2e12602] {
margin: 0 .5rem;
}
.expand-sites[data-v-e2e12602] {
color: rgba(0, 0, 0, 0.5);
display: none;
}
.expand-sites .icon[data-v-e2e12602] {
fill: rgba(0, 0, 0, 0.5);
}
.expand-sites[data-v-e2e12602]:hover {
color: rgba(0, 0, 0, 0.7);
}
.expand-sites:hover .icon[data-v-e2e12602] {
fill: rgba(0, 0, 0, 0.7);
}
.collapse-sites[data-v-e2e12602] {
background: #222;
color: rgba(255, 255, 255, 0.5);
}
.collapse-sites .icon[data-v-e2e12602] {
fill: rgba(255, 255, 255, 0.5);
}
.collapse-sites[data-v-e2e12602]:hover {
color: #fff;
}
.collapse-sites:hover .icon[data-v-e2e12602] {
fill: #fff;
}
.sites.compact[data-v-e2e12602] {
display: none;
background: #222;
grid-row: 1;
}
.expand[data-v-e2e12602] {
display: none;
color: #fff;
background: #222;
padding: .5rem;
text-align: center;
cursor: pointer;
font-size: .9rem;
font-weight: bold;
}
@media (max-width: 1200px) {
.header[data-v-e2e12602],
.header.hideable[data-v-e2e12602] {
@@ -783,8 +811,9 @@
.sites.compact.expanded[data-v-e2e12602] {
display: grid;
}
.expand[data-v-e2e12602] {
display: block;
.expand-sites[data-v-e2e12602] {
display: -webkit-box;
display: flex;
}
.network[data-v-e2e12602] {
-webkit-box-orient: vertical;