This is an automated email from the ASF dual-hosted git repository. yasith pushed a commit to branch merge-portals in repository https://gitbox.apache.org/repos/asf/airavata-portals.git
commit b89a6b6c7e54d09f007af3481b4e9bf75873ceac Author: Aarushi Bisht <[email protected]> AuthorDate: Sat Apr 25 23:20:32 2020 -0400 added grid view buttons --- .../js/containers/Storage.vue | 35 ++++++++++++++++++---- airavata_mft/apps/workspace/vue.config.js | 4 +-- airavata_mft/static/common/vue.config.js | 2 +- airavata_mft/templates/base.html | 3 +- 4 files changed, 35 insertions(+), 9 deletions(-) diff --git a/airavata_mft/apps/workspace/static/airavata_mft_workspace/js/containers/Storage.vue b/airavata_mft/apps/workspace/static/airavata_mft_workspace/js/containers/Storage.vue index f893fb6e5..3c9215c63 100644 --- a/airavata_mft/apps/workspace/static/airavata_mft_workspace/js/containers/Storage.vue +++ b/airavata_mft/apps/workspace/static/airavata_mft_workspace/js/containers/Storage.vue @@ -1,10 +1,29 @@ <template> <div class="row"> - <div class="col-8"> + <div class="col-7"> <h1 class="h4 mb-4">{{heading}}</h1> </div> - <!-- Add buttons here --> + <div class="col-4"> + <div class="btn-toolbar"> + <div class="btn-group mr-4" role="group"> + <div class="dropdown"> + <button class="btn btn-sm btn-outline-secondary dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Sort by</button> + <div class="dropdown-menu" aria-labelledby="dropdownMenuButton"> + <a class="dropdown-item" href="#">Name</a> + <a class="dropdown-item" href="#">Size</a> + </div> + </div> + </div> + <div class="btn-group mr-4" role="group"> + <button class="btn btn-sm btn-outline-secondary list"><i class="fa fa-bars"></i></button> + <button class="btn btn-sm btn-outline-secondary list"><i class="fa fa-th"></i></button> + </div> + <div class="btn-group mr-4 new-unit" role="group"> + <button class="btn btn-info btn-sm"><i class="fa fa-plus plus-icon"></i>Add new unit</button> + </div> + </div> + </div> <!-- Dialog box to show description of each storage unit --> <b-modal class="modal-dialog modal-dialog-centered" :title="selectedStorage.name" id="description-dialog" hide-footer> <div class="container"> @@ -76,7 +95,13 @@ export default { </script> <style> -.description{ - width: 70%; -} + .new-unit{ + width: 140px; + } + .plus-icon{ + padding-right: 15px; + } + .list{ + width: 40px; + } </style> \ No newline at end of file diff --git a/airavata_mft/apps/workspace/vue.config.js b/airavata_mft/apps/workspace/vue.config.js index c16bafc39..eafceb781 100644 --- a/airavata_mft/apps/workspace/vue.config.js +++ b/airavata_mft/apps/workspace/vue.config.js @@ -4,7 +4,7 @@ const path = require("path"); module.exports = { publicPath: process.env.NODE_ENV === "development" - ? "http://localhost:9000/static/airavata_mft_workspace/dist/"; + ? "http://localhost:9001/static/airavata_mft_workspace/dist/"; : "/static/airavata_mft_workspace/dist/", outputDir: "./static/airavata_mft_workspace/dist", productionSourceMap: false, @@ -36,7 +36,7 @@ module.exports = { }); }, devServer: { - port: 9000, + port: 9001, headers: { "Access-Control-Allow-Origin": "*" }, diff --git a/airavata_mft/static/common/vue.config.js b/airavata_mft/static/common/vue.config.js index 1792bd287..7cb5504be 100644 --- a/airavata_mft/static/common/vue.config.js +++ b/airavata_mft/static/common/vue.config.js @@ -4,7 +4,7 @@ module.exports = { publicPath: "/static/common/dist/", productionSourceMap: false, pages: { - app: "./js/main.js", + app: "./js/main.js" }, configureWebpack: { plugins: [ diff --git a/airavata_mft/templates/base.html b/airavata_mft/templates/base.html index 3c4921f01..09b60fbd0 100644 --- a/airavata_mft/templates/base.html +++ b/airavata_mft/templates/base.html @@ -1,3 +1,4 @@ +{% load static %} {% load render_bundle from webpack_loader %} <!DOCTYPE html> <head> @@ -15,7 +16,7 @@ <a class="navbar-brand" href="#"> <div class="row"> <div class="col-5"> - <img class="logo" src="/static/images/airavata-logo.png"> + <img class="logo" src="{% static 'images/airavata-logo.png' %}"> </div> <div> <div class="col-8">
