npm - @oat-sa/tao-core-ui - Versions diffs - 3.9.2 → 3.9.3 - Mend

@oat-sa/tao-core-ui 3.9.2 → 3.9.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (10) hide show

package/dist/resource/filters.js +1 -1
package/dist/searchModal/css/searchModal.css +1 -0
package/dist/searchModal/css/searchModal.css.map +1 -1
package/dist/searchModal.js +1 -1
package/package.json +1 -1
package/src/resource/filters.js +1 -0
package/src/searchModal/css/searchModal.css +1 -0
package/src/searchModal/css/searchModal.css.map +1 -1
package/src/searchModal/scss/searchModal.scss +1 -0
package/src/searchModal.js +1 -1

package/dist/resource/filters.js CHANGED Viewed

@@ -46,7 +46,7 @@ define(['lodash', 'i18n', 'ui/component', 'ui/generis/form/form', 'handlebars',
      *
      * FIXME add radio as soon as supported
      */
-    var supportedWidgets = ['http://www.tao.lu/datatypes/WidgetDefinitions.rdf#TextBox', 'http://www.tao.lu/datatypes/WidgetDefinitions.rdf#CheckBox', 'http://www.tao.lu/datatypes/WidgetDefinitions.rdf#ComboBox', 'http://www.tao.lu/datatypes/WidgetDefinitions.rdf#TextArea', 'http://www.tao.lu/datatypes/WidgetDefinitions.rdf#StateWidget'];
+    var supportedWidgets = ['http://www.tao.lu/datatypes/WidgetDefinitions.rdf#Readonly', 'http://www.tao.lu/datatypes/WidgetDefinitions.rdf#TextBox', 'http://www.tao.lu/datatypes/WidgetDefinitions.rdf#CheckBox', 'http://www.tao.lu/datatypes/WidgetDefinitions.rdf#ComboBox', 'http://www.tao.lu/datatypes/WidgetDefinitions.rdf#TextArea', 'http://www.tao.lu/datatypes/WidgetDefinitions.rdf#StateWidget'];
     var defaultConfig = {
       title: __('Search by properties'),
       applyLabel: __('Apply')

package/dist/searchModal/css/searchModal.css CHANGED Viewed

@@ -352,6 +352,7 @@ Usage:
 }
 .search-modal .ui-container .filter-container {
   position: relative;
+  z-index: 1;
   margin-bottom: 8px;
 }
 .search-modal .ui-container .filter-container:last-child {

package/dist/searchModal/css/searchModal.css.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../scss/inc/_functions.scss","../../../scss/inc/fonts/_tao-icon-vars.scss","../scss/searchModal.scss%23sass","../scss/searchModal.scss","../../../scss/inc/_colors.scss"],"names":[],"mappings":"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","file":"searchModal.css","sourcesContent":["@mixin iterate-sprite($iconList, $x, $y, $direction, $prefix:'') {\n @each $icon in $iconList {\n #{$prefix}#{$icon} {\n background-position: $x * 1px $y * 1px;\n }\n @if $direction == 'x' {\n $x: $x - 16;\n } @else {\n $y: $y - 16;\n }\n }\n}\n\n/\nUsage:\n- linear-gradient((color1, color2, color3)) - returns linear-gradient with evenly distributed colors,\n if 3 colors used then the position of each will be 33,33%\n- linear-gradient((color1 0%, color2 30%, color3 80%)) - returns linear-gradient with manually distributed colors,\n first param - color, second - position. Also you can use px or other valid units for set position.\n/\n@mixin linear-gradient($colorList, $direction: 'to right') {\n $percentage: 0;\n $units: '%';\n $count: length($colorList);\n $increment: calc(100 / ($count - 1));\n $css: #{$direction + ', '};\n $sep: ', ';\n @each $colorItem in $colorList {\n $color: $colorItem;\n @if (length($colorItem) > 1) {\n $color: nth($colorItem, 1);\n $percentage: nth($colorItem, 2);\n $units: '';\n }\n @if ($percentage >= 100 or index($colorList, $colorItem) == $count) {\n $sep: '';\n }\n $css: #{$css + $color + ' ' + $percentage + $units + $sep};\n $percentage: $percentage + $increment;\n }\n background: linear-gradient( #{$css} );\n}\n\n@mixin grid-unit($span, $numCols: 12, $gutter: 0) {\n $gridPx: 840;\n $rawSpanPx: calc((($gridPx - ($numCols * $gutter)) / $numCols));\n $spanPx: $rawSpanPx * $span + (($span - 1) * $gutter);\n $spanPercent: widthPerc($spanPx, $gridPx);\n $marginPercent: widthPerc($gutter, $gridPx);\n margin-left: $marginPercent;\n width: $spanPercent;\n}\n\n\n@mixin vendor-prefix($property, $value, $whatToPrefix: property, $prefixes: (-webkit-, -moz-, -ms-, -o-, '')) {\n @if $whatToPrefix == 'property' {\n @each $prefix in $prefixes {\n #{$prefix + $property}: #{$value};\n }\n }\n @else if $whatToPrefix == 'value' {\n @each $prefix in $prefixes {\n #{$property}: #{$prefix + $value};\n }\n }\n}\n@mixin flex-container($wrapBehavior: nowrap, $direction : row) {\n @include vendor-prefix(display, flex, value, (-ms-, -webkit-, ''));\n\n @include vendor-prefix(flex-direction, $direction, property, (-ms-, -webkit-, ''));\n @include vendor-prefix(flex-wrap, $wrapBehavior, property, (-ms-, -webkit-, ''));\n\n @include vendor-prefix(justify-content, flex-start, property, (-webkit-, ''));\n\n @include vendor-prefix(align-content, flex-start, property, (-webkit-, ''));\n\n @include vendor-prefix(align-items, stretch, property, (-webkit-, ''));\n}\n\n@mixin simple-flex-box($width: auto, $minWidth: 1) {\n\n @include vendor-prefix(order, 0, property, (-ms-, -webkit-, ''));\n flex-item-align: stretch;\n -ms-flex-item-align: stretch;\n @include vendor-prefix(align-self, stretch, property, (-webkit-, ''));\n\n // if both, min width and width are set, width will win this conflict\n @if ($width == auto) {\n @if ($minWidth != 1) {\n @include vendor-prefix(flex, 1 1 $minWidth, property, (-ms-, -webkit-, ''));\n }\n @else {\n @include vendor-prefix(flex, 1 1 auto, property, (-ms-, -webkit-, ''));\n // @see https://developer.mozilla.org/en-US/docs/Web/CSS/flex-basis#Values\n // for a discussion auto vs. main-size\n @include vendor-prefix(flex, 1 1, property, (-ms-, -webkit-, ''));\n }\n }\n @else {\n @include vendor-prefix(flex, 0 0 $width, property, (-ms-, -webkit-, ''));\n }\n}\n\n\n@mixin box-shadow($horiz: 1px, $vert: 1px, $blur: 2px, $spread: 0, $color: rgba(0, 0, 0, .2)) {\n @include vendor-prefix(box-shadow, $horiz $vert $blur $spread $color, property);\n}\n\n@mixin simple-border($color: #ddd) {\n border: 1px solid $color;\n border-radius: 2px;\n -webkit-border-radius: 2px;\n}\n\n@mixin border-radius($radius: 2) {\n -moz-border-radius: $radius * 1px;\n -webkit-border-radius: $radius * 1px;\n border-radius: $radius * 1px;\n}\n\n@mixin border-radius-top($radius: 2) {\n -webkit-border-top-left-radius: $radius * 1px;\n -webkit-border-top-right-radius: $radius * 1px;\n -moz-border-radius-topleft: $radius * 1px;\n -moz-border-radius-topright: $radius * 1px;\n border-top-left-radius: $radius * 1px;\n border-top-right-radius: $radius * 1px;\n}\n\n@mixin border-radius-bottom($radius: 2) {\n -webkit-border-bottom-right-radius: $radius * 1px;\n -webkit-border-bottom-left-radius: $radius * 1px;\n -moz-border-radius-bottomright: $radius * 1px;\n -moz-border-radius-bottomleft: $radius * 1px;\n border-bottom-right-radius: $radius * 1px;\n border-bottom-left-radius: $radius * 1px;\n}\n\n@mixin border-radius-left($radius: 2) {\n -webkit-border-top-left-radius: $radius * 1px;\n -webkit-border-bottom-left-radius: $radius * 1px;\n -moz-border-radius-topleft: $radius * 1px;\n -moz-border-radius-bottomleft: $radius * 1px;\n border-top-left-radius: $radius * 1px;\n border-bottom-left-radius: $radius * 1px;\n}\n\n@mixin border-radius-right($radius: 2) {\n -webkit-border-top-right-radius: $radius * 1px;\n -webkit-border-bottom-right-radius: $radius * 1px;\n -moz-border-radius-topright: $radius * 1px;\n -moz-border-radius-bottomright: $radius * 1px;\n border-top-right-radius: $radius * 1px;\n border-bottom-right-radius: $radius * 1px;\n}\n\n@mixin border-radius-top-left($radius: 2) {\n -webkit-border-top-left-radius: $radius * 1px;\n -moz-border-radius-topleft: $radius * 1px;\n border-top-left-radius: $radius * 1px;\n}\n\n@mixin border-radius-top-right($radius: 2) {\n -webkit-border-top-right-radius: $radius * 1px;\n -moz-border-radius-topright: $radius * 1px;\n border-top-right-radius: $radius * 1px;\n}\n\n@mixin border-radius-bottom-right($radius: 2) {\n -webkit-border-bottom-right-radius: $radius * 1px;\n -moz-border-radius-bottomright: $radius * 1px;\n border-bottom-right-radius: $radius * 1px;\n}\n\n@mixin border-radius-bottom-left($radius: 2) {\n -webkit-border-bottom-left-radius: $radius * 1px;\n -moz-border-radius-bottomleft: $radius * 1px;\n border-bottom-left-radius: $radius * 1px;\n}\n\n@mixin border-box() {\n -moz-box-sizing: border-box;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n}\n\n@function whiten($color, $white: 0.3) {\n @return mix(#fff, $color, ($white * 100) * 1%);\n}\n\n@function blacken($color, $black: 0.3) {\n @return mix(#000, $color, ($black * 100) * 1%);\n}\n\n@function widthPerc($colWidth, $context) {\n @return calc(($colWidth * 100 / $context) * 1%)\n}\n\n@function remDist($fontSizePx) {\n @return calc(($fontSizePx / 10) * 1rem)\n}\n\n@function black($alpha: 1) {\n @return (rgba(0, 0, 0, $alpha))\n}\n\n@function white($alpha: 1) {\n @return (rgba(255, 255, 255, $alpha))\n}\n\n@mixin font-size($remPx, $important: false) {\n @if $important == true {\n font-size: calc(($remPx) * 1px) !important;\n font-size: calc(($remPx / 10) * 1rem) !important;\n }\n @else {\n font-size: calc(($remPx) * 1px);\n font-size: calc(($remPx / 10) * 1rem);\n }\n}\n\n\n@mixin keyframes($name) {\n @-o-keyframes #{$name} { @content };\n @-moz-keyframes #{$name} { @content };\n @-webkit-keyframes #{$name} { @content };\n @keyframes #{$name} { @content };\n}\n\n\n@mixin animation($value, $type:'') {\n $animation: animation;\n @if $type != '' {\n $animation: $animation + '-' + $type;\n }\n @include vendor-prefix($animation, $value, property);\n}\n\n/// CSS transition mixin to the current selection (apply also vendor prefixes).\n/// See <https://developer.mozilla.org/en-US/docs/Web/CSS/transition> for the values\n///\n/// @param {property} [$type = all] the CSS property to apply the transition to\n/// @param {time} [$duration = .5s] the transition property\n/// @param {timing-function} [$effect = ease-out] the transition property\n@mixin transition($type : all, $duration : 0.5s, $effect : ease-out, $delay : 0s){\n @include vendor-prefix(transition, $type + ', ' + $duration + ', ' + $effect + ', ' + $delay, property);\n}\n\n@mixin fade($duration: 1s){\n\n @include keyframes(fade) {\n 0% {opacity:0;}\n 50% {opacity:1;}\n 100% {opacity:0;}\n }\n\n @include vendor-prefix(animation, fade 1s forwards, property);\n}\n\n@mixin repeat(){\n @include animation(infinite, iteration-count);\n}\n\n@mixin largeHeading() {\n @include font-size(20);\n font-family: $headingFont;\n font-style: normal;\n}\n\n@mixin disableSelect() {\n @include vendor-prefix(user-select, none, property);\n}\n\n/* based on \"visually-hidden\" mixin in LDS for accessibility goals /\n@mixin visuallyHidden() {\n position: absolute;\n width: 1px;\n height: 1px;\n overflow: hidden;\n clip: rect(1px, 1px, 1px, 1px);\n margin: 0;\n padding: 0;\n}\n","/ Do not edit /@mixin tao-icon-setup {\n / use !important to prevent issues with browser extensions that change fonts /\n font-family: 'tao' !important;\n speak: never;\n font-style: normal;\n font-weight: normal;\n font-variant: normal;\n text-transform: none;\n line-height: 1;\n\n / Better Font Rendering =========== /\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n\n@mixin icon-align-center { content: \"\\e92a\"; }\n@mixin icon-multiple-magicwand { content: \"\\e929\"; }\n@mixin icon-sd-import { content: \"\\e91f\"; }\n@mixin icon-sd-export { content: \"\\e924\"; }\n@mixin icon-browse { content: \"\\e925\"; }\n@mixin icon-minus { content: \"\\e926\"; }\n@mixin icon-plus { content: \"\\e927\"; }\n@mixin icon-sd-save { content: \"\\e928\"; }\n@mixin icon-back-button { content: \"\\e91e\"; }\n@mixin icon-japan-incorrect { content: \"\\e91b\"; }\n@mixin icon-japan-correct { content: \"\\e91c\"; }\n@mixin icon-japan-partial { content: \"\\e91d\"; }\n@mixin icon-score-partial { content: \"\\e91a\"; }\n@mixin icon-furigana { content: \"\\e919\"; }\n@mixin icon-add-subsection { content: \"\\e918\"; }\n@mixin icon-info-bare { content: \"\\e923\"; }\n@mixin icon-bookmark-outline { content: \"\\e922\"; }\n@mixin icon-bookmark { content: \"\\e921\"; }\n@mixin icon-indicator { content: \"\\e920\"; }\n@mixin icon-wrap-inline { content: \"\\e915\"; }\n@mixin icon-wrap-left { content: \"\\e916\"; }\n@mixin icon-wrap-right { content: \"\\e917\"; }\n@mixin icon-offline { content: \"\\e913\"; }\n@mixin icon-online { content: \"\\e914\"; }\n@mixin icon-tab { content: \"\\e90d\"; }\n@mixin icon-untab { content: \"\\e90e\"; }\n@mixin icon-multi-select { content: \"\\e90b\"; }\n@mixin icon-clipboard { content: \"\\e90a\"; }\n@mixin icon-filebox { content: \"\\e909\"; }\n@mixin icon-click-to-speak { content: \"\\e907\"; }\n@mixin icon-speech-bubble { content: \"\\f0e5\"; }\n@mixin icon-microphone { content: \"\\f130\"; }\n@mixin icon-microphone-off { content: \"\\f131\"; }\n@mixin icon-disconnect { content: \"\\e905\"; }\n@mixin icon-connect { content: \"\\e906\"; }\n@mixin icon-eliminate { content: \"\\e904\"; }\n@mixin icon-wheelchair { content: \"\\e903\"; }\n@mixin icon-text-marker { content: \"\\e902\"; }\n@mixin icon-unshield { content: \"\\e32a\"; }\n@mixin icon-shield { content: \"\\e8e8\"; }\n@mixin icon-tree { content: \"\\e6b4\"; }\n@mixin icon-home { content: \"\\e6b3\"; }\n@mixin icon-shared-file { content: \"\\e6b2\"; }\n@mixin icon-end-attempt { content: \"\\e603\"; }\n@mixin icon-icon { content: \"\\f1c5\"; }\n@mixin icon-radio-bg { content: \"\\e600\"; }\n@mixin icon-checkbox-bg { content: \"\\e601\"; }\n@mixin icon-tag { content: \"\\e602\"; }\n@mixin icon-style { content: \"\\e604\"; }\n@mixin icon-ownership-transfer { content: \"\\e605\"; }\n@mixin icon-property-advanced { content: \"\\e606\"; }\n@mixin icon-property-add { content: \"\\e607\"; }\n@mixin icon-repository-add { content: \"\\e608\"; }\n@mixin icon-repository-remove { content: \"\\e609\"; }\n@mixin icon-repository { content: \"\\e60a\"; }\n@mixin icon-result-server { content: \"\\e60b\"; }\n@mixin icon-folder { content: \"\\e60c\"; }\n@mixin icon-folder-open { content: \"\\e60d\"; }\n@mixin icon-left { content: \"\\e60e\"; }\n@mixin icon-right { content: \"\\e60f\"; }\n@mixin icon-up { content: \"\\e610\"; }\n@mixin icon-down { content: \"\\e611\"; }\n@mixin icon-undo { content: \"\\e612\"; }\n@mixin icon-redo { content: \"\\e613\"; }\n@mixin icon-screen { content: \"\\e614\"; }\n@mixin icon-laptop { content: \"\\e615\"; }\n@mixin icon-tablet { content: \"\\e616\"; }\n@mixin icon-phone { content: \"\\e617\"; }\n@mixin icon-move { content: \"\\e618\"; }\n@mixin icon-bin { content: \"\\e619\"; }\n@mixin icon-shuffle { content: \"\\e61a\"; }\n@mixin icon-print { content: \"\\e61b\"; }\n@mixin icon-tools { content: \"\\e61c\"; }\n@mixin icon-settings { content: \"\\e61d\"; }\n@mixin icon-video { content: \"\\e61e\"; }\n@mixin icon-find { content: \"\\e61f\"; }\n@mixin icon-image { content: \"\\e620\"; }\n@mixin icon-edit { content: \"\\e621\"; }\n@mixin icon-document { content: \"\\e622\"; }\n@mixin icon-resize-grid { content: \"\\e623\"; }\n@mixin icon-resize { content: \"\\e624\"; }\n@mixin icon-help { content: \"\\e625\"; }\n@mixin icon-mobile-menu { content: \"\\e626\"; }\n@mixin icon-fix { content: \"\\e627\"; }\n@mixin icon-unlock { content: \"\\e628\"; }\n@mixin icon-lock { content: \"\\e629\"; }\n@mixin icon-ul { content: \"\\e62a\"; }\n@mixin icon-ol { content: \"\\e62b\"; }\n@mixin icon-email { content: \"\\e62c\"; }\n@mixin icon-download { content: \"\\e62d\"; }\n@mixin icon-logout { content: \"\\e62e\"; }\n@mixin icon-login { content: \"\\e62f\"; }\n@mixin icon-spinner { content: \"\\e630\"; }\n@mixin icon-preview { content: \"\\e631\"; }\n@mixin icon-external { content: \"\\e632\"; }\n@mixin icon-time { content: \"\\e633\"; }\n@mixin icon-save { content: \"\\e634\"; }\n@mixin icon-warning { content: \"\\e635\"; }\n@mixin icon-add { content: \"\\e636\"; }\n@mixin icon-error { content: \"\\e900\"; }\n@mixin icon-close { content: \"\\e637\"; }\n@mixin icon-success { content: \"\\e638\"; }\n@mixin icon-remove { content: \"\\e639\"; }\n@mixin icon-info { content: \"\\e63a\"; }\n@mixin icon-danger { content: \"\\e63b\"; }\n@mixin icon-users { content: \"\\e63c\"; }\n@mixin icon-user { content: \"\\e63d\"; }\n@mixin icon-test-taker { content: \"\\e63e\"; }\n@mixin icon-test-takers { content: \"\\e63f\"; }\n@mixin icon-item { content: \"\\e640\"; }\n@mixin icon-test { content: \"\\e641\"; }\n@mixin icon-delivery { content: \"\\e642\"; }\n@mixin icon-eye-slash { content: \"\\e643\"; }\n@mixin icon-result { content: \"\\e644\"; }\n@mixin icon-delivery-small { content: \"\\e645\"; }\n@mixin icon-upload { content: \"\\e646\"; }\n@mixin icon-result-small { content: \"\\e647\"; }\n@mixin icon-mobile-preview { content: \"\\e648\"; }\n@mixin icon-extension { content: \"\\e649\"; }\n@mixin icon-desktop-preview { content: \"\\e64a\"; }\n@mixin icon-tablet-preview { content: \"\\e64b\"; }\n@mixin icon-insert-horizontal-line { content: \"\\e64c\"; }\n@mixin icon-table { content: \"\\e64d\"; }\n@mixin icon-anchor { content: \"\\e64e\"; }\n@mixin icon-unlink { content: \"\\e64f\"; }\n@mixin icon-link { content: \"\\e650\"; }\n@mixin icon-right-left { content: \"\\e651\"; }\n@mixin icon-left-right { content: \"\\e652\"; }\n@mixin icon-special-character { content: \"\\e653\"; }\n@mixin icon-source { content: \"\\e654\"; }\n@mixin icon-new-page { content: \"\\e655\"; }\n@mixin icon-templates { content: \"\\e656\"; }\n@mixin icon-cut { content: \"\\e657\"; }\n@mixin icon-replace { content: \"\\e658\"; }\n@mixin icon-copy { content: \"\\e659\"; }\n@mixin icon-paste { content: \"\\e65a\"; }\n@mixin icon-select-all { content: \"\\e65b\"; }\n@mixin icon-paste-text { content: \"\\e65c\"; }\n@mixin icon-paste-word { content: \"\\e65d\"; }\n@mixin icon-bold { content: \"\\e65e\"; }\n@mixin icon-italic { content: \"\\e65f\"; }\n@mixin icon-underline { content: \"\\e660\"; }\n@mixin icon-subscript { content: \"\\e661\"; }\n@mixin icon-superscript { content: \"\\e662\"; }\n@mixin icon-strike-through { content: \"\\e663\"; }\n@mixin icon-decrease-indent { content: \"\\e664\"; }\n@mixin icon-increase-indent { content: \"\\e665\"; }\n@mixin icon-block-quote { content: \"\\e666\"; }\n@mixin icon-div-container { content: \"\\e667\"; }\n@mixin icon-align-left { content: \"\\e668\"; }\n@mixin icon-center { content: \"\\e669\"; }\n@mixin icon-align-right { content: \"\\e66a\"; }\n@mixin icon-justify { content: \"\\e66b\"; }\n@mixin icon-choice { content: \"\\e66c\"; }\n@mixin icon-inline-choice { content: \"\\e66d\"; }\n@mixin icon-match { content: \"\\e66e\"; }\n@mixin icon-associate { content: \"\\e66f\"; }\n@mixin icon-media { content: \"\\e670\"; }\n@mixin icon-graphic-order { content: \"\\e671\"; }\n@mixin icon-hotspot { content: \"\\e672\"; }\n@mixin icon-graphic-gap { content: \"\\e673\"; }\n@mixin icon-graphic-associate { content: \"\\e674\"; }\n@mixin icon-select-point { content: \"\\e675\"; }\n@mixin icon-pin { content: \"\\e676\"; }\n@mixin icon-import { content: \"\\e677\"; }\n@mixin icon-export { content: \"\\e678\"; }\n@mixin icon-move-item { content: \"\\e679\"; }\n@mixin icon-meta-data { content: \"\\e67a\"; }\n@mixin icon-slider { content: \"\\e67b\"; }\n@mixin icon-summary-report { content: \"\\e67c\"; }\n@mixin icon-text-entry { content: \"\\e67d\"; }\n@mixin icon-extended-text { content: \"\\e67e\"; }\n@mixin icon-eraser { content: \"\\e67f\"; }\n@mixin icon-row { content: \"\\e680\"; }\n@mixin icon-column { content: \"\\e681\"; }\n@mixin icon-text-color { content: \"\\e682\"; }\n@mixin icon-background-color { content: \"\\e683\"; }\n@mixin icon-spell-check { content: \"\\e684\"; }\n@mixin icon-polygon { content: \"\\e685\"; }\n@mixin icon-rectangle { content: \"\\e686\"; }\n@mixin icon-gap-match { content: \"\\e687\"; }\n@mixin icon-order { content: \"\\e688\"; }\n@mixin icon-hottext { content: \"\\e689\"; }\n@mixin icon-free-form { content: \"\\e68a\"; }\n@mixin icon-step-backward { content: \"\\e68b\"; }\n@mixin icon-fast-backward { content: \"\\e68c\"; }\n@mixin icon-backward { content: \"\\e68d\"; }\n@mixin icon-play { content: \"\\e68e\"; }\n@mixin icon-pause { content: \"\\e68f\"; }\n@mixin icon-stop { content: \"\\e690\"; }\n@mixin icon-forward { content: \"\\e691\"; }\n@mixin icon-fast-forward { content: \"\\e692\"; }\n@mixin icon-step-forward { content: \"\\e693\"; }\n@mixin icon-ellipsis { content: \"\\e694\"; }\n@mixin icon-circle { content: \"\\e695\"; }\n@mixin icon-target { content: \"\\e696\"; }\n@mixin icon-guide-arrow { content: \"\\e697\"; }\n@mixin icon-range-slider-right { content: \"\\e698\"; }\n@mixin icon-range-slider-left { content: \"\\e699\"; }\n@mixin icon-radio-checked { content: \"\\e69a\"; }\n@mixin icon-checkbox-indeterminate { content: \"\\e901\"; }\n@mixin icon-checkbox { content: \"\\e69b\"; }\n@mixin icon-checkbox-crossed { content: \"\\e69c\"; }\n@mixin icon-checkbox-checked { content: \"\\e69d\"; }\n@mixin icon-result-nok { content: \"\\e69e\"; }\n@mixin icon-result-ok { content: \"\\e69f\"; }\n@mixin icon-not-evaluated { content: \"\\e6a0\"; }\n@mixin icon-filter { content: \"\\e6a1\"; }\n@mixin icon-translate { content: \"\\e6a2\"; }\n@mixin icon-eject { content: \"\\e6a3\"; }\n@mixin icon-continue { content: \"\\e6a4\"; }\n@mixin icon-radio { content: \"\\e6a5\"; }\n@mixin icon-sphere { content: \"\\e6a6\"; }\n@mixin icon-reset { content: \"\\e6a7\"; }\n@mixin icon-smaller { content: \"\\e6a8\"; }\n@mixin icon-larger { content: \"\\e6a9\"; }\n@mixin icon-clock { content: \"\\e6aa\"; }\n@mixin icon-font { content: \"\\e6ab\"; }\n@mixin icon-maths { content: \"\\e6ac\"; }\n@mixin icon-grip { content: \"\\e6ad\"; }\n@mixin icon-rubric { content: \"\\e6ae\"; }\n@mixin icon-audio { content: \"\\e6af\"; }\n@mixin icon-grip-h { content: \"\\e6b0\"; }\n@mixin icon-magicwand { content: \"\\e6b1\"; }\n@mixin icon-loop { content: \"\\ea2e\"; }\n@mixin icon-calendar { content: \"\\e953\"; }\n@mixin icon-reload { content: \"\\e984\"; }\n@mixin icon-speed { content: \"\\e9a6\"; }\n@mixin icon-volume { content: \"\\ea27\"; }\n@mixin icon-contrast { content: \"\\e9d5\"; }\n@mixin icon-headphones { content: \"\\e910\"; }\n@mixin icon-compress { content: \"\\f066\"; }\n@mixin icon-map-o { content: \"\\f278\"; }\n@mixin icon-variable { content: \"\\e908\"; }\n@mixin icon-tooltip { content: \"\\e90c\"; }\n@mixin icon-globe { content: \"\\e9c9\"; }\n@mixin icon-highlighter { content: \"\\e90f\"; }\n@mixin icon-eliminate-crossed { content: \"\\e911\"; }\n@mixin icon-play-from-here { content: \"\\e912\"; }\n","@import 'inc/bootstrap';\n$classTreeVariables: (\n top: 27px,\n left: 0px,\n width: 275px,\n font-size: 1.2rem\n);\n\n.section-container {\n // some variations of flex children\n $flexCols: full, half, third, quarter;\n @for $i from 1 through length($flexCols) {\n $width: calc((100 / ($i)) 1%);\n $flexCol: #{nth($flexCols, $i)};\n .flex-container-#{$flexCol} {\n @include simple-flex-box($width);\n }\n }\n\n // 'whatever-is-left' container\n .flex-container-remaining {\n @include simple-flex-box(auto, 480px);\n }\n\n // main form on left hand side\n .flex-container-main-form {\n @include simple-flex-box(500px);\n margin: 0 20px 20px 0;\n width: 100%;\n\n .form-content {\n max-width: 100%;\n }\n }\n\n // the one for the sidebar that usually holds tree\n .flex-container-navi {\n @include simple-flex-box($treeSidebar * 1px);\n }\n\n // @todo all simple-flex-box references below should be removed once all templates are upgraded\n\n top: 0 !important;\n\n .section-header {\n border: none;\n }\n\n .content-panel {\n width: 100%;\n height: 100%;\n margin: 0;\n padding: 0;\n border: none !important;\n @include flex-container();\n }\n\n .tab-container {\n border: none;\n display: none;\n list-style-type: none;\n padding: 0;\n margin: 0;\n li {\n float: left;\n position: relative;\n top: 0;\n padding: 0;\n margin: 0 1px 0px 0;\n border-top: 1px solid $canvas !important;\n border-bottom: 1px solid $canvas !important;\n background: $canvas !important;\n a {\n top: 0 !important;\n margin-bottom: 0 !important;\n padding: 6px 16px;\n text-decoration: none;\n min-height: 32px;\n color: $textColor;\n float: left;\n }\n &.active,\n &:hover {\n border-bottom-color: whiten($info, 0.25) !important;\n border-top-color: whiten($info, 0.4) !important;\n background: whiten($info, 0.1) !important;\n a {\n background: transparent !important;\n border-color: transparent !important;\n color: $textHighlight !important;\n text-shadow: 1px 1px 0 black(0.2);\n }\n }\n &.disabled:hover {\n background: $canvas !important;\n a {\n cursor: not-allowed !important;\n color: $textColor !important;\n }\n }\n }\n }\n\n .ui-container {\n display: none;\n background: $canvas;\n @include simple-flex-box($treeSidebar * 1px);\n border-right: 1px $uiGeneralContentBorder solid;\n .block-title {\n @include font-size(14);\n padding: 2px 8px;\n margin: 0;\n }\n .tree-action-bar-box {\n margin: 10px 0;\n opacity: 0;\n &.active {\n opacity: 1;\n @include vendor-prefix(opacity, 0.25s ease-in-out, property, (-webkit-, -moz-, ''));\n }\n }\n }\n\n .content-container {\n border: none;\n @include simple-flex-box();\n overflow: auto;\n }\n\n .content-toolbar {\n height: 2rem;\n display: flex;\n flex-direction: row;\n justify-content: flex-end;\n }\n\n .toggle-modal-button {\n user-select: none;\n margin: 0 2rem;\n .icon-add {\n font-size: 1.6rem;\n position: relative;\n top: 2px;\n margin-right: 8px;\n }\n }\n\n .content-block {\n padding: 20px;\n overflow-y: auto;\n @include flex-container(wrap);\n & > .grid-container {\n width: 100%;\n }\n\n .data-container-wrapper {\n padding: 0px 20px 0 0;\n &:before,\n &:after {\n content: ' ';\n display: table;\n }\n &:after {\n clear: both;\n }\n & > section,\n .data-container {\n width: 260px;\n margin: 0 20px 20px 0;\n float: left;\n @include simple-border();\n &.double {\n width: 540px;\n }\n .emptyContentFooter {\n display: none;\n }\n .tree {\n border: none;\n max-width: none;\n max-height: none;\n }\n form {\n background: none;\n border: none;\n margin: 0;\n padding: 0;\n }\n & > header,\n .ui-widget-header {\n background: $canvas;\n border-width: 0px !important;\n border-bottom: 1px #ddd solid !important;\n h1,\n h6 {\n padding: 4px;\n margin: 0;\n @include font-size(14);\n }\n }\n & > div,\n .ui-widget-content,\n .container-content {\n border-width: 0px !important;\n overflow-y: auto;\n min-height: 250px;\n padding: 5px;\n .icon-grip {\n cursor: move;\n }\n }\n\n & > footer {\n min-height: 33px;\n }\n & > footer,\n .data-container-footer {\n background: $canvas;\n text-align: right !important;\n padding: 4px;\n border-width: 0px !important;\n border-top: 1px #ddd solid !important;\n .square {\n width: 28px;\n span {\n padding: 0;\n left: 0;\n }\n }\n }\n ol {\n margin: 0 0 0 15px;\n padding: 10px;\n }\n }\n }\n\n #form-container.ui-widget-content {\n border: none !important;\n }\n form:not(.list-container) {\n border: 1px $uiGeneralContentBorder solid;\n background: $canvas;\n padding: 30px;\n @include simple-border();\n }\n [class^='btn-'],\n [class=' btn-'] {\n margin: 0 2px;\n }\n }\n}\n\n.search-modal {\n width: 100% !important;\n // Increasing specificity\n &.search-modal {\n max-height: 100%;\n min-height: 320px;\n height: 100%;\n padding: 0px;\n }\n .ui-container {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n padding: 64px 0px 20px 20px;\n .filters-container {\n flex: 1 1 auto;\n height: 100%;\n min-height: 0;\n display: flex;\n flex-direction: column;\n }\n .basic-search-container {\n padding-right: 20px;\n flex: 0 0 auto;\n .class-filter-container {\n cursor: pointer;\n z-index: 2;\n }\n }\n .filter-container {\n position: relative;\n margin-bottom: 8px;\n &:last-child {\n padding-bottom: 16px;\n }\n > .icon-find,\n > .icon-folder {\n position: absolute;\n top: 7px;\n left: 8px;\n color: #666;\n }\n .icon-down {\n position: absolute;\n top: 1px;\n right: 1px;\n padding: 5px;\n background: white;\n }\n > input,\n > textarea {\n width: 100%;\n padding-left: 28px;\n }\n .class-filter {\n cursor: pointer;\n resize: none;\n white-space: nowrap;\n overflow: hidden;\n &[readonly]{\n opacity: 1 !important;\n }\n }\n .class-tree {\n display: none;\n position: absolute;\n top: map-get($classTreeVariables, top);\n left: map-get($classTreeVariables, left);\n width: map-get($classTreeVariables, width);\n font-size: map-get($classTreeVariables, font-size);\n\n main {\n overflow-y: auto;\n border: 1px solid black;\n }\n }\n }\n .buttons-container {\n flex: 0 0 auto;\n padding-right: 4px;\n display: flex;\n justify-content: space-between;\n button {\n flex: 1 1 auto;\n margin-right: 16px;\n vertical-align: top;\n }\n .btn-transparent {\n background-color: transparent;\n border: 1px solid black;\n color: black;\n text-shadow: none;\n }\n }\n }\n .content-container {\n @media screen and (min-width: 840px) {\n padding: 44px 64px 64px;\n }\n .no-datatable-container {\n display: flex;\n flex-direction: column;\n align-items: center;\n .no-datatable-icon {\n color: $lightBlueGrey;\n font-size: 3.5em;\n margin-bottom: 30px;\n }\n }\n }\n\n // Overwrite some not customizable styles of datatable and pagination components\n .go-to-item {\n background-color: transparent !important;\n border: 1px solid black;\n color: black !important;\n text-shadow: none !important;\n }\n\n .actions {\n width: 12%;\n }\n\n // Custom class for close modal button, so it positioned on the top-left corner instead of top-right (default)\n .modal-close-left {\n position: absolute;\n left: 20px;\n top: 20px;\n cursor: pointer;\n font-weight: bold;\n color: $textColor !important;\n background-color: transparent;\n padding: 0;\n height: 24px;\n .icon-close {\n font-size: 2.4rem;\n }\n }\n}\n\n","@import 'inc/bootstrap';\n$classTreeVariables: (\n top: 27px,\n left: 0px,\n width: 275px,\n font-size: 1.2rem\n);\n\n.section-container {\n // some variations of flex children\n $flexCols: full, half, third, quarter;\n @for $i from 1 through length($flexCols) {\n $width: calc((100 / ($i)) 1%);\n $flexCol: #{nth($flexCols, $i)};\n .flex-container-#{$flexCol} {\n @include simple-flex-box($width);\n }\n }\n\n // 'whatever-is-left' container\n .flex-container-remaining {\n @include simple-flex-box(auto, 480px);\n }\n\n // main form on left hand side\n .flex-container-main-form {\n @include simple-flex-box(500px);\n margin: 0 20px 20px 0;\n width: 100%;\n\n .form-content {\n max-width: 100%;\n }\n }\n\n // the one for the sidebar that usually holds tree\n .flex-container-navi {\n @include simple-flex-box($treeSidebar * 1px);\n }\n\n // @todo all simple-flex-box references below should be removed once all templates are upgraded\n\n top: 0 !important;\n\n .section-header {\n border: none;\n }\n\n .content-panel {\n width: 100%;\n height: 100%;\n margin: 0;\n padding: 0;\n border: none !important;\n @include flex-container();\n }\n\n .tab-container {\n border: none;\n display: none;\n list-style-type: none;\n padding: 0;\n margin: 0;\n li {\n float: left;\n position: relative;\n top: 0;\n padding: 0;\n margin: 0 1px 0px 0;\n border-top: 1px solid $canvas !important;\n border-bottom: 1px solid $canvas !important;\n background: $canvas !important;\n a {\n top: 0 !important;\n margin-bottom: 0 !important;\n padding: 6px 16px;\n text-decoration: none;\n min-height: 32px;\n color: $textColor;\n float: left;\n }\n &.active,\n &:hover {\n border-bottom-color: whiten($info, 0.25) !important;\n border-top-color: whiten($info, 0.4) !important;\n background: whiten($info, 0.1) !important;\n a {\n background: transparent !important;\n border-color: transparent !important;\n color: $textHighlight !important;\n text-shadow: 1px 1px 0 black(0.2);\n }\n }\n &.disabled:hover {\n background: $canvas !important;\n a {\n cursor: not-allowed !important;\n color: $textColor !important;\n }\n }\n }\n }\n\n .ui-container {\n display: none;\n background: $canvas;\n @include simple-flex-box($treeSidebar * 1px);\n border-right: 1px $uiGeneralContentBorder solid;\n .block-title {\n @include font-size(14);\n padding: 2px 8px;\n margin: 0;\n }\n .tree-action-bar-box {\n margin: 10px 0;\n opacity: 0;\n &.active {\n opacity: 1;\n @include vendor-prefix(opacity, 0.25s ease-in-out, property, (-webkit-, -moz-, ''));\n }\n }\n }\n\n .content-container {\n border: none;\n @include simple-flex-box();\n overflow: auto;\n }\n\n .content-toolbar {\n height: 2rem;\n display: flex;\n flex-direction: row;\n justify-content: flex-end;\n }\n\n .toggle-modal-button {\n user-select: none;\n margin: 0 2rem;\n .icon-add {\n font-size: 1.6rem;\n position: relative;\n top: 2px;\n margin-right: 8px;\n }\n }\n\n .content-block {\n padding: 20px;\n overflow-y: auto;\n @include flex-container(wrap);\n & > .grid-container {\n width: 100%;\n }\n\n .data-container-wrapper {\n padding: 0px 20px 0 0;\n &:before,\n &:after {\n content: ' ';\n display: table;\n }\n &:after {\n clear: both;\n }\n & > section,\n .data-container {\n width: 260px;\n margin: 0 20px 20px 0;\n float: left;\n @include simple-border();\n &.double {\n width: 540px;\n }\n .emptyContentFooter {\n display: none;\n }\n .tree {\n border: none;\n max-width: none;\n max-height: none;\n }\n form {\n background: none;\n border: none;\n margin: 0;\n padding: 0;\n }\n & > header,\n .ui-widget-header {\n background: $canvas;\n border-width: 0px !important;\n border-bottom: 1px #ddd solid !important;\n h1,\n h6 {\n padding: 4px;\n margin: 0;\n @include font-size(14);\n }\n }\n & > div,\n .ui-widget-content,\n .container-content {\n border-width: 0px !important;\n overflow-y: auto;\n min-height: 250px;\n padding: 5px;\n .icon-grip {\n cursor: move;\n }\n }\n\n & > footer {\n min-height: 33px;\n }\n & > footer,\n .data-container-footer {\n background: $canvas;\n text-align: right !important;\n padding: 4px;\n border-width: 0px !important;\n border-top: 1px #ddd solid !important;\n .square {\n width: 28px;\n span {\n padding: 0;\n left: 0;\n }\n }\n }\n ol {\n margin: 0 0 0 15px;\n padding: 10px;\n }\n }\n }\n\n #form-container.ui-widget-content {\n border: none !important;\n }\n form:not(.list-container) {\n border: 1px $uiGeneralContentBorder solid;\n background: $canvas;\n padding: 30px;\n @include simple-border();\n }\n [class^='btn-'],\n [class*=' btn-'] {\n margin: 0 2px;\n }\n }\n}\n\n.search-modal {\n width: 100% !important;\n // Increasing specificity\n &.search-modal {\n max-height: 100%;\n min-height: 320px;\n height: 100%;\n padding: 0px;\n }\n .ui-container {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n padding: 64px 0px 20px 20px;\n .filters-container {\n flex: 1 1 auto;\n height: 100%;\n min-height: 0;\n display: flex;\n flex-direction: column;\n }\n .basic-search-container {\n padding-right: 20px;\n flex: 0 0 auto;\n .class-filter-container {\n cursor: pointer;\n z-index: 2;\n }\n }\n .filter-container {\n position: relative;\n margin-bottom: 8px;\n &:last-child {\n padding-bottom: 16px;\n }\n > .icon-find,\n > .icon-folder {\n position: absolute;\n top: 7px;\n left: 8px;\n color: #666;\n }\n .icon-down {\n position: absolute;\n top: 1px;\n right: 1px;\n padding: 5px;\n background: white;\n }\n > input,\n > textarea {\n width: 100%;\n padding-left: 28px;\n }\n .class-filter {\n cursor: pointer;\n resize: none;\n white-space: nowrap;\n overflow: hidden;\n &[readonly]{\n opacity: 1 !important;\n }\n }\n .class-tree {\n display: none;\n position: absolute;\n top: map-get($classTreeVariables, top);\n left: map-get($classTreeVariables, left);\n width: map-get($classTreeVariables, width);\n font-size: map-get($classTreeVariables, font-size);\n\n main {\n overflow-y: auto;\n border: 1px solid black;\n }\n }\n }\n .buttons-container {\n flex: 0 0 auto;\n padding-right: 4px;\n display: flex;\n justify-content: space-between;\n button {\n flex: 1 1 auto;\n margin-right: 16px;\n vertical-align: top;\n }\n .btn-transparent {\n background-color: transparent;\n border: 1px solid black;\n color: black;\n text-shadow: none;\n }\n }\n }\n .content-container {\n @media screen and (min-width: 840px) {\n padding: 44px 64px 64px;\n }\n .no-datatable-container {\n display: flex;\n flex-direction: column;\n align-items: center;\n .no-datatable-icon {\n color: $lightBlueGrey;\n font-size: 3.5em;\n margin-bottom: 30px;\n }\n }\n }\n\n // Overwrite some not customizable styles of datatable and pagination components\n .go-to-item {\n background-color: transparent !important;\n border: 1px solid black;\n color: black !important;\n text-shadow: none !important;\n }\n\n .actions {\n width: 12%;\n }\n\n // Custom class for close modal button, so it positioned on the top-left corner instead of top-right (default)\n .modal-close-left {\n position: absolute;\n left: 20px;\n top: 20px;\n cursor: pointer;\n font-weight: bold;\n color: $textColor !important;\n background-color: transparent;\n padding: 0;\n height: 24px;\n .icon-close {\n font-size: 2.4rem;\n }\n }\n}\n\n","// buttons and alerts\n$success: rgb(14, 145, 75);\n$info: rgb(14, 93, 145);\n$warning: rgb(216, 174, 91);\n$danger: rgb(201, 96, 67);\n$error: rgb(186, 18, 43);\n$activeInteraction: rgb(195, 90, 19);\n\n// corporate identity\n$logoRed: rgb(186, 18, 43);\n$grey: rgb(173, 161, 148);\n$darkBlueGrey: rgb(164, 187, 197);\n$mediumBlueGrey: rgb(193, 212, 220);\n$lightBlueGrey: rgb(228, 236, 239);\n$brownRedGrey: rgb(154, 137, 123);\n$darkBrown: rgb(111, 99, 89);\n$websiteBorder: rgb(141, 148, 158);\n\n// ui elements, these should only variations of the above\n// naming convention: jQueryUi theme roller -> camelCase\n\n$textColor: #222;\n$textHighlight: white;\n$textSecondary: #737373;\n$shadowColor: rgba(0, 0, 0, 0.25);\n\n$modalBorderColor: #dddfe2;\n$searchInp: #dddfe2;\n\n$uiGeneralContentBg: white();\n$uiGeneralContentBorder: #ddd;\n\n$uiHeaderBg: #d4d5d7;\n\n$uiClickableDefaultBg: #f3f1ef;\n$uiClickableHoverBg: whiten($info, 0.2);\n//$uiClickableActiveBg: $uiHeaderBg;\n$uiClickableActiveBg: whiten($websiteBorder, 0.2);\n//$uiClickableActiveBg: #aaa;\n\n$uiSelectableSelectedBg: whiten($info, 0.2);\n$uiSelectableSelectedHoverBg: whiten($info, 0.1);\n$uiSelectableHoverBg: whiten($info, 0.9);\n\n$uiOverlay: $lightBlueGrey;\n\n// new layout. Implemented now only for review panel\n$uiReviewPanelBg: #f2f2f2;\n$uiReviewPanelTextDisabled: hsl(0, 0%, 45%);\n$uiReviewPanelTextDefault: hsl(0, 0%, 12%);\n$uiReviewPanelBgDefault: $uiGeneralContentBg;\n$uiReviewPanelPrimaryHighlight: hsl(208, 100%, 32%);\n$uiReviewPanelBgInverted: $uiReviewPanelTextDefault;\n$uiReviewPanelTextInverted: $uiGeneralContentBg;\n\n// sidebars etc.\n$canvas: mix(#fff, $grey, 85%);\n\n// colors taken from feedback.scss\n$successBgColor: whiten($success, 0.8);\n$successBorderColor: whiten($success, 0.1);\n\n$infoBgColor: whiten($info, 0.8);\n$infoBorderColor: whiten($info, 0.1);\n\n$warningBgColor: whiten($warning, 0.8);\n$warningBorderColor: whiten($warning, 0.1);\n\n$dangerBgColor: whiten($danger, 0.8);\n$dangerBorderColor: whiten($danger, 0.1);\n\n$errorBgColor: whiten($error, 0.8);\n$errorBorderColor: whiten($error, 0.1);\n\n$darkBar: rgb(51, 51, 51);\n$darkBarTxt: rgb(230, 230, 230);\n$darkBarIcon: rgb(220, 220, 220);\n\n$actionLinkColor: #276d9b;\n$actionLinkHoverColor: #4f83a7;\n\n$colorWheel-01: #c3ba13;\n$colorWheel-02: #84a610;\n$colorWheel-03: #2b8e0e;\n$colorWheel-04: #0f9787;\n$colorWheel-05: #0e5d91;\n$colorWheel-06: #0d2689;\n$colorWheel-07: #400d83;\n$colorWheel-08: #960e7d;\n$colorWheel-09: #ba122b;\n$colorWheel-10: #c34713;\n$colorWheel-11: #c36f13;\n$colorWheel-12: #c39413;\n"]}
1	+ {"version":3,"sources":["../../../scss/inc/_functions.scss","../../../scss/inc/fonts/_tao-icon-vars.scss","../scss/searchModal.scss%23sass","../scss/searchModal.scss","../../../scss/inc/_colors.scss"],"names":[],"mappings":"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","file":"searchModal.css","sourcesContent":["@mixin iterate-sprite($iconList, $x, $y, $direction, $prefix:'') {\n @each $icon in $iconList {\n #{$prefix}#{$icon} {\n background-position: $x * 1px $y * 1px;\n }\n @if $direction == 'x' {\n $x: $x - 16;\n } @else {\n $y: $y - 16;\n }\n }\n}\n\n/\nUsage:\n- linear-gradient((color1, color2, color3)) - returns linear-gradient with evenly distributed colors,\n if 3 colors used then the position of each will be 33,33%\n- linear-gradient((color1 0%, color2 30%, color3 80%)) - returns linear-gradient with manually distributed colors,\n first param - color, second - position. Also you can use px or other valid units for set position.\n/\n@mixin linear-gradient($colorList, $direction: 'to right') {\n $percentage: 0;\n $units: '%';\n $count: length($colorList);\n $increment: calc(100 / ($count - 1));\n $css: #{$direction + ', '};\n $sep: ', ';\n @each $colorItem in $colorList {\n $color: $colorItem;\n @if (length($colorItem) > 1) {\n $color: nth($colorItem, 1);\n $percentage: nth($colorItem, 2);\n $units: '';\n }\n @if ($percentage >= 100 or index($colorList, $colorItem) == $count) {\n $sep: '';\n }\n $css: #{$css + $color + ' ' + $percentage + $units + $sep};\n $percentage: $percentage + $increment;\n }\n background: linear-gradient( #{$css} );\n}\n\n@mixin grid-unit($span, $numCols: 12, $gutter: 0) {\n $gridPx: 840;\n $rawSpanPx: calc((($gridPx - ($numCols * $gutter)) / $numCols));\n $spanPx: $rawSpanPx * $span + (($span - 1) * $gutter);\n $spanPercent: widthPerc($spanPx, $gridPx);\n $marginPercent: widthPerc($gutter, $gridPx);\n margin-left: $marginPercent;\n width: $spanPercent;\n}\n\n\n@mixin vendor-prefix($property, $value, $whatToPrefix: property, $prefixes: (-webkit-, -moz-, -ms-, -o-, '')) {\n @if $whatToPrefix == 'property' {\n @each $prefix in $prefixes {\n #{$prefix + $property}: #{$value};\n }\n }\n @else if $whatToPrefix == 'value' {\n @each $prefix in $prefixes {\n #{$property}: #{$prefix + $value};\n }\n }\n}\n@mixin flex-container($wrapBehavior: nowrap, $direction : row) {\n @include vendor-prefix(display, flex, value, (-ms-, -webkit-, ''));\n\n @include vendor-prefix(flex-direction, $direction, property, (-ms-, -webkit-, ''));\n @include vendor-prefix(flex-wrap, $wrapBehavior, property, (-ms-, -webkit-, ''));\n\n @include vendor-prefix(justify-content, flex-start, property, (-webkit-, ''));\n\n @include vendor-prefix(align-content, flex-start, property, (-webkit-, ''));\n\n @include vendor-prefix(align-items, stretch, property, (-webkit-, ''));\n}\n\n@mixin simple-flex-box($width: auto, $minWidth: 1) {\n\n @include vendor-prefix(order, 0, property, (-ms-, -webkit-, ''));\n flex-item-align: stretch;\n -ms-flex-item-align: stretch;\n @include vendor-prefix(align-self, stretch, property, (-webkit-, ''));\n\n // if both, min width and width are set, width will win this conflict\n @if ($width == auto) {\n @if ($minWidth != 1) {\n @include vendor-prefix(flex, 1 1 $minWidth, property, (-ms-, -webkit-, ''));\n }\n @else {\n @include vendor-prefix(flex, 1 1 auto, property, (-ms-, -webkit-, ''));\n // @see https://developer.mozilla.org/en-US/docs/Web/CSS/flex-basis#Values\n // for a discussion auto vs. main-size\n @include vendor-prefix(flex, 1 1, property, (-ms-, -webkit-, ''));\n }\n }\n @else {\n @include vendor-prefix(flex, 0 0 $width, property, (-ms-, -webkit-, ''));\n }\n}\n\n\n@mixin box-shadow($horiz: 1px, $vert: 1px, $blur: 2px, $spread: 0, $color: rgba(0, 0, 0, .2)) {\n @include vendor-prefix(box-shadow, $horiz $vert $blur $spread $color, property);\n}\n\n@mixin simple-border($color: #ddd) {\n border: 1px solid $color;\n border-radius: 2px;\n -webkit-border-radius: 2px;\n}\n\n@mixin border-radius($radius: 2) {\n -moz-border-radius: $radius * 1px;\n -webkit-border-radius: $radius * 1px;\n border-radius: $radius * 1px;\n}\n\n@mixin border-radius-top($radius: 2) {\n -webkit-border-top-left-radius: $radius * 1px;\n -webkit-border-top-right-radius: $radius * 1px;\n -moz-border-radius-topleft: $radius * 1px;\n -moz-border-radius-topright: $radius * 1px;\n border-top-left-radius: $radius * 1px;\n border-top-right-radius: $radius * 1px;\n}\n\n@mixin border-radius-bottom($radius: 2) {\n -webkit-border-bottom-right-radius: $radius * 1px;\n -webkit-border-bottom-left-radius: $radius * 1px;\n -moz-border-radius-bottomright: $radius * 1px;\n -moz-border-radius-bottomleft: $radius * 1px;\n border-bottom-right-radius: $radius * 1px;\n border-bottom-left-radius: $radius * 1px;\n}\n\n@mixin border-radius-left($radius: 2) {\n -webkit-border-top-left-radius: $radius * 1px;\n -webkit-border-bottom-left-radius: $radius * 1px;\n -moz-border-radius-topleft: $radius * 1px;\n -moz-border-radius-bottomleft: $radius * 1px;\n border-top-left-radius: $radius * 1px;\n border-bottom-left-radius: $radius * 1px;\n}\n\n@mixin border-radius-right($radius: 2) {\n -webkit-border-top-right-radius: $radius * 1px;\n -webkit-border-bottom-right-radius: $radius * 1px;\n -moz-border-radius-topright: $radius * 1px;\n -moz-border-radius-bottomright: $radius * 1px;\n border-top-right-radius: $radius * 1px;\n border-bottom-right-radius: $radius * 1px;\n}\n\n@mixin border-radius-top-left($radius: 2) {\n -webkit-border-top-left-radius: $radius * 1px;\n -moz-border-radius-topleft: $radius * 1px;\n border-top-left-radius: $radius * 1px;\n}\n\n@mixin border-radius-top-right($radius: 2) {\n -webkit-border-top-right-radius: $radius * 1px;\n -moz-border-radius-topright: $radius * 1px;\n border-top-right-radius: $radius * 1px;\n}\n\n@mixin border-radius-bottom-right($radius: 2) {\n -webkit-border-bottom-right-radius: $radius * 1px;\n -moz-border-radius-bottomright: $radius * 1px;\n border-bottom-right-radius: $radius * 1px;\n}\n\n@mixin border-radius-bottom-left($radius: 2) {\n -webkit-border-bottom-left-radius: $radius * 1px;\n -moz-border-radius-bottomleft: $radius * 1px;\n border-bottom-left-radius: $radius * 1px;\n}\n\n@mixin border-box() {\n -moz-box-sizing: border-box;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n}\n\n@function whiten($color, $white: 0.3) {\n @return mix(#fff, $color, ($white * 100) * 1%);\n}\n\n@function blacken($color, $black: 0.3) {\n @return mix(#000, $color, ($black * 100) * 1%);\n}\n\n@function widthPerc($colWidth, $context) {\n @return calc(($colWidth * 100 / $context) * 1%)\n}\n\n@function remDist($fontSizePx) {\n @return calc(($fontSizePx / 10) * 1rem)\n}\n\n@function black($alpha: 1) {\n @return (rgba(0, 0, 0, $alpha))\n}\n\n@function white($alpha: 1) {\n @return (rgba(255, 255, 255, $alpha))\n}\n\n@mixin font-size($remPx, $important: false) {\n @if $important == true {\n font-size: calc(($remPx) * 1px) !important;\n font-size: calc(($remPx / 10) * 1rem) !important;\n }\n @else {\n font-size: calc(($remPx) * 1px);\n font-size: calc(($remPx / 10) * 1rem);\n }\n}\n\n\n@mixin keyframes($name) {\n @-o-keyframes #{$name} { @content };\n @-moz-keyframes #{$name} { @content };\n @-webkit-keyframes #{$name} { @content };\n @keyframes #{$name} { @content };\n}\n\n\n@mixin animation($value, $type:'') {\n $animation: animation;\n @if $type != '' {\n $animation: $animation + '-' + $type;\n }\n @include vendor-prefix($animation, $value, property);\n}\n\n/// CSS transition mixin to the current selection (apply also vendor prefixes).\n/// See <https://developer.mozilla.org/en-US/docs/Web/CSS/transition> for the values\n///\n/// @param {property} [$type = all] the CSS property to apply the transition to\n/// @param {time} [$duration = .5s] the transition property\n/// @param {timing-function} [$effect = ease-out] the transition property\n@mixin transition($type : all, $duration : 0.5s, $effect : ease-out, $delay : 0s){\n @include vendor-prefix(transition, $type + ', ' + $duration + ', ' + $effect + ', ' + $delay, property);\n}\n\n@mixin fade($duration: 1s){\n\n @include keyframes(fade) {\n 0% {opacity:0;}\n 50% {opacity:1;}\n 100% {opacity:0;}\n }\n\n @include vendor-prefix(animation, fade 1s forwards, property);\n}\n\n@mixin repeat(){\n @include animation(infinite, iteration-count);\n}\n\n@mixin largeHeading() {\n @include font-size(20);\n font-family: $headingFont;\n font-style: normal;\n}\n\n@mixin disableSelect() {\n @include vendor-prefix(user-select, none, property);\n}\n\n/* based on \"visually-hidden\" mixin in LDS for accessibility goals /\n@mixin visuallyHidden() {\n position: absolute;\n width: 1px;\n height: 1px;\n overflow: hidden;\n clip: rect(1px, 1px, 1px, 1px);\n margin: 0;\n padding: 0;\n}\n","/ Do not edit /@mixin tao-icon-setup {\n / use !important to prevent issues with browser extensions that change fonts /\n font-family: 'tao' !important;\n speak: never;\n font-style: normal;\n font-weight: normal;\n font-variant: normal;\n text-transform: none;\n line-height: 1;\n\n / Better Font Rendering =========== /\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n\n@mixin icon-align-center { content: \"\\e92a\"; }\n@mixin icon-multiple-magicwand { content: \"\\e929\"; }\n@mixin icon-sd-import { content: \"\\e91f\"; }\n@mixin icon-sd-export { content: \"\\e924\"; }\n@mixin icon-browse { content: \"\\e925\"; }\n@mixin icon-minus { content: \"\\e926\"; }\n@mixin icon-plus { content: \"\\e927\"; }\n@mixin icon-sd-save { content: \"\\e928\"; }\n@mixin icon-back-button { content: \"\\e91e\"; }\n@mixin icon-japan-incorrect { content: \"\\e91b\"; }\n@mixin icon-japan-correct { content: \"\\e91c\"; }\n@mixin icon-japan-partial { content: \"\\e91d\"; }\n@mixin icon-score-partial { content: \"\\e91a\"; }\n@mixin icon-furigana { content: \"\\e919\"; }\n@mixin icon-add-subsection { content: \"\\e918\"; }\n@mixin icon-info-bare { content: \"\\e923\"; }\n@mixin icon-bookmark-outline { content: \"\\e922\"; }\n@mixin icon-bookmark { content: \"\\e921\"; }\n@mixin icon-indicator { content: \"\\e920\"; }\n@mixin icon-wrap-inline { content: \"\\e915\"; }\n@mixin icon-wrap-left { content: \"\\e916\"; }\n@mixin icon-wrap-right { content: \"\\e917\"; }\n@mixin icon-offline { content: \"\\e913\"; }\n@mixin icon-online { content: \"\\e914\"; }\n@mixin icon-tab { content: \"\\e90d\"; }\n@mixin icon-untab { content: \"\\e90e\"; }\n@mixin icon-multi-select { content: \"\\e90b\"; }\n@mixin icon-clipboard { content: \"\\e90a\"; }\n@mixin icon-filebox { content: \"\\e909\"; }\n@mixin icon-click-to-speak { content: \"\\e907\"; }\n@mixin icon-speech-bubble { content: \"\\f0e5\"; }\n@mixin icon-microphone { content: \"\\f130\"; }\n@mixin icon-microphone-off { content: \"\\f131\"; }\n@mixin icon-disconnect { content: \"\\e905\"; }\n@mixin icon-connect { content: \"\\e906\"; }\n@mixin icon-eliminate { content: \"\\e904\"; }\n@mixin icon-wheelchair { content: \"\\e903\"; }\n@mixin icon-text-marker { content: \"\\e902\"; }\n@mixin icon-unshield { content: \"\\e32a\"; }\n@mixin icon-shield { content: \"\\e8e8\"; }\n@mixin icon-tree { content: \"\\e6b4\"; }\n@mixin icon-home { content: \"\\e6b3\"; }\n@mixin icon-shared-file { content: \"\\e6b2\"; }\n@mixin icon-end-attempt { content: \"\\e603\"; }\n@mixin icon-icon { content: \"\\f1c5\"; }\n@mixin icon-radio-bg { content: \"\\e600\"; }\n@mixin icon-checkbox-bg { content: \"\\e601\"; }\n@mixin icon-tag { content: \"\\e602\"; }\n@mixin icon-style { content: \"\\e604\"; }\n@mixin icon-ownership-transfer { content: \"\\e605\"; }\n@mixin icon-property-advanced { content: \"\\e606\"; }\n@mixin icon-property-add { content: \"\\e607\"; }\n@mixin icon-repository-add { content: \"\\e608\"; }\n@mixin icon-repository-remove { content: \"\\e609\"; }\n@mixin icon-repository { content: \"\\e60a\"; }\n@mixin icon-result-server { content: \"\\e60b\"; }\n@mixin icon-folder { content: \"\\e60c\"; }\n@mixin icon-folder-open { content: \"\\e60d\"; }\n@mixin icon-left { content: \"\\e60e\"; }\n@mixin icon-right { content: \"\\e60f\"; }\n@mixin icon-up { content: \"\\e610\"; }\n@mixin icon-down { content: \"\\e611\"; }\n@mixin icon-undo { content: \"\\e612\"; }\n@mixin icon-redo { content: \"\\e613\"; }\n@mixin icon-screen { content: \"\\e614\"; }\n@mixin icon-laptop { content: \"\\e615\"; }\n@mixin icon-tablet { content: \"\\e616\"; }\n@mixin icon-phone { content: \"\\e617\"; }\n@mixin icon-move { content: \"\\e618\"; }\n@mixin icon-bin { content: \"\\e619\"; }\n@mixin icon-shuffle { content: \"\\e61a\"; }\n@mixin icon-print { content: \"\\e61b\"; }\n@mixin icon-tools { content: \"\\e61c\"; }\n@mixin icon-settings { content: \"\\e61d\"; }\n@mixin icon-video { content: \"\\e61e\"; }\n@mixin icon-find { content: \"\\e61f\"; }\n@mixin icon-image { content: \"\\e620\"; }\n@mixin icon-edit { content: \"\\e621\"; }\n@mixin icon-document { content: \"\\e622\"; }\n@mixin icon-resize-grid { content: \"\\e623\"; }\n@mixin icon-resize { content: \"\\e624\"; }\n@mixin icon-help { content: \"\\e625\"; }\n@mixin icon-mobile-menu { content: \"\\e626\"; }\n@mixin icon-fix { content: \"\\e627\"; }\n@mixin icon-unlock { content: \"\\e628\"; }\n@mixin icon-lock { content: \"\\e629\"; }\n@mixin icon-ul { content: \"\\e62a\"; }\n@mixin icon-ol { content: \"\\e62b\"; }\n@mixin icon-email { content: \"\\e62c\"; }\n@mixin icon-download { content: \"\\e62d\"; }\n@mixin icon-logout { content: \"\\e62e\"; }\n@mixin icon-login { content: \"\\e62f\"; }\n@mixin icon-spinner { content: \"\\e630\"; }\n@mixin icon-preview { content: \"\\e631\"; }\n@mixin icon-external { content: \"\\e632\"; }\n@mixin icon-time { content: \"\\e633\"; }\n@mixin icon-save { content: \"\\e634\"; }\n@mixin icon-warning { content: \"\\e635\"; }\n@mixin icon-add { content: \"\\e636\"; }\n@mixin icon-error { content: \"\\e900\"; }\n@mixin icon-close { content: \"\\e637\"; }\n@mixin icon-success { content: \"\\e638\"; }\n@mixin icon-remove { content: \"\\e639\"; }\n@mixin icon-info { content: \"\\e63a\"; }\n@mixin icon-danger { content: \"\\e63b\"; }\n@mixin icon-users { content: \"\\e63c\"; }\n@mixin icon-user { content: \"\\e63d\"; }\n@mixin icon-test-taker { content: \"\\e63e\"; }\n@mixin icon-test-takers { content: \"\\e63f\"; }\n@mixin icon-item { content: \"\\e640\"; }\n@mixin icon-test { content: \"\\e641\"; }\n@mixin icon-delivery { content: \"\\e642\"; }\n@mixin icon-eye-slash { content: \"\\e643\"; }\n@mixin icon-result { content: \"\\e644\"; }\n@mixin icon-delivery-small { content: \"\\e645\"; }\n@mixin icon-upload { content: \"\\e646\"; }\n@mixin icon-result-small { content: \"\\e647\"; }\n@mixin icon-mobile-preview { content: \"\\e648\"; }\n@mixin icon-extension { content: \"\\e649\"; }\n@mixin icon-desktop-preview { content: \"\\e64a\"; }\n@mixin icon-tablet-preview { content: \"\\e64b\"; }\n@mixin icon-insert-horizontal-line { content: \"\\e64c\"; }\n@mixin icon-table { content: \"\\e64d\"; }\n@mixin icon-anchor { content: \"\\e64e\"; }\n@mixin icon-unlink { content: \"\\e64f\"; }\n@mixin icon-link { content: \"\\e650\"; }\n@mixin icon-right-left { content: \"\\e651\"; }\n@mixin icon-left-right { content: \"\\e652\"; }\n@mixin icon-special-character { content: \"\\e653\"; }\n@mixin icon-source { content: \"\\e654\"; }\n@mixin icon-new-page { content: \"\\e655\"; }\n@mixin icon-templates { content: \"\\e656\"; }\n@mixin icon-cut { content: \"\\e657\"; }\n@mixin icon-replace { content: \"\\e658\"; }\n@mixin icon-copy { content: \"\\e659\"; }\n@mixin icon-paste { content: \"\\e65a\"; }\n@mixin icon-select-all { content: \"\\e65b\"; }\n@mixin icon-paste-text { content: \"\\e65c\"; }\n@mixin icon-paste-word { content: \"\\e65d\"; }\n@mixin icon-bold { content: \"\\e65e\"; }\n@mixin icon-italic { content: \"\\e65f\"; }\n@mixin icon-underline { content: \"\\e660\"; }\n@mixin icon-subscript { content: \"\\e661\"; }\n@mixin icon-superscript { content: \"\\e662\"; }\n@mixin icon-strike-through { content: \"\\e663\"; }\n@mixin icon-decrease-indent { content: \"\\e664\"; }\n@mixin icon-increase-indent { content: \"\\e665\"; }\n@mixin icon-block-quote { content: \"\\e666\"; }\n@mixin icon-div-container { content: \"\\e667\"; }\n@mixin icon-align-left { content: \"\\e668\"; }\n@mixin icon-center { content: \"\\e669\"; }\n@mixin icon-align-right { content: \"\\e66a\"; }\n@mixin icon-justify { content: \"\\e66b\"; }\n@mixin icon-choice { content: \"\\e66c\"; }\n@mixin icon-inline-choice { content: \"\\e66d\"; }\n@mixin icon-match { content: \"\\e66e\"; }\n@mixin icon-associate { content: \"\\e66f\"; }\n@mixin icon-media { content: \"\\e670\"; }\n@mixin icon-graphic-order { content: \"\\e671\"; }\n@mixin icon-hotspot { content: \"\\e672\"; }\n@mixin icon-graphic-gap { content: \"\\e673\"; }\n@mixin icon-graphic-associate { content: \"\\e674\"; }\n@mixin icon-select-point { content: \"\\e675\"; }\n@mixin icon-pin { content: \"\\e676\"; }\n@mixin icon-import { content: \"\\e677\"; }\n@mixin icon-export { content: \"\\e678\"; }\n@mixin icon-move-item { content: \"\\e679\"; }\n@mixin icon-meta-data { content: \"\\e67a\"; }\n@mixin icon-slider { content: \"\\e67b\"; }\n@mixin icon-summary-report { content: \"\\e67c\"; }\n@mixin icon-text-entry { content: \"\\e67d\"; }\n@mixin icon-extended-text { content: \"\\e67e\"; }\n@mixin icon-eraser { content: \"\\e67f\"; }\n@mixin icon-row { content: \"\\e680\"; }\n@mixin icon-column { content: \"\\e681\"; }\n@mixin icon-text-color { content: \"\\e682\"; }\n@mixin icon-background-color { content: \"\\e683\"; }\n@mixin icon-spell-check { content: \"\\e684\"; }\n@mixin icon-polygon { content: \"\\e685\"; }\n@mixin icon-rectangle { content: \"\\e686\"; }\n@mixin icon-gap-match { content: \"\\e687\"; }\n@mixin icon-order { content: \"\\e688\"; }\n@mixin icon-hottext { content: \"\\e689\"; }\n@mixin icon-free-form { content: \"\\e68a\"; }\n@mixin icon-step-backward { content: \"\\e68b\"; }\n@mixin icon-fast-backward { content: \"\\e68c\"; }\n@mixin icon-backward { content: \"\\e68d\"; }\n@mixin icon-play { content: \"\\e68e\"; }\n@mixin icon-pause { content: \"\\e68f\"; }\n@mixin icon-stop { content: \"\\e690\"; }\n@mixin icon-forward { content: \"\\e691\"; }\n@mixin icon-fast-forward { content: \"\\e692\"; }\n@mixin icon-step-forward { content: \"\\e693\"; }\n@mixin icon-ellipsis { content: \"\\e694\"; }\n@mixin icon-circle { content: \"\\e695\"; }\n@mixin icon-target { content: \"\\e696\"; }\n@mixin icon-guide-arrow { content: \"\\e697\"; }\n@mixin icon-range-slider-right { content: \"\\e698\"; }\n@mixin icon-range-slider-left { content: \"\\e699\"; }\n@mixin icon-radio-checked { content: \"\\e69a\"; }\n@mixin icon-checkbox-indeterminate { content: \"\\e901\"; }\n@mixin icon-checkbox { content: \"\\e69b\"; }\n@mixin icon-checkbox-crossed { content: \"\\e69c\"; }\n@mixin icon-checkbox-checked { content: \"\\e69d\"; }\n@mixin icon-result-nok { content: \"\\e69e\"; }\n@mixin icon-result-ok { content: \"\\e69f\"; }\n@mixin icon-not-evaluated { content: \"\\e6a0\"; }\n@mixin icon-filter { content: \"\\e6a1\"; }\n@mixin icon-translate { content: \"\\e6a2\"; }\n@mixin icon-eject { content: \"\\e6a3\"; }\n@mixin icon-continue { content: \"\\e6a4\"; }\n@mixin icon-radio { content: \"\\e6a5\"; }\n@mixin icon-sphere { content: \"\\e6a6\"; }\n@mixin icon-reset { content: \"\\e6a7\"; }\n@mixin icon-smaller { content: \"\\e6a8\"; }\n@mixin icon-larger { content: \"\\e6a9\"; }\n@mixin icon-clock { content: \"\\e6aa\"; }\n@mixin icon-font { content: \"\\e6ab\"; }\n@mixin icon-maths { content: \"\\e6ac\"; }\n@mixin icon-grip { content: \"\\e6ad\"; }\n@mixin icon-rubric { content: \"\\e6ae\"; }\n@mixin icon-audio { content: \"\\e6af\"; }\n@mixin icon-grip-h { content: \"\\e6b0\"; }\n@mixin icon-magicwand { content: \"\\e6b1\"; }\n@mixin icon-loop { content: \"\\ea2e\"; }\n@mixin icon-calendar { content: \"\\e953\"; }\n@mixin icon-reload { content: \"\\e984\"; }\n@mixin icon-speed { content: \"\\e9a6\"; }\n@mixin icon-volume { content: \"\\ea27\"; }\n@mixin icon-contrast { content: \"\\e9d5\"; }\n@mixin icon-headphones { content: \"\\e910\"; }\n@mixin icon-compress { content: \"\\f066\"; }\n@mixin icon-map-o { content: \"\\f278\"; }\n@mixin icon-variable { content: \"\\e908\"; }\n@mixin icon-tooltip { content: \"\\e90c\"; }\n@mixin icon-globe { content: \"\\e9c9\"; }\n@mixin icon-highlighter { content: \"\\e90f\"; }\n@mixin icon-eliminate-crossed { content: \"\\e911\"; }\n@mixin icon-play-from-here { content: \"\\e912\"; }\n","@import 'inc/bootstrap';\n$classTreeVariables: (\n top: 27px,\n left: 0px,\n width: 275px,\n font-size: 1.2rem\n);\n\n.section-container {\n // some variations of flex children\n $flexCols: full, half, third, quarter;\n @for $i from 1 through length($flexCols) {\n $width: calc((100 / ($i)) 1%);\n $flexCol: #{nth($flexCols, $i)};\n .flex-container-#{$flexCol} {\n @include simple-flex-box($width);\n }\n }\n\n // 'whatever-is-left' container\n .flex-container-remaining {\n @include simple-flex-box(auto, 480px);\n }\n\n // main form on left hand side\n .flex-container-main-form {\n @include simple-flex-box(500px);\n margin: 0 20px 20px 0;\n width: 100%;\n\n .form-content {\n max-width: 100%;\n }\n }\n\n // the one for the sidebar that usually holds tree\n .flex-container-navi {\n @include simple-flex-box($treeSidebar * 1px);\n }\n\n // @todo all simple-flex-box references below should be removed once all templates are upgraded\n\n top: 0 !important;\n\n .section-header {\n border: none;\n }\n\n .content-panel {\n width: 100%;\n height: 100%;\n margin: 0;\n padding: 0;\n border: none !important;\n @include flex-container();\n }\n\n .tab-container {\n border: none;\n display: none;\n list-style-type: none;\n padding: 0;\n margin: 0;\n li {\n float: left;\n position: relative;\n top: 0;\n padding: 0;\n margin: 0 1px 0px 0;\n border-top: 1px solid $canvas !important;\n border-bottom: 1px solid $canvas !important;\n background: $canvas !important;\n a {\n top: 0 !important;\n margin-bottom: 0 !important;\n padding: 6px 16px;\n text-decoration: none;\n min-height: 32px;\n color: $textColor;\n float: left;\n }\n &.active,\n &:hover {\n border-bottom-color: whiten($info, 0.25) !important;\n border-top-color: whiten($info, 0.4) !important;\n background: whiten($info, 0.1) !important;\n a {\n background: transparent !important;\n border-color: transparent !important;\n color: $textHighlight !important;\n text-shadow: 1px 1px 0 black(0.2);\n }\n }\n &.disabled:hover {\n background: $canvas !important;\n a {\n cursor: not-allowed !important;\n color: $textColor !important;\n }\n }\n }\n }\n\n .ui-container {\n display: none;\n background: $canvas;\n @include simple-flex-box($treeSidebar * 1px);\n border-right: 1px $uiGeneralContentBorder solid;\n .block-title {\n @include font-size(14);\n padding: 2px 8px;\n margin: 0;\n }\n .tree-action-bar-box {\n margin: 10px 0;\n opacity: 0;\n &.active {\n opacity: 1;\n @include vendor-prefix(opacity, 0.25s ease-in-out, property, (-webkit-, -moz-, ''));\n }\n }\n }\n\n .content-container {\n border: none;\n @include simple-flex-box();\n overflow: auto;\n }\n\n .content-toolbar {\n height: 2rem;\n display: flex;\n flex-direction: row;\n justify-content: flex-end;\n }\n\n .toggle-modal-button {\n user-select: none;\n margin: 0 2rem;\n .icon-add {\n font-size: 1.6rem;\n position: relative;\n top: 2px;\n margin-right: 8px;\n }\n }\n\n .content-block {\n padding: 20px;\n overflow-y: auto;\n @include flex-container(wrap);\n & > .grid-container {\n width: 100%;\n }\n\n .data-container-wrapper {\n padding: 0px 20px 0 0;\n &:before,\n &:after {\n content: ' ';\n display: table;\n }\n &:after {\n clear: both;\n }\n & > section,\n .data-container {\n width: 260px;\n margin: 0 20px 20px 0;\n float: left;\n @include simple-border();\n &.double {\n width: 540px;\n }\n .emptyContentFooter {\n display: none;\n }\n .tree {\n border: none;\n max-width: none;\n max-height: none;\n }\n form {\n background: none;\n border: none;\n margin: 0;\n padding: 0;\n }\n & > header,\n .ui-widget-header {\n background: $canvas;\n border-width: 0px !important;\n border-bottom: 1px #ddd solid !important;\n h1,\n h6 {\n padding: 4px;\n margin: 0;\n @include font-size(14);\n }\n }\n & > div,\n .ui-widget-content,\n .container-content {\n border-width: 0px !important;\n overflow-y: auto;\n min-height: 250px;\n padding: 5px;\n .icon-grip {\n cursor: move;\n }\n }\n\n & > footer {\n min-height: 33px;\n }\n & > footer,\n .data-container-footer {\n background: $canvas;\n text-align: right !important;\n padding: 4px;\n border-width: 0px !important;\n border-top: 1px #ddd solid !important;\n .square {\n width: 28px;\n span {\n padding: 0;\n left: 0;\n }\n }\n }\n ol {\n margin: 0 0 0 15px;\n padding: 10px;\n }\n }\n }\n\n #form-container.ui-widget-content {\n border: none !important;\n }\n form:not(.list-container) {\n border: 1px $uiGeneralContentBorder solid;\n background: $canvas;\n padding: 30px;\n @include simple-border();\n }\n [class^='btn-'],\n [class=' btn-'] {\n margin: 0 2px;\n }\n }\n}\n\n.search-modal {\n width: 100% !important;\n // Increasing specificity\n &.search-modal {\n max-height: 100%;\n min-height: 320px;\n height: 100%;\n padding: 0px;\n }\n .ui-container {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n padding: 64px 0px 20px 20px;\n .filters-container {\n flex: 1 1 auto;\n height: 100%;\n min-height: 0;\n display: flex;\n flex-direction: column;\n }\n .basic-search-container {\n padding-right: 20px;\n flex: 0 0 auto;\n .class-filter-container {\n cursor: pointer;\n z-index: 2;\n }\n }\n .filter-container {\n position: relative;\n z-index: 1;\n margin-bottom: 8px;\n &:last-child {\n padding-bottom: 16px;\n }\n > .icon-find,\n > .icon-folder {\n position: absolute;\n top: 7px;\n left: 8px;\n color: #666;\n }\n .icon-down {\n position: absolute;\n top: 1px;\n right: 1px;\n padding: 5px;\n background: white;\n }\n > input,\n > textarea {\n width: 100%;\n padding-left: 28px;\n }\n .class-filter {\n cursor: pointer;\n resize: none;\n white-space: nowrap;\n overflow: hidden;\n &[readonly]{\n opacity: 1 !important;\n }\n }\n .class-tree {\n display: none;\n position: absolute;\n top: map-get($classTreeVariables, top);\n left: map-get($classTreeVariables, left);\n width: map-get($classTreeVariables, width);\n font-size: map-get($classTreeVariables, font-size);\n\n main {\n overflow-y: auto;\n border: 1px solid black;\n }\n }\n }\n .buttons-container {\n flex: 0 0 auto;\n padding-right: 4px;\n display: flex;\n justify-content: space-between;\n button {\n flex: 1 1 auto;\n margin-right: 16px;\n vertical-align: top;\n }\n .btn-transparent {\n background-color: transparent;\n border: 1px solid black;\n color: black;\n text-shadow: none;\n }\n }\n }\n .content-container {\n @media screen and (min-width: 840px) {\n padding: 44px 64px 64px;\n }\n .no-datatable-container {\n display: flex;\n flex-direction: column;\n align-items: center;\n .no-datatable-icon {\n color: $lightBlueGrey;\n font-size: 3.5em;\n margin-bottom: 30px;\n }\n }\n }\n\n // Overwrite some not customizable styles of datatable and pagination components\n .go-to-item {\n background-color: transparent !important;\n border: 1px solid black;\n color: black !important;\n text-shadow: none !important;\n }\n\n .actions {\n width: 12%;\n }\n\n // Custom class for close modal button, so it positioned on the top-left corner instead of top-right (default)\n .modal-close-left {\n position: absolute;\n left: 20px;\n top: 20px;\n cursor: pointer;\n font-weight: bold;\n color: $textColor !important;\n background-color: transparent;\n padding: 0;\n height: 24px;\n .icon-close {\n font-size: 2.4rem;\n }\n }\n}\n\n","@import 'inc/bootstrap';\n$classTreeVariables: (\n top: 27px,\n left: 0px,\n width: 275px,\n font-size: 1.2rem\n);\n\n.section-container {\n // some variations of flex children\n $flexCols: full, half, third, quarter;\n @for $i from 1 through length($flexCols) {\n $width: calc((100 / ($i)) 1%);\n $flexCol: #{nth($flexCols, $i)};\n .flex-container-#{$flexCol} {\n @include simple-flex-box($width);\n }\n }\n\n // 'whatever-is-left' container\n .flex-container-remaining {\n @include simple-flex-box(auto, 480px);\n }\n\n // main form on left hand side\n .flex-container-main-form {\n @include simple-flex-box(500px);\n margin: 0 20px 20px 0;\n width: 100%;\n\n .form-content {\n max-width: 100%;\n }\n }\n\n // the one for the sidebar that usually holds tree\n .flex-container-navi {\n @include simple-flex-box($treeSidebar * 1px);\n }\n\n // @todo all simple-flex-box references below should be removed once all templates are upgraded\n\n top: 0 !important;\n\n .section-header {\n border: none;\n }\n\n .content-panel {\n width: 100%;\n height: 100%;\n margin: 0;\n padding: 0;\n border: none !important;\n @include flex-container();\n }\n\n .tab-container {\n border: none;\n display: none;\n list-style-type: none;\n padding: 0;\n margin: 0;\n li {\n float: left;\n position: relative;\n top: 0;\n padding: 0;\n margin: 0 1px 0px 0;\n border-top: 1px solid $canvas !important;\n border-bottom: 1px solid $canvas !important;\n background: $canvas !important;\n a {\n top: 0 !important;\n margin-bottom: 0 !important;\n padding: 6px 16px;\n text-decoration: none;\n min-height: 32px;\n color: $textColor;\n float: left;\n }\n &.active,\n &:hover {\n border-bottom-color: whiten($info, 0.25) !important;\n border-top-color: whiten($info, 0.4) !important;\n background: whiten($info, 0.1) !important;\n a {\n background: transparent !important;\n border-color: transparent !important;\n color: $textHighlight !important;\n text-shadow: 1px 1px 0 black(0.2);\n }\n }\n &.disabled:hover {\n background: $canvas !important;\n a {\n cursor: not-allowed !important;\n color: $textColor !important;\n }\n }\n }\n }\n\n .ui-container {\n display: none;\n background: $canvas;\n @include simple-flex-box($treeSidebar * 1px);\n border-right: 1px $uiGeneralContentBorder solid;\n .block-title {\n @include font-size(14);\n padding: 2px 8px;\n margin: 0;\n }\n .tree-action-bar-box {\n margin: 10px 0;\n opacity: 0;\n &.active {\n opacity: 1;\n @include vendor-prefix(opacity, 0.25s ease-in-out, property, (-webkit-, -moz-, ''));\n }\n }\n }\n\n .content-container {\n border: none;\n @include simple-flex-box();\n overflow: auto;\n }\n\n .content-toolbar {\n height: 2rem;\n display: flex;\n flex-direction: row;\n justify-content: flex-end;\n }\n\n .toggle-modal-button {\n user-select: none;\n margin: 0 2rem;\n .icon-add {\n font-size: 1.6rem;\n position: relative;\n top: 2px;\n margin-right: 8px;\n }\n }\n\n .content-block {\n padding: 20px;\n overflow-y: auto;\n @include flex-container(wrap);\n & > .grid-container {\n width: 100%;\n }\n\n .data-container-wrapper {\n padding: 0px 20px 0 0;\n &:before,\n &:after {\n content: ' ';\n display: table;\n }\n &:after {\n clear: both;\n }\n & > section,\n .data-container {\n width: 260px;\n margin: 0 20px 20px 0;\n float: left;\n @include simple-border();\n &.double {\n width: 540px;\n }\n .emptyContentFooter {\n display: none;\n }\n .tree {\n border: none;\n max-width: none;\n max-height: none;\n }\n form {\n background: none;\n border: none;\n margin: 0;\n padding: 0;\n }\n & > header,\n .ui-widget-header {\n background: $canvas;\n border-width: 0px !important;\n border-bottom: 1px #ddd solid !important;\n h1,\n h6 {\n padding: 4px;\n margin: 0;\n @include font-size(14);\n }\n }\n & > div,\n .ui-widget-content,\n .container-content {\n border-width: 0px !important;\n overflow-y: auto;\n min-height: 250px;\n padding: 5px;\n .icon-grip {\n cursor: move;\n }\n }\n\n & > footer {\n min-height: 33px;\n }\n & > footer,\n .data-container-footer {\n background: $canvas;\n text-align: right !important;\n padding: 4px;\n border-width: 0px !important;\n border-top: 1px #ddd solid !important;\n .square {\n width: 28px;\n span {\n padding: 0;\n left: 0;\n }\n }\n }\n ol {\n margin: 0 0 0 15px;\n padding: 10px;\n }\n }\n }\n\n #form-container.ui-widget-content {\n border: none !important;\n }\n form:not(.list-container) {\n border: 1px $uiGeneralContentBorder solid;\n background: $canvas;\n padding: 30px;\n @include simple-border();\n }\n [class^='btn-'],\n [class*=' btn-'] {\n margin: 0 2px;\n }\n }\n}\n\n.search-modal {\n width: 100% !important;\n // Increasing specificity\n &.search-modal {\n max-height: 100%;\n min-height: 320px;\n height: 100%;\n padding: 0px;\n }\n .ui-container {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n padding: 64px 0px 20px 20px;\n .filters-container {\n flex: 1 1 auto;\n height: 100%;\n min-height: 0;\n display: flex;\n flex-direction: column;\n }\n .basic-search-container {\n padding-right: 20px;\n flex: 0 0 auto;\n .class-filter-container {\n cursor: pointer;\n z-index: 2;\n }\n }\n .filter-container {\n position: relative;\n z-index: 1;\n margin-bottom: 8px;\n &:last-child {\n padding-bottom: 16px;\n }\n > .icon-find,\n > .icon-folder {\n position: absolute;\n top: 7px;\n left: 8px;\n color: #666;\n }\n .icon-down {\n position: absolute;\n top: 1px;\n right: 1px;\n padding: 5px;\n background: white;\n }\n > input,\n > textarea {\n width: 100%;\n padding-left: 28px;\n }\n .class-filter {\n cursor: pointer;\n resize: none;\n white-space: nowrap;\n overflow: hidden;\n &[readonly]{\n opacity: 1 !important;\n }\n }\n .class-tree {\n display: none;\n position: absolute;\n top: map-get($classTreeVariables, top);\n left: map-get($classTreeVariables, left);\n width: map-get($classTreeVariables, width);\n font-size: map-get($classTreeVariables, font-size);\n\n main {\n overflow-y: auto;\n border: 1px solid black;\n }\n }\n }\n .buttons-container {\n flex: 0 0 auto;\n padding-right: 4px;\n display: flex;\n justify-content: space-between;\n button {\n flex: 1 1 auto;\n margin-right: 16px;\n vertical-align: top;\n }\n .btn-transparent {\n background-color: transparent;\n border: 1px solid black;\n color: black;\n text-shadow: none;\n }\n }\n }\n .content-container {\n @media screen and (min-width: 840px) {\n padding: 44px 64px 64px;\n }\n .no-datatable-container {\n display: flex;\n flex-direction: column;\n align-items: center;\n .no-datatable-icon {\n color: $lightBlueGrey;\n font-size: 3.5em;\n margin-bottom: 30px;\n }\n }\n }\n\n // Overwrite some not customizable styles of datatable and pagination components\n .go-to-item {\n background-color: transparent !important;\n border: 1px solid black;\n color: black !important;\n text-shadow: none !important;\n }\n\n .actions {\n width: 12%;\n }\n\n // Custom class for close modal button, so it positioned on the top-left corner instead of top-right (default)\n .modal-close-left {\n position: absolute;\n left: 20px;\n top: 20px;\n cursor: pointer;\n font-weight: bold;\n color: $textColor !important;\n background-color: transparent;\n padding: 0;\n height: 24px;\n .icon-close {\n font-size: 2.4rem;\n }\n }\n}\n\n","// buttons and alerts\n$success: rgb(14, 145, 75);\n$info: rgb(14, 93, 145);\n$warning: rgb(216, 174, 91);\n$danger: rgb(201, 96, 67);\n$error: rgb(186, 18, 43);\n$activeInteraction: rgb(195, 90, 19);\n\n// corporate identity\n$logoRed: rgb(186, 18, 43);\n$grey: rgb(173, 161, 148);\n$darkBlueGrey: rgb(164, 187, 197);\n$mediumBlueGrey: rgb(193, 212, 220);\n$lightBlueGrey: rgb(228, 236, 239);\n$brownRedGrey: rgb(154, 137, 123);\n$darkBrown: rgb(111, 99, 89);\n$websiteBorder: rgb(141, 148, 158);\n\n// ui elements, these should only variations of the above\n// naming convention: jQueryUi theme roller -> camelCase\n\n$textColor: #222;\n$textHighlight: white;\n$textSecondary: #737373;\n$shadowColor: rgba(0, 0, 0, 0.25);\n\n$modalBorderColor: #dddfe2;\n$searchInp: #dddfe2;\n\n$uiGeneralContentBg: white();\n$uiGeneralContentBorder: #ddd;\n\n$uiHeaderBg: #d4d5d7;\n\n$uiClickableDefaultBg: #f3f1ef;\n$uiClickableHoverBg: whiten($info, 0.2);\n//$uiClickableActiveBg: $uiHeaderBg;\n$uiClickableActiveBg: whiten($websiteBorder, 0.2);\n//$uiClickableActiveBg: #aaa;\n\n$uiSelectableSelectedBg: whiten($info, 0.2);\n$uiSelectableSelectedHoverBg: whiten($info, 0.1);\n$uiSelectableHoverBg: whiten($info, 0.9);\n\n$uiOverlay: $lightBlueGrey;\n\n// new layout. Implemented now only for review panel\n$uiReviewPanelBg: #f2f2f2;\n$uiReviewPanelTextDisabled: hsl(0, 0%, 45%);\n$uiReviewPanelTextDefault: hsl(0, 0%, 12%);\n$uiReviewPanelBgDefault: $uiGeneralContentBg;\n$uiReviewPanelPrimaryHighlight: hsl(208, 100%, 32%);\n$uiReviewPanelBgInverted: $uiReviewPanelTextDefault;\n$uiReviewPanelTextInverted: $uiGeneralContentBg;\n\n// sidebars etc.\n$canvas: mix(#fff, $grey, 85%);\n\n// colors taken from feedback.scss\n$successBgColor: whiten($success, 0.8);\n$successBorderColor: whiten($success, 0.1);\n\n$infoBgColor: whiten($info, 0.8);\n$infoBorderColor: whiten($info, 0.1);\n\n$warningBgColor: whiten($warning, 0.8);\n$warningBorderColor: whiten($warning, 0.1);\n\n$dangerBgColor: whiten($danger, 0.8);\n$dangerBorderColor: whiten($danger, 0.1);\n\n$errorBgColor: whiten($error, 0.8);\n$errorBorderColor: whiten($error, 0.1);\n\n$darkBar: rgb(51, 51, 51);\n$darkBarTxt: rgb(230, 230, 230);\n$darkBarIcon: rgb(220, 220, 220);\n\n$actionLinkColor: #276d9b;\n$actionLinkHoverColor: #4f83a7;\n\n$colorWheel-01: #c3ba13;\n$colorWheel-02: #84a610;\n$colorWheel-03: #2b8e0e;\n$colorWheel-04: #0f9787;\n$colorWheel-05: #0e5d91;\n$colorWheel-06: #0d2689;\n$colorWheel-07: #400d83;\n$colorWheel-08: #960e7d;\n$colorWheel-09: #ba122b;\n$colorWheel-10: #c34713;\n$colorWheel-11: #c36f13;\n$colorWheel-12: #c39413;\n"]}

package/dist/searchModal.js CHANGED Viewed

@@ -275,7 +275,7 @@ define(['jquery', 'lodash', 'i18n', 'context', 'handlebars', 'lib/handlebars/hel
           //set up the inner resource selector
           selectionMode: 'single',
           selectClass: true,
-          classUri: rootClassUri,
+          classUri: initialClassUri,
           showContext: false,
           showSelection: false
         });

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
     "name": "@oat-sa/tao-core-ui",
-    "version": "3.9.2",
+    "version": "3.9.3",
     "displayName": "TAO Core UI",
     "description": "UI libraries of TAO",
     "scripts": {

package/src/resource/filters.js CHANGED Viewed

@@ -35,6 +35,7 @@ import filtersTpl from 'ui/resource/tpl/filters';
  * FIXME add radio as soon as supported
  */
 var supportedWidgets = [
+    'http://www.tao.lu/datatypes/WidgetDefinitions.rdf#Readonly',
     'http://www.tao.lu/datatypes/WidgetDefinitions.rdf#TextBox',
     'http://www.tao.lu/datatypes/WidgetDefinitions.rdf#CheckBox',
     'http://www.tao.lu/datatypes/WidgetDefinitions.rdf#ComboBox',

package/src/searchModal/css/searchModal.css CHANGED Viewed

@@ -352,6 +352,7 @@ Usage:
 }
 .search-modal .ui-container .filter-container {
   position: relative;
+  z-index: 1;
   margin-bottom: 8px;
 }
 .search-modal .ui-container .filter-container:last-child {

package/src/searchModal/css/searchModal.css.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../scss/inc/_functions.scss","../../../scss/inc/fonts/_tao-icon-vars.scss","../scss/searchModal.scss%23sass","../scss/searchModal.scss","../../../scss/inc/_colors.scss"],"names":[],"mappings":"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","file":"searchModal.css","sourcesContent":["@mixin iterate-sprite($iconList, $x, $y, $direction, $prefix:'') {\n @each $icon in $iconList {\n #{$prefix}#{$icon} {\n background-position: $x * 1px $y * 1px;\n }\n @if $direction == 'x' {\n $x: $x - 16;\n } @else {\n $y: $y - 16;\n }\n }\n}\n\n/\nUsage:\n- linear-gradient((color1, color2, color3)) - returns linear-gradient with evenly distributed colors,\n if 3 colors used then the position of each will be 33,33%\n- linear-gradient((color1 0%, color2 30%, color3 80%)) - returns linear-gradient with manually distributed colors,\n first param - color, second - position. Also you can use px or other valid units for set position.\n/\n@mixin linear-gradient($colorList, $direction: 'to right') {\n $percentage: 0;\n $units: '%';\n $count: length($colorList);\n $increment: calc(100 / ($count - 1));\n $css: #{$direction + ', '};\n $sep: ', ';\n @each $colorItem in $colorList {\n $color: $colorItem;\n @if (length($colorItem) > 1) {\n $color: nth($colorItem, 1);\n $percentage: nth($colorItem, 2);\n $units: '';\n }\n @if ($percentage >= 100 or index($colorList, $colorItem) == $count) {\n $sep: '';\n }\n $css: #{$css + $color + ' ' + $percentage + $units + $sep};\n $percentage: $percentage + $increment;\n }\n background: linear-gradient( #{$css} );\n}\n\n@mixin grid-unit($span, $numCols: 12, $gutter: 0) {\n $gridPx: 840;\n $rawSpanPx: calc((($gridPx - ($numCols * $gutter)) / $numCols));\n $spanPx: $rawSpanPx * $span + (($span - 1) * $gutter);\n $spanPercent: widthPerc($spanPx, $gridPx);\n $marginPercent: widthPerc($gutter, $gridPx);\n margin-left: $marginPercent;\n width: $spanPercent;\n}\n\n\n@mixin vendor-prefix($property, $value, $whatToPrefix: property, $prefixes: (-webkit-, -moz-, -ms-, -o-, '')) {\n @if $whatToPrefix == 'property' {\n @each $prefix in $prefixes {\n #{$prefix + $property}: #{$value};\n }\n }\n @else if $whatToPrefix == 'value' {\n @each $prefix in $prefixes {\n #{$property}: #{$prefix + $value};\n }\n }\n}\n@mixin flex-container($wrapBehavior: nowrap, $direction : row) {\n @include vendor-prefix(display, flex, value, (-ms-, -webkit-, ''));\n\n @include vendor-prefix(flex-direction, $direction, property, (-ms-, -webkit-, ''));\n @include vendor-prefix(flex-wrap, $wrapBehavior, property, (-ms-, -webkit-, ''));\n\n @include vendor-prefix(justify-content, flex-start, property, (-webkit-, ''));\n\n @include vendor-prefix(align-content, flex-start, property, (-webkit-, ''));\n\n @include vendor-prefix(align-items, stretch, property, (-webkit-, ''));\n}\n\n@mixin simple-flex-box($width: auto, $minWidth: 1) {\n\n @include vendor-prefix(order, 0, property, (-ms-, -webkit-, ''));\n flex-item-align: stretch;\n -ms-flex-item-align: stretch;\n @include vendor-prefix(align-self, stretch, property, (-webkit-, ''));\n\n // if both, min width and width are set, width will win this conflict\n @if ($width == auto) {\n @if ($minWidth != 1) {\n @include vendor-prefix(flex, 1 1 $minWidth, property, (-ms-, -webkit-, ''));\n }\n @else {\n @include vendor-prefix(flex, 1 1 auto, property, (-ms-, -webkit-, ''));\n // @see https://developer.mozilla.org/en-US/docs/Web/CSS/flex-basis#Values\n // for a discussion auto vs. main-size\n @include vendor-prefix(flex, 1 1, property, (-ms-, -webkit-, ''));\n }\n }\n @else {\n @include vendor-prefix(flex, 0 0 $width, property, (-ms-, -webkit-, ''));\n }\n}\n\n\n@mixin box-shadow($horiz: 1px, $vert: 1px, $blur: 2px, $spread: 0, $color: rgba(0, 0, 0, .2)) {\n @include vendor-prefix(box-shadow, $horiz $vert $blur $spread $color, property);\n}\n\n@mixin simple-border($color: #ddd) {\n border: 1px solid $color;\n border-radius: 2px;\n -webkit-border-radius: 2px;\n}\n\n@mixin border-radius($radius: 2) {\n -moz-border-radius: $radius * 1px;\n -webkit-border-radius: $radius * 1px;\n border-radius: $radius * 1px;\n}\n\n@mixin border-radius-top($radius: 2) {\n -webkit-border-top-left-radius: $radius * 1px;\n -webkit-border-top-right-radius: $radius * 1px;\n -moz-border-radius-topleft: $radius * 1px;\n -moz-border-radius-topright: $radius * 1px;\n border-top-left-radius: $radius * 1px;\n border-top-right-radius: $radius * 1px;\n}\n\n@mixin border-radius-bottom($radius: 2) {\n -webkit-border-bottom-right-radius: $radius * 1px;\n -webkit-border-bottom-left-radius: $radius * 1px;\n -moz-border-radius-bottomright: $radius * 1px;\n -moz-border-radius-bottomleft: $radius * 1px;\n border-bottom-right-radius: $radius * 1px;\n border-bottom-left-radius: $radius * 1px;\n}\n\n@mixin border-radius-left($radius: 2) {\n -webkit-border-top-left-radius: $radius * 1px;\n -webkit-border-bottom-left-radius: $radius * 1px;\n -moz-border-radius-topleft: $radius * 1px;\n -moz-border-radius-bottomleft: $radius * 1px;\n border-top-left-radius: $radius * 1px;\n border-bottom-left-radius: $radius * 1px;\n}\n\n@mixin border-radius-right($radius: 2) {\n -webkit-border-top-right-radius: $radius * 1px;\n -webkit-border-bottom-right-radius: $radius * 1px;\n -moz-border-radius-topright: $radius * 1px;\n -moz-border-radius-bottomright: $radius * 1px;\n border-top-right-radius: $radius * 1px;\n border-bottom-right-radius: $radius * 1px;\n}\n\n@mixin border-radius-top-left($radius: 2) {\n -webkit-border-top-left-radius: $radius * 1px;\n -moz-border-radius-topleft: $radius * 1px;\n border-top-left-radius: $radius * 1px;\n}\n\n@mixin border-radius-top-right($radius: 2) {\n -webkit-border-top-right-radius: $radius * 1px;\n -moz-border-radius-topright: $radius * 1px;\n border-top-right-radius: $radius * 1px;\n}\n\n@mixin border-radius-bottom-right($radius: 2) {\n -webkit-border-bottom-right-radius: $radius * 1px;\n -moz-border-radius-bottomright: $radius * 1px;\n border-bottom-right-radius: $radius * 1px;\n}\n\n@mixin border-radius-bottom-left($radius: 2) {\n -webkit-border-bottom-left-radius: $radius * 1px;\n -moz-border-radius-bottomleft: $radius * 1px;\n border-bottom-left-radius: $radius * 1px;\n}\n\n@mixin border-box() {\n -moz-box-sizing: border-box;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n}\n\n@function whiten($color, $white: 0.3) {\n @return mix(#fff, $color, ($white * 100) * 1%);\n}\n\n@function blacken($color, $black: 0.3) {\n @return mix(#000, $color, ($black * 100) * 1%);\n}\n\n@function widthPerc($colWidth, $context) {\n @return calc(($colWidth * 100 / $context) * 1%)\n}\n\n@function remDist($fontSizePx) {\n @return calc(($fontSizePx / 10) * 1rem)\n}\n\n@function black($alpha: 1) {\n @return (rgba(0, 0, 0, $alpha))\n}\n\n@function white($alpha: 1) {\n @return (rgba(255, 255, 255, $alpha))\n}\n\n@mixin font-size($remPx, $important: false) {\n @if $important == true {\n font-size: calc(($remPx) * 1px) !important;\n font-size: calc(($remPx / 10) * 1rem) !important;\n }\n @else {\n font-size: calc(($remPx) * 1px);\n font-size: calc(($remPx / 10) * 1rem);\n }\n}\n\n\n@mixin keyframes($name) {\n @-o-keyframes #{$name} { @content };\n @-moz-keyframes #{$name} { @content };\n @-webkit-keyframes #{$name} { @content };\n @keyframes #{$name} { @content };\n}\n\n\n@mixin animation($value, $type:'') {\n $animation: animation;\n @if $type != '' {\n $animation: $animation + '-' + $type;\n }\n @include vendor-prefix($animation, $value, property);\n}\n\n/// CSS transition mixin to the current selection (apply also vendor prefixes).\n/// See <https://developer.mozilla.org/en-US/docs/Web/CSS/transition> for the values\n///\n/// @param {property} [$type = all] the CSS property to apply the transition to\n/// @param {time} [$duration = .5s] the transition property\n/// @param {timing-function} [$effect = ease-out] the transition property\n@mixin transition($type : all, $duration : 0.5s, $effect : ease-out, $delay : 0s){\n @include vendor-prefix(transition, $type + ', ' + $duration + ', ' + $effect + ', ' + $delay, property);\n}\n\n@mixin fade($duration: 1s){\n\n @include keyframes(fade) {\n 0% {opacity:0;}\n 50% {opacity:1;}\n 100% {opacity:0;}\n }\n\n @include vendor-prefix(animation, fade 1s forwards, property);\n}\n\n@mixin repeat(){\n @include animation(infinite, iteration-count);\n}\n\n@mixin largeHeading() {\n @include font-size(20);\n font-family: $headingFont;\n font-style: normal;\n}\n\n@mixin disableSelect() {\n @include vendor-prefix(user-select, none, property);\n}\n\n/* based on \"visually-hidden\" mixin in LDS for accessibility goals /\n@mixin visuallyHidden() {\n position: absolute;\n width: 1px;\n height: 1px;\n overflow: hidden;\n clip: rect(1px, 1px, 1px, 1px);\n margin: 0;\n padding: 0;\n}\n","/ Do not edit /@mixin tao-icon-setup {\n / use !important to prevent issues with browser extensions that change fonts /\n font-family: 'tao' !important;\n speak: never;\n font-style: normal;\n font-weight: normal;\n font-variant: normal;\n text-transform: none;\n line-height: 1;\n\n / Better Font Rendering =========== /\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n\n@mixin icon-align-center { content: \"\\e92a\"; }\n@mixin icon-multiple-magicwand { content: \"\\e929\"; }\n@mixin icon-sd-import { content: \"\\e91f\"; }\n@mixin icon-sd-export { content: \"\\e924\"; }\n@mixin icon-browse { content: \"\\e925\"; }\n@mixin icon-minus { content: \"\\e926\"; }\n@mixin icon-plus { content: \"\\e927\"; }\n@mixin icon-sd-save { content: \"\\e928\"; }\n@mixin icon-back-button { content: \"\\e91e\"; }\n@mixin icon-japan-incorrect { content: \"\\e91b\"; }\n@mixin icon-japan-correct { content: \"\\e91c\"; }\n@mixin icon-japan-partial { content: \"\\e91d\"; }\n@mixin icon-score-partial { content: \"\\e91a\"; }\n@mixin icon-furigana { content: \"\\e919\"; }\n@mixin icon-add-subsection { content: \"\\e918\"; }\n@mixin icon-info-bare { content: \"\\e923\"; }\n@mixin icon-bookmark-outline { content: \"\\e922\"; }\n@mixin icon-bookmark { content: \"\\e921\"; }\n@mixin icon-indicator { content: \"\\e920\"; }\n@mixin icon-wrap-inline { content: \"\\e915\"; }\n@mixin icon-wrap-left { content: \"\\e916\"; }\n@mixin icon-wrap-right { content: \"\\e917\"; }\n@mixin icon-offline { content: \"\\e913\"; }\n@mixin icon-online { content: \"\\e914\"; }\n@mixin icon-tab { content: \"\\e90d\"; }\n@mixin icon-untab { content: \"\\e90e\"; }\n@mixin icon-multi-select { content: \"\\e90b\"; }\n@mixin icon-clipboard { content: \"\\e90a\"; }\n@mixin icon-filebox { content: \"\\e909\"; }\n@mixin icon-click-to-speak { content: \"\\e907\"; }\n@mixin icon-speech-bubble { content: \"\\f0e5\"; }\n@mixin icon-microphone { content: \"\\f130\"; }\n@mixin icon-microphone-off { content: \"\\f131\"; }\n@mixin icon-disconnect { content: \"\\e905\"; }\n@mixin icon-connect { content: \"\\e906\"; }\n@mixin icon-eliminate { content: \"\\e904\"; }\n@mixin icon-wheelchair { content: \"\\e903\"; }\n@mixin icon-text-marker { content: \"\\e902\"; }\n@mixin icon-unshield { content: \"\\e32a\"; }\n@mixin icon-shield { content: \"\\e8e8\"; }\n@mixin icon-tree { content: \"\\e6b4\"; }\n@mixin icon-home { content: \"\\e6b3\"; }\n@mixin icon-shared-file { content: \"\\e6b2\"; }\n@mixin icon-end-attempt { content: \"\\e603\"; }\n@mixin icon-icon { content: \"\\f1c5\"; }\n@mixin icon-radio-bg { content: \"\\e600\"; }\n@mixin icon-checkbox-bg { content: \"\\e601\"; }\n@mixin icon-tag { content: \"\\e602\"; }\n@mixin icon-style { content: \"\\e604\"; }\n@mixin icon-ownership-transfer { content: \"\\e605\"; }\n@mixin icon-property-advanced { content: \"\\e606\"; }\n@mixin icon-property-add { content: \"\\e607\"; }\n@mixin icon-repository-add { content: \"\\e608\"; }\n@mixin icon-repository-remove { content: \"\\e609\"; }\n@mixin icon-repository { content: \"\\e60a\"; }\n@mixin icon-result-server { content: \"\\e60b\"; }\n@mixin icon-folder { content: \"\\e60c\"; }\n@mixin icon-folder-open { content: \"\\e60d\"; }\n@mixin icon-left { content: \"\\e60e\"; }\n@mixin icon-right { content: \"\\e60f\"; }\n@mixin icon-up { content: \"\\e610\"; }\n@mixin icon-down { content: \"\\e611\"; }\n@mixin icon-undo { content: \"\\e612\"; }\n@mixin icon-redo { content: \"\\e613\"; }\n@mixin icon-screen { content: \"\\e614\"; }\n@mixin icon-laptop { content: \"\\e615\"; }\n@mixin icon-tablet { content: \"\\e616\"; }\n@mixin icon-phone { content: \"\\e617\"; }\n@mixin icon-move { content: \"\\e618\"; }\n@mixin icon-bin { content: \"\\e619\"; }\n@mixin icon-shuffle { content: \"\\e61a\"; }\n@mixin icon-print { content: \"\\e61b\"; }\n@mixin icon-tools { content: \"\\e61c\"; }\n@mixin icon-settings { content: \"\\e61d\"; }\n@mixin icon-video { content: \"\\e61e\"; }\n@mixin icon-find { content: \"\\e61f\"; }\n@mixin icon-image { content: \"\\e620\"; }\n@mixin icon-edit { content: \"\\e621\"; }\n@mixin icon-document { content: \"\\e622\"; }\n@mixin icon-resize-grid { content: \"\\e623\"; }\n@mixin icon-resize { content: \"\\e624\"; }\n@mixin icon-help { content: \"\\e625\"; }\n@mixin icon-mobile-menu { content: \"\\e626\"; }\n@mixin icon-fix { content: \"\\e627\"; }\n@mixin icon-unlock { content: \"\\e628\"; }\n@mixin icon-lock { content: \"\\e629\"; }\n@mixin icon-ul { content: \"\\e62a\"; }\n@mixin icon-ol { content: \"\\e62b\"; }\n@mixin icon-email { content: \"\\e62c\"; }\n@mixin icon-download { content: \"\\e62d\"; }\n@mixin icon-logout { content: \"\\e62e\"; }\n@mixin icon-login { content: \"\\e62f\"; }\n@mixin icon-spinner { content: \"\\e630\"; }\n@mixin icon-preview { content: \"\\e631\"; }\n@mixin icon-external { content: \"\\e632\"; }\n@mixin icon-time { content: \"\\e633\"; }\n@mixin icon-save { content: \"\\e634\"; }\n@mixin icon-warning { content: \"\\e635\"; }\n@mixin icon-add { content: \"\\e636\"; }\n@mixin icon-error { content: \"\\e900\"; }\n@mixin icon-close { content: \"\\e637\"; }\n@mixin icon-success { content: \"\\e638\"; }\n@mixin icon-remove { content: \"\\e639\"; }\n@mixin icon-info { content: \"\\e63a\"; }\n@mixin icon-danger { content: \"\\e63b\"; }\n@mixin icon-users { content: \"\\e63c\"; }\n@mixin icon-user { content: \"\\e63d\"; }\n@mixin icon-test-taker { content: \"\\e63e\"; }\n@mixin icon-test-takers { content: \"\\e63f\"; }\n@mixin icon-item { content: \"\\e640\"; }\n@mixin icon-test { content: \"\\e641\"; }\n@mixin icon-delivery { content: \"\\e642\"; }\n@mixin icon-eye-slash { content: \"\\e643\"; }\n@mixin icon-result { content: \"\\e644\"; }\n@mixin icon-delivery-small { content: \"\\e645\"; }\n@mixin icon-upload { content: \"\\e646\"; }\n@mixin icon-result-small { content: \"\\e647\"; }\n@mixin icon-mobile-preview { content: \"\\e648\"; }\n@mixin icon-extension { content: \"\\e649\"; }\n@mixin icon-desktop-preview { content: \"\\e64a\"; }\n@mixin icon-tablet-preview { content: \"\\e64b\"; }\n@mixin icon-insert-horizontal-line { content: \"\\e64c\"; }\n@mixin icon-table { content: \"\\e64d\"; }\n@mixin icon-anchor { content: \"\\e64e\"; }\n@mixin icon-unlink { content: \"\\e64f\"; }\n@mixin icon-link { content: \"\\e650\"; }\n@mixin icon-right-left { content: \"\\e651\"; }\n@mixin icon-left-right { content: \"\\e652\"; }\n@mixin icon-special-character { content: \"\\e653\"; }\n@mixin icon-source { content: \"\\e654\"; }\n@mixin icon-new-page { content: \"\\e655\"; }\n@mixin icon-templates { content: \"\\e656\"; }\n@mixin icon-cut { content: \"\\e657\"; }\n@mixin icon-replace { content: \"\\e658\"; }\n@mixin icon-copy { content: \"\\e659\"; }\n@mixin icon-paste { content: \"\\e65a\"; }\n@mixin icon-select-all { content: \"\\e65b\"; }\n@mixin icon-paste-text { content: \"\\e65c\"; }\n@mixin icon-paste-word { content: \"\\e65d\"; }\n@mixin icon-bold { content: \"\\e65e\"; }\n@mixin icon-italic { content: \"\\e65f\"; }\n@mixin icon-underline { content: \"\\e660\"; }\n@mixin icon-subscript { content: \"\\e661\"; }\n@mixin icon-superscript { content: \"\\e662\"; }\n@mixin icon-strike-through { content: \"\\e663\"; }\n@mixin icon-decrease-indent { content: \"\\e664\"; }\n@mixin icon-increase-indent { content: \"\\e665\"; }\n@mixin icon-block-quote { content: \"\\e666\"; }\n@mixin icon-div-container { content: \"\\e667\"; }\n@mixin icon-align-left { content: \"\\e668\"; }\n@mixin icon-center { content: \"\\e669\"; }\n@mixin icon-align-right { content: \"\\e66a\"; }\n@mixin icon-justify { content: \"\\e66b\"; }\n@mixin icon-choice { content: \"\\e66c\"; }\n@mixin icon-inline-choice { content: \"\\e66d\"; }\n@mixin icon-match { content: \"\\e66e\"; }\n@mixin icon-associate { content: \"\\e66f\"; }\n@mixin icon-media { content: \"\\e670\"; }\n@mixin icon-graphic-order { content: \"\\e671\"; }\n@mixin icon-hotspot { content: \"\\e672\"; }\n@mixin icon-graphic-gap { content: \"\\e673\"; }\n@mixin icon-graphic-associate { content: \"\\e674\"; }\n@mixin icon-select-point { content: \"\\e675\"; }\n@mixin icon-pin { content: \"\\e676\"; }\n@mixin icon-import { content: \"\\e677\"; }\n@mixin icon-export { content: \"\\e678\"; }\n@mixin icon-move-item { content: \"\\e679\"; }\n@mixin icon-meta-data { content: \"\\e67a\"; }\n@mixin icon-slider { content: \"\\e67b\"; }\n@mixin icon-summary-report { content: \"\\e67c\"; }\n@mixin icon-text-entry { content: \"\\e67d\"; }\n@mixin icon-extended-text { content: \"\\e67e\"; }\n@mixin icon-eraser { content: \"\\e67f\"; }\n@mixin icon-row { content: \"\\e680\"; }\n@mixin icon-column { content: \"\\e681\"; }\n@mixin icon-text-color { content: \"\\e682\"; }\n@mixin icon-background-color { content: \"\\e683\"; }\n@mixin icon-spell-check { content: \"\\e684\"; }\n@mixin icon-polygon { content: \"\\e685\"; }\n@mixin icon-rectangle { content: \"\\e686\"; }\n@mixin icon-gap-match { content: \"\\e687\"; }\n@mixin icon-order { content: \"\\e688\"; }\n@mixin icon-hottext { content: \"\\e689\"; }\n@mixin icon-free-form { content: \"\\e68a\"; }\n@mixin icon-step-backward { content: \"\\e68b\"; }\n@mixin icon-fast-backward { content: \"\\e68c\"; }\n@mixin icon-backward { content: \"\\e68d\"; }\n@mixin icon-play { content: \"\\e68e\"; }\n@mixin icon-pause { content: \"\\e68f\"; }\n@mixin icon-stop { content: \"\\e690\"; }\n@mixin icon-forward { content: \"\\e691\"; }\n@mixin icon-fast-forward { content: \"\\e692\"; }\n@mixin icon-step-forward { content: \"\\e693\"; }\n@mixin icon-ellipsis { content: \"\\e694\"; }\n@mixin icon-circle { content: \"\\e695\"; }\n@mixin icon-target { content: \"\\e696\"; }\n@mixin icon-guide-arrow { content: \"\\e697\"; }\n@mixin icon-range-slider-right { content: \"\\e698\"; }\n@mixin icon-range-slider-left { content: \"\\e699\"; }\n@mixin icon-radio-checked { content: \"\\e69a\"; }\n@mixin icon-checkbox-indeterminate { content: \"\\e901\"; }\n@mixin icon-checkbox { content: \"\\e69b\"; }\n@mixin icon-checkbox-crossed { content: \"\\e69c\"; }\n@mixin icon-checkbox-checked { content: \"\\e69d\"; }\n@mixin icon-result-nok { content: \"\\e69e\"; }\n@mixin icon-result-ok { content: \"\\e69f\"; }\n@mixin icon-not-evaluated { content: \"\\e6a0\"; }\n@mixin icon-filter { content: \"\\e6a1\"; }\n@mixin icon-translate { content: \"\\e6a2\"; }\n@mixin icon-eject { content: \"\\e6a3\"; }\n@mixin icon-continue { content: \"\\e6a4\"; }\n@mixin icon-radio { content: \"\\e6a5\"; }\n@mixin icon-sphere { content: \"\\e6a6\"; }\n@mixin icon-reset { content: \"\\e6a7\"; }\n@mixin icon-smaller { content: \"\\e6a8\"; }\n@mixin icon-larger { content: \"\\e6a9\"; }\n@mixin icon-clock { content: \"\\e6aa\"; }\n@mixin icon-font { content: \"\\e6ab\"; }\n@mixin icon-maths { content: \"\\e6ac\"; }\n@mixin icon-grip { content: \"\\e6ad\"; }\n@mixin icon-rubric { content: \"\\e6ae\"; }\n@mixin icon-audio { content: \"\\e6af\"; }\n@mixin icon-grip-h { content: \"\\e6b0\"; }\n@mixin icon-magicwand { content: \"\\e6b1\"; }\n@mixin icon-loop { content: \"\\ea2e\"; }\n@mixin icon-calendar { content: \"\\e953\"; }\n@mixin icon-reload { content: \"\\e984\"; }\n@mixin icon-speed { content: \"\\e9a6\"; }\n@mixin icon-volume { content: \"\\ea27\"; }\n@mixin icon-contrast { content: \"\\e9d5\"; }\n@mixin icon-headphones { content: \"\\e910\"; }\n@mixin icon-compress { content: \"\\f066\"; }\n@mixin icon-map-o { content: \"\\f278\"; }\n@mixin icon-variable { content: \"\\e908\"; }\n@mixin icon-tooltip { content: \"\\e90c\"; }\n@mixin icon-globe { content: \"\\e9c9\"; }\n@mixin icon-highlighter { content: \"\\e90f\"; }\n@mixin icon-eliminate-crossed { content: \"\\e911\"; }\n@mixin icon-play-from-here { content: \"\\e912\"; }\n","@import 'inc/bootstrap';\n$classTreeVariables: (\n top: 27px,\n left: 0px,\n width: 275px,\n font-size: 1.2rem\n);\n\n.section-container {\n // some variations of flex children\n $flexCols: full, half, third, quarter;\n @for $i from 1 through length($flexCols) {\n $width: calc((100 / ($i)) 1%);\n $flexCol: #{nth($flexCols, $i)};\n .flex-container-#{$flexCol} {\n @include simple-flex-box($width);\n }\n }\n\n // 'whatever-is-left' container\n .flex-container-remaining {\n @include simple-flex-box(auto, 480px);\n }\n\n // main form on left hand side\n .flex-container-main-form {\n @include simple-flex-box(500px);\n margin: 0 20px 20px 0;\n width: 100%;\n\n .form-content {\n max-width: 100%;\n }\n }\n\n // the one for the sidebar that usually holds tree\n .flex-container-navi {\n @include simple-flex-box($treeSidebar * 1px);\n }\n\n // @todo all simple-flex-box references below should be removed once all templates are upgraded\n\n top: 0 !important;\n\n .section-header {\n border: none;\n }\n\n .content-panel {\n width: 100%;\n height: 100%;\n margin: 0;\n padding: 0;\n border: none !important;\n @include flex-container();\n }\n\n .tab-container {\n border: none;\n display: none;\n list-style-type: none;\n padding: 0;\n margin: 0;\n li {\n float: left;\n position: relative;\n top: 0;\n padding: 0;\n margin: 0 1px 0px 0;\n border-top: 1px solid $canvas !important;\n border-bottom: 1px solid $canvas !important;\n background: $canvas !important;\n a {\n top: 0 !important;\n margin-bottom: 0 !important;\n padding: 6px 16px;\n text-decoration: none;\n min-height: 32px;\n color: $textColor;\n float: left;\n }\n &.active,\n &:hover {\n border-bottom-color: whiten($info, 0.25) !important;\n border-top-color: whiten($info, 0.4) !important;\n background: whiten($info, 0.1) !important;\n a {\n background: transparent !important;\n border-color: transparent !important;\n color: $textHighlight !important;\n text-shadow: 1px 1px 0 black(0.2);\n }\n }\n &.disabled:hover {\n background: $canvas !important;\n a {\n cursor: not-allowed !important;\n color: $textColor !important;\n }\n }\n }\n }\n\n .ui-container {\n display: none;\n background: $canvas;\n @include simple-flex-box($treeSidebar * 1px);\n border-right: 1px $uiGeneralContentBorder solid;\n .block-title {\n @include font-size(14);\n padding: 2px 8px;\n margin: 0;\n }\n .tree-action-bar-box {\n margin: 10px 0;\n opacity: 0;\n &.active {\n opacity: 1;\n @include vendor-prefix(opacity, 0.25s ease-in-out, property, (-webkit-, -moz-, ''));\n }\n }\n }\n\n .content-container {\n border: none;\n @include simple-flex-box();\n overflow: auto;\n }\n\n .content-toolbar {\n height: 2rem;\n display: flex;\n flex-direction: row;\n justify-content: flex-end;\n }\n\n .toggle-modal-button {\n user-select: none;\n margin: 0 2rem;\n .icon-add {\n font-size: 1.6rem;\n position: relative;\n top: 2px;\n margin-right: 8px;\n }\n }\n\n .content-block {\n padding: 20px;\n overflow-y: auto;\n @include flex-container(wrap);\n & > .grid-container {\n width: 100%;\n }\n\n .data-container-wrapper {\n padding: 0px 20px 0 0;\n &:before,\n &:after {\n content: ' ';\n display: table;\n }\n &:after {\n clear: both;\n }\n & > section,\n .data-container {\n width: 260px;\n margin: 0 20px 20px 0;\n float: left;\n @include simple-border();\n &.double {\n width: 540px;\n }\n .emptyContentFooter {\n display: none;\n }\n .tree {\n border: none;\n max-width: none;\n max-height: none;\n }\n form {\n background: none;\n border: none;\n margin: 0;\n padding: 0;\n }\n & > header,\n .ui-widget-header {\n background: $canvas;\n border-width: 0px !important;\n border-bottom: 1px #ddd solid !important;\n h1,\n h6 {\n padding: 4px;\n margin: 0;\n @include font-size(14);\n }\n }\n & > div,\n .ui-widget-content,\n .container-content {\n border-width: 0px !important;\n overflow-y: auto;\n min-height: 250px;\n padding: 5px;\n .icon-grip {\n cursor: move;\n }\n }\n\n & > footer {\n min-height: 33px;\n }\n & > footer,\n .data-container-footer {\n background: $canvas;\n text-align: right !important;\n padding: 4px;\n border-width: 0px !important;\n border-top: 1px #ddd solid !important;\n .square {\n width: 28px;\n span {\n padding: 0;\n left: 0;\n }\n }\n }\n ol {\n margin: 0 0 0 15px;\n padding: 10px;\n }\n }\n }\n\n #form-container.ui-widget-content {\n border: none !important;\n }\n form:not(.list-container) {\n border: 1px $uiGeneralContentBorder solid;\n background: $canvas;\n padding: 30px;\n @include simple-border();\n }\n [class^='btn-'],\n [class=' btn-'] {\n margin: 0 2px;\n }\n }\n}\n\n.search-modal {\n width: 100% !important;\n // Increasing specificity\n &.search-modal {\n max-height: 100%;\n min-height: 320px;\n height: 100%;\n padding: 0px;\n }\n .ui-container {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n padding: 64px 0px 20px 20px;\n .filters-container {\n flex: 1 1 auto;\n height: 100%;\n min-height: 0;\n display: flex;\n flex-direction: column;\n }\n .basic-search-container {\n padding-right: 20px;\n flex: 0 0 auto;\n .class-filter-container {\n cursor: pointer;\n z-index: 2;\n }\n }\n .filter-container {\n position: relative;\n margin-bottom: 8px;\n &:last-child {\n padding-bottom: 16px;\n }\n > .icon-find,\n > .icon-folder {\n position: absolute;\n top: 7px;\n left: 8px;\n color: #666;\n }\n .icon-down {\n position: absolute;\n top: 1px;\n right: 1px;\n padding: 5px;\n background: white;\n }\n > input,\n > textarea {\n width: 100%;\n padding-left: 28px;\n }\n .class-filter {\n cursor: pointer;\n resize: none;\n white-space: nowrap;\n overflow: hidden;\n &[readonly]{\n opacity: 1 !important;\n }\n }\n .class-tree {\n display: none;\n position: absolute;\n top: map-get($classTreeVariables, top);\n left: map-get($classTreeVariables, left);\n width: map-get($classTreeVariables, width);\n font-size: map-get($classTreeVariables, font-size);\n\n main {\n overflow-y: auto;\n border: 1px solid black;\n }\n }\n }\n .buttons-container {\n flex: 0 0 auto;\n padding-right: 4px;\n display: flex;\n justify-content: space-between;\n button {\n flex: 1 1 auto;\n margin-right: 16px;\n vertical-align: top;\n }\n .btn-transparent {\n background-color: transparent;\n border: 1px solid black;\n color: black;\n text-shadow: none;\n }\n }\n }\n .content-container {\n @media screen and (min-width: 840px) {\n padding: 44px 64px 64px;\n }\n .no-datatable-container {\n display: flex;\n flex-direction: column;\n align-items: center;\n .no-datatable-icon {\n color: $lightBlueGrey;\n font-size: 3.5em;\n margin-bottom: 30px;\n }\n }\n }\n\n // Overwrite some not customizable styles of datatable and pagination components\n .go-to-item {\n background-color: transparent !important;\n border: 1px solid black;\n color: black !important;\n text-shadow: none !important;\n }\n\n .actions {\n width: 12%;\n }\n\n // Custom class for close modal button, so it positioned on the top-left corner instead of top-right (default)\n .modal-close-left {\n position: absolute;\n left: 20px;\n top: 20px;\n cursor: pointer;\n font-weight: bold;\n color: $textColor !important;\n background-color: transparent;\n padding: 0;\n height: 24px;\n .icon-close {\n font-size: 2.4rem;\n }\n }\n}\n\n","@import 'inc/bootstrap';\n$classTreeVariables: (\n top: 27px,\n left: 0px,\n width: 275px,\n font-size: 1.2rem\n);\n\n.section-container {\n // some variations of flex children\n $flexCols: full, half, third, quarter;\n @for $i from 1 through length($flexCols) {\n $width: calc((100 / ($i)) 1%);\n $flexCol: #{nth($flexCols, $i)};\n .flex-container-#{$flexCol} {\n @include simple-flex-box($width);\n }\n }\n\n // 'whatever-is-left' container\n .flex-container-remaining {\n @include simple-flex-box(auto, 480px);\n }\n\n // main form on left hand side\n .flex-container-main-form {\n @include simple-flex-box(500px);\n margin: 0 20px 20px 0;\n width: 100%;\n\n .form-content {\n max-width: 100%;\n }\n }\n\n // the one for the sidebar that usually holds tree\n .flex-container-navi {\n @include simple-flex-box($treeSidebar * 1px);\n }\n\n // @todo all simple-flex-box references below should be removed once all templates are upgraded\n\n top: 0 !important;\n\n .section-header {\n border: none;\n }\n\n .content-panel {\n width: 100%;\n height: 100%;\n margin: 0;\n padding: 0;\n border: none !important;\n @include flex-container();\n }\n\n .tab-container {\n border: none;\n display: none;\n list-style-type: none;\n padding: 0;\n margin: 0;\n li {\n float: left;\n position: relative;\n top: 0;\n padding: 0;\n margin: 0 1px 0px 0;\n border-top: 1px solid $canvas !important;\n border-bottom: 1px solid $canvas !important;\n background: $canvas !important;\n a {\n top: 0 !important;\n margin-bottom: 0 !important;\n padding: 6px 16px;\n text-decoration: none;\n min-height: 32px;\n color: $textColor;\n float: left;\n }\n &.active,\n &:hover {\n border-bottom-color: whiten($info, 0.25) !important;\n border-top-color: whiten($info, 0.4) !important;\n background: whiten($info, 0.1) !important;\n a {\n background: transparent !important;\n border-color: transparent !important;\n color: $textHighlight !important;\n text-shadow: 1px 1px 0 black(0.2);\n }\n }\n &.disabled:hover {\n background: $canvas !important;\n a {\n cursor: not-allowed !important;\n color: $textColor !important;\n }\n }\n }\n }\n\n .ui-container {\n display: none;\n background: $canvas;\n @include simple-flex-box($treeSidebar * 1px);\n border-right: 1px $uiGeneralContentBorder solid;\n .block-title {\n @include font-size(14);\n padding: 2px 8px;\n margin: 0;\n }\n .tree-action-bar-box {\n margin: 10px 0;\n opacity: 0;\n &.active {\n opacity: 1;\n @include vendor-prefix(opacity, 0.25s ease-in-out, property, (-webkit-, -moz-, ''));\n }\n }\n }\n\n .content-container {\n border: none;\n @include simple-flex-box();\n overflow: auto;\n }\n\n .content-toolbar {\n height: 2rem;\n display: flex;\n flex-direction: row;\n justify-content: flex-end;\n }\n\n .toggle-modal-button {\n user-select: none;\n margin: 0 2rem;\n .icon-add {\n font-size: 1.6rem;\n position: relative;\n top: 2px;\n margin-right: 8px;\n }\n }\n\n .content-block {\n padding: 20px;\n overflow-y: auto;\n @include flex-container(wrap);\n & > .grid-container {\n width: 100%;\n }\n\n .data-container-wrapper {\n padding: 0px 20px 0 0;\n &:before,\n &:after {\n content: ' ';\n display: table;\n }\n &:after {\n clear: both;\n }\n & > section,\n .data-container {\n width: 260px;\n margin: 0 20px 20px 0;\n float: left;\n @include simple-border();\n &.double {\n width: 540px;\n }\n .emptyContentFooter {\n display: none;\n }\n .tree {\n border: none;\n max-width: none;\n max-height: none;\n }\n form {\n background: none;\n border: none;\n margin: 0;\n padding: 0;\n }\n & > header,\n .ui-widget-header {\n background: $canvas;\n border-width: 0px !important;\n border-bottom: 1px #ddd solid !important;\n h1,\n h6 {\n padding: 4px;\n margin: 0;\n @include font-size(14);\n }\n }\n & > div,\n .ui-widget-content,\n .container-content {\n border-width: 0px !important;\n overflow-y: auto;\n min-height: 250px;\n padding: 5px;\n .icon-grip {\n cursor: move;\n }\n }\n\n & > footer {\n min-height: 33px;\n }\n & > footer,\n .data-container-footer {\n background: $canvas;\n text-align: right !important;\n padding: 4px;\n border-width: 0px !important;\n border-top: 1px #ddd solid !important;\n .square {\n width: 28px;\n span {\n padding: 0;\n left: 0;\n }\n }\n }\n ol {\n margin: 0 0 0 15px;\n padding: 10px;\n }\n }\n }\n\n #form-container.ui-widget-content {\n border: none !important;\n }\n form:not(.list-container) {\n border: 1px $uiGeneralContentBorder solid;\n background: $canvas;\n padding: 30px;\n @include simple-border();\n }\n [class^='btn-'],\n [class*=' btn-'] {\n margin: 0 2px;\n }\n }\n}\n\n.search-modal {\n width: 100% !important;\n // Increasing specificity\n &.search-modal {\n max-height: 100%;\n min-height: 320px;\n height: 100%;\n padding: 0px;\n }\n .ui-container {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n padding: 64px 0px 20px 20px;\n .filters-container {\n flex: 1 1 auto;\n height: 100%;\n min-height: 0;\n display: flex;\n flex-direction: column;\n }\n .basic-search-container {\n padding-right: 20px;\n flex: 0 0 auto;\n .class-filter-container {\n cursor: pointer;\n z-index: 2;\n }\n }\n .filter-container {\n position: relative;\n margin-bottom: 8px;\n &:last-child {\n padding-bottom: 16px;\n }\n > .icon-find,\n > .icon-folder {\n position: absolute;\n top: 7px;\n left: 8px;\n color: #666;\n }\n .icon-down {\n position: absolute;\n top: 1px;\n right: 1px;\n padding: 5px;\n background: white;\n }\n > input,\n > textarea {\n width: 100%;\n padding-left: 28px;\n }\n .class-filter {\n cursor: pointer;\n resize: none;\n white-space: nowrap;\n overflow: hidden;\n &[readonly]{\n opacity: 1 !important;\n }\n }\n .class-tree {\n display: none;\n position: absolute;\n top: map-get($classTreeVariables, top);\n left: map-get($classTreeVariables, left);\n width: map-get($classTreeVariables, width);\n font-size: map-get($classTreeVariables, font-size);\n\n main {\n overflow-y: auto;\n border: 1px solid black;\n }\n }\n }\n .buttons-container {\n flex: 0 0 auto;\n padding-right: 4px;\n display: flex;\n justify-content: space-between;\n button {\n flex: 1 1 auto;\n margin-right: 16px;\n vertical-align: top;\n }\n .btn-transparent {\n background-color: transparent;\n border: 1px solid black;\n color: black;\n text-shadow: none;\n }\n }\n }\n .content-container {\n @media screen and (min-width: 840px) {\n padding: 44px 64px 64px;\n }\n .no-datatable-container {\n display: flex;\n flex-direction: column;\n align-items: center;\n .no-datatable-icon {\n color: $lightBlueGrey;\n font-size: 3.5em;\n margin-bottom: 30px;\n }\n }\n }\n\n // Overwrite some not customizable styles of datatable and pagination components\n .go-to-item {\n background-color: transparent !important;\n border: 1px solid black;\n color: black !important;\n text-shadow: none !important;\n }\n\n .actions {\n width: 12%;\n }\n\n // Custom class for close modal button, so it positioned on the top-left corner instead of top-right (default)\n .modal-close-left {\n position: absolute;\n left: 20px;\n top: 20px;\n cursor: pointer;\n font-weight: bold;\n color: $textColor !important;\n background-color: transparent;\n padding: 0;\n height: 24px;\n .icon-close {\n font-size: 2.4rem;\n }\n }\n}\n\n","// buttons and alerts\n$success: rgb(14, 145, 75);\n$info: rgb(14, 93, 145);\n$warning: rgb(216, 174, 91);\n$danger: rgb(201, 96, 67);\n$error: rgb(186, 18, 43);\n$activeInteraction: rgb(195, 90, 19);\n\n// corporate identity\n$logoRed: rgb(186, 18, 43);\n$grey: rgb(173, 161, 148);\n$darkBlueGrey: rgb(164, 187, 197);\n$mediumBlueGrey: rgb(193, 212, 220);\n$lightBlueGrey: rgb(228, 236, 239);\n$brownRedGrey: rgb(154, 137, 123);\n$darkBrown: rgb(111, 99, 89);\n$websiteBorder: rgb(141, 148, 158);\n\n// ui elements, these should only variations of the above\n// naming convention: jQueryUi theme roller -> camelCase\n\n$textColor: #222;\n$textHighlight: white;\n$textSecondary: #737373;\n$shadowColor: rgba(0, 0, 0, 0.25);\n\n$modalBorderColor: #dddfe2;\n$searchInp: #dddfe2;\n\n$uiGeneralContentBg: white();\n$uiGeneralContentBorder: #ddd;\n\n$uiHeaderBg: #d4d5d7;\n\n$uiClickableDefaultBg: #f3f1ef;\n$uiClickableHoverBg: whiten($info, 0.2);\n//$uiClickableActiveBg: $uiHeaderBg;\n$uiClickableActiveBg: whiten($websiteBorder, 0.2);\n//$uiClickableActiveBg: #aaa;\n\n$uiSelectableSelectedBg: whiten($info, 0.2);\n$uiSelectableSelectedHoverBg: whiten($info, 0.1);\n$uiSelectableHoverBg: whiten($info, 0.9);\n\n$uiOverlay: $lightBlueGrey;\n\n// new layout. Implemented now only for review panel\n$uiReviewPanelBg: #f2f2f2;\n$uiReviewPanelTextDisabled: hsl(0, 0%, 45%);\n$uiReviewPanelTextDefault: hsl(0, 0%, 12%);\n$uiReviewPanelBgDefault: $uiGeneralContentBg;\n$uiReviewPanelPrimaryHighlight: hsl(208, 100%, 32%);\n$uiReviewPanelBgInverted: $uiReviewPanelTextDefault;\n$uiReviewPanelTextInverted: $uiGeneralContentBg;\n\n// sidebars etc.\n$canvas: mix(#fff, $grey, 85%);\n\n// colors taken from feedback.scss\n$successBgColor: whiten($success, 0.8);\n$successBorderColor: whiten($success, 0.1);\n\n$infoBgColor: whiten($info, 0.8);\n$infoBorderColor: whiten($info, 0.1);\n\n$warningBgColor: whiten($warning, 0.8);\n$warningBorderColor: whiten($warning, 0.1);\n\n$dangerBgColor: whiten($danger, 0.8);\n$dangerBorderColor: whiten($danger, 0.1);\n\n$errorBgColor: whiten($error, 0.8);\n$errorBorderColor: whiten($error, 0.1);\n\n$darkBar: rgb(51, 51, 51);\n$darkBarTxt: rgb(230, 230, 230);\n$darkBarIcon: rgb(220, 220, 220);\n\n$actionLinkColor: #276d9b;\n$actionLinkHoverColor: #4f83a7;\n\n$colorWheel-01: #c3ba13;\n$colorWheel-02: #84a610;\n$colorWheel-03: #2b8e0e;\n$colorWheel-04: #0f9787;\n$colorWheel-05: #0e5d91;\n$colorWheel-06: #0d2689;\n$colorWheel-07: #400d83;\n$colorWheel-08: #960e7d;\n$colorWheel-09: #ba122b;\n$colorWheel-10: #c34713;\n$colorWheel-11: #c36f13;\n$colorWheel-12: #c39413;\n"]}
1	+ {"version":3,"sources":["../../../scss/inc/_functions.scss","../../../scss/inc/fonts/_tao-icon-vars.scss","../scss/searchModal.scss%23sass","../scss/searchModal.scss","../../../scss/inc/_colors.scss"],"names":[],"mappings":"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","file":"searchModal.css","sourcesContent":["@mixin iterate-sprite($iconList, $x, $y, $direction, $prefix:'') {\n @each $icon in $iconList {\n #{$prefix}#{$icon} {\n background-position: $x * 1px $y * 1px;\n }\n @if $direction == 'x' {\n $x: $x - 16;\n } @else {\n $y: $y - 16;\n }\n }\n}\n\n/\nUsage:\n- linear-gradient((color1, color2, color3)) - returns linear-gradient with evenly distributed colors,\n if 3 colors used then the position of each will be 33,33%\n- linear-gradient((color1 0%, color2 30%, color3 80%)) - returns linear-gradient with manually distributed colors,\n first param - color, second - position. Also you can use px or other valid units for set position.\n/\n@mixin linear-gradient($colorList, $direction: 'to right') {\n $percentage: 0;\n $units: '%';\n $count: length($colorList);\n $increment: calc(100 / ($count - 1));\n $css: #{$direction + ', '};\n $sep: ', ';\n @each $colorItem in $colorList {\n $color: $colorItem;\n @if (length($colorItem) > 1) {\n $color: nth($colorItem, 1);\n $percentage: nth($colorItem, 2);\n $units: '';\n }\n @if ($percentage >= 100 or index($colorList, $colorItem) == $count) {\n $sep: '';\n }\n $css: #{$css + $color + ' ' + $percentage + $units + $sep};\n $percentage: $percentage + $increment;\n }\n background: linear-gradient( #{$css} );\n}\n\n@mixin grid-unit($span, $numCols: 12, $gutter: 0) {\n $gridPx: 840;\n $rawSpanPx: calc((($gridPx - ($numCols * $gutter)) / $numCols));\n $spanPx: $rawSpanPx * $span + (($span - 1) * $gutter);\n $spanPercent: widthPerc($spanPx, $gridPx);\n $marginPercent: widthPerc($gutter, $gridPx);\n margin-left: $marginPercent;\n width: $spanPercent;\n}\n\n\n@mixin vendor-prefix($property, $value, $whatToPrefix: property, $prefixes: (-webkit-, -moz-, -ms-, -o-, '')) {\n @if $whatToPrefix == 'property' {\n @each $prefix in $prefixes {\n #{$prefix + $property}: #{$value};\n }\n }\n @else if $whatToPrefix == 'value' {\n @each $prefix in $prefixes {\n #{$property}: #{$prefix + $value};\n }\n }\n}\n@mixin flex-container($wrapBehavior: nowrap, $direction : row) {\n @include vendor-prefix(display, flex, value, (-ms-, -webkit-, ''));\n\n @include vendor-prefix(flex-direction, $direction, property, (-ms-, -webkit-, ''));\n @include vendor-prefix(flex-wrap, $wrapBehavior, property, (-ms-, -webkit-, ''));\n\n @include vendor-prefix(justify-content, flex-start, property, (-webkit-, ''));\n\n @include vendor-prefix(align-content, flex-start, property, (-webkit-, ''));\n\n @include vendor-prefix(align-items, stretch, property, (-webkit-, ''));\n}\n\n@mixin simple-flex-box($width: auto, $minWidth: 1) {\n\n @include vendor-prefix(order, 0, property, (-ms-, -webkit-, ''));\n flex-item-align: stretch;\n -ms-flex-item-align: stretch;\n @include vendor-prefix(align-self, stretch, property, (-webkit-, ''));\n\n // if both, min width and width are set, width will win this conflict\n @if ($width == auto) {\n @if ($minWidth != 1) {\n @include vendor-prefix(flex, 1 1 $minWidth, property, (-ms-, -webkit-, ''));\n }\n @else {\n @include vendor-prefix(flex, 1 1 auto, property, (-ms-, -webkit-, ''));\n // @see https://developer.mozilla.org/en-US/docs/Web/CSS/flex-basis#Values\n // for a discussion auto vs. main-size\n @include vendor-prefix(flex, 1 1, property, (-ms-, -webkit-, ''));\n }\n }\n @else {\n @include vendor-prefix(flex, 0 0 $width, property, (-ms-, -webkit-, ''));\n }\n}\n\n\n@mixin box-shadow($horiz: 1px, $vert: 1px, $blur: 2px, $spread: 0, $color: rgba(0, 0, 0, .2)) {\n @include vendor-prefix(box-shadow, $horiz $vert $blur $spread $color, property);\n}\n\n@mixin simple-border($color: #ddd) {\n border: 1px solid $color;\n border-radius: 2px;\n -webkit-border-radius: 2px;\n}\n\n@mixin border-radius($radius: 2) {\n -moz-border-radius: $radius * 1px;\n -webkit-border-radius: $radius * 1px;\n border-radius: $radius * 1px;\n}\n\n@mixin border-radius-top($radius: 2) {\n -webkit-border-top-left-radius: $radius * 1px;\n -webkit-border-top-right-radius: $radius * 1px;\n -moz-border-radius-topleft: $radius * 1px;\n -moz-border-radius-topright: $radius * 1px;\n border-top-left-radius: $radius * 1px;\n border-top-right-radius: $radius * 1px;\n}\n\n@mixin border-radius-bottom($radius: 2) {\n -webkit-border-bottom-right-radius: $radius * 1px;\n -webkit-border-bottom-left-radius: $radius * 1px;\n -moz-border-radius-bottomright: $radius * 1px;\n -moz-border-radius-bottomleft: $radius * 1px;\n border-bottom-right-radius: $radius * 1px;\n border-bottom-left-radius: $radius * 1px;\n}\n\n@mixin border-radius-left($radius: 2) {\n -webkit-border-top-left-radius: $radius * 1px;\n -webkit-border-bottom-left-radius: $radius * 1px;\n -moz-border-radius-topleft: $radius * 1px;\n -moz-border-radius-bottomleft: $radius * 1px;\n border-top-left-radius: $radius * 1px;\n border-bottom-left-radius: $radius * 1px;\n}\n\n@mixin border-radius-right($radius: 2) {\n -webkit-border-top-right-radius: $radius * 1px;\n -webkit-border-bottom-right-radius: $radius * 1px;\n -moz-border-radius-topright: $radius * 1px;\n -moz-border-radius-bottomright: $radius * 1px;\n border-top-right-radius: $radius * 1px;\n border-bottom-right-radius: $radius * 1px;\n}\n\n@mixin border-radius-top-left($radius: 2) {\n -webkit-border-top-left-radius: $radius * 1px;\n -moz-border-radius-topleft: $radius * 1px;\n border-top-left-radius: $radius * 1px;\n}\n\n@mixin border-radius-top-right($radius: 2) {\n -webkit-border-top-right-radius: $radius * 1px;\n -moz-border-radius-topright: $radius * 1px;\n border-top-right-radius: $radius * 1px;\n}\n\n@mixin border-radius-bottom-right($radius: 2) {\n -webkit-border-bottom-right-radius: $radius * 1px;\n -moz-border-radius-bottomright: $radius * 1px;\n border-bottom-right-radius: $radius * 1px;\n}\n\n@mixin border-radius-bottom-left($radius: 2) {\n -webkit-border-bottom-left-radius: $radius * 1px;\n -moz-border-radius-bottomleft: $radius * 1px;\n border-bottom-left-radius: $radius * 1px;\n}\n\n@mixin border-box() {\n -moz-box-sizing: border-box;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n}\n\n@function whiten($color, $white: 0.3) {\n @return mix(#fff, $color, ($white * 100) * 1%);\n}\n\n@function blacken($color, $black: 0.3) {\n @return mix(#000, $color, ($black * 100) * 1%);\n}\n\n@function widthPerc($colWidth, $context) {\n @return calc(($colWidth * 100 / $context) * 1%)\n}\n\n@function remDist($fontSizePx) {\n @return calc(($fontSizePx / 10) * 1rem)\n}\n\n@function black($alpha: 1) {\n @return (rgba(0, 0, 0, $alpha))\n}\n\n@function white($alpha: 1) {\n @return (rgba(255, 255, 255, $alpha))\n}\n\n@mixin font-size($remPx, $important: false) {\n @if $important == true {\n font-size: calc(($remPx) * 1px) !important;\n font-size: calc(($remPx / 10) * 1rem) !important;\n }\n @else {\n font-size: calc(($remPx) * 1px);\n font-size: calc(($remPx / 10) * 1rem);\n }\n}\n\n\n@mixin keyframes($name) {\n @-o-keyframes #{$name} { @content };\n @-moz-keyframes #{$name} { @content };\n @-webkit-keyframes #{$name} { @content };\n @keyframes #{$name} { @content };\n}\n\n\n@mixin animation($value, $type:'') {\n $animation: animation;\n @if $type != '' {\n $animation: $animation + '-' + $type;\n }\n @include vendor-prefix($animation, $value, property);\n}\n\n/// CSS transition mixin to the current selection (apply also vendor prefixes).\n/// See <https://developer.mozilla.org/en-US/docs/Web/CSS/transition> for the values\n///\n/// @param {property} [$type = all] the CSS property to apply the transition to\n/// @param {time} [$duration = .5s] the transition property\n/// @param {timing-function} [$effect = ease-out] the transition property\n@mixin transition($type : all, $duration : 0.5s, $effect : ease-out, $delay : 0s){\n @include vendor-prefix(transition, $type + ', ' + $duration + ', ' + $effect + ', ' + $delay, property);\n}\n\n@mixin fade($duration: 1s){\n\n @include keyframes(fade) {\n 0% {opacity:0;}\n 50% {opacity:1;}\n 100% {opacity:0;}\n }\n\n @include vendor-prefix(animation, fade 1s forwards, property);\n}\n\n@mixin repeat(){\n @include animation(infinite, iteration-count);\n}\n\n@mixin largeHeading() {\n @include font-size(20);\n font-family: $headingFont;\n font-style: normal;\n}\n\n@mixin disableSelect() {\n @include vendor-prefix(user-select, none, property);\n}\n\n/* based on \"visually-hidden\" mixin in LDS for accessibility goals /\n@mixin visuallyHidden() {\n position: absolute;\n width: 1px;\n height: 1px;\n overflow: hidden;\n clip: rect(1px, 1px, 1px, 1px);\n margin: 0;\n padding: 0;\n}\n","/ Do not edit /@mixin tao-icon-setup {\n / use !important to prevent issues with browser extensions that change fonts /\n font-family: 'tao' !important;\n speak: never;\n font-style: normal;\n font-weight: normal;\n font-variant: normal;\n text-transform: none;\n line-height: 1;\n\n / Better Font Rendering =========== /\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n\n@mixin icon-align-center { content: \"\\e92a\"; }\n@mixin icon-multiple-magicwand { content: \"\\e929\"; }\n@mixin icon-sd-import { content: \"\\e91f\"; }\n@mixin icon-sd-export { content: \"\\e924\"; }\n@mixin icon-browse { content: \"\\e925\"; }\n@mixin icon-minus { content: \"\\e926\"; }\n@mixin icon-plus { content: \"\\e927\"; }\n@mixin icon-sd-save { content: \"\\e928\"; }\n@mixin icon-back-button { content: \"\\e91e\"; }\n@mixin icon-japan-incorrect { content: \"\\e91b\"; }\n@mixin icon-japan-correct { content: \"\\e91c\"; }\n@mixin icon-japan-partial { content: \"\\e91d\"; }\n@mixin icon-score-partial { content: \"\\e91a\"; }\n@mixin icon-furigana { content: \"\\e919\"; }\n@mixin icon-add-subsection { content: \"\\e918\"; }\n@mixin icon-info-bare { content: \"\\e923\"; }\n@mixin icon-bookmark-outline { content: \"\\e922\"; }\n@mixin icon-bookmark { content: \"\\e921\"; }\n@mixin icon-indicator { content: \"\\e920\"; }\n@mixin icon-wrap-inline { content: \"\\e915\"; }\n@mixin icon-wrap-left { content: \"\\e916\"; }\n@mixin icon-wrap-right { content: \"\\e917\"; }\n@mixin icon-offline { content: \"\\e913\"; }\n@mixin icon-online { content: \"\\e914\"; }\n@mixin icon-tab { content: \"\\e90d\"; }\n@mixin icon-untab { content: \"\\e90e\"; }\n@mixin icon-multi-select { content: \"\\e90b\"; }\n@mixin icon-clipboard { content: \"\\e90a\"; }\n@mixin icon-filebox { content: \"\\e909\"; }\n@mixin icon-click-to-speak { content: \"\\e907\"; }\n@mixin icon-speech-bubble { content: \"\\f0e5\"; }\n@mixin icon-microphone { content: \"\\f130\"; }\n@mixin icon-microphone-off { content: \"\\f131\"; }\n@mixin icon-disconnect { content: \"\\e905\"; }\n@mixin icon-connect { content: \"\\e906\"; }\n@mixin icon-eliminate { content: \"\\e904\"; }\n@mixin icon-wheelchair { content: \"\\e903\"; }\n@mixin icon-text-marker { content: \"\\e902\"; }\n@mixin icon-unshield { content: \"\\e32a\"; }\n@mixin icon-shield { content: \"\\e8e8\"; }\n@mixin icon-tree { content: \"\\e6b4\"; }\n@mixin icon-home { content: \"\\e6b3\"; }\n@mixin icon-shared-file { content: \"\\e6b2\"; }\n@mixin icon-end-attempt { content: \"\\e603\"; }\n@mixin icon-icon { content: \"\\f1c5\"; }\n@mixin icon-radio-bg { content: \"\\e600\"; }\n@mixin icon-checkbox-bg { content: \"\\e601\"; }\n@mixin icon-tag { content: \"\\e602\"; }\n@mixin icon-style { content: \"\\e604\"; }\n@mixin icon-ownership-transfer { content: \"\\e605\"; }\n@mixin icon-property-advanced { content: \"\\e606\"; }\n@mixin icon-property-add { content: \"\\e607\"; }\n@mixin icon-repository-add { content: \"\\e608\"; }\n@mixin icon-repository-remove { content: \"\\e609\"; }\n@mixin icon-repository { content: \"\\e60a\"; }\n@mixin icon-result-server { content: \"\\e60b\"; }\n@mixin icon-folder { content: \"\\e60c\"; }\n@mixin icon-folder-open { content: \"\\e60d\"; }\n@mixin icon-left { content: \"\\e60e\"; }\n@mixin icon-right { content: \"\\e60f\"; }\n@mixin icon-up { content: \"\\e610\"; }\n@mixin icon-down { content: \"\\e611\"; }\n@mixin icon-undo { content: \"\\e612\"; }\n@mixin icon-redo { content: \"\\e613\"; }\n@mixin icon-screen { content: \"\\e614\"; }\n@mixin icon-laptop { content: \"\\e615\"; }\n@mixin icon-tablet { content: \"\\e616\"; }\n@mixin icon-phone { content: \"\\e617\"; }\n@mixin icon-move { content: \"\\e618\"; }\n@mixin icon-bin { content: \"\\e619\"; }\n@mixin icon-shuffle { content: \"\\e61a\"; }\n@mixin icon-print { content: \"\\e61b\"; }\n@mixin icon-tools { content: \"\\e61c\"; }\n@mixin icon-settings { content: \"\\e61d\"; }\n@mixin icon-video { content: \"\\e61e\"; }\n@mixin icon-find { content: \"\\e61f\"; }\n@mixin icon-image { content: \"\\e620\"; }\n@mixin icon-edit { content: \"\\e621\"; }\n@mixin icon-document { content: \"\\e622\"; }\n@mixin icon-resize-grid { content: \"\\e623\"; }\n@mixin icon-resize { content: \"\\e624\"; }\n@mixin icon-help { content: \"\\e625\"; }\n@mixin icon-mobile-menu { content: \"\\e626\"; }\n@mixin icon-fix { content: \"\\e627\"; }\n@mixin icon-unlock { content: \"\\e628\"; }\n@mixin icon-lock { content: \"\\e629\"; }\n@mixin icon-ul { content: \"\\e62a\"; }\n@mixin icon-ol { content: \"\\e62b\"; }\n@mixin icon-email { content: \"\\e62c\"; }\n@mixin icon-download { content: \"\\e62d\"; }\n@mixin icon-logout { content: \"\\e62e\"; }\n@mixin icon-login { content: \"\\e62f\"; }\n@mixin icon-spinner { content: \"\\e630\"; }\n@mixin icon-preview { content: \"\\e631\"; }\n@mixin icon-external { content: \"\\e632\"; }\n@mixin icon-time { content: \"\\e633\"; }\n@mixin icon-save { content: \"\\e634\"; }\n@mixin icon-warning { content: \"\\e635\"; }\n@mixin icon-add { content: \"\\e636\"; }\n@mixin icon-error { content: \"\\e900\"; }\n@mixin icon-close { content: \"\\e637\"; }\n@mixin icon-success { content: \"\\e638\"; }\n@mixin icon-remove { content: \"\\e639\"; }\n@mixin icon-info { content: \"\\e63a\"; }\n@mixin icon-danger { content: \"\\e63b\"; }\n@mixin icon-users { content: \"\\e63c\"; }\n@mixin icon-user { content: \"\\e63d\"; }\n@mixin icon-test-taker { content: \"\\e63e\"; }\n@mixin icon-test-takers { content: \"\\e63f\"; }\n@mixin icon-item { content: \"\\e640\"; }\n@mixin icon-test { content: \"\\e641\"; }\n@mixin icon-delivery { content: \"\\e642\"; }\n@mixin icon-eye-slash { content: \"\\e643\"; }\n@mixin icon-result { content: \"\\e644\"; }\n@mixin icon-delivery-small { content: \"\\e645\"; }\n@mixin icon-upload { content: \"\\e646\"; }\n@mixin icon-result-small { content: \"\\e647\"; }\n@mixin icon-mobile-preview { content: \"\\e648\"; }\n@mixin icon-extension { content: \"\\e649\"; }\n@mixin icon-desktop-preview { content: \"\\e64a\"; }\n@mixin icon-tablet-preview { content: \"\\e64b\"; }\n@mixin icon-insert-horizontal-line { content: \"\\e64c\"; }\n@mixin icon-table { content: \"\\e64d\"; }\n@mixin icon-anchor { content: \"\\e64e\"; }\n@mixin icon-unlink { content: \"\\e64f\"; }\n@mixin icon-link { content: \"\\e650\"; }\n@mixin icon-right-left { content: \"\\e651\"; }\n@mixin icon-left-right { content: \"\\e652\"; }\n@mixin icon-special-character { content: \"\\e653\"; }\n@mixin icon-source { content: \"\\e654\"; }\n@mixin icon-new-page { content: \"\\e655\"; }\n@mixin icon-templates { content: \"\\e656\"; }\n@mixin icon-cut { content: \"\\e657\"; }\n@mixin icon-replace { content: \"\\e658\"; }\n@mixin icon-copy { content: \"\\e659\"; }\n@mixin icon-paste { content: \"\\e65a\"; }\n@mixin icon-select-all { content: \"\\e65b\"; }\n@mixin icon-paste-text { content: \"\\e65c\"; }\n@mixin icon-paste-word { content: \"\\e65d\"; }\n@mixin icon-bold { content: \"\\e65e\"; }\n@mixin icon-italic { content: \"\\e65f\"; }\n@mixin icon-underline { content: \"\\e660\"; }\n@mixin icon-subscript { content: \"\\e661\"; }\n@mixin icon-superscript { content: \"\\e662\"; }\n@mixin icon-strike-through { content: \"\\e663\"; }\n@mixin icon-decrease-indent { content: \"\\e664\"; }\n@mixin icon-increase-indent { content: \"\\e665\"; }\n@mixin icon-block-quote { content: \"\\e666\"; }\n@mixin icon-div-container { content: \"\\e667\"; }\n@mixin icon-align-left { content: \"\\e668\"; }\n@mixin icon-center { content: \"\\e669\"; }\n@mixin icon-align-right { content: \"\\e66a\"; }\n@mixin icon-justify { content: \"\\e66b\"; }\n@mixin icon-choice { content: \"\\e66c\"; }\n@mixin icon-inline-choice { content: \"\\e66d\"; }\n@mixin icon-match { content: \"\\e66e\"; }\n@mixin icon-associate { content: \"\\e66f\"; }\n@mixin icon-media { content: \"\\e670\"; }\n@mixin icon-graphic-order { content: \"\\e671\"; }\n@mixin icon-hotspot { content: \"\\e672\"; }\n@mixin icon-graphic-gap { content: \"\\e673\"; }\n@mixin icon-graphic-associate { content: \"\\e674\"; }\n@mixin icon-select-point { content: \"\\e675\"; }\n@mixin icon-pin { content: \"\\e676\"; }\n@mixin icon-import { content: \"\\e677\"; }\n@mixin icon-export { content: \"\\e678\"; }\n@mixin icon-move-item { content: \"\\e679\"; }\n@mixin icon-meta-data { content: \"\\e67a\"; }\n@mixin icon-slider { content: \"\\e67b\"; }\n@mixin icon-summary-report { content: \"\\e67c\"; }\n@mixin icon-text-entry { content: \"\\e67d\"; }\n@mixin icon-extended-text { content: \"\\e67e\"; }\n@mixin icon-eraser { content: \"\\e67f\"; }\n@mixin icon-row { content: \"\\e680\"; }\n@mixin icon-column { content: \"\\e681\"; }\n@mixin icon-text-color { content: \"\\e682\"; }\n@mixin icon-background-color { content: \"\\e683\"; }\n@mixin icon-spell-check { content: \"\\e684\"; }\n@mixin icon-polygon { content: \"\\e685\"; }\n@mixin icon-rectangle { content: \"\\e686\"; }\n@mixin icon-gap-match { content: \"\\e687\"; }\n@mixin icon-order { content: \"\\e688\"; }\n@mixin icon-hottext { content: \"\\e689\"; }\n@mixin icon-free-form { content: \"\\e68a\"; }\n@mixin icon-step-backward { content: \"\\e68b\"; }\n@mixin icon-fast-backward { content: \"\\e68c\"; }\n@mixin icon-backward { content: \"\\e68d\"; }\n@mixin icon-play { content: \"\\e68e\"; }\n@mixin icon-pause { content: \"\\e68f\"; }\n@mixin icon-stop { content: \"\\e690\"; }\n@mixin icon-forward { content: \"\\e691\"; }\n@mixin icon-fast-forward { content: \"\\e692\"; }\n@mixin icon-step-forward { content: \"\\e693\"; }\n@mixin icon-ellipsis { content: \"\\e694\"; }\n@mixin icon-circle { content: \"\\e695\"; }\n@mixin icon-target { content: \"\\e696\"; }\n@mixin icon-guide-arrow { content: \"\\e697\"; }\n@mixin icon-range-slider-right { content: \"\\e698\"; }\n@mixin icon-range-slider-left { content: \"\\e699\"; }\n@mixin icon-radio-checked { content: \"\\e69a\"; }\n@mixin icon-checkbox-indeterminate { content: \"\\e901\"; }\n@mixin icon-checkbox { content: \"\\e69b\"; }\n@mixin icon-checkbox-crossed { content: \"\\e69c\"; }\n@mixin icon-checkbox-checked { content: \"\\e69d\"; }\n@mixin icon-result-nok { content: \"\\e69e\"; }\n@mixin icon-result-ok { content: \"\\e69f\"; }\n@mixin icon-not-evaluated { content: \"\\e6a0\"; }\n@mixin icon-filter { content: \"\\e6a1\"; }\n@mixin icon-translate { content: \"\\e6a2\"; }\n@mixin icon-eject { content: \"\\e6a3\"; }\n@mixin icon-continue { content: \"\\e6a4\"; }\n@mixin icon-radio { content: \"\\e6a5\"; }\n@mixin icon-sphere { content: \"\\e6a6\"; }\n@mixin icon-reset { content: \"\\e6a7\"; }\n@mixin icon-smaller { content: \"\\e6a8\"; }\n@mixin icon-larger { content: \"\\e6a9\"; }\n@mixin icon-clock { content: \"\\e6aa\"; }\n@mixin icon-font { content: \"\\e6ab\"; }\n@mixin icon-maths { content: \"\\e6ac\"; }\n@mixin icon-grip { content: \"\\e6ad\"; }\n@mixin icon-rubric { content: \"\\e6ae\"; }\n@mixin icon-audio { content: \"\\e6af\"; }\n@mixin icon-grip-h { content: \"\\e6b0\"; }\n@mixin icon-magicwand { content: \"\\e6b1\"; }\n@mixin icon-loop { content: \"\\ea2e\"; }\n@mixin icon-calendar { content: \"\\e953\"; }\n@mixin icon-reload { content: \"\\e984\"; }\n@mixin icon-speed { content: \"\\e9a6\"; }\n@mixin icon-volume { content: \"\\ea27\"; }\n@mixin icon-contrast { content: \"\\e9d5\"; }\n@mixin icon-headphones { content: \"\\e910\"; }\n@mixin icon-compress { content: \"\\f066\"; }\n@mixin icon-map-o { content: \"\\f278\"; }\n@mixin icon-variable { content: \"\\e908\"; }\n@mixin icon-tooltip { content: \"\\e90c\"; }\n@mixin icon-globe { content: \"\\e9c9\"; }\n@mixin icon-highlighter { content: \"\\e90f\"; }\n@mixin icon-eliminate-crossed { content: \"\\e911\"; }\n@mixin icon-play-from-here { content: \"\\e912\"; }\n","@import 'inc/bootstrap';\n$classTreeVariables: (\n top: 27px,\n left: 0px,\n width: 275px,\n font-size: 1.2rem\n);\n\n.section-container {\n // some variations of flex children\n $flexCols: full, half, third, quarter;\n @for $i from 1 through length($flexCols) {\n $width: calc((100 / ($i)) 1%);\n $flexCol: #{nth($flexCols, $i)};\n .flex-container-#{$flexCol} {\n @include simple-flex-box($width);\n }\n }\n\n // 'whatever-is-left' container\n .flex-container-remaining {\n @include simple-flex-box(auto, 480px);\n }\n\n // main form on left hand side\n .flex-container-main-form {\n @include simple-flex-box(500px);\n margin: 0 20px 20px 0;\n width: 100%;\n\n .form-content {\n max-width: 100%;\n }\n }\n\n // the one for the sidebar that usually holds tree\n .flex-container-navi {\n @include simple-flex-box($treeSidebar * 1px);\n }\n\n // @todo all simple-flex-box references below should be removed once all templates are upgraded\n\n top: 0 !important;\n\n .section-header {\n border: none;\n }\n\n .content-panel {\n width: 100%;\n height: 100%;\n margin: 0;\n padding: 0;\n border: none !important;\n @include flex-container();\n }\n\n .tab-container {\n border: none;\n display: none;\n list-style-type: none;\n padding: 0;\n margin: 0;\n li {\n float: left;\n position: relative;\n top: 0;\n padding: 0;\n margin: 0 1px 0px 0;\n border-top: 1px solid $canvas !important;\n border-bottom: 1px solid $canvas !important;\n background: $canvas !important;\n a {\n top: 0 !important;\n margin-bottom: 0 !important;\n padding: 6px 16px;\n text-decoration: none;\n min-height: 32px;\n color: $textColor;\n float: left;\n }\n &.active,\n &:hover {\n border-bottom-color: whiten($info, 0.25) !important;\n border-top-color: whiten($info, 0.4) !important;\n background: whiten($info, 0.1) !important;\n a {\n background: transparent !important;\n border-color: transparent !important;\n color: $textHighlight !important;\n text-shadow: 1px 1px 0 black(0.2);\n }\n }\n &.disabled:hover {\n background: $canvas !important;\n a {\n cursor: not-allowed !important;\n color: $textColor !important;\n }\n }\n }\n }\n\n .ui-container {\n display: none;\n background: $canvas;\n @include simple-flex-box($treeSidebar * 1px);\n border-right: 1px $uiGeneralContentBorder solid;\n .block-title {\n @include font-size(14);\n padding: 2px 8px;\n margin: 0;\n }\n .tree-action-bar-box {\n margin: 10px 0;\n opacity: 0;\n &.active {\n opacity: 1;\n @include vendor-prefix(opacity, 0.25s ease-in-out, property, (-webkit-, -moz-, ''));\n }\n }\n }\n\n .content-container {\n border: none;\n @include simple-flex-box();\n overflow: auto;\n }\n\n .content-toolbar {\n height: 2rem;\n display: flex;\n flex-direction: row;\n justify-content: flex-end;\n }\n\n .toggle-modal-button {\n user-select: none;\n margin: 0 2rem;\n .icon-add {\n font-size: 1.6rem;\n position: relative;\n top: 2px;\n margin-right: 8px;\n }\n }\n\n .content-block {\n padding: 20px;\n overflow-y: auto;\n @include flex-container(wrap);\n & > .grid-container {\n width: 100%;\n }\n\n .data-container-wrapper {\n padding: 0px 20px 0 0;\n &:before,\n &:after {\n content: ' ';\n display: table;\n }\n &:after {\n clear: both;\n }\n & > section,\n .data-container {\n width: 260px;\n margin: 0 20px 20px 0;\n float: left;\n @include simple-border();\n &.double {\n width: 540px;\n }\n .emptyContentFooter {\n display: none;\n }\n .tree {\n border: none;\n max-width: none;\n max-height: none;\n }\n form {\n background: none;\n border: none;\n margin: 0;\n padding: 0;\n }\n & > header,\n .ui-widget-header {\n background: $canvas;\n border-width: 0px !important;\n border-bottom: 1px #ddd solid !important;\n h1,\n h6 {\n padding: 4px;\n margin: 0;\n @include font-size(14);\n }\n }\n & > div,\n .ui-widget-content,\n .container-content {\n border-width: 0px !important;\n overflow-y: auto;\n min-height: 250px;\n padding: 5px;\n .icon-grip {\n cursor: move;\n }\n }\n\n & > footer {\n min-height: 33px;\n }\n & > footer,\n .data-container-footer {\n background: $canvas;\n text-align: right !important;\n padding: 4px;\n border-width: 0px !important;\n border-top: 1px #ddd solid !important;\n .square {\n width: 28px;\n span {\n padding: 0;\n left: 0;\n }\n }\n }\n ol {\n margin: 0 0 0 15px;\n padding: 10px;\n }\n }\n }\n\n #form-container.ui-widget-content {\n border: none !important;\n }\n form:not(.list-container) {\n border: 1px $uiGeneralContentBorder solid;\n background: $canvas;\n padding: 30px;\n @include simple-border();\n }\n [class^='btn-'],\n [class=' btn-'] {\n margin: 0 2px;\n }\n }\n}\n\n.search-modal {\n width: 100% !important;\n // Increasing specificity\n &.search-modal {\n max-height: 100%;\n min-height: 320px;\n height: 100%;\n padding: 0px;\n }\n .ui-container {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n padding: 64px 0px 20px 20px;\n .filters-container {\n flex: 1 1 auto;\n height: 100%;\n min-height: 0;\n display: flex;\n flex-direction: column;\n }\n .basic-search-container {\n padding-right: 20px;\n flex: 0 0 auto;\n .class-filter-container {\n cursor: pointer;\n z-index: 2;\n }\n }\n .filter-container {\n position: relative;\n z-index: 1;\n margin-bottom: 8px;\n &:last-child {\n padding-bottom: 16px;\n }\n > .icon-find,\n > .icon-folder {\n position: absolute;\n top: 7px;\n left: 8px;\n color: #666;\n }\n .icon-down {\n position: absolute;\n top: 1px;\n right: 1px;\n padding: 5px;\n background: white;\n }\n > input,\n > textarea {\n width: 100%;\n padding-left: 28px;\n }\n .class-filter {\n cursor: pointer;\n resize: none;\n white-space: nowrap;\n overflow: hidden;\n &[readonly]{\n opacity: 1 !important;\n }\n }\n .class-tree {\n display: none;\n position: absolute;\n top: map-get($classTreeVariables, top);\n left: map-get($classTreeVariables, left);\n width: map-get($classTreeVariables, width);\n font-size: map-get($classTreeVariables, font-size);\n\n main {\n overflow-y: auto;\n border: 1px solid black;\n }\n }\n }\n .buttons-container {\n flex: 0 0 auto;\n padding-right: 4px;\n display: flex;\n justify-content: space-between;\n button {\n flex: 1 1 auto;\n margin-right: 16px;\n vertical-align: top;\n }\n .btn-transparent {\n background-color: transparent;\n border: 1px solid black;\n color: black;\n text-shadow: none;\n }\n }\n }\n .content-container {\n @media screen and (min-width: 840px) {\n padding: 44px 64px 64px;\n }\n .no-datatable-container {\n display: flex;\n flex-direction: column;\n align-items: center;\n .no-datatable-icon {\n color: $lightBlueGrey;\n font-size: 3.5em;\n margin-bottom: 30px;\n }\n }\n }\n\n // Overwrite some not customizable styles of datatable and pagination components\n .go-to-item {\n background-color: transparent !important;\n border: 1px solid black;\n color: black !important;\n text-shadow: none !important;\n }\n\n .actions {\n width: 12%;\n }\n\n // Custom class for close modal button, so it positioned on the top-left corner instead of top-right (default)\n .modal-close-left {\n position: absolute;\n left: 20px;\n top: 20px;\n cursor: pointer;\n font-weight: bold;\n color: $textColor !important;\n background-color: transparent;\n padding: 0;\n height: 24px;\n .icon-close {\n font-size: 2.4rem;\n }\n }\n}\n\n","@import 'inc/bootstrap';\n$classTreeVariables: (\n top: 27px,\n left: 0px,\n width: 275px,\n font-size: 1.2rem\n);\n\n.section-container {\n // some variations of flex children\n $flexCols: full, half, third, quarter;\n @for $i from 1 through length($flexCols) {\n $width: calc((100 / ($i)) 1%);\n $flexCol: #{nth($flexCols, $i)};\n .flex-container-#{$flexCol} {\n @include simple-flex-box($width);\n }\n }\n\n // 'whatever-is-left' container\n .flex-container-remaining {\n @include simple-flex-box(auto, 480px);\n }\n\n // main form on left hand side\n .flex-container-main-form {\n @include simple-flex-box(500px);\n margin: 0 20px 20px 0;\n width: 100%;\n\n .form-content {\n max-width: 100%;\n }\n }\n\n // the one for the sidebar that usually holds tree\n .flex-container-navi {\n @include simple-flex-box($treeSidebar * 1px);\n }\n\n // @todo all simple-flex-box references below should be removed once all templates are upgraded\n\n top: 0 !important;\n\n .section-header {\n border: none;\n }\n\n .content-panel {\n width: 100%;\n height: 100%;\n margin: 0;\n padding: 0;\n border: none !important;\n @include flex-container();\n }\n\n .tab-container {\n border: none;\n display: none;\n list-style-type: none;\n padding: 0;\n margin: 0;\n li {\n float: left;\n position: relative;\n top: 0;\n padding: 0;\n margin: 0 1px 0px 0;\n border-top: 1px solid $canvas !important;\n border-bottom: 1px solid $canvas !important;\n background: $canvas !important;\n a {\n top: 0 !important;\n margin-bottom: 0 !important;\n padding: 6px 16px;\n text-decoration: none;\n min-height: 32px;\n color: $textColor;\n float: left;\n }\n &.active,\n &:hover {\n border-bottom-color: whiten($info, 0.25) !important;\n border-top-color: whiten($info, 0.4) !important;\n background: whiten($info, 0.1) !important;\n a {\n background: transparent !important;\n border-color: transparent !important;\n color: $textHighlight !important;\n text-shadow: 1px 1px 0 black(0.2);\n }\n }\n &.disabled:hover {\n background: $canvas !important;\n a {\n cursor: not-allowed !important;\n color: $textColor !important;\n }\n }\n }\n }\n\n .ui-container {\n display: none;\n background: $canvas;\n @include simple-flex-box($treeSidebar * 1px);\n border-right: 1px $uiGeneralContentBorder solid;\n .block-title {\n @include font-size(14);\n padding: 2px 8px;\n margin: 0;\n }\n .tree-action-bar-box {\n margin: 10px 0;\n opacity: 0;\n &.active {\n opacity: 1;\n @include vendor-prefix(opacity, 0.25s ease-in-out, property, (-webkit-, -moz-, ''));\n }\n }\n }\n\n .content-container {\n border: none;\n @include simple-flex-box();\n overflow: auto;\n }\n\n .content-toolbar {\n height: 2rem;\n display: flex;\n flex-direction: row;\n justify-content: flex-end;\n }\n\n .toggle-modal-button {\n user-select: none;\n margin: 0 2rem;\n .icon-add {\n font-size: 1.6rem;\n position: relative;\n top: 2px;\n margin-right: 8px;\n }\n }\n\n .content-block {\n padding: 20px;\n overflow-y: auto;\n @include flex-container(wrap);\n & > .grid-container {\n width: 100%;\n }\n\n .data-container-wrapper {\n padding: 0px 20px 0 0;\n &:before,\n &:after {\n content: ' ';\n display: table;\n }\n &:after {\n clear: both;\n }\n & > section,\n .data-container {\n width: 260px;\n margin: 0 20px 20px 0;\n float: left;\n @include simple-border();\n &.double {\n width: 540px;\n }\n .emptyContentFooter {\n display: none;\n }\n .tree {\n border: none;\n max-width: none;\n max-height: none;\n }\n form {\n background: none;\n border: none;\n margin: 0;\n padding: 0;\n }\n & > header,\n .ui-widget-header {\n background: $canvas;\n border-width: 0px !important;\n border-bottom: 1px #ddd solid !important;\n h1,\n h6 {\n padding: 4px;\n margin: 0;\n @include font-size(14);\n }\n }\n & > div,\n .ui-widget-content,\n .container-content {\n border-width: 0px !important;\n overflow-y: auto;\n min-height: 250px;\n padding: 5px;\n .icon-grip {\n cursor: move;\n }\n }\n\n & > footer {\n min-height: 33px;\n }\n & > footer,\n .data-container-footer {\n background: $canvas;\n text-align: right !important;\n padding: 4px;\n border-width: 0px !important;\n border-top: 1px #ddd solid !important;\n .square {\n width: 28px;\n span {\n padding: 0;\n left: 0;\n }\n }\n }\n ol {\n margin: 0 0 0 15px;\n padding: 10px;\n }\n }\n }\n\n #form-container.ui-widget-content {\n border: none !important;\n }\n form:not(.list-container) {\n border: 1px $uiGeneralContentBorder solid;\n background: $canvas;\n padding: 30px;\n @include simple-border();\n }\n [class^='btn-'],\n [class*=' btn-'] {\n margin: 0 2px;\n }\n }\n}\n\n.search-modal {\n width: 100% !important;\n // Increasing specificity\n &.search-modal {\n max-height: 100%;\n min-height: 320px;\n height: 100%;\n padding: 0px;\n }\n .ui-container {\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n padding: 64px 0px 20px 20px;\n .filters-container {\n flex: 1 1 auto;\n height: 100%;\n min-height: 0;\n display: flex;\n flex-direction: column;\n }\n .basic-search-container {\n padding-right: 20px;\n flex: 0 0 auto;\n .class-filter-container {\n cursor: pointer;\n z-index: 2;\n }\n }\n .filter-container {\n position: relative;\n z-index: 1;\n margin-bottom: 8px;\n &:last-child {\n padding-bottom: 16px;\n }\n > .icon-find,\n > .icon-folder {\n position: absolute;\n top: 7px;\n left: 8px;\n color: #666;\n }\n .icon-down {\n position: absolute;\n top: 1px;\n right: 1px;\n padding: 5px;\n background: white;\n }\n > input,\n > textarea {\n width: 100%;\n padding-left: 28px;\n }\n .class-filter {\n cursor: pointer;\n resize: none;\n white-space: nowrap;\n overflow: hidden;\n &[readonly]{\n opacity: 1 !important;\n }\n }\n .class-tree {\n display: none;\n position: absolute;\n top: map-get($classTreeVariables, top);\n left: map-get($classTreeVariables, left);\n width: map-get($classTreeVariables, width);\n font-size: map-get($classTreeVariables, font-size);\n\n main {\n overflow-y: auto;\n border: 1px solid black;\n }\n }\n }\n .buttons-container {\n flex: 0 0 auto;\n padding-right: 4px;\n display: flex;\n justify-content: space-between;\n button {\n flex: 1 1 auto;\n margin-right: 16px;\n vertical-align: top;\n }\n .btn-transparent {\n background-color: transparent;\n border: 1px solid black;\n color: black;\n text-shadow: none;\n }\n }\n }\n .content-container {\n @media screen and (min-width: 840px) {\n padding: 44px 64px 64px;\n }\n .no-datatable-container {\n display: flex;\n flex-direction: column;\n align-items: center;\n .no-datatable-icon {\n color: $lightBlueGrey;\n font-size: 3.5em;\n margin-bottom: 30px;\n }\n }\n }\n\n // Overwrite some not customizable styles of datatable and pagination components\n .go-to-item {\n background-color: transparent !important;\n border: 1px solid black;\n color: black !important;\n text-shadow: none !important;\n }\n\n .actions {\n width: 12%;\n }\n\n // Custom class for close modal button, so it positioned on the top-left corner instead of top-right (default)\n .modal-close-left {\n position: absolute;\n left: 20px;\n top: 20px;\n cursor: pointer;\n font-weight: bold;\n color: $textColor !important;\n background-color: transparent;\n padding: 0;\n height: 24px;\n .icon-close {\n font-size: 2.4rem;\n }\n }\n}\n\n","// buttons and alerts\n$success: rgb(14, 145, 75);\n$info: rgb(14, 93, 145);\n$warning: rgb(216, 174, 91);\n$danger: rgb(201, 96, 67);\n$error: rgb(186, 18, 43);\n$activeInteraction: rgb(195, 90, 19);\n\n// corporate identity\n$logoRed: rgb(186, 18, 43);\n$grey: rgb(173, 161, 148);\n$darkBlueGrey: rgb(164, 187, 197);\n$mediumBlueGrey: rgb(193, 212, 220);\n$lightBlueGrey: rgb(228, 236, 239);\n$brownRedGrey: rgb(154, 137, 123);\n$darkBrown: rgb(111, 99, 89);\n$websiteBorder: rgb(141, 148, 158);\n\n// ui elements, these should only variations of the above\n// naming convention: jQueryUi theme roller -> camelCase\n\n$textColor: #222;\n$textHighlight: white;\n$textSecondary: #737373;\n$shadowColor: rgba(0, 0, 0, 0.25);\n\n$modalBorderColor: #dddfe2;\n$searchInp: #dddfe2;\n\n$uiGeneralContentBg: white();\n$uiGeneralContentBorder: #ddd;\n\n$uiHeaderBg: #d4d5d7;\n\n$uiClickableDefaultBg: #f3f1ef;\n$uiClickableHoverBg: whiten($info, 0.2);\n//$uiClickableActiveBg: $uiHeaderBg;\n$uiClickableActiveBg: whiten($websiteBorder, 0.2);\n//$uiClickableActiveBg: #aaa;\n\n$uiSelectableSelectedBg: whiten($info, 0.2);\n$uiSelectableSelectedHoverBg: whiten($info, 0.1);\n$uiSelectableHoverBg: whiten($info, 0.9);\n\n$uiOverlay: $lightBlueGrey;\n\n// new layout. Implemented now only for review panel\n$uiReviewPanelBg: #f2f2f2;\n$uiReviewPanelTextDisabled: hsl(0, 0%, 45%);\n$uiReviewPanelTextDefault: hsl(0, 0%, 12%);\n$uiReviewPanelBgDefault: $uiGeneralContentBg;\n$uiReviewPanelPrimaryHighlight: hsl(208, 100%, 32%);\n$uiReviewPanelBgInverted: $uiReviewPanelTextDefault;\n$uiReviewPanelTextInverted: $uiGeneralContentBg;\n\n// sidebars etc.\n$canvas: mix(#fff, $grey, 85%);\n\n// colors taken from feedback.scss\n$successBgColor: whiten($success, 0.8);\n$successBorderColor: whiten($success, 0.1);\n\n$infoBgColor: whiten($info, 0.8);\n$infoBorderColor: whiten($info, 0.1);\n\n$warningBgColor: whiten($warning, 0.8);\n$warningBorderColor: whiten($warning, 0.1);\n\n$dangerBgColor: whiten($danger, 0.8);\n$dangerBorderColor: whiten($danger, 0.1);\n\n$errorBgColor: whiten($error, 0.8);\n$errorBorderColor: whiten($error, 0.1);\n\n$darkBar: rgb(51, 51, 51);\n$darkBarTxt: rgb(230, 230, 230);\n$darkBarIcon: rgb(220, 220, 220);\n\n$actionLinkColor: #276d9b;\n$actionLinkHoverColor: #4f83a7;\n\n$colorWheel-01: #c3ba13;\n$colorWheel-02: #84a610;\n$colorWheel-03: #2b8e0e;\n$colorWheel-04: #0f9787;\n$colorWheel-05: #0e5d91;\n$colorWheel-06: #0d2689;\n$colorWheel-07: #400d83;\n$colorWheel-08: #960e7d;\n$colorWheel-09: #ba122b;\n$colorWheel-10: #c34713;\n$colorWheel-11: #c36f13;\n$colorWheel-12: #c39413;\n"]}

package/src/searchModal/scss/searchModal.scss CHANGED Viewed

@@ -282,6 +282,7 @@ $classTreeVariables: (
         }
         .filter-container {
             position: relative;
+            z-index: 1;
             margin-bottom: 8px;
             &:last-child {
                 padding-bottom: 16px;

package/src/searchModal.js CHANGED Viewed

@@ -175,7 +175,7 @@ export default function searchModalFactory(config) {
                 //set up the inner resource selector
                 selectionMode: 'single',
                 selectClass: true,
-                classUri: rootClassUri,
+                classUri: initialClassUri,
                 showContext: false,
                 showSelection: false
             });