Introducing Pillar Framework

Refactor of pillar-server and pillar-web into a single python package. This
simplifies the overall architecture of pillar applications.

Special thanks @sybren and @venomgfx
This commit is contained in:
2016-08-19 09:19:06 +02:00
parent a5e92e1d87
commit 2c5dc34ea2
232 changed files with 79508 additions and 2232 deletions

File diff suppressed because it is too large Load Diff

View File

@@ -0,0 +1,147 @@
$color-scrollbars-base: lighten($color-background-nav, 25%)
.ps-container
.ps-scrollbar-y
opacity: 0
transition: opacity 150ms ease-in-out
&:hover
.ps-scrollbar-y
opacity: 1
/* perfect-scrollbar v0.6.3 */
.ps-container
-ms-touch-action: none
overflow: hidden !important
.ps-container.ps-active-x > .ps-scrollbar-x-rail,
.ps-container.ps-active-y > .ps-scrollbar-y-rail
display: block
.ps-container > .ps-scrollbar-x-rail
display: none
position: absolute
/* please don't change 'position' */
-webkit-border-radius: 4px
-moz-border-radius: 4px
-ms-border-radius: 4px
border-radius: 4px
opacity: 0
-webkit-transition: background-color .2s linear, opacity .2s linear
-moz-transition: background-color .2s linear, opacity .2s linear
-o-transition: background-color .2s linear, opacity .2s linear
transition: background-color .2s linear, opacity .2s linear
bottom: 3px
/* there must be 'bottom' for ps-scrollbar-x-rail */
height: 8px
.ps-container > .ps-scrollbar-x-rail > .ps-scrollbar-x
position: absolute
/* please don't change 'position' */
background-color: $color-scrollbars-base
-webkit-border-radius: 4px
-moz-border-radius: 4px
-ms-border-radius: 4px
border-radius: 4px
-webkit-transition: background-color .2s linear
-moz-transition: background-color .2s linear
-o-transition: background-color .2s linear
transition: background-color .2s linear
bottom: 0
/* there must be 'bottom' for ps-scrollbar-x */
height: 5px
.ps-container > .ps-scrollbar-y-rail
display: none
position: absolute
/* please don't change 'position' */
-webkit-border-radius: 4px
-moz-border-radius: 4px
-ms-border-radius: 4px
border-radius: 4px
opacity: 0.6
-webkit-transition: background-color .2s linear, opacity .2s linear
-moz-transition: background-color .2s linear, opacity .2s linear
-o-transition: background-color .2s linear, opacity .2s linear
transition: background-color .2s linear, opacity .2s linear
right: 3px
/* there must be 'right' for ps-scrollbar-y-rail */
width: 5px
margin:
top: 5px
bottom: 5px
#project_nav.ps-container > .ps-scrollbar-y-rail
margin-top: $project_header-height + 10
.ps-container > .ps-scrollbar-y-rail > .ps-scrollbar-y
position: absolute
/* please don't change 'position' */
background-color: $color-scrollbars-base
-webkit-border-radius: 4px
-moz-border-radius: 4px
-ms-border-radius: 4px
border-radius: 4px
-webkit-transition: background-color .2s linear
-moz-transition: background-color .2s linear
-o-transition: background-color .2s linear
transition: background-color .2s linear, height .2s linear
right: 0
/* there must be 'right' for ps-scrollbar-y */
width: 5px
.ps-container.ps-in-scrolling
pointer-events: none
&.ps-x
.ps-scrollbar-x-rail
background-color: rgba($color-scrollbars-base, .2)
opacity: 0.9
.ps-scrollbar-x
background-color: rgba($color-scrollbars-base, .2)
&.ps-y
.ps-scrollbar-y-rail
background-color: rgba($color-scrollbars-base, .2)
opacity: 0.9
.ps-scrollbar-y
background-color: rgba($color-scrollbars-base, .2)
.ps-container:hover
.ps-scrollbar-x-rail, .ps-scrollbar-y-rail
opacity: 0.6
&:hover
background-color: rgba($color-scrollbars-base, .2)
opacity: 0.9
.ps-scrollbar-x, .ps-scrollbar-y
background-color: $color-scrollbars-base
&.ps-in-scrolling
pointer-events: none
&.ps-x
.ps-scrollbar-x-rail
background-color: rgba($color-scrollbars-base, .2)
opacity: 0.9
.ps-scrollbar-x
background-color: rgba($color-scrollbars-base, .1)
&.ps-y
.ps-scrollbar-y-rail
background-color: rgba($color-scrollbars-base, .2)
opacity: 0.9
.ps-scrollbar-y
background-color: rgba($color-scrollbars-base, .1)

View File

@@ -0,0 +1,449 @@
.select2-container
box-sizing: border-box
display: inline-block
margin: 0
position: relative
vertical-align: middle
.select2-selection--single
box-sizing: border-box
cursor: pointer
display: block
height: 28px
user-select: none
-webkit-user-select: none
.select2-selection__rendered
display: block
padding-left: 8px
padding-right: 20px
overflow: hidden
text-overflow: ellipsis
white-space: nowrap
.select2-selection__clear
position: relative
&[dir="rtl"] .select2-selection--single .select2-selection__rendered
padding-right: 8px
padding-left: 20px
.select2-selection--multiple
box-sizing: border-box
cursor: pointer
display: block
min-height: 32px
user-select: none
-webkit-user-select: none
.select2-selection__rendered
display: inline-block
overflow: hidden
padding-left: 8px
text-overflow: ellipsis
white-space: nowrap
.select2-search--inline
float: left
.select2-search__field
box-sizing: border-box
border: none
font-size: 100%
margin-top: 5px
padding: 0
&::-webkit-search-cancel-button
-webkit-appearance: none
.select2-dropdown
background-color: white
border: 1px solid #aaa
border-radius: 4px
box-sizing: border-box
display: block
position: absolute
left: -100000px
width: 100%
z-index: 1051
.select2-results
display: block
.select2-results__options
list-style: none
margin: 0
padding: 0
.select2-results__option
padding: 6px
user-select: none
-webkit-user-select: none
&[aria-selected]
cursor: pointer
.select2-container--open
.select2-dropdown
left: 0
.select2-dropdown--above
border-bottom: none
border-bottom-left-radius: 0
border-bottom-right-radius: 0
.select2-dropdown--below
border-top: none
border-top-left-radius: 0
border-top-right-radius: 0
.select2-search--dropdown
display: block
padding: 4px
.select2-search__field
padding: 4px
width: 100%
box-sizing: border-box
&::-webkit-search-cancel-button
-webkit-appearance: none
&.select2-search--hide
display: none
.select2-close-mask
border: 0
margin: 0
padding: 0
display: block
position: fixed
left: 0
top: 0
min-height: 100%
min-width: 100%
height: auto
width: auto
opacity: 0
z-index: 99
background-color: #fff
filter: alpha(opacity = 0)
.select2-hidden-accessible
border: 0 !important
clip: rect(0 0 0 0) !important
height: 1px !important
margin: -1px !important
overflow: hidden !important
padding: 0 !important
position: absolute !important
width: 1px !important
.select2-container--default
.select2-selection--single
background-color: #fff
border: 1px solid #aaa
border-radius: 4px
.select2-selection__rendered
color: #444
line-height: 28px
.select2-selection__clear
cursor: pointer
float: right
font-weight: bold
.select2-selection__placeholder
color: #999
.select2-selection__arrow
height: 26px
position: absolute
top: 1px
right: 1px
width: 20px
b
border-color: #888 transparent transparent transparent
border-style: solid
border-width: 5px 4px 0 4px
height: 0
left: 50%
margin-left: -4px
margin-top: -2px
position: absolute
top: 50%
width: 0
&[dir="rtl"] .select2-selection--single
.select2-selection__clear
float: left
.select2-selection__arrow
left: 1px
right: auto
&.select2-container--disabled .select2-selection--single
background-color: #eee
cursor: default
.select2-selection__clear
display: none
&.select2-container--open .select2-selection--single .select2-selection__arrow b
border-color: transparent transparent #888 transparent
border-width: 0 4px 5px 4px
.select2-selection--multiple
background-color: white
border: 1px solid #aaa
border-radius: 4px
cursor: text
.select2-selection__rendered
box-sizing: border-box
list-style: none
margin: 0
padding: 0 5px
width: 100%
.select2-selection__placeholder
color: #999
margin-top: 5px
float: left
.select2-selection__clear
cursor: pointer
float: right
font-weight: bold
margin-top: 5px
margin-right: 10px
.select2-selection__choice
background-color: #e4e4e4
border: 1px solid #aaa
border-radius: 4px
cursor: default
float: left
margin-right: 5px
margin-top: 5px
padding: 0 5px
.select2-selection__choice__remove
color: #999
cursor: pointer
display: inline-block
font-weight: bold
margin-right: 2px
&:hover
color: #333
&[dir="rtl"] .select2-selection--multiple
.select2-selection__choice, .select2-selection__placeholder, .select2-search--inline
float: right
.select2-selection__choice
margin-left: 5px
margin-right: auto
.select2-selection__choice__remove
margin-left: 2px
margin-right: auto
&.select2-container--focus .select2-selection--multiple
border: solid $color-text-dark 1px
outline: 0
&.select2-container--disabled
.select2-selection--multiple
background-color: #eee
cursor: default
.select2-selection__choice__remove
display: none
&.select2-container--open
&.select2-container--above
.select2-selection--single, .select2-selection--multiple
border-top-left-radius: 0
border-top-right-radius: 0
&.select2-container--below
.select2-selection--single, .select2-selection--multiple
border-bottom-left-radius: 0
border-bottom-right-radius: 0
.select2-search--dropdown .select2-search__field
border: 1px solid #aaa
.select2-search--inline .select2-search__field
background: transparent
border: none
outline: 0
box-shadow: none
-webkit-appearance: textfield
.select2-results > .select2-results__options
max-height: 200px
overflow-y: auto
.select2-results__option
&[role=group]
padding: 0
&[aria-disabled=true]
color: #999
&[aria-selected=true]
background-color: #ddd
.select2-results__option
padding-left: 1em
.select2-results__group
padding-left: 0
.select2-results__option
margin-left: -1em
padding-left: 2em
.select2-results__option
margin-left: -2em
padding-left: 3em
.select2-results__option
margin-left: -3em
padding-left: 4em
.select2-results__option
margin-left: -4em
padding-left: 5em
.select2-results__option
margin-left: -5em
padding-left: 6em
.select2-results__option--highlighted[aria-selected]
background-color: #5897fb
color: white
.select2-results__group
cursor: default
display: block
padding: 6px
.select2-container--classic
.select2-selection--single
background-color: #f7f7f7
border: 1px solid #aaa
border-radius: 4px
outline: 0
background-image: -webkit-linear-gradient(top, white 50%, #eeeeee 100%)
background-image: -o-linear-gradient(top, white 50%, #eeeeee 100%)
background-image: linear-gradient(to bottom, white 50%, #eeeeee 100%)
background-repeat: repeat-x
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0)
&:focus
border: 1px solid #5897fb
.select2-selection__rendered
color: #444
line-height: 28px
.select2-selection__clear
cursor: pointer
float: right
font-weight: bold
margin-right: 10px
.select2-selection__placeholder
color: #999
.select2-selection__arrow
background-color: #ddd
border: none
border-left: 1px solid #aaa
border-top-right-radius: 4px
border-bottom-right-radius: 4px
height: 26px
position: absolute
top: 1px
right: 1px
width: 20px
background-image: -webkit-linear-gradient(top, #eeeeee 50%, #cccccc 100%)
background-image: -o-linear-gradient(top, #eeeeee 50%, #cccccc 100%)
background-image: linear-gradient(to bottom, #eeeeee 50%, #cccccc 100%)
background-repeat: repeat-x
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFCCCCCC', GradientType=0)
b
border-color: #888 transparent transparent transparent
border-style: solid
border-width: 5px 4px 0 4px
height: 0
left: 50%
margin-left: -4px
margin-top: -2px
position: absolute
top: 50%
width: 0
&[dir="rtl"] .select2-selection--single
.select2-selection__clear
float: left
.select2-selection__arrow
border: none
border-right: 1px solid #aaa
border-radius: 0
border-top-left-radius: 4px
border-bottom-left-radius: 4px
left: 1px
right: auto
&.select2-container--open
.select2-selection--single
border: 1px solid #5897fb
.select2-selection__arrow
background: transparent
border: none
b
border-color: transparent transparent #888 transparent
border-width: 0 4px 5px 4px
&.select2-container--above .select2-selection--single
border-top: none
border-top-left-radius: 0
border-top-right-radius: 0
background-image: -webkit-linear-gradient(top, white 0%, #eeeeee 50%)
background-image: -o-linear-gradient(top, white 0%, #eeeeee 50%)
background-image: linear-gradient(to bottom, white 0%, #eeeeee 50%)
background-repeat: repeat-x
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0)
&.select2-container--below .select2-selection--single
border-bottom: none
border-bottom-left-radius: 0
border-bottom-right-radius: 0
background-image: -webkit-linear-gradient(top, #eeeeee 50%, white 100%)
background-image: -o-linear-gradient(top, #eeeeee 50%, white 100%)
background-image: linear-gradient(to bottom, #eeeeee 50%, white 100%)
background-repeat: repeat-x
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFFFFFFF', GradientType=0)
.select2-selection--multiple
background-color: white
border: 1px solid #aaa
border-radius: 4px
cursor: text
outline: 0
&:focus
border: 1px solid #5897fb
.select2-selection__rendered
list-style: none
margin: 0
padding: 0 5px
.select2-selection__clear
display: none
.select2-selection__choice
background-color: #e4e4e4
border: 1px solid #aaa
border-radius: 4px
cursor: default
float: left
margin-right: 5px
margin-top: 5px
padding: 0 5px
.select2-selection__choice__remove
color: #888
cursor: pointer
display: inline-block
font-weight: bold
margin-right: 2px
&:hover
color: #555
&[dir="rtl"] .select2-selection--multiple
.select2-selection__choice
float: right
margin-left: 5px
margin-right: auto
.select2-selection__choice__remove
margin-left: 2px
margin-right: auto
&.select2-container--open
.select2-selection--multiple
border: 1px solid #5897fb
&.select2-container--above .select2-selection--multiple
border-top: none
border-top-left-radius: 0
border-top-right-radius: 0
&.select2-container--below .select2-selection--multiple
border-bottom: none
border-bottom-left-radius: 0
border-bottom-right-radius: 0
.select2-search--dropdown .select2-search__field
border: 1px solid #aaa
outline: 0
.select2-search--inline .select2-search__field
outline: 0
box-shadow: none
.select2-dropdown
background-color: white
border: 1px solid transparent
.select2-dropdown--above
border-bottom: none
.select2-dropdown--below
border-top: none
.select2-results > .select2-results__options
max-height: 200px
overflow-y: auto
.select2-results__option
&[role=group]
padding: 0
&[aria-disabled=true]
color: grey
.select2-results__option--highlighted[aria-selected]
background-color: #3875d7
color: white
.select2-results__group
cursor: default
display: block
padding: 6px
&.select2-container--open .select2-dropdown
border-color: #5897fb

View File

@@ -0,0 +1,267 @@
/* jsTree overrides */
$tree-color-text: $color-text-light-primary
$tree-color-highlight: white
$tree-color-highlight-background: $color-primary
.jstree-default
font-weight: 400
.jstree-loading
padding: 5px
color: $color-text-light-secondary
.jstree-default-responsive .jstree-anchor
+media-sm
font-weight: normal !important
text-shadow: none !important
.jstree-default .jstree-node
max-width: 100% // Needed for ellipsis on long names
padding: 0 !important
margin: 0 !important
font-weight: 400 !important
color: $tree-color-text
min-height: 12px !important
line-height: 12px !important
+media-xs
width: 100%
.ps-active-y
.jstree-default .jstree-node
max-width: 97%
.jstree-node.jstree-open
background-color: darken($color-background-nav, 2%) !important
.jstree-node.jstree-open > .jstree-anchor:first-of-type
color: white !important
background-color: darken($color-background-nav, 2%) !important
.jstree-default .jstree-node.jstree-open,
.jstree-default .jstree-node.jstree-leaf
// border-left: 2px solid lighten($color-background-nav, 15%) /* Whatever after the top level */
.jstree-default .jstree-node.jstree-closed
// border-left: 2px solid lighten($color-background-nav, 20%) /* Closed Folder */
.jstree-default .jstree-node.jstree-closed .jstree-icon.jstree-ocl,
.jstree-default .jstree-node.jstree-open .jstree-icon.jstree-ocl
position: absolute
z-index: 1
opacity: 0
min-width: 30px
float: left
.jstree-default .jstree-ocl:before
+media-xs
font-weight: bold
font-size: 100%
top: 10%
left: 46%
.jstree-anchor
padding-right: 5px
+media-xs
width: 98%
padding: 0 !important
.jstree-default .jstree-node.jstree-closed .jstree-icon.jstree-ocl + .jstree-anchor,
.jstree-default .jstree-node.jstree-open .jstree-icon.jstree-ocl + .jstree-anchor
padding-left: 28px !important
.jstree .jstree-open > .jstree-children
padding-top: 0 !important
.jstree-default .jstree-anchor /* The text of the last level item */
width: 100%
padding-left: 28px !important
height: inherit !important
line-height: 26px !important
white-space: nowrap
text-overflow: ellipsis
overflow: hidden
border-bottom: thin solid transparent
transition: none
.jstree-default li
transition: none
/* expanded item, like a folder */
.jstree-default .jstree-open > .jstree-ocl,
.jstree-default .jstree-open > .jstree-anchor,
.jstree-default .jstree-open > .jstree-ocl .jstree-icon.jstree-themeicon,
.jstree-default .jstree-open > .jstree-anchor .jstree-icon.jstree-themeicon
color: $tree-color-text !important
/* active item text */
.jstree-default .jstree-clicked,
.jstree-default .jstree-clicked > .jstree-ocl
background-color: transparent !important
border-radius: 0
box-shadow: none
border-bottom: thin solid transparent
// max-width: 95%
.jstree-default .jstree-leaf .jstree-clicked
width: 100% !important
/* hovered text */
.jstree-default .jstree-hovered,
.jstree-default .jstree-open .jstree-hovered,
.jstree-default .jstree-hovered .jstree-icon.jstree-themeicon
color: $tree-color-highlight !important
.jstree-default .jstree-hovered
background-color: rgba($tree-color-highlight, .1) !important
/* active item text + icon */
.jstree-default .jstree-clicked,
.jstree-default .jstree-clicked > .jstree-ocl,
.jstree-default .jstree-clicked .jstree-icon.jstree-themeicon
color: $tree-color-highlight !important
.jstree-leaf[aria-selected='true']
a.jstree-anchor.jstree-clicked
background-color: rgba($tree-color-highlight-background, .5) !important
padding-left: 28px !important
.jstree-default li[aria-selected='true']
a.jstree-anchor
padding-right: 15px
&:after
content: '\e83a'
font-family: 'pillar-font'
color: $tree-color-highlight
position: absolute
right: 7px
top: 1px
li
a.jstree-anchor:after
content: ''
.jstree-default li[aria-expanded='true']
background-color: transparent
a.jstree-anchor.jstree-clicked
background-color: rgba($tree-color-highlight-background, .5) !important
a.jstree-anchor.jstree-clicked+ul li a.jstree-anchor.jstree-clicked
background-color: rgba($tree-color-highlight-background, .7) !important
a.jstree-anchor.jstree-clicked+ul li a.jstree-anchor.jstree-clicked+ul li a.jstree-anchor.jstree-clicked
background-color: rgba($tree-color-highlight-background, .8) !important
a.jstree-anchor+ul
border:
top: none !important
bottom: none !important
a.jstree-anchor
color: darken($color-text-light-primary, 10%) !important
&.jstree-hovered,
&.jstree-clicked
color: white !important
&+ul
a.jstree-anchor
color: darken($color-text-light-primary, 10%) !important
&.jstree-hovered,
&.jstree-clicked
color: white !important
/* hover an active item */
.jstree-default .jstree-clicked.jstree-hovered,
.jstree-default .jstree-clicked.jstree-hovered .jstree-icon.jstree-themeicon
color: lighten($tree-color-highlight, 5%) !important
box-shadow: none
.jstree-anchor > .jstree-themeicon
margin-right: 10px !important
margin-left: 20px !important
.jstree-default .jstree-hovered,
.jstree-default .jstree-hovered .jstree-ocl
background-color: transparent !important
box-shadow: none
color: white !important
.jstree-default .jstree-hovered
box-shadow: none
.jstree-default .jstree-node,
.jstree-default .jstree-icon
background-image: none !important
position: relative
.jstree-default .jstree-icon /* Folder that you click to collapse/expand */
width: 20px !important
text-align: left !important
background-color: transparent !important
position: absolute
i.jstree-icon.jstree-ocl
height: 26px !important
color: rgba($tree-color-text, .5) !important
+media-xs
height: 40px !important
.jstree-default .jstree-icon:empty
line-height: 26px
left: 5px
.jstree-children .jstree-open i.jstree-icon.jstree-ocl
height: 26px !important
.jstree-anchor > .jstree-themeicon
margin-right: 3px !important
margin-left: 0 !important
color: rgba($tree-color-text, .7) !important
font-size: 95% !important
.jstree-open > .jstree-anchor > .jstree-themeicon
color: $color-primary !important
.jstree-leaf > .jstree-clicked > .jstree-themeicon
color: $color-secondary !important
.jstree-leaf .jstree-icon /* Icon of the files (not nodes) */
opacity: 0
width: 0px !important
.jstree-leaf .jstree-icon.jstree-themeicon
opacity: 1
width: 24px !important
color: lighten($color-text, 30%) !important
&.pi-image
font-size: .85em !important
.jstree .jstree-open > .jstree-children > .jstree-node
padding-left: 15px !important
.jstree-icon:empty
left: 20px !important
// Tweaks for specific icons
&.pi-file-archive
left: 22px !important
&.pi-folder
left: 21px !important
font-size: .9em !important
&.pi-film-thick
left: 22px !important
font-size: .85em !important
.jstree-anchor
border-left: thin solid lighten($color-background-nav, 5%)
/* /jsTree overrides */