diff --git a/client/src/components/History/Content/ContentItem.vue b/client/src/components/History/Content/ContentItem.vue index ea90128906d..9be30c3027c 100644 --- a/client/src/components/History/Content/ContentItem.vue +++ b/client/src/components/History/Content/ContentItem.vue @@ -128,10 +128,11 @@ export default { onDisplay() { const id = this.item.id; useGalaxy((Galaxy) => { + const url = `datasets/${id}/display/?preview=True`; if (Galaxy.frame && Galaxy.frame.active) { Galaxy.frame.add({ title: this.name, - url: `datasets/${id}/display/?preview=True`, + url: url, }); } else { iframeRedirect(url); diff --git a/client/src/style/scss/base.scss b/client/src/style/scss/base.scss index 6f25089e965..fe61dd9854b 100644 --- a/client/src/style/scss/base.scss +++ b/client/src/style/scss/base.scss @@ -24,7 +24,7 @@ $fa-font-path: "../../../node_modules/@fortawesome/fontawesome-free/webfonts/"; // galaxy sub-components @import "reports"; -@import "frame.scss"; +@import "windows.scss"; @import "upload.scss"; @import "ui.scss"; @import "library.scss"; diff --git a/client/src/style/scss/frame.scss b/client/src/style/scss/frame.scss deleted file mode 100644 index 33fedbc8312..00000000000 --- a/client/src/style/scss/frame.scss +++ /dev/null @@ -1,155 +0,0 @@ -$frame-zindex: 1000; -$frame-default-border: $border-color; - -.galaxy-frame { - .corner { - -moz-border-radius: $border-radius-large; - border-radius: $border-radius-large; - } - - .toggle { - color: $dropdown-link-active-color; - } - - .frame-background { - z-index: $frame-zindex; - position: absolute; - top: 0px; - left: 0px; - height: 100%; - width: 100%; - opacity: 0.5; - background: $brand-dark; - overflow: auto; - } - - .frame-shadow { - z-index: $frame-zindex + 1; - position: absolute; - display: none; - top: 0px; - left: 0px; - opacity: 0.5; - background: $brand-dark; - border: 1px solid $frame-default-border; - } - - /* - panel menu button - */ - .frame-menu { - z-index: $frame-zindex + 5; - position: absolute; - cursor: pointer; - color: $dropdown-link-active-color; - right: 10px; - } - - .frame-scroll-up { - top: 50px; - } - - .frame-scroll-down { - bottom: 20px; - } - - /* - frame components - */ - - .frame { - z-index: $frame-zindex + 2; - overflow: hidden; - position: absolute; - background: $white; - border: 1px solid $frame-default-border; - -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); - - .f-content { - position: absolute; - overflow: hidden; - background: $white; - border: none; - top: 24px; - bottom: 3px; - left: 3px; - right: 3px; - } - - .f-cover { - position: absolute; - display: none; - top: 0px; - left: 0px; - height: 100%; - width: 100%; - opacity: 0; - background: $white; - } - - .f-iframe { - border: none; - width: 100%; - height: 100%; - } - - .f-header { - height: 17px; - margin: 2px; - cursor: pointer; - border: 1px solid $black; - background: $brand-dark; - color: $white; - .f-icon-left { - cursor: pointer; - font-size: 15px; - margin-left: 3px; - float: left; - &[disabled] { - opacity: 0.25; - } - } - } - - .f-title { - position: absolute; - top: 2px; - left: 50px; - right: 50px; - font-size: 12px; - font-family: $font-family-sans-serif; - text-align: center; - } - - /* - frame icons - */ - - .f-not-allowed { - cursor: not-allowed; - } - - .f-close { - cursor: pointer; - position: absolute; - font-size: 15px; - right: 5px; - top: 2px; - } - - .f-resize { - cursor: pointer; - position: absolute; - font-size: 15px; - right: 0px; - bottom: 0px; - background: $white; - width: 16px; - height: 16px; - color: $brand-dark; - text-align: center; - line-height: 16px; - border: 0px; - } - } -} diff --git a/client/src/style/scss/windows.scss b/client/src/style/scss/windows.scss new file mode 100644 index 00000000000..e1708567c68 --- /dev/null +++ b/client/src/style/scss/windows.scss @@ -0,0 +1,26 @@ +.winbox { + border-radius: $border-radius-base; + @extend .m-1; + margin-top: 4rem; +} + +.winbox.min { + @extend .m-0; +} + +.wb-header { + border-radius: $border-radius-base; + background: $brand-info; +} + +.wb-icon * { + opacity: 0.65; +} + +.wb-icon *:hover { + opacity: 1; +} + +.wb-full { + display: none !important; +}