@girder/core 5.0.0-beta.1 → 5.0.0-beta.2

package/dist-lib/src/stylesheets/layout/global.styl

@@ -0,0 +1,154 @@
+/**
+ * Place global styles in this file.
+ */
+
+body
+  // Override the default font from Bootstrap
+  font-family "Open Sans", sans-serif !important
+  padding 0
+  word-wrap break-word
+
+i
+  -webkit-font-smoothing antialiased
+
+a
+  cursor pointer
+  text-decoration none !important
+
+.g-clear-both
+  clear both
+
+.g-clear-right
+  clear right
+
+ul.dropdown-menu
+  >li.dropdown-header
+    padding 3px 20px 3px 8px
+    margin-bottom 3px
+    background-color #555
+    font-weight bold
+    color white
+  >li>a
+    padding 3px 20px 3px 8px
+
+    &:hover
+      background-color #eee
+    >i
+      margin-right 3px
+
+.panel-heading
+  padding 10px
+
+.panel-title
+  font-size 15px
+
+.g-body-title
+  font-size 20px
+  font-weight bold
+  color #555
+
+.g-body-subtitle
+  font-size 15px
+  color #888
+  margin-bottom 5px
+
+.g-dialog-subtitle
+  margin-top 5px
+  width 100%
+
+#g-confirm-text
+  max-width 50%
+
+.g-info-message-container
+  background-color #fffee1
+  color #777
+  padding 6px 8px
+  border 1px solid #e5e2c8
+
+// Augment the bootstrap tabs styling a bit
+.nav-tabs>li:not(.active)>a
+  border 1px solid #e2e2e2
+
+// Personal preference for less white space at bottom of dialogs
+.modal-footer
+  margin-top 5px
+
+.modal-content
+  border-radius 0
+  max-height calc(100vh - 60px)
+  overflow-y auto
+  margin 30px auto
+
+.modal-backdrop.in
+  opacity 0.35
+
+// By default bootstrap only applies form-inline rules at >=768px width
+.form-inline .form-group
+  display inline-block
+  margin-bottom 0
+  vertical-align middle
+
+blockquote p
+  font-size inherit
+
+code
+  font-family monospace
+
+// Don't show the vertical scroll bar when we show a dialog unless we must
+.modal
+  overflow-y auto
+
+.g-monospace-viewer
+  font-family monospace
+  border 1px solid #ccc
+  background-color #f5f5f5
+  border-radius 0
+  overflow-x scroll
+  padding 7px 11px
+  white-space pre
+  word-wrap initial
+  font-size 13px
+
+textarea
+  max-width 100%
+
+// Stuff that applies across the top level object lists
+.g-top-level-list-title-container
+  display inline-block
+  overflow hidden
+  white-space nowrap
+  width calc(100% - 350px)
+  position relative
+
+  .g-text-fade
+    height 30px
+    width 45px
+    position absolute
+    right 0
+    background linear-gradient(to right, rgba(250, 250, 252, 0), rgba(250, 250, 252, 1))
+
+    &[public="false"]
+      background linear-gradient(to right, rgba(255, 249, 234, 0), rgba(255, 249, 234, 1))
+
+.g-list-public-status-icon
+  display inline-block
+  line-height 40px
+  vertical-align top
+  color #888
+  margin-right 10px
+  border-right 1px solid #dedede
+  padding-right 5px
+  font-size 18px
+  margin-left -5px
+
+.g-top-level-list-entry
+  padding 11px 14px
+  margin 2px 0
+  border-radius 3px
+  background-color #fafafc
+  border 1px solid #eaeaea
+  box-shadow inset 0 0 2px 2px #f4f4f4
+
+  &[public="false"]
+    box-shadow inset 0 0 2px 2px #fff0e0
+    background-color #fff9ea

package/dist-lib/src/stylesheets/layout/globalNav.styl

@@ -0,0 +1,89 @@
+$navLinkBorder=1px solid #e0e0e0
+$emptyBorder=1px solid transparent
+$minHeight=500px
+
+.g-global-nav-main
+  box-shadow inset 0 -35px 45px -10px #fff
+  background-image linear-gradient(to left, #f4f4f4 0, #fff 7px)
+  min-height $minHeight - 12px
+  padding 15px 0 20px 6px
+
+.g-nav-link
+  display block
+  line-height 2.2
+  font-size 17px
+  color #4a4a4a
+  padding-left 12px
+  i
+    color #888
+    margin 3px
+
+ul.g-global-nav
+  padding-left 0
+
+  >li
+    border $emptyBorder
+    list-style-type none
+    text-decoration none
+
+  >li:hover:not(.g-active)
+    background-color #fafafa
+    .g-nav-link
+      position relative
+      color #222
+    i
+      color #333
+
+  >li.g-active
+    pointer-events none
+    cursor default
+    background-color white
+    border-top $navLinkBorder
+    border-bottom $navLinkBorder
+    border-left $navLinkBorder
+    box-shadow -1px 1px 3px rgba(0, 0, 0, 0.05)
+    .g-nav-link
+      color black
+    i
+      color black
+
+@media (max-width 720px)
+  .g-nav-link
+    display inline-block
+    padding 0 10px 0 6px
+    line-height 1.9
+
+  ul.g-global-nav
+    width 100%
+    border-bottom $navLinkBorder
+    >li
+      display inline-block
+      padding 4px 5px
+      border $emptyBorder
+    >li.g-active
+      box-shadow none
+      border-bottom $emptyBorder
+      border-left $navLinkBorder
+      border-right $navLinkBorder
+      border-top $navLinkBorder
+    >li:not(.g-active)
+      background-color #f1f1f1
+
+@media (min-width 721px)
+  ul.g-global-nav
+    >li:hover:not(.g-active)
+      .g-nav-link:after
+        content ""
+        position absolute
+        width 4px
+        top -1px
+        bottom -1px
+        right -1px
+        background-color #ffcc00
+
+@media (max-width 720px)
+  .g-global-nav-main
+    padding 0
+    box-shadow none
+    background-image none
+    min-height 0

package/dist-lib/src/stylesheets/layout/header.styl

@@ -0,0 +1,29 @@
+@import "layoutVars"
+
+.g-header-wrapper
+  height $headerHeight
+  vertical-align middle
+  padding 0 15px
+
+.g-app-title
+  display inline
+  font-size 25px
+  font-weight bold
+  margin-right 35px
+  line-height $headerHeight
+  cursor pointer
+
+.g-quick-search-form
+  display inline-block
+  margin-right 12px
+  vertical-align top
+  margin-top (($headerHeight - 30px) / 2)
+  width $quickSearchWidth
+
+.g-current-user-wrapper
+  display inline
+  float right
+
+@media (max-width 720px)
+  .g-app-title
+    display none

package/dist-lib/src/stylesheets/layout/headerUser.styl

@@ -0,0 +1,33 @@
+@import "layoutVars"
+
+.g-user-text
+  line-height $headerHeight
+
+  a
+    color white
+    display inline-block
+
+    &:hover
+      color #e0e0e0
+
+  .g-user-dropdown-link
+    display inline-block
+    max-width calc(100vw - 300px)
+    overflow hidden
+    text-overflow ellipsis
+    white-space nowrap
+
+    i
+      margin-left 2px
+
+  .g-or-text
+    vertical-align top
+    display inline-block
+    margin 0 5px
+
+#g-user-action-menu
+  display inline
+
+  .dropdown-menu
+    right 0
+    left auto

package/dist-lib/src/stylesheets/layout/layout.styl

@@ -0,0 +1,75 @@
+@import "layoutVars"
+
+#g-app-header-container
+  position fixed
+  top 0
+  width 100%
+  z-index $headerZ
+  height $headerHeight
+
+#g-app-body-container.g-default-layout
+  min-height $minHeight
+
+#g-app-body-container.g-empty-layout
+  margin 0
+  padding 0
+
+#g-alerts-container
+  position fixed
+  top 65px
+  right 10px
+  width 320px
+  z-index $alertsZ
+
+  .alert
+    display none
+    padding-top 10px
+    padding-bottom 10px
+    border-color #aaa
+    border-radius 0
+    box-shadow 0 0 0 5px rgba(180, 180, 180, 0.33)
+
+.g-validation-failed-message
+  font-weight bold
+  color #dd2222
+
+.g-bottom-message
+  margin-top 15px
+  font-size 12px
+  color #878080
+
+.g-password-reset-explanation
+  font-size 13px
+  color #505050
+  margin-bottom 10px
+
+#g-app-progress-container
+  position fixed
+  right 10px
+  bottom 0
+  width 400px
+  z-index $progressZ
+
+.modal-body p
+  overflow hidden
+  text-overflow ellipsis
+
+@media (min-width 721px)
+  #g-app-body-container.g-default-layout
+    padding 10px + $headerHeight 10px 10px 10px
+    margin-left $navWidth + 1px
+
+  #g-global-nav-container
+    position fixed
+    top $headerHeight
+    width $navWidth
+
+@media (max-width 720px)
+  #g-global-nav-container
+    width 100%
+    position static
+    margin-top $headerHeight
+
+  #g-app-body-container.g-default-layout
+    margin-left 0
+    padding 10px

package/dist-lib/src/stylesheets/layout/layoutVars.styl

@@ -0,0 +1,9 @@
+$navWidth = 180px
+$minHeight = 500px
+$headerHeight = 52px
+$headerZ = 50
+$modalBackdropZ = 1030
+$modalZ = 1040
+$progressZ = $modalZ + 100
+$alertsZ = $progressZ + 100
+$quickSearchWidth = 220px

package/dist-lib/src/stylesheets/layout/loading.styl

@@ -0,0 +1,37 @@
+// CSS for the loading animation
+
+#g-loading-animation
+  margin 4px
+  width 30px
+  height 22px
+
+.g-loading-block
+  background-color #808080
+  border 1px solid #808080
+  float left
+  height 21px
+  margin-left 1px
+  width 6px
+  opacity 0.1
+  animation-name bounceG
+  animation-duration 1.3s
+  animation-iteration-count infinite
+  animation-direction linear
+  transform scale(0.7)
+
+#g-loading-block-1
+  animation-delay 0.39s
+
+#g-loading-block-2
+  animation-delay 0.52s
+
+#g-loading-block-3
+  animation-delay 0.65s
+
+@keyframes bounceG
+  0%
+    transform scale(1.1)
+    opacity 1
+  100%
+    transform scale(0.7)
+    opacity 0.1

package/dist-lib/src/stylesheets/layout/progressArea.styl

@@ -0,0 +1,17 @@
+$containerBorder = 1px solid #d7d7d7
+
+.g-progress-list-container
+  padding 9px 11px
+  padding-top 0
+  box-shadow 0 0 4px 2px rgba(0, 0, 0, 0.07)
+  border-top $containerBorder
+  border-left $containerBorder
+  border-right $containerBorder
+  background-color rgba(255, 255, 255, 0.8)
+  transition background-color 0.35s ease-in-out
+
+  &:hover
+    background-color rgba(255, 255, 255, 1)
+
+  .g-progress-widget-container
+    padding-top 14px

package/dist-lib/src/stylesheets/widgets/accessWidget.styl

@@ -0,0 +1,106 @@
+.g-access-modal-body
+  padding-top 10px
+  padding-bottom 0
+
+.g-public-container
+  margin-bottom 16px
+
+  .g-action-manage-public-flags
+    margin-left 20px
+
+  .radio
+    margin-top 0
+    color #aaa
+
+  .radio.g-selected
+    color #333
+
+    i.icon-globe
+      color #3355a0
+    i.icon-lock
+      color #d0b822
+
+.g-ac-list-title
+  background-color #888
+  color white
+  font-weight bold
+  padding 3px 10px
+
+i.g-flag-icon
+  position relative
+
+.g-flag-count-indicator
+  display inline-block
+  border-radius 3px
+  background-color #c80000
+  color white
+  position absolute
+  font-size 9px
+  bottom -4px
+  right -1px
+  padding 0 0.3em
+  font-style normal
+
+.g-ac-list
+  border 1px solid #d7d7d7
+  border-top none
+  background linear-gradient(to bottom, #d3d3d3 0, #f0f0f0 6px)
+  padding 1px 4px
+
+  .g-group-access-entry
+  .g-user-access-entry
+    margin 9px 0
+
+  .g-access-icon
+    color #666
+    font-size 25px
+    position absolute
+
+  .g-access-desc
+    position relative
+    left 42px
+    width 310px
+    .g-desc-title
+      font-size 14px
+    .g-desc-subtitle
+      font-size 12px
+      color #888
+
+  .g-access-col-left
+    display inline-block
+    vertical-align top
+    width 360px
+    word-wrap break-word
+
+  .g-access-col-right
+    display inline-block
+    vertical-align top
+
+    .g-access-action-container
+      margin-left 9px
+      display inline-block
+
+      a
+        font-size 16px
+        display inline-block
+        vertical-align middle
+        color #999
+        margin-left 5px
+
+      .g-action-manage-flags:hover
+        color #0e84b5
+
+      .g-action-remove-access:hover
+        color #d02344
+
+    select
+      display inline-block
+      width 113px
+
+.g-grant-access-container
+  margin-top 5px
+  padding-top 8px
+
+  .form-group>label
+    font-weight normal
+    font-size 13px

package/dist-lib/src/stylesheets/widgets/browserWidget.styl

@@ -0,0 +1,9 @@
+.g-browser-widget
+  .g-hierarchy-widget-container
+    max-height calc(100vh - 400px)
+    min-height 200px
+    overflow-y scroll
+
+  .g-input-element
+    input.form-control
+      height auto