height: 100%;
}
-html {
- width: 100%;
- height: 100%;
-}
-
@media(min-width:992px) {
.navbar {
-webkit-transition: background .5s ease-in-out,padding .5s ease-in-out;
}
}
-.panel {
- margin-bottom: 5px;
-}
/* Modal Dialog */
.modal-dialog {
display: inline-block;
- text-align: left;
+ text-align: center;
vertical-align: middle;
}
font-size: 16px;
}
+
+/* Package Page */
#tic-package-section {
+ height: 100%;
padding-top: 70px;
background: #e1e1e1;
}
-
-/* Package Page */
#tic-package-left-col-tree-toolbar, #tic-package-left-col-tree {
padding-top: 10px;
}
#tic-package-left-col-tree {
- height: 30vh;
- position: relative;
+ height: calc(100vh - 200px);
overflow: auto;
}
-@media (min-width: 768px) {
- #tic-package-left-col-tree {
- height: 80vh;
- position: relative;
- overflow: auto;
- }
-}
#tic-package-left-col-tree .list-group-item {
padding: 3px 10px;
/* Package Toolbar filter-clear button */
::-ms-clear {
- display: none;
+ display: none;
}
.form-control-clear {
- z-index: 10;
- pointer-events: auto;
- cursor: pointer;
-}
-
-
-/* TODO: Height of Treeview, Package Information and Summary grid in Package Page */
-#tic-package-info-table {
- height: 15vh;
- display: inline-block;
- position: relative;
- overflow: auto;
-}
-@media (min-width: 992px) {
- #tic-package-info-table {
- height: 43vh;
- display: inline-block;
- position: relative;
- overflow: auto;
- }
+ z-index: 10;
+ pointer-events: auto;
+ cursor: pointer;
}
-#tic-package-summary {
- height: 10vh;
+#tic-package-info-table, #tic-package-summary {
+ height: calc(50vh - 183px);
display: inline-block;
- position: relative;
overflow: auto;
}
-@media (min-width: 992px) {
- #tic-package-summary {
- height: 20vh;
- display: inline-block;
- position: relative;
- overflow: auto;
- }
-}
/* Image Page */
#tic-image-section {
padding-top: 70px;
background: #e1e1e1;
}
-#tic-image-summary {
- height: 40vh;
+
+#tic-image-summary, #tic-image-new-container {
+ height: calc(50vh - 183px);
display: inline-block;
- position: relative;
overflow: auto;
}
+
#tic-image-list {
- margin-top: 3px;
+ height: calc(100vh - 210px);
+ display: inline-block;
+ overflow: auto;
}
+
+/* Image List Item */
.image-list-name {
font-weight: bold;
text-overflow: ellipsis;
font-size: 14px;
}
-.infoboxheader {
- padding-left: 15px;
- border: 1px solid #eee;
- border-left-width: 5px;
- border-radius: 3px;
- margin-top: -5px;
- height: 5vh;
- overflow: hidden;
- text-overflow: ellipsis;
- border-left-color: #337ab7;
- vertical-align: middle;
-}
-.infoboxheader h4 {
- color: #1b809e;
-}
-
-@media (min-width: 992px) {
- #tic-image-summary {
- height: 70vh;
- display: inline-block;
- position: relative;
- overflow: auto;
- }
-}
-
/* Settings Page */
#tic-settings-section {
</tbody>
</table>
</div>
+ </div>
+
+ <div class="panel panel-primary">
+ <div class="panel-heading">Create Image</div>
+ <div class="panel-body">
+ <div id="tic-image-new-container">
+ <div class="infobox info" id="tic-image-new">
+ <div id="tic-image-new-log"></div>
+ </div>
+ </div>
+ </div>
<div class="panel-footer">
<button type="button" id="tic-image-create" class="btn btn-primary">Create Image</button>
</div>
<div class="panel-heading">Image List</div>
<div class="panel-body">
<ul class="list-group" id="tic-image-list"></ul>
- <!-- Create an image -->
- <div id="tic-image-new-container">
- <div class="infoboxheader">
- <h4>Create an image</h4>
- </div>
- <div class="infobox info" id="tic-image-new">
- <div id="tic-image-new-log"></div>
- </div>
- </div>
</div>
</div>
</div><!-- /End Image List Column -->
<!-- library loading -->
<script src="/socket.io/socket.io.js"></script>
- <script src="/lib/bootstrap/js/bootstrap.js"></script>
- <script src="/lib/bootstrap-treeview/bootstrap-treeview.min.js"></script>
<script src="/lib/jquery/jquery.js"></script>
<script src="/lib/jquery-sortable/jquery-sortable.js"></script>
+ <script src="/lib/bootstrap/js/bootstrap.js"></script>
+ <script src="/lib/bootstrap-treeview/bootstrap-treeview.min.js"></script>
<script src="/lib/lodash/lodash.js"></script>
<script src="/js/config.js"></script>
<script src="/lib/requirejs/require.js" data-main="js/main"></script>
$('#tic-package-toolbar-input-clear').on('click', _inputClearBtnHandler);
function _checkAllBtnHandler() {
- $tree.treeview('checkAll', { silent: true });
+ $tree.treeview('checkAll', { silent: true });
_.forEach(packages, function(node) {
node.state.checked = true;
node.selfChecked = false;
$('#tic-package-toolbar-checkall').on('click', _checkAllBtnHandler);
function _uncheckAllBtnHandler() {
- $tree.treeview('uncheckAll', { silent: true });
+ // FIXME: bug for state.checked = false in treeview objects
+ $tree.treeview('checkAll', { silent: true });
+ $tree.treeview('uncheckAll', { silent: true });
_.forEach(packages, function(node) {
node.state.checked = false;
node.selfChecked = false;
}
$('#tic-package-left-col-tree-toolbar-expand-all').on('click', _expandAll);
+ // Patch: Bootstrap dropdown menu not working (not dropping down when clicked)
+ $('.dropdown-toggle').dropdown();
}
init();