commit/galaxy-central: guerler: Shift galaxy.upload.css to less format, update modal window according to new bootstrap version
1 new commit in galaxy-central: https://bitbucket.org/galaxy/galaxy-central/commits/b65602624e25/ Changeset: b65602624e25 User: guerler Date: 2013-09-14 17:38:27 Summary: Shift galaxy.upload.css to less format, update modal window according to new bootstrap version Affected #: 6 files diff -r a598d4d47dce07864f5211f9c8f7847ab39bce75 -r b65602624e257d96d90fe94de13b483fd70d2f7e static/scripts/galaxy.modal.js --- a/static/scripts/galaxy.modal.js +++ b/static/scripts/galaxy.modal.js @@ -68,7 +68,7 @@ $(this.el_main).append($(this.el)); // link elements - var footer = (this.$el).find('.footer'); + var footer = (this.$el).find('.buttons'); // append buttons var self = this; @@ -91,15 +91,17 @@ // fill regular modal template template: function(title, body) { - return '<div class="modal">' + - '<div class="modal-backdrop"></div>' + - '<div class="modal-dialog galaxy-corner">' + + return '<div class="modal in">' + + '<div class="modal-backdrop in" style="z-index: -1;"></div>' + + '<div class="modal-dialog">' + '<div class="modal-content">' + - '<div class="header">' + + '<div class="modal-header">' + '<span><h3 class="title">' + title + '</h3></span>' + '</div>' + - '<div class="body">' + body + '</div>' + - '<div class="footer"></div>' + + '<div class="modal-body style="min-width: 540px; max-height: 445px;">' + body + '</div>' + + '<div class="modal-footer">' + + '<div class="buttons" style="float: right;"></div>' + + '</div>' + '</div' + '</div>' + '</div>'; diff -r a598d4d47dce07864f5211f9c8f7847ab39bce75 -r b65602624e257d96d90fe94de13b483fd70d2f7e static/scripts/galaxy.upload.js --- a/static/scripts/galaxy.upload.js +++ b/static/scripts/galaxy.upload.js @@ -3,7 +3,7 @@ */ // dependencies -define(["utils/galaxy.css", "galaxy.modal", "galaxy.master", "utils/galaxy.uploadbox", "libs/backbone/backbone-relational"], function(css, mod_modal, mod_master) { +define(["galaxy.modal", "galaxy.master", "utils/galaxy.uploadbox", "libs/backbone/backbone-relational"], function(mod_modal, mod_master) { // galaxy upload var GalaxyUpload = Backbone.View.extend( @@ -20,9 +20,6 @@ // initialize initialize : function() { - // load required css files - css.load_file("static/style/galaxy.upload.css"); - // add activate icon var self = this; this.button_show = new mod_master.GalaxyMasterIcon ( @@ -47,13 +44,13 @@ // mouse over event_mouseover : function (e) { - $('#galaxy-upload-box').addClass('galaxy-upload-highlight'); + $('#galaxy-upload-box').addClass('highlight'); }, // mouse left event_mouseleave : function (e) { - $('#galaxy-upload-box').removeClass('galaxy-upload-highlight'); + $('#galaxy-upload-box').removeClass('highlight'); }, // start @@ -110,7 +107,7 @@ var el = $('#galaxy-upload-file-' + index); // update progress frame - el.find('.progress-frame').addClass("failed"); + el.find('.progress-frame').addClass('failed'); // update error message el.find('.error').html("<strong>Failed:</strong> " + message); @@ -141,10 +138,14 @@ if (!this.modal) { // make modal + var self = this; this.modal = new mod_modal.GalaxyModal( { title : 'Upload files from your local drive', - body : this.template() + body : this.template(), + buttons : { + 'Close' : function() {self.modal.hide()} + } }); // get current history @@ -198,16 +199,16 @@ // load html template template: function() { - return '<form id="galaxy-upload-box" class="galaxy-upload-box galaxy-corner"></form>'; + return '<form id="galaxy-upload-box" class="galaxy-upload-box"></form>'; }, // load html template template_file: function(id) { - return '<div id="' + id.substr(1) + '" class="galaxy-upload-file galaxy-corner-soft galaxy-shadow">' + + return '<div id="' + id.substr(1) + '" class="file corner-soft shadow">' + '<div class="title"></div>' + '<div class="error"></div>' + - '<div class="progress-frame galaxy-corner-soft">' + + '<div class="progress-frame corner-soft">' + '<div class="progress"></div>' + '</div>' + '<div class="info"></div>' + diff -r a598d4d47dce07864f5211f9c8f7847ab39bce75 -r b65602624e257d96d90fe94de13b483fd70d2f7e static/style/blue/base.css --- a/static/style/blue/base.css +++ b/static/style/blue/base.css @@ -1124,6 +1124,15 @@ .galaxy-frame .frame .f-close{right:5px;top:1px} .galaxy-frame .frame .f-pin{left:6px;top:1px} .galaxy-frame .frame .f-resize{background:#fff;width:16px;height:16px;color:#2c3143;right:0px;bottom:0px;text-align:center;line-height:16px;border:0px} +.galaxy-upload-box{width:100%;height:200px;max-height:200px;padding:10px 0px 0px 0px;text-align:center;cursor:pointer;overflow:scroll;font-size:12px;line-height:1.428571429;-moz-border-radius:5px;border-radius:5px;border:1px dashed #bfbfbf}.galaxy-upload-box .corner-soft{-moz-border-radius:3px;border-radius:3px} +.galaxy-upload-box .shadow{-webkit-box-shadow:0 0 2px rgba(0,0,0,0.3)} +.galaxy-upload-box .highlight{border:1px dashed #333} +.galaxy-upload-box .file{position:relative;margin:5px 20px 5px 20px;border:1px solid #bfbfbf;color:#333}.galaxy-upload-box .file .title{margin:3px 130px 0px 5px;text-align:left;overflow:hidden;border:0px} +.galaxy-upload-box .file .progress-frame{border:0px;margin:0px 5px 3px 5px;height:7px;background:#bfbfbf} +.galaxy-upload-box .file .progress{background:#5cb85c;height:100%;width:0%} +.galaxy-upload-box .file .failed{background:#d9534f} +.galaxy-upload-box .file .error{font-size:11px;text-align:left;overflow:hidden;margin:0px 5px 0px 5px} +.galaxy-upload-box .file .info{position:absolute;top:4px;right:5px;font-size:11px;text-align:right;overflow:hidden;max-width:100px;max-height:12px} .unselectable{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none} .parent-width{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;width:100%;*width:90%} .clear:before,.clear:after{content:" ";display:table;} @@ -1162,7 +1171,7 @@ .panel-warning-message{background-image:url(warn_small.png);background-color:#fce1ba} .panel-done-message{background-image:url(ok_small.png);background-color:#aff1af} .panel-info-message{background-image:url(info_small.png);background-color:#a6e4f7} -#masthead{position:absolute;top:0;left:0;width:100%;min-width:920px;padding:0}#masthead .nav{z-index:15001} +#masthead{position:absolute;top:0;left:0;width:100%;min-width:980px;padding:0}#masthead .nav{z-index:15001} #masthead .nav>li>a{cursor:pointer;text-decoration:none}#masthead .nav>li>a:hover{color:gold} #masthead li.dropdown>a:hover .caret{border-top-color:gold;border-bottom-color:gold} #masthead .navbar-brand{position:absolute;left:0;top:0;font-family:verdana;font-weight:bold;font-size:20px;line-height:1;color:white;padding:5px 20px 12px;margin-left:-15px;z-index:2000}#masthead .navbar-brand img{display:inline;width:26px;vertical-align:top} diff -r a598d4d47dce07864f5211f9c8f7847ab39bce75 -r b65602624e257d96d90fe94de13b483fd70d2f7e static/style/blue/galaxy.upload.css --- a/static/style/blue/galaxy.upload.css +++ /dev/null @@ -1,97 +0,0 @@ -/* - upload box -*/ - -.galaxy-upload-button -{ - z-index : 34010; - position : absolute; - top : 8px; - right : 210px; - cursor : pointer; - color : #D0D0D0; -} - -.galaxy-upload-box -{ - margin : -5px; - width : 100%; - height : 200px; - max-height : 200px; - border : 1px dashed #D0D0D0; - font-weight : bold; - line-height : 16px; - color : #5C5858; - padding : 10px 0px 0px 0px; - text-align : center; - font-size : 12px; - cursor : pointer; - overflow : scroll; -} - -.galaxy-upload-highlight -{ - border : 1px dashed #5C5858; - color : #5C5858; -} - -.galaxy-upload-file -{ - position : relative; - margin : 5px 20px 5px 20px; - border : 1px solid #D0D0D0; -} - -.galaxy-upload-file .title -{ - font-weight : normal; - font-size : 12px; - color : #5C5858; - margin : 3px 130px 0px 5px; - text-align : left; - overflow : hidden; -} - -.galaxy-upload-file .progress-frame -{ - border : 0px; - margin : 0px 5px 3px 5px; - height : 7px; - background : #D0D0D0; -} - -.galaxy-upload-file .progress -{ - background : #CCFFCC; - height : 100%; - width : 0%; -} - -.galaxy-upload-file .failed -{ - background : #FFCCCC; -} - -.galaxy-upload-file .error -{ - font-weight : normal; - font-size : 10px; - color : #5C5858; - text-align : left; - overflow : hidden; - margin : 0px 5px 0px 5px; -} - -.galaxy-upload-file .info -{ - position : absolute; - top : 4px; - right : 5px; - font-weight : normal; - font-size : 10px; - color : #5C5858; - text-align : right; - overflow : hidden; - max-width : 100px; - max-height : 12px; -} \ No newline at end of file diff -r a598d4d47dce07864f5211f9c8f7847ab39bce75 -r b65602624e257d96d90fe94de13b483fd70d2f7e static/style/src/less/base.less --- a/static/style/src/less/base.less +++ b/static/style/src/less/base.less @@ -18,6 +18,9 @@ // load galaxy frame styles @import "frame.less"; +// load galaxy upload styles +@import "upload.less"; + // Mixins .unselectable { @@ -321,7 +324,7 @@ top:0; left:0; width:100%; - min-width:920px; + min-width:980px; padding: 0; .nav { diff -r a598d4d47dce07864f5211f9c8f7847ab39bce75 -r b65602624e257d96d90fe94de13b483fd70d2f7e static/style/src/less/upload.less --- /dev/null +++ b/static/style/src/less/upload.less @@ -0,0 +1,87 @@ +.galaxy-upload-box +{ + width : 100%; + height : 200px; + max-height : 200px; + padding : 10px 0px 0px 0px; + text-align : center; + cursor : pointer; + overflow : scroll; + font-size : @font-size-base; + line-height : @line-height-base; + -moz-border-radius: @border-radius-large; + border-radius: @border-radius-large; + border : 1px dashed @btn-default-border; + + .corner-soft + { + -moz-border-radius: @border-radius-base; + border-radius: @border-radius-base; + } + + .shadow + { + -webkit-box-shadow: 0 0 2px rgba(0,0,0,0.3); + } + + .highlight + { + border : 1px dashed @btn-default-color; + } + + .file + { + position : relative; + margin : 5px 20px 5px 20px; + border : 1px solid @btn-default-border; + color : @btn-default-color; + + .title + { + margin : 3px 130px 0px 5px; + text-align : left; + overflow : hidden; + border : 0px; + } + + .progress-frame + { + border : 0px; + margin : 0px 5px 3px 5px; + height : 7px; + background : @btn-default-border; + } + + .progress + { + background : @bs-success; + height : 100%; + width : 0%; + } + + .failed + { + background : @bs-danger; + } + + .error + { + font-size : @font-size-small; + text-align : left; + overflow : hidden; + margin : 0px 5px 0px 5px; + } + + .info + { + position : absolute; + top : 4px; + right : 5px; + font-size : @font-size-small; + text-align : right; + overflow : hidden; + max-width : 100px; + max-height : 12px; + } + } +} \ No newline at end of file Repository URL: https://bitbucket.org/galaxy/galaxy-central/ -- This is a commit notification from bitbucket.org. You are receiving this because you have the service enabled, addressing the recipient of this email.
participants (1)
-
commits-noreply@bitbucket.org