mirror of
https://github.com/simon987/sist2.git
synced 2025-04-19 10:16:42 +00:00
Configurable column count
This commit is contained in:
parent
61de9e9f14
commit
db2285973f
@ -121,7 +121,7 @@ body {
|
|||||||
background: #546b7a;
|
background: #546b7a;
|
||||||
}
|
}
|
||||||
|
|
||||||
a:hover,.btn:hover {
|
a:hover, .btn:hover {
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -130,7 +130,11 @@ a:hover,.btn:hover {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.document {
|
.document {
|
||||||
padding: 0.5rem;
|
padding: 0.3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-text:last-child {
|
||||||
|
margin-top: -1px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.document p {
|
.document p {
|
||||||
@ -203,7 +207,7 @@ a:hover,.btn:hover {
|
|||||||
margin-top: -1px;
|
margin-top: -1px;
|
||||||
font-family: monospace;
|
font-family: monospace;
|
||||||
font-size: 90%;
|
font-size: 90%;
|
||||||
background: rgba(0,0,0,0.2);
|
background: rgba(0, 0, 0, 0.2);
|
||||||
padding: 0.1em 0.4em;
|
padding: 0.1em 0.4em;
|
||||||
color: white;
|
color: white;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
@ -241,20 +245,6 @@ a:hover,.btn:hover {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media screen and (min-width: 1500px) {
|
|
||||||
.container {
|
|
||||||
max-width: 1440px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.bricklayer-column-sizer {
|
|
||||||
width: 20% !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.bricklayer-column {
|
|
||||||
max-width: 20%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media screen and (min-width: 1800px) {
|
@media screen and (min-width: 1800px) {
|
||||||
.container {
|
.container {
|
||||||
max-width: 1550px;
|
max-width: 1550px;
|
||||||
@ -451,6 +441,7 @@ option {
|
|||||||
.small-btn {
|
.small-btn {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.large-btn {
|
.large-btn {
|
||||||
display: inherit;
|
display: inherit;
|
||||||
}
|
}
|
||||||
@ -460,6 +451,7 @@ option {
|
|||||||
.small-btn {
|
.small-btn {
|
||||||
display: inherit;
|
display: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
.large-btn {
|
.large-btn {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
@ -70,7 +70,11 @@ body {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.document {
|
.document {
|
||||||
padding: 0.5rem;
|
padding: 0.3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card-text:last-child {
|
||||||
|
margin-top: -1px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.document p {
|
.document p {
|
||||||
@ -181,6 +185,10 @@ body {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.bricklayer {
|
||||||
|
/*max-width: 100%;*/
|
||||||
|
}
|
||||||
|
|
||||||
@media screen and (max-width: 1200px) {
|
@media screen and (max-width: 1200px) {
|
||||||
.bricklayer-column {
|
.bricklayer-column {
|
||||||
max-width: 100%;
|
max-width: 100%;
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
const SIZE = 40;
|
const SIZE = 60;
|
||||||
let mimeMap = [];
|
let mimeMap = [];
|
||||||
let tagMap = [];
|
let tagMap = [];
|
||||||
let mimeTree;
|
let mimeTree;
|
||||||
|
@ -101,7 +101,8 @@ const _defaults = {
|
|||||||
treemapColor: "PuBuGn",
|
treemapColor: "PuBuGn",
|
||||||
treemapSize: "large",
|
treemapSize: "large",
|
||||||
suggestPath: true,
|
suggestPath: true,
|
||||||
fragmentSize: 100
|
fragmentSize: 100,
|
||||||
|
columns: 5
|
||||||
};
|
};
|
||||||
|
|
||||||
function loadSettings() {
|
function loadSettings() {
|
||||||
@ -118,6 +119,7 @@ function loadSettings() {
|
|||||||
$("#settingTreemapType").val(CONF.options.treemapType);
|
$("#settingTreemapType").val(CONF.options.treemapType);
|
||||||
$("#settingSuggestPath").prop("checked", CONF.options.suggestPath);
|
$("#settingSuggestPath").prop("checked", CONF.options.suggestPath);
|
||||||
$("#settingFragmentSize").val(CONF.options.fragmentSize);
|
$("#settingFragmentSize").val(CONF.options.fragmentSize);
|
||||||
|
$("#settingColumns").val(CONF.options.columns);
|
||||||
}
|
}
|
||||||
|
|
||||||
function Settings() {
|
function Settings() {
|
||||||
@ -125,6 +127,7 @@ function Settings() {
|
|||||||
|
|
||||||
this._onUpdate = function () {
|
this._onUpdate = function () {
|
||||||
$("#fuzzyToggle").prop("checked", this.options.fuzzy);
|
$("#fuzzyToggle").prop("checked", this.options.fuzzy);
|
||||||
|
updateColumnStyle();
|
||||||
};
|
};
|
||||||
|
|
||||||
this.load = function () {
|
this.load = function () {
|
||||||
@ -161,6 +164,7 @@ function updateSettings() {
|
|||||||
CONF.options.treemapType = $("#settingTreemapType").val();
|
CONF.options.treemapType = $("#settingTreemapType").val();
|
||||||
CONF.options.suggestPath = $("#settingSuggestPath").prop("checked");
|
CONF.options.suggestPath = $("#settingSuggestPath").prop("checked");
|
||||||
CONF.options.fragmentSize = $("#settingFragmentSize").val();
|
CONF.options.fragmentSize = $("#settingFragmentSize").val();
|
||||||
|
CONF.options.columns = $("#settingColumns").val();
|
||||||
CONF.save();
|
CONF.save();
|
||||||
|
|
||||||
if (typeof searchDebounced !== "undefined") {
|
if (typeof searchDebounced !== "undefined") {
|
||||||
@ -203,3 +207,26 @@ function toggleTheme() {
|
|||||||
}
|
}
|
||||||
window.location.reload();
|
window.location.reload();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function updateColumnStyle() {
|
||||||
|
const style = document.getElementById("style");
|
||||||
|
if (style) {
|
||||||
|
style.innerHTML =
|
||||||
|
`
|
||||||
|
@media screen and (min-width: 1500px) {
|
||||||
|
.container {
|
||||||
|
max-width: 1440px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bricklayer-column-sizer {
|
||||||
|
width: ${100 / CONF.options.columns}% !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bricklayer-column {
|
||||||
|
max-width: ${100 / CONF.options.columns}%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
`
|
||||||
|
}
|
||||||
|
}
|
@ -6,6 +6,7 @@
|
|||||||
<meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no'/>
|
<meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no'/>
|
||||||
|
|
||||||
<link href="css" rel="stylesheet" type="text/css">
|
<link href="css" rel="stylesheet" type="text/css">
|
||||||
|
<style id="style"></style>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
@ -216,6 +217,20 @@
|
|||||||
<option value="list">List</option>
|
<option value="list">List</option>
|
||||||
</select>
|
</select>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="settingColumns">Maximum column count</label>
|
||||||
|
<select id="settingColumns" class="form-control form-control-sm">
|
||||||
|
<option value="3">3</option>
|
||||||
|
<option value="4">4</option>
|
||||||
|
<option value="5">5</option>
|
||||||
|
<option value="6">6</option>
|
||||||
|
<option value="7">7</option>
|
||||||
|
<option value="8">8</option>
|
||||||
|
<option value="9">9</option>
|
||||||
|
<option value="13">13</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
|
||||||
<hr/>
|
<hr/>
|
||||||
<h4>Stats</h4>
|
<h4>Stats</h4>
|
||||||
|
|
||||||
|
@ -94,6 +94,19 @@
|
|||||||
<option value="list">List</option>
|
<option value="list">List</option>
|
||||||
</select>
|
</select>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="settingColumns">Maximum column count</label>
|
||||||
|
<select id="settingColumns" class="form-control form-control-sm">
|
||||||
|
<option value="3">3</option>
|
||||||
|
<option value="4">4</option>
|
||||||
|
<option value="5">5</option>
|
||||||
|
<option value="6">6</option>
|
||||||
|
<option value="7">7</option>
|
||||||
|
<option value="8">8</option>
|
||||||
|
<option value="9">9</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
|
||||||
<hr/>
|
<hr/>
|
||||||
<h4>Stats</h4>
|
<h4>Stats</h4>
|
||||||
|
|
||||||
|
File diff suppressed because one or more lines are too long
Loading…
x
Reference in New Issue
Block a user