@oat-sa/tao-core-ui 2.0.0 → 2.2.0

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 (101) hide show
  1. package/dist/animable/absorbable/css/absorb.css.map +1 -1
  2. package/dist/animable/pulsable/css/pulse.css.map +1 -1
  3. package/dist/autocomplete/css/autocomplete.css.map +1 -1
  4. package/dist/badge/css/badge.css.map +1 -1
  5. package/dist/breadcrumbs/css/breadcrumbs.css.map +1 -1
  6. package/dist/bulkActionPopup/css/bulkActionPopup.css.map +1 -1
  7. package/dist/calculator/css/calculator.css.map +1 -1
  8. package/dist/ckeditor/ckConfigurator.js +10 -1
  9. package/dist/class/css/selector.css.map +1 -1
  10. package/dist/component/css/components.css.map +1 -1
  11. package/dist/component/css/windowComponent.css.map +1 -1
  12. package/dist/contextualPopup/css/contextualPopup.css.map +1 -1
  13. package/dist/dashboard/css/dashboard.css.map +1 -1
  14. package/dist/datalist/css/datalist.css.map +1 -1
  15. package/dist/datatable/css/datatable.css.map +1 -1
  16. package/dist/dateRange/css/dateRange.css.map +1 -1
  17. package/dist/datetime/css/picker.css.map +1 -1
  18. package/dist/destination/css/selector.css.map +1 -1
  19. package/dist/documentViewer/css/documentViewer.css.map +1 -1
  20. package/dist/dropdown/css/dropdown.css.map +1 -1
  21. package/dist/dynamicComponent/css/dynamicComponent.css.map +1 -1
  22. package/dist/form/css/dropdownForm.css.map +1 -1
  23. package/dist/form/css/form.css.map +1 -1
  24. package/dist/form/validator/css/validator.css.map +1 -1
  25. package/dist/form/widget/css/widget.css.map +1 -1
  26. package/dist/generis/form/css/form.css.map +1 -1
  27. package/dist/generis/validator/css/validator.css.map +1 -1
  28. package/dist/generis/widget/css/widget.css.map +1 -1
  29. package/dist/itemButtonList/css/item-button-list.css.map +1 -1
  30. package/dist/listbox/css/listbox.css.map +1 -1
  31. package/dist/loadingButton/css/button.css.map +1 -1
  32. package/dist/maths/calculator/css/calculator.css.map +1 -1
  33. package/dist/mediaplayer/css/player.css.map +1 -1
  34. package/dist/pagination/css/pagination.css.map +1 -1
  35. package/dist/propertySelector/css/propertySelector.css.map +1 -1
  36. package/dist/resource/css/selector.css.map +1 -1
  37. package/dist/resourcemgr/css/resourcemgr.css.map +1 -1
  38. package/dist/searchModal/css/advancedSearch.css.map +1 -1
  39. package/dist/searchModal/css/searchModal.css.map +1 -1
  40. package/dist/switch/css/switch.css.map +1 -1
  41. package/dist/tabs/css/tabs.css.map +1 -1
  42. package/dist/taskQueue/css/taskQueue.css.map +1 -1
  43. package/dist/taskQueueButton/css/taskable.css.map +1 -1
  44. package/dist/taskQueueButton/css/treeButton.css.map +1 -1
  45. package/dist/tristateCheckboxGroup/css/tristateCheckboxGroup.css.map +1 -1
  46. package/dist/waitingDialog/css/waitingDialog.css.map +1 -1
  47. package/package.json +1 -1
  48. package/scss/font/tao/tao.svg +1 -0
  49. package/scss/font/tao/tao.ttf +0 -0
  50. package/scss/font/tao/tao.woff +0 -0
  51. package/scss/inc/fonts/_tao-icon-classes.scss +1 -0
  52. package/scss/inc/fonts/_tao-icon-def.scss +3 -3
  53. package/scss/inc/fonts/_tao-icon-vars.scss +1 -0
  54. package/src/animable/absorbable/css/absorb.css.map +1 -1
  55. package/src/animable/pulsable/css/pulse.css.map +1 -1
  56. package/src/autocomplete/css/autocomplete.css.map +1 -1
  57. package/src/badge/css/badge.css.map +1 -1
  58. package/src/breadcrumbs/css/breadcrumbs.css.map +1 -1
  59. package/src/bulkActionPopup/css/bulkActionPopup.css.map +1 -1
  60. package/src/calculator/css/calculator.css.map +1 -1
  61. package/src/ckeditor/ckConfigurator.js +11 -4
  62. package/src/class/css/selector.css.map +1 -1
  63. package/src/component/css/components.css.map +1 -1
  64. package/src/component/css/windowComponent.css.map +1 -1
  65. package/src/contextualPopup/css/contextualPopup.css.map +1 -1
  66. package/src/css/basic.css +5 -1
  67. package/src/css/basic.css.map +1 -1
  68. package/src/dashboard/css/dashboard.css.map +1 -1
  69. package/src/datalist/css/datalist.css.map +1 -1
  70. package/src/datatable/css/datatable.css.map +1 -1
  71. package/src/dateRange/css/dateRange.css.map +1 -1
  72. package/src/datetime/css/picker.css.map +1 -1
  73. package/src/destination/css/selector.css.map +1 -1
  74. package/src/documentViewer/css/documentViewer.css.map +1 -1
  75. package/src/dropdown/css/dropdown.css.map +1 -1
  76. package/src/dynamicComponent/css/dynamicComponent.css.map +1 -1
  77. package/src/form/css/dropdownForm.css.map +1 -1
  78. package/src/form/css/form.css.map +1 -1
  79. package/src/form/validator/css/validator.css.map +1 -1
  80. package/src/form/widget/css/widget.css.map +1 -1
  81. package/src/generis/form/css/form.css.map +1 -1
  82. package/src/generis/validator/css/validator.css.map +1 -1
  83. package/src/generis/widget/css/widget.css.map +1 -1
  84. package/src/itemButtonList/css/item-button-list.css.map +1 -1
  85. package/src/listbox/css/listbox.css.map +1 -1
  86. package/src/loadingButton/css/button.css.map +1 -1
  87. package/src/maths/calculator/css/calculator.css.map +1 -1
  88. package/src/mediaplayer/css/player.css.map +1 -1
  89. package/src/pagination/css/pagination.css.map +1 -1
  90. package/src/propertySelector/css/propertySelector.css.map +1 -1
  91. package/src/resource/css/selector.css.map +1 -1
  92. package/src/resourcemgr/css/resourcemgr.css.map +1 -1
  93. package/src/searchModal/css/advancedSearch.css.map +1 -1
  94. package/src/searchModal/css/searchModal.css.map +1 -1
  95. package/src/switch/css/switch.css.map +1 -1
  96. package/src/tabs/css/tabs.css.map +1 -1
  97. package/src/taskQueue/css/taskQueue.css.map +1 -1
  98. package/src/taskQueueButton/css/taskable.css.map +1 -1
  99. package/src/taskQueueButton/css/treeButton.css.map +1 -1
  100. package/src/tristateCheckboxGroup/css/tristateCheckboxGroup.css.map +1 -1
  101. package/src/waitingDialog/css/waitingDialog.css.map +1 -1
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../scss/inc/_functions.scss","../../../../scss/inc/fonts/_tao-icon-vars.scss","../scss/widget.scss%23sass","../scss/widget.scss","../../../../scss/inc/_colors.scss","../../../../scss/inc/_variables.scss"],"names":[],"mappings":"AAaA;;;;;;CAAA;AAoQA,oEAAA;ACjRA,gBAAA;ACEA;EACI,gBAAA;ACQJ;ADNI;EACI,qBAAA;EACA,eAAA;EACA,UAAA;EACA,mBAAA;ACQR;ADLI;EACI,qBAAA;EACA,gBAAA;EACA,UAAA;ACOR;ADLQ;;;EAGI,uBAAA;EFyFR,sBAAA;EACA,kBAAA;EACA,0BAAA;EEzFQ,WEDA;EFEA,0CGfE;EHgBF,YAAA;EACA,WAAA;ACSZ;ADNQ;;EAEI,aAAA;EACA,YAAA;ACQZ;ADLQ;EACI,WEdA;EFeA,qBAAA;EACA,0CAAA;EACA,YAAA;EACA,WAAA;ACOZ;ADLY;EACI,gBAAA;ACOhB;ADHQ;;;;EAII,8BE7CJ;EF8CI,uBAAA;ACKZ;ADDI;EACI,uBEnDA;EFoDA,iBAAA;ECGR,UAAA;AACA","file":"widget.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-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\n.ui-generis-widget {\n margin: 10px 0px;\n\n > .left {\n display: inline-block;\n margin-top: 8px;\n width: 34%;\n vertical-align: top;\n }\n\n > .right {\n display: inline-block;\n min-width: 150px;\n width: 65%;\n\n > input,\n > select,\n > textarea {\n background-color: white;\n @include simple-border();\n color: $textColor;\n font-family: $regularFont;\n padding: 8px;\n width: 100%;\n }\n\n > input,\n > select {\n font: inherit;\n height: 36px;\n }\n\n > .check-box-input {\n color: $textColor;\n display: inline-block;\n font-family: $regularFont;\n padding: 4px;\n width: 100%;\n\n > .option {\n padding-top: 4px;\n }\n }\n\n input.error,\n select.error,\n textarea.error,\n .check-box-input.error {\n border-color: $error;\n color: $error;\n }\n }\n\n .validation-container {\n color: $error;\n text-align: right;\n width: 99%;\n }\n}\n","@import 'inc/bootstrap';\n\n.ui-generis-widget {\n margin: 10px 0px;\n\n > .left {\n display: inline-block;\n margin-top: 8px;\n width: 34%;\n vertical-align: top;\n }\n\n > .right {\n display: inline-block;\n min-width: 150px;\n width: 65%;\n\n > input,\n > select,\n > textarea {\n background-color: white;\n @include simple-border();\n color: $textColor;\n font-family: $regularFont;\n padding: 8px;\n width: 100%;\n }\n\n > input,\n > select {\n font: inherit;\n height: 36px;\n }\n\n > .check-box-input {\n color: $textColor;\n display: inline-block;\n font-family: $regularFont;\n padding: 4px;\n width: 100%;\n\n > .option {\n padding-top: 4px;\n }\n }\n\n input.error,\n select.error,\n textarea.error,\n .check-box-input.error {\n border-color: $error;\n color: $error;\n }\n }\n\n .validation-container {\n color: $error;\n text-align: right;\n width: 99%;\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","$sidebarWidth: 180;\n$sidebarGutter: 0;\n$toolbarHeight: 50;\n$treeSidebar: 280;\n\n// fonts\n$fontPath : 'font/' !default;\n$monospaceFont: Consolas, 'Andale Mono WT', 'Andale Mono', 'Lucida Console', 'Lucida Sans Typewriter', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', 'Liberation Mono', 'Nimbus Mono L', Monaco, 'Courier New', Courier, monospace;\n$regularFont: 'Source Sans Pro', sans-serif;\n$headingFont: 'Source Sans Pro', sans-serif;\n\n\n%clearfix {\n &:before, &:after {\n content: \" \";\n display: table;\n }\n &:after {\n clear: both;\n }\n}\n"]}
1
+ {"version":3,"sources":["../../../../scss/inc/_functions.scss","../../../../scss/inc/fonts/_tao-icon-vars.scss","../scss/widget.scss%23sass","../scss/widget.scss","../../../../scss/inc/_colors.scss","../../../../scss/inc/_variables.scss"],"names":[],"mappings":"AAaA;;;;;;CAAA;AAoQA,oEAAA;ACjRA,gBAAA;ACEA;EACI,gBAAA;ACQJ;ADNI;EACI,qBAAA;EACA,eAAA;EACA,UAAA;EACA,mBAAA;ACQR;ADLI;EACI,qBAAA;EACA,gBAAA;EACA,UAAA;ACOR;ADLQ;;;EAGI,uBAAA;EFyFR,sBAAA;EACA,kBAAA;EACA,0BAAA;EEzFQ,WEDA;EFEA,0CGfE;EHgBF,YAAA;EACA,WAAA;ACSZ;ADNQ;;EAEI,aAAA;EACA,YAAA;ACQZ;ADLQ;EACI,WEdA;EFeA,qBAAA;EACA,0CAAA;EACA,YAAA;EACA,WAAA;ACOZ;ADLY;EACI,gBAAA;ACOhB;ADHQ;;;;EAII,8BE7CJ;EF8CI,uBAAA;ACKZ;ADDI;EACI,uBEnDA;EFoDA,iBAAA;ECGR,UAAA;AACA","file":"widget.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-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\n.ui-generis-widget {\n margin: 10px 0px;\n\n > .left {\n display: inline-block;\n margin-top: 8px;\n width: 34%;\n vertical-align: top;\n }\n\n > .right {\n display: inline-block;\n min-width: 150px;\n width: 65%;\n\n > input,\n > select,\n > textarea {\n background-color: white;\n @include simple-border();\n color: $textColor;\n font-family: $regularFont;\n padding: 8px;\n width: 100%;\n }\n\n > input,\n > select {\n font: inherit;\n height: 36px;\n }\n\n > .check-box-input {\n color: $textColor;\n display: inline-block;\n font-family: $regularFont;\n padding: 4px;\n width: 100%;\n\n > .option {\n padding-top: 4px;\n }\n }\n\n input.error,\n select.error,\n textarea.error,\n .check-box-input.error {\n border-color: $error;\n color: $error;\n }\n }\n\n .validation-container {\n color: $error;\n text-align: right;\n width: 99%;\n }\n}\n","@import 'inc/bootstrap';\n\n.ui-generis-widget {\n margin: 10px 0px;\n\n > .left {\n display: inline-block;\n margin-top: 8px;\n width: 34%;\n vertical-align: top;\n }\n\n > .right {\n display: inline-block;\n min-width: 150px;\n width: 65%;\n\n > input,\n > select,\n > textarea {\n background-color: white;\n @include simple-border();\n color: $textColor;\n font-family: $regularFont;\n padding: 8px;\n width: 100%;\n }\n\n > input,\n > select {\n font: inherit;\n height: 36px;\n }\n\n > .check-box-input {\n color: $textColor;\n display: inline-block;\n font-family: $regularFont;\n padding: 4px;\n width: 100%;\n\n > .option {\n padding-top: 4px;\n }\n }\n\n input.error,\n select.error,\n textarea.error,\n .check-box-input.error {\n border-color: $error;\n color: $error;\n }\n }\n\n .validation-container {\n color: $error;\n text-align: right;\n width: 99%;\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","$sidebarWidth: 180;\n$sidebarGutter: 0;\n$toolbarHeight: 50;\n$treeSidebar: 280;\n\n// fonts\n$fontPath : 'font/' !default;\n$monospaceFont: Consolas, 'Andale Mono WT', 'Andale Mono', 'Lucida Console', 'Lucida Sans Typewriter', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', 'Liberation Mono', 'Nimbus Mono L', Monaco, 'Courier New', Courier, monospace;\n$regularFont: 'Source Sans Pro', sans-serif;\n$headingFont: 'Source Sans Pro', sans-serif;\n\n\n%clearfix {\n &:before, &:after {\n content: \" \";\n display: table;\n }\n &:after {\n clear: both;\n }\n}\n"]}
@@ -1 +1 @@
1
- {"version":3,"sources":["../scss/item-button-list.scss%23sass","../../../scss/inc/_functions.scss","../../../scss/inc/fonts/_tao-icon-vars.scss","../scss/item-button-list.scss","../../../scss/inc/_colors.scss"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;EAAA;ACaA;;;;;;CAAA;AAoQA,oEAAA;ACjRA,gBAAA;AF+BA;EGJA,aAAA;EACA,eAAA;EACA,sBHKI;EACA,UAAA;EAEA,2BAAA;EAgGA,iCAAA;EA6DA,sEAAA;EAuBA,qCAAA;AGtLJ;AHGI;EACI,eAAA;EACA,cAAA;EACA,aAAA;EACA,uBAAA,EAAA,gEAAA;EACA,mBAAA;EACA,wBAAA;EACA,UAAA;EACA,YAAA;AGDR;AHII;EACI,kBAAA;EACA,aAAA;EACA,uBAAA;EACA,mBAAA;EACA,YAAA;EACA,WAAA;EACA,mBAAA;EACA,kBAAA;EACA,sBAAA;EACA,6BIXoB;EJYpB,mCAAA;EACA,UAAA,EAAA,6BAAA;EACA,iBAAA;EACA,iBAAA;EACA,oCInCa;EJoCb,sBAAA;EACA,iBAAA;EACA,eAAA;AGFR;AHKI;EACI,gEAAA;EACA,kBAAA;EACA,gBAAA;EACA,mBAAA;EACA,oBAAA;AGHR;AHKI;EACI,UAAA;EACA,MAAA;EACA,OAAA;AGHR;AHKI;EACI,aAAA;AGHR;AHKI;EACI,aAAA;AGHR;AHMI;EACI,aAAA;AGJR;AHOI;EACI,kBAAA;EACA,YAAA;EACA,cAAA;EACA,WAAA;EACA,YAAA;EACA,mBAAA;EACA,yBIvEa;EJwEb,uCAAA;EACA,aAAA;EACA,uBAAA;EACA,mBAAA;AGLR;AHOI;EACI,iBAAA;EACA,UAAA;EACA,MAAA;EACA,OAAA;AGLR;AHQI;EE5FoB,gBAAA;ACuFxB;AHQI;EE7FmB,gBAAA;ACwFvB;AHQI;EE4FoB,gBAAA;ACjGxB;AHQI;EEwFqB,gBAAA;AC7FzB;AHQI;EExBe,gBAAA;ACmBnB;AHQI;EE9GwB,gBAAA;ACyG5B;AHWI;EC7EQ,yBAAA;EAAA,oBAAA;EAAA,iBAAA;AEyEZ;AHQY;EACI,qBA9GD;EA+GC,sBAAA;EACA,6BAAA;AGNhB;AHUY;EACI,qBAAA;EACA,iCAAA;EACA,yBIvHK;EJwHL,6BIpGW;AD4F3B;AHYY;EACI,kBAAA;EACA,cAAA;EACA,UAAA;EACA,sBI5GW;EJ6GX,cAAA;EACA,iBAAA;EACA,UAAA;EACA,eAAA;EACA,UAAA;EACA,2BAAA;EACA,SAAA;EACA,2BAAA;AGVhB;AHeY;EACI,kCAAA;AGbhB;AHkBY;EACI,kCI5KR;AD4JR;AHqBY;EACI,yBAAA;AGnBhB;AHwBY;EACI,yBAAA;AGtBhB;AH6BQ;EACI,qCAAA;EACA,0BInJoB;EJoJpB,iCIpJoB;ADyHhC;AH8BI;;EAEK,wBAAA;EACA,kCAAA;EACA,qBAAA;EACA,4BAAA;AG5BT;AH8BQ;;EACI,mBAAA;EACA,wBAAA;EACA,iBAAA;AG3BZ;AHkCQ;;EAEI,WAAA;EACA,cAAA;EACA,kBAAA;EACA,aAAA;EACA,cAAA;EACA,SAAA;EACA,QAAA;EACA,gCAAA;EACA,qBAAA;EACA,iCAAA;EACA,oBAAA;EACA,kBAAA;AGhCZ;AHmCQ;EAGI,0BAAA;AGnCZ;AHsCQ;EAEI,oCAAA;EACA,0BIjMoB;EJkMpB,iCAAA;AGrCZ;AHwCQ;EAEI,qCIvMoB;EJwMpB,yBI9NS;EJ+NT,iCIzMoB;ADkKhC","file":"item-button-list.css","sourcesContent":["/**\n * This program is free software; you can redistribute it and/or\n * modify it under the terms of the GNU General Public License\n * as published by the Free Software Foundation; under version 2\n * of the License (non-upgradable).\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program; if not, write to the Free Software\n * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.\n *\n * Copyright (c) 2022 Open Assessment Technologies SA ;\n */\n@import \"inc/bootstrap\";\n\n$correctColor: $success;\n$incorrectColor: $error;\n$hoverBgColor: hsl(208, 100%, 95%);\n$pendingColor: #6E6E6E;\n$partialColor: #AD5700;\n\n$radiusCircular: 50%;\n$sizeDefault: 4rem;\n$hitboxSize: 6.25rem;\n$borderThin: 0.125rem;\n$borderMedium: 0.25rem;\n\n.buttonlist-items {\n display: flex;\n flex-wrap: wrap;\n justify-content: start;\n padding: 0;\n\n /****** base styles *******/\n .buttonlist-item {\n height: $hitboxSize;\n width: $hitboxSize;\n display: flex;\n justify-content: center; /* aligning left - cut focusing board for keyboard interacting */\n align-items: center;\n /* reset parent styles */\n padding: 0;\n border: none;\n }\n\n .buttonlist-btn {\n position: relative;\n display: flex;\n justify-content: center;\n align-items: center;\n height: $sizeDefault;\n width: $sizeDefault;\n border-style: solid;\n border-radius: $radiusCircular;\n border-width: $borderThin;\n border-color: $uiReviewPanelTextDisabled;\n margin: 1.3rem 0.75rem 1rem 0.75rem;\n padding: 0; /*Fixes firefox button jumps*/\n font-weight: bold;\n font-size: 1.6rem;\n background-color: $uiReviewPanelBgDefault;\n color: $uiReviewPanelTextDisabled;\n text-shadow: none;\n cursor: pointer;\n }\n\n .buttonlist-label {\n font-family: 'Nunito Sans', 'Source Sans Pro', Arial, sans-serif;\n max-width: 3.75rem;\n overflow: hidden;\n white-space: nowrap;\n line-height: initial;\n }\n .buttonlist-icon {\n padding: 0;\n top: 0;\n left: 0;\n }\n .buttonlist-icon:not([class*=\"icon-\"]) {\n display: none;\n }\n .buttonlist-icon[class*=\"icon-\"] ~ .buttonlist-label {\n display: none;\n }\n\n .indicator {\n display: none;\n }\n\n .buttonlist-score-badge {\n position: absolute;\n top: -0.9rem;\n right: -0.9rem;\n width: 2rem;\n height: 2rem;\n border-radius: 100%;\n color: $uiReviewPanelTextInverted;\n border: 0.1rem solid $uiReviewPanelTextInverted;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n .buttonlist-score-icon {\n font-size: 1.2rem;\n padding: 0;\n top: 0;\n left: 0;\n }\n\n .icon-info::before {\n @include icon-info-bare;\n }\n .icon-flagged::before {\n @include icon-bookmark;\n }\n .icon-correct::before {\n @include icon-result-ok;\n }\n .icon-incorrect::before {\n @include icon-result-nok;\n }\n .icon-score-pending::before {\n @include icon-time;\n }\n .icon-score-partial::before {\n @include icon-score-partial;\n }\n\n\n /****** step state styles *******/\n .buttonlist-item {\n @include disableSelect();\n\n &.viewed {\n .buttonlist-btn {\n border-width: $borderMedium;\n color: $uiReviewPanelTextDefault;\n border-color: $uiReviewPanelTextDefault;\n }\n }\n &.answered {\n .buttonlist-btn {\n border-width: $borderMedium;\n background-color: $uiReviewPanelBgInverted;\n color: $uiReviewPanelTextInverted;\n border-color: $uiReviewPanelBgInverted;\n }\n }\n &.buttonlist-item-active {\n .indicator {\n position: absolute;\n display: block;\n z-index: 1;\n color: $uiReviewPanelTextDefault;\n height: 1.4rem;\n min-width: 1.6rem;\n top: unset;\n bottom: -1.7rem;\n padding: 0;\n /* centering horizontally */\n left: 50%;\n transform: translateX(-50%);\n }\n }\n\n &.correct {\n .buttonlist-score-badge {\n background-color: $correctColor;\n }\n }\n\n &.incorrect {\n .buttonlist-score-badge {\n background-color: $incorrectColor;\n }\n }\n\n &.score-pending {\n .buttonlist-score-badge {\n background-color: $pendingColor;\n }\n }\n\n &.score-partial {\n .buttonlist-score-badge {\n background-color: $partialColor;\n }\n }\n }\n\n /* disabling is applied at buttonlist-item or buttonlist-items level */\n &:not(.disabled) .buttonlist-item:not(.disabled) {\n .buttonlist-btn:hover {\n background-color: $hoverBgColor;\n color: $uiReviewPanelPrimaryHighlight;\n border-color: $uiReviewPanelPrimaryHighlight;\n }\n }\n &.disabled,\n .buttonlist-item.disabled {\n /* reset global styles */\n background-color: unset !important;\n opacity: 1 !important;\n text-shadow: none !important;\n\n .buttonlist-btn {\n cursor: not-allowed;\n /* reset global styles */\n text-shadow: none;\n }\n }\n\n\n /****** keyboard focus styles *******/\n .buttonlist-item {\n &.key-navigation-highlight .buttonlist-btn::before,\n .buttonlist-btn.buttonlist-btn-focus:focus::before {\n content: '';\n display: block;\n position: absolute;\n width: 5.2rem;\n height: 5.2rem;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n border-width: $borderMedium;\n border-color: $uiReviewPanelPrimaryHighlight;\n border-style: dotted;\n border-radius: $radiusCircular;\n }\n\n &.key-navigation-highlight.buttonlist-item-active .buttonlist-btn .indicator,\n &.buttonlist-item-active .buttonlist-btn.buttonlist-btn-focus:focus .indicator,\n &.buttonlist-item-active .buttonlist-btn:focus-visible .indicator {\n color: $uiReviewPanelPrimaryHighlight;\n }\n\n &.key-navigation-highlight.viewed .buttonlist-btn,\n &.viewed .buttonlist-btn.buttonlist-btn-focus:focus {\n background-color: $uiReviewPanelBgDefault;\n color: $uiReviewPanelPrimaryHighlight;\n border-color: $uiReviewPanelPrimaryHighlight;\n }\n\n &.key-navigation-highlight.answered .buttonlist-btn,\n &.answered .buttonlist-btn.buttonlist-btn-focus:focus {\n background-color: $uiReviewPanelPrimaryHighlight;\n color: $uiReviewPanelTextInverted;\n border-color: $uiReviewPanelPrimaryHighlight;\n }\n }\n}\n","@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-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","/**\n * This program is free software; you can redistribute it and/or\n * modify it under the terms of the GNU General Public License\n * as published by the Free Software Foundation; under version 2\n * of the License (non-upgradable).\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program; if not, write to the Free Software\n * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.\n *\n * Copyright (c) 2022 Open Assessment Technologies SA ;\n */\n@import \"inc/bootstrap\";\n\n$correctColor: $success;\n$incorrectColor: $error;\n$hoverBgColor: hsl(208, 100%, 95%);\n$pendingColor: #6E6E6E;\n$partialColor: #AD5700;\n\n$radiusCircular: 50%;\n$sizeDefault: 4rem;\n$hitboxSize: 6.25rem;\n$borderThin: 0.125rem;\n$borderMedium: 0.25rem;\n\n.buttonlist-items {\n display: flex;\n flex-wrap: wrap;\n justify-content: start;\n padding: 0;\n\n /****** base styles *******/\n .buttonlist-item {\n height: $hitboxSize;\n width: $hitboxSize;\n display: flex;\n justify-content: center; /* aligning left - cut focusing board for keyboard interacting */\n align-items: center;\n /* reset parent styles */\n padding: 0;\n border: none;\n }\n\n .buttonlist-btn {\n position: relative;\n display: flex;\n justify-content: center;\n align-items: center;\n height: $sizeDefault;\n width: $sizeDefault;\n border-style: solid;\n border-radius: $radiusCircular;\n border-width: $borderThin;\n border-color: $uiReviewPanelTextDisabled;\n margin: 1.3rem 0.75rem 1rem 0.75rem;\n padding: 0; /*Fixes firefox button jumps*/\n font-weight: bold;\n font-size: 1.6rem;\n background-color: $uiReviewPanelBgDefault;\n color: $uiReviewPanelTextDisabled;\n text-shadow: none;\n cursor: pointer;\n }\n\n .buttonlist-label {\n font-family: 'Nunito Sans', 'Source Sans Pro', Arial, sans-serif;\n max-width: 3.75rem;\n overflow: hidden;\n white-space: nowrap;\n line-height: initial;\n }\n .buttonlist-icon {\n padding: 0;\n top: 0;\n left: 0;\n }\n .buttonlist-icon:not([class*=\"icon-\"]) {\n display: none;\n }\n .buttonlist-icon[class*=\"icon-\"] ~ .buttonlist-label {\n display: none;\n }\n\n .indicator {\n display: none;\n }\n\n .buttonlist-score-badge {\n position: absolute;\n top: -0.9rem;\n right: -0.9rem;\n width: 2rem;\n height: 2rem;\n border-radius: 100%;\n color: $uiReviewPanelTextInverted;\n border: 0.1rem solid $uiReviewPanelTextInverted;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n .buttonlist-score-icon {\n font-size: 1.2rem;\n padding: 0;\n top: 0;\n left: 0;\n }\n\n .icon-info::before {\n @include icon-info-bare;\n }\n .icon-flagged::before {\n @include icon-bookmark;\n }\n .icon-correct::before {\n @include icon-result-ok;\n }\n .icon-incorrect::before {\n @include icon-result-nok;\n }\n .icon-score-pending::before {\n @include icon-time;\n }\n .icon-score-partial::before {\n @include icon-score-partial;\n }\n\n\n /****** step state styles *******/\n .buttonlist-item {\n @include disableSelect();\n\n &.viewed {\n .buttonlist-btn {\n border-width: $borderMedium;\n color: $uiReviewPanelTextDefault;\n border-color: $uiReviewPanelTextDefault;\n }\n }\n &.answered {\n .buttonlist-btn {\n border-width: $borderMedium;\n background-color: $uiReviewPanelBgInverted;\n color: $uiReviewPanelTextInverted;\n border-color: $uiReviewPanelBgInverted;\n }\n }\n &.buttonlist-item-active {\n .indicator {\n position: absolute;\n display: block;\n z-index: 1;\n color: $uiReviewPanelTextDefault;\n height: 1.4rem;\n min-width: 1.6rem;\n top: unset;\n bottom: -1.7rem;\n padding: 0;\n /* centering horizontally */\n left: 50%;\n transform: translateX(-50%);\n }\n }\n\n &.correct {\n .buttonlist-score-badge {\n background-color: $correctColor;\n }\n }\n\n &.incorrect {\n .buttonlist-score-badge {\n background-color: $incorrectColor;\n }\n }\n\n &.score-pending {\n .buttonlist-score-badge {\n background-color: $pendingColor;\n }\n }\n\n &.score-partial {\n .buttonlist-score-badge {\n background-color: $partialColor;\n }\n }\n }\n\n /* disabling is applied at buttonlist-item or buttonlist-items level */\n &:not(.disabled) .buttonlist-item:not(.disabled) {\n .buttonlist-btn:hover {\n background-color: $hoverBgColor;\n color: $uiReviewPanelPrimaryHighlight;\n border-color: $uiReviewPanelPrimaryHighlight;\n }\n }\n &.disabled,\n .buttonlist-item.disabled {\n /* reset global styles */\n background-color: unset !important;\n opacity: 1 !important;\n text-shadow: none !important;\n\n .buttonlist-btn {\n cursor: not-allowed;\n /* reset global styles */\n text-shadow: none;\n }\n }\n\n\n /****** keyboard focus styles *******/\n .buttonlist-item {\n &.key-navigation-highlight .buttonlist-btn::before,\n .buttonlist-btn.buttonlist-btn-focus:focus::before {\n content: '';\n display: block;\n position: absolute;\n width: 5.2rem;\n height: 5.2rem;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n border-width: $borderMedium;\n border-color: $uiReviewPanelPrimaryHighlight;\n border-style: dotted;\n border-radius: $radiusCircular;\n }\n\n &.key-navigation-highlight.buttonlist-item-active .buttonlist-btn .indicator,\n &.buttonlist-item-active .buttonlist-btn.buttonlist-btn-focus:focus .indicator,\n &.buttonlist-item-active .buttonlist-btn:focus-visible .indicator {\n color: $uiReviewPanelPrimaryHighlight;\n }\n\n &.key-navigation-highlight.viewed .buttonlist-btn,\n &.viewed .buttonlist-btn.buttonlist-btn-focus:focus {\n background-color: $uiReviewPanelBgDefault;\n color: $uiReviewPanelPrimaryHighlight;\n border-color: $uiReviewPanelPrimaryHighlight;\n }\n\n &.key-navigation-highlight.answered .buttonlist-btn,\n &.answered .buttonlist-btn.buttonlist-btn-focus:focus {\n background-color: $uiReviewPanelPrimaryHighlight;\n color: $uiReviewPanelTextInverted;\n border-color: $uiReviewPanelPrimaryHighlight;\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/item-button-list.scss%23sass","../../../scss/inc/_functions.scss","../../../scss/inc/fonts/_tao-icon-vars.scss","../scss/item-button-list.scss","../../../scss/inc/_colors.scss"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;EAAA;ACaA;;;;;;CAAA;AAoQA,oEAAA;ACjRA,gBAAA;AF+BA;EGJA,aAAA;EACA,eAAA;EACA,sBHKI;EACA,UAAA;EAEA,2BAAA;EAgGA,iCAAA;EA6DA,sEAAA;EAuBA,qCAAA;AGtLJ;AHGI;EACI,eAAA;EACA,cAAA;EACA,aAAA;EACA,uBAAA,EAAA,gEAAA;EACA,mBAAA;EACA,wBAAA;EACA,UAAA;EACA,YAAA;AGDR;AHII;EACI,kBAAA;EACA,aAAA;EACA,uBAAA;EACA,mBAAA;EACA,YAAA;EACA,WAAA;EACA,mBAAA;EACA,kBAAA;EACA,sBAAA;EACA,6BIXoB;EJYpB,mCAAA;EACA,UAAA,EAAA,6BAAA;EACA,iBAAA;EACA,iBAAA;EACA,oCInCa;EJoCb,sBAAA;EACA,iBAAA;EACA,eAAA;AGFR;AHKI;EACI,gEAAA;EACA,kBAAA;EACA,gBAAA;EACA,mBAAA;EACA,oBAAA;AGHR;AHKI;EACI,UAAA;EACA,MAAA;EACA,OAAA;AGHR;AHKI;EACI,aAAA;AGHR;AHKI;EACI,aAAA;AGHR;AHMI;EACI,aAAA;AGJR;AHOI;EACI,kBAAA;EACA,YAAA;EACA,cAAA;EACA,WAAA;EACA,YAAA;EACA,mBAAA;EACA,yBIvEa;EJwEb,uCAAA;EACA,aAAA;EACA,uBAAA;EACA,mBAAA;AGLR;AHOI;EACI,iBAAA;EACA,UAAA;EACA,MAAA;EACA,OAAA;AGLR;AHQI;EE3FoB,gBAAA;ACsFxB;AHQI;EE5FmB,gBAAA;ACuFvB;AHQI;EE6FoB,gBAAA;AClGxB;AHQI;EEyFqB,gBAAA;AC9FzB;AHQI;EEvBe,gBAAA;ACkBnB;AHQI;EE7GwB,gBAAA;ACwG5B;AHWI;EC7EQ,yBAAA;EAAA,oBAAA;EAAA,iBAAA;AEyEZ;AHQY;EACI,qBA9GD;EA+GC,sBAAA;EACA,6BAAA;AGNhB;AHUY;EACI,qBAAA;EACA,iCAAA;EACA,yBIvHK;EJwHL,6BIpGW;AD4F3B;AHYY;EACI,kBAAA;EACA,cAAA;EACA,UAAA;EACA,sBI5GW;EJ6GX,cAAA;EACA,iBAAA;EACA,UAAA;EACA,eAAA;EACA,UAAA;EACA,2BAAA;EACA,SAAA;EACA,2BAAA;AGVhB;AHeY;EACI,kCAAA;AGbhB;AHkBY;EACI,kCI5KR;AD4JR;AHqBY;EACI,yBAAA;AGnBhB;AHwBY;EACI,yBAAA;AGtBhB;AH6BQ;EACI,qCAAA;EACA,0BInJoB;EJoJpB,iCIpJoB;ADyHhC;AH8BI;;EAEK,wBAAA;EACA,kCAAA;EACA,qBAAA;EACA,4BAAA;AG5BT;AH8BQ;;EACI,mBAAA;EACA,wBAAA;EACA,iBAAA;AG3BZ;AHkCQ;;EAEI,WAAA;EACA,cAAA;EACA,kBAAA;EACA,aAAA;EACA,cAAA;EACA,SAAA;EACA,QAAA;EACA,gCAAA;EACA,qBAAA;EACA,iCAAA;EACA,oBAAA;EACA,kBAAA;AGhCZ;AHmCQ;EAGI,0BAAA;AGnCZ;AHsCQ;EAEI,oCAAA;EACA,0BIjMoB;EJkMpB,iCAAA;AGrCZ;AHwCQ;EAEI,qCIvMoB;EJwMpB,yBI9NS;EJ+NT,iCIzMoB;ADkKhC","file":"item-button-list.css","sourcesContent":["/**\n * This program is free software; you can redistribute it and/or\n * modify it under the terms of the GNU General Public License\n * as published by the Free Software Foundation; under version 2\n * of the License (non-upgradable).\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program; if not, write to the Free Software\n * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.\n *\n * Copyright (c) 2022 Open Assessment Technologies SA ;\n */\n@import \"inc/bootstrap\";\n\n$correctColor: $success;\n$incorrectColor: $error;\n$hoverBgColor: hsl(208, 100%, 95%);\n$pendingColor: #6E6E6E;\n$partialColor: #AD5700;\n\n$radiusCircular: 50%;\n$sizeDefault: 4rem;\n$hitboxSize: 6.25rem;\n$borderThin: 0.125rem;\n$borderMedium: 0.25rem;\n\n.buttonlist-items {\n display: flex;\n flex-wrap: wrap;\n justify-content: start;\n padding: 0;\n\n /****** base styles *******/\n .buttonlist-item {\n height: $hitboxSize;\n width: $hitboxSize;\n display: flex;\n justify-content: center; /* aligning left - cut focusing board for keyboard interacting */\n align-items: center;\n /* reset parent styles */\n padding: 0;\n border: none;\n }\n\n .buttonlist-btn {\n position: relative;\n display: flex;\n justify-content: center;\n align-items: center;\n height: $sizeDefault;\n width: $sizeDefault;\n border-style: solid;\n border-radius: $radiusCircular;\n border-width: $borderThin;\n border-color: $uiReviewPanelTextDisabled;\n margin: 1.3rem 0.75rem 1rem 0.75rem;\n padding: 0; /*Fixes firefox button jumps*/\n font-weight: bold;\n font-size: 1.6rem;\n background-color: $uiReviewPanelBgDefault;\n color: $uiReviewPanelTextDisabled;\n text-shadow: none;\n cursor: pointer;\n }\n\n .buttonlist-label {\n font-family: 'Nunito Sans', 'Source Sans Pro', Arial, sans-serif;\n max-width: 3.75rem;\n overflow: hidden;\n white-space: nowrap;\n line-height: initial;\n }\n .buttonlist-icon {\n padding: 0;\n top: 0;\n left: 0;\n }\n .buttonlist-icon:not([class*=\"icon-\"]) {\n display: none;\n }\n .buttonlist-icon[class*=\"icon-\"] ~ .buttonlist-label {\n display: none;\n }\n\n .indicator {\n display: none;\n }\n\n .buttonlist-score-badge {\n position: absolute;\n top: -0.9rem;\n right: -0.9rem;\n width: 2rem;\n height: 2rem;\n border-radius: 100%;\n color: $uiReviewPanelTextInverted;\n border: 0.1rem solid $uiReviewPanelTextInverted;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n .buttonlist-score-icon {\n font-size: 1.2rem;\n padding: 0;\n top: 0;\n left: 0;\n }\n\n .icon-info::before {\n @include icon-info-bare;\n }\n .icon-flagged::before {\n @include icon-bookmark;\n }\n .icon-correct::before {\n @include icon-result-ok;\n }\n .icon-incorrect::before {\n @include icon-result-nok;\n }\n .icon-score-pending::before {\n @include icon-time;\n }\n .icon-score-partial::before {\n @include icon-score-partial;\n }\n\n\n /****** step state styles *******/\n .buttonlist-item {\n @include disableSelect();\n\n &.viewed {\n .buttonlist-btn {\n border-width: $borderMedium;\n color: $uiReviewPanelTextDefault;\n border-color: $uiReviewPanelTextDefault;\n }\n }\n &.answered {\n .buttonlist-btn {\n border-width: $borderMedium;\n background-color: $uiReviewPanelBgInverted;\n color: $uiReviewPanelTextInverted;\n border-color: $uiReviewPanelBgInverted;\n }\n }\n &.buttonlist-item-active {\n .indicator {\n position: absolute;\n display: block;\n z-index: 1;\n color: $uiReviewPanelTextDefault;\n height: 1.4rem;\n min-width: 1.6rem;\n top: unset;\n bottom: -1.7rem;\n padding: 0;\n /* centering horizontally */\n left: 50%;\n transform: translateX(-50%);\n }\n }\n\n &.correct {\n .buttonlist-score-badge {\n background-color: $correctColor;\n }\n }\n\n &.incorrect {\n .buttonlist-score-badge {\n background-color: $incorrectColor;\n }\n }\n\n &.score-pending {\n .buttonlist-score-badge {\n background-color: $pendingColor;\n }\n }\n\n &.score-partial {\n .buttonlist-score-badge {\n background-color: $partialColor;\n }\n }\n }\n\n /* disabling is applied at buttonlist-item or buttonlist-items level */\n &:not(.disabled) .buttonlist-item:not(.disabled) {\n .buttonlist-btn:hover {\n background-color: $hoverBgColor;\n color: $uiReviewPanelPrimaryHighlight;\n border-color: $uiReviewPanelPrimaryHighlight;\n }\n }\n &.disabled,\n .buttonlist-item.disabled {\n /* reset global styles */\n background-color: unset !important;\n opacity: 1 !important;\n text-shadow: none !important;\n\n .buttonlist-btn {\n cursor: not-allowed;\n /* reset global styles */\n text-shadow: none;\n }\n }\n\n\n /****** keyboard focus styles *******/\n .buttonlist-item {\n &.key-navigation-highlight .buttonlist-btn::before,\n .buttonlist-btn.buttonlist-btn-focus:focus::before {\n content: '';\n display: block;\n position: absolute;\n width: 5.2rem;\n height: 5.2rem;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n border-width: $borderMedium;\n border-color: $uiReviewPanelPrimaryHighlight;\n border-style: dotted;\n border-radius: $radiusCircular;\n }\n\n &.key-navigation-highlight.buttonlist-item-active .buttonlist-btn .indicator,\n &.buttonlist-item-active .buttonlist-btn.buttonlist-btn-focus:focus .indicator,\n &.buttonlist-item-active .buttonlist-btn:focus-visible .indicator {\n color: $uiReviewPanelPrimaryHighlight;\n }\n\n &.key-navigation-highlight.viewed .buttonlist-btn,\n &.viewed .buttonlist-btn.buttonlist-btn-focus:focus {\n background-color: $uiReviewPanelBgDefault;\n color: $uiReviewPanelPrimaryHighlight;\n border-color: $uiReviewPanelPrimaryHighlight;\n }\n\n &.key-navigation-highlight.answered .buttonlist-btn,\n &.answered .buttonlist-btn.buttonlist-btn-focus:focus {\n background-color: $uiReviewPanelPrimaryHighlight;\n color: $uiReviewPanelTextInverted;\n border-color: $uiReviewPanelPrimaryHighlight;\n }\n }\n}\n","@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-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","/**\n * This program is free software; you can redistribute it and/or\n * modify it under the terms of the GNU General Public License\n * as published by the Free Software Foundation; under version 2\n * of the License (non-upgradable).\n *\n * This program is distributed in the hope that it will be useful,\n * but WITHOUT ANY WARRANTY; without even the implied warranty of\n * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n * GNU General Public License for more details.\n *\n * You should have received a copy of the GNU General Public License\n * along with this program; if not, write to the Free Software\n * Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.\n *\n * Copyright (c) 2022 Open Assessment Technologies SA ;\n */\n@import \"inc/bootstrap\";\n\n$correctColor: $success;\n$incorrectColor: $error;\n$hoverBgColor: hsl(208, 100%, 95%);\n$pendingColor: #6E6E6E;\n$partialColor: #AD5700;\n\n$radiusCircular: 50%;\n$sizeDefault: 4rem;\n$hitboxSize: 6.25rem;\n$borderThin: 0.125rem;\n$borderMedium: 0.25rem;\n\n.buttonlist-items {\n display: flex;\n flex-wrap: wrap;\n justify-content: start;\n padding: 0;\n\n /****** base styles *******/\n .buttonlist-item {\n height: $hitboxSize;\n width: $hitboxSize;\n display: flex;\n justify-content: center; /* aligning left - cut focusing board for keyboard interacting */\n align-items: center;\n /* reset parent styles */\n padding: 0;\n border: none;\n }\n\n .buttonlist-btn {\n position: relative;\n display: flex;\n justify-content: center;\n align-items: center;\n height: $sizeDefault;\n width: $sizeDefault;\n border-style: solid;\n border-radius: $radiusCircular;\n border-width: $borderThin;\n border-color: $uiReviewPanelTextDisabled;\n margin: 1.3rem 0.75rem 1rem 0.75rem;\n padding: 0; /*Fixes firefox button jumps*/\n font-weight: bold;\n font-size: 1.6rem;\n background-color: $uiReviewPanelBgDefault;\n color: $uiReviewPanelTextDisabled;\n text-shadow: none;\n cursor: pointer;\n }\n\n .buttonlist-label {\n font-family: 'Nunito Sans', 'Source Sans Pro', Arial, sans-serif;\n max-width: 3.75rem;\n overflow: hidden;\n white-space: nowrap;\n line-height: initial;\n }\n .buttonlist-icon {\n padding: 0;\n top: 0;\n left: 0;\n }\n .buttonlist-icon:not([class*=\"icon-\"]) {\n display: none;\n }\n .buttonlist-icon[class*=\"icon-\"] ~ .buttonlist-label {\n display: none;\n }\n\n .indicator {\n display: none;\n }\n\n .buttonlist-score-badge {\n position: absolute;\n top: -0.9rem;\n right: -0.9rem;\n width: 2rem;\n height: 2rem;\n border-radius: 100%;\n color: $uiReviewPanelTextInverted;\n border: 0.1rem solid $uiReviewPanelTextInverted;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n .buttonlist-score-icon {\n font-size: 1.2rem;\n padding: 0;\n top: 0;\n left: 0;\n }\n\n .icon-info::before {\n @include icon-info-bare;\n }\n .icon-flagged::before {\n @include icon-bookmark;\n }\n .icon-correct::before {\n @include icon-result-ok;\n }\n .icon-incorrect::before {\n @include icon-result-nok;\n }\n .icon-score-pending::before {\n @include icon-time;\n }\n .icon-score-partial::before {\n @include icon-score-partial;\n }\n\n\n /****** step state styles *******/\n .buttonlist-item {\n @include disableSelect();\n\n &.viewed {\n .buttonlist-btn {\n border-width: $borderMedium;\n color: $uiReviewPanelTextDefault;\n border-color: $uiReviewPanelTextDefault;\n }\n }\n &.answered {\n .buttonlist-btn {\n border-width: $borderMedium;\n background-color: $uiReviewPanelBgInverted;\n color: $uiReviewPanelTextInverted;\n border-color: $uiReviewPanelBgInverted;\n }\n }\n &.buttonlist-item-active {\n .indicator {\n position: absolute;\n display: block;\n z-index: 1;\n color: $uiReviewPanelTextDefault;\n height: 1.4rem;\n min-width: 1.6rem;\n top: unset;\n bottom: -1.7rem;\n padding: 0;\n /* centering horizontally */\n left: 50%;\n transform: translateX(-50%);\n }\n }\n\n &.correct {\n .buttonlist-score-badge {\n background-color: $correctColor;\n }\n }\n\n &.incorrect {\n .buttonlist-score-badge {\n background-color: $incorrectColor;\n }\n }\n\n &.score-pending {\n .buttonlist-score-badge {\n background-color: $pendingColor;\n }\n }\n\n &.score-partial {\n .buttonlist-score-badge {\n background-color: $partialColor;\n }\n }\n }\n\n /* disabling is applied at buttonlist-item or buttonlist-items level */\n &:not(.disabled) .buttonlist-item:not(.disabled) {\n .buttonlist-btn:hover {\n background-color: $hoverBgColor;\n color: $uiReviewPanelPrimaryHighlight;\n border-color: $uiReviewPanelPrimaryHighlight;\n }\n }\n &.disabled,\n .buttonlist-item.disabled {\n /* reset global styles */\n background-color: unset !important;\n opacity: 1 !important;\n text-shadow: none !important;\n\n .buttonlist-btn {\n cursor: not-allowed;\n /* reset global styles */\n text-shadow: none;\n }\n }\n\n\n /****** keyboard focus styles *******/\n .buttonlist-item {\n &.key-navigation-highlight .buttonlist-btn::before,\n .buttonlist-btn.buttonlist-btn-focus:focus::before {\n content: '';\n display: block;\n position: absolute;\n width: 5.2rem;\n height: 5.2rem;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n border-width: $borderMedium;\n border-color: $uiReviewPanelPrimaryHighlight;\n border-style: dotted;\n border-radius: $radiusCircular;\n }\n\n &.key-navigation-highlight.buttonlist-item-active .buttonlist-btn .indicator,\n &.buttonlist-item-active .buttonlist-btn.buttonlist-btn-focus:focus .indicator,\n &.buttonlist-item-active .buttonlist-btn:focus-visible .indicator {\n color: $uiReviewPanelPrimaryHighlight;\n }\n\n &.key-navigation-highlight.viewed .buttonlist-btn,\n &.viewed .buttonlist-btn.buttonlist-btn-focus:focus {\n background-color: $uiReviewPanelBgDefault;\n color: $uiReviewPanelPrimaryHighlight;\n border-color: $uiReviewPanelPrimaryHighlight;\n }\n\n &.key-navigation-highlight.answered .buttonlist-btn,\n &.answered .buttonlist-btn.buttonlist-btn-focus:focus {\n background-color: $uiReviewPanelPrimaryHighlight;\n color: $uiReviewPanelTextInverted;\n border-color: $uiReviewPanelPrimaryHighlight;\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 +1 @@
1
- {"version":3,"sources":["../../../scss/inc/_functions.scss","../../../scss/inc/fonts/_tao-icon-vars.scss","../scss/listbox.scss%23sass","../scss/listbox.scss","../../../scss/inc/_variables.scss","../../../scss/inc/_colors.scss"],"names":[],"mappings":"AAaA;;;;;;CAAA;AAoQA,oEAAA;ACjRA,gBAAA;ACMA;EACE,iBAAA;EACA,YAAA;ACIF;ADFE;EACE,0CAAA;EF6MI,eAAA;EACA,iBAAA;EE5MJ,mBAAA;ACKJ;ADHE;EACE,0CEPU;EJ+MN,eAAA;EACA,iBAAA;EEvMJ,mBAAA;ACMJ;ADHE;EACE,WAAA;ACKJ;ADFE;EFoFE,sBAAA;EACA,kBAAA;EACA,0BAAA;EEpFA,mBGOmB;EHNnB,mBAAA;EACA,aAAA;EACA,kBAAA;ACMJ;ADFI;EFsLI,eAAA;EACA,eAAA;EErLF,kBAAA;EACA,uBGnCC;EHoCD,6BAAA;ACKN;ADHI;EACE,kBAAA;EACA,WAAA;EACA,YAAA;EACA,2BAAA;EACA,iBAAA;EACA,gBAAA;EACA,wBAAA;EACA,cAAA;EACA,UAAA;ACKN;ADJM;EACE,uBAAA;ACMR;ADJM;EACI,kBAAA;ACMV;ADHI;EACE,iBAAA;ACKN;ADHI;EACE,kBAAA;ACKN;ADHM;EACE,WAAA;EACA,cAAA;EACA,yBAAA;EACA,yBAAA;EACA,4BAAA;EACA,kBAAA;EACA,UAAA;EACA,SAAA;EACA,UAAA;ACKR;ADFM;EACE,uBAAA;EACA,WAAA;EACA,wBAAA;EACA,uBAAA;EACA,SAAA;ACIR;ADDM;EACE,wBAAA;EACA,WAAA;EACA,wBAAA;EACA,uBAAA;ACGR;ADGI;EACE,qBAAA;ACDN;ADGI;EACE,aAAA;ACDN;ADKI;EACE,qBAAA;ACHN;ADKI;EACE,aAAA;ACHN;ADOI;EACE,qBAAA;ACLN;ADOI;EACE,aAAA;ACLN","file":"listbox.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-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\n$entryArrowWidthBefore: 20;\n$entryArrowWidthAfter: 20;\n$entryArrowHeight: 150;\n\n.listbox {\n max-width: 1024px;\n margin: auto;\n\n h1 {\n font-family: $headingFont;\n @include font-size(22);\n font-weight: normal;\n }\n h2 {\n font-family: $headingFont;\n @include font-size(18);\n margin: 30px 0 10px;\n }\n\n .list {\n width: 100%;\n }\n\n .box {\n @include simple-border();\n background: $uiClickableDefaultBg;\n margin-bottom: 20px;\n padding: 20px;\n position: relative;\n }\n\n .list-box {\n h1, h3 {\n @include font-size(20);\n margin-bottom: 7px;\n color: $info;\n text-shadow: 1px 1px 1px #fff;\n }\n .text-link {\n position: absolute;\n right: -1px;\n bottom: -1px;\n padding: 20px 20px 8px 20px;\n text-align: right;\n min-width: 100px;\n border-bottom: 3px solid;\n color: $uiClickableHoverBg;\n outline: 0;\n &:hover {\n color: $info;\n }\n [class*=\" icon-\"], [class^=\"icon-\"] {\n margin-right: 10px;\n }\n }\n a {\n min-height: $entryArrowHeight * 1px;\n }\n .box {\n padding-left: 40px;\n\n &:before, &:after {\n content: '';\n height: calc(($entryArrowHeight / 4) * 1px);\n border: solid transparent;\n border-top-width: calc((($entryArrowHeight / 4) / 2) * 1px);\n border-bottom-width: calc((($entryArrowHeight / 4) / 2) * 1px);\n position: absolute;\n left: -1px;\n top: 54px;\n z-index: 2;\n }\n\n &:before {\n border-left-color: $uiGeneralContentBorder;\n width: $entryArrowWidthBefore * 1px;\n border-right-width: calc(($entryArrowWidthBefore / 2) * 1px);\n border-left-width: calc(($entryArrowWidthBefore / 2) * 1px);\n left: 0px;\n }\n\n &:after {\n border-left-color: white;\n width: $entryArrowWidthAfter * 1px;\n border-right-width: calc(($entryArrowWidthAfter / 2) * 1px);\n border-left-width: calc(($entryArrowWidthAfter / 2) * 1px);\n }\n }\n }\n\n &.loading {\n .loading {\n display: inline-block;\n }\n .list, .empty-list, .available-list {\n display: none;\n }\n }\n &.loaded {\n .list, .available-list {\n display: inline-block;\n }\n .loading, .empty-list {\n display: none;\n }\n }\n &.empty {\n .empty-list {\n display: inline-block;\n }\n .loading, .list, .available-list {\n display: none;\n }\n }\n}\n","@import \"inc/bootstrap\";\n\n$entryArrowWidthBefore: 20;\n$entryArrowWidthAfter: 20;\n$entryArrowHeight: 150;\n\n.listbox {\n max-width: 1024px;\n margin: auto;\n\n h1 {\n font-family: $headingFont;\n @include font-size(22);\n font-weight: normal;\n }\n h2 {\n font-family: $headingFont;\n @include font-size(18);\n margin: 30px 0 10px;\n }\n\n .list {\n width: 100%;\n }\n\n .box {\n @include simple-border();\n background: $uiClickableDefaultBg;\n margin-bottom: 20px;\n padding: 20px;\n position: relative;\n }\n\n .list-box {\n h1, h3 {\n @include font-size(20);\n margin-bottom: 7px;\n color: $info;\n text-shadow: 1px 1px 1px #fff;\n }\n .text-link {\n position: absolute;\n right: -1px;\n bottom: -1px;\n padding: 20px 20px 8px 20px;\n text-align: right;\n min-width: 100px;\n border-bottom: 3px solid;\n color: $uiClickableHoverBg;\n outline: 0;\n &:hover {\n color: $info;\n }\n [class*=\" icon-\"], [class^=\"icon-\"] {\n margin-right: 10px;\n }\n }\n a {\n min-height: $entryArrowHeight * 1px;\n }\n .box {\n padding-left: 40px;\n\n &:before, &:after {\n content: '';\n height: calc(($entryArrowHeight / 4) * 1px);\n border: solid transparent;\n border-top-width: calc((($entryArrowHeight / 4) / 2) * 1px);\n border-bottom-width: calc((($entryArrowHeight / 4) / 2) * 1px);\n position: absolute;\n left: -1px;\n top: 54px;\n z-index: 2;\n }\n\n &:before {\n border-left-color: $uiGeneralContentBorder;\n width: $entryArrowWidthBefore * 1px;\n border-right-width: calc(($entryArrowWidthBefore / 2) * 1px);\n border-left-width: calc(($entryArrowWidthBefore / 2) * 1px);\n left: 0px;\n }\n\n &:after {\n border-left-color: white;\n width: $entryArrowWidthAfter * 1px;\n border-right-width: calc(($entryArrowWidthAfter / 2) * 1px);\n border-left-width: calc(($entryArrowWidthAfter / 2) * 1px);\n }\n }\n }\n\n &.loading {\n .loading {\n display: inline-block;\n }\n .list, .empty-list, .available-list {\n display: none;\n }\n }\n &.loaded {\n .list, .available-list {\n display: inline-block;\n }\n .loading, .empty-list {\n display: none;\n }\n }\n &.empty {\n .empty-list {\n display: inline-block;\n }\n .loading, .list, .available-list {\n display: none;\n }\n }\n}\n","$sidebarWidth: 180;\n$sidebarGutter: 0;\n$toolbarHeight: 50;\n$treeSidebar: 280;\n\n// fonts\n$fontPath : 'font/' !default;\n$monospaceFont: Consolas, 'Andale Mono WT', 'Andale Mono', 'Lucida Console', 'Lucida Sans Typewriter', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', 'Liberation Mono', 'Nimbus Mono L', Monaco, 'Courier New', Courier, monospace;\n$regularFont: 'Source Sans Pro', sans-serif;\n$headingFont: 'Source Sans Pro', sans-serif;\n\n\n%clearfix {\n &:before, &:after {\n content: \" \";\n display: table;\n }\n &:after {\n clear: both;\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/listbox.scss%23sass","../scss/listbox.scss","../../../scss/inc/_variables.scss","../../../scss/inc/_colors.scss"],"names":[],"mappings":"AAaA;;;;;;CAAA;AAoQA,oEAAA;ACjRA,gBAAA;ACMA;EACE,iBAAA;EACA,YAAA;ACIF;ADFE;EACE,0CAAA;EF6MI,eAAA;EACA,iBAAA;EE5MJ,mBAAA;ACKJ;ADHE;EACE,0CEPU;EJ+MN,eAAA;EACA,iBAAA;EEvMJ,mBAAA;ACMJ;ADHE;EACE,WAAA;ACKJ;ADFE;EFoFE,sBAAA;EACA,kBAAA;EACA,0BAAA;EEpFA,mBGOmB;EHNnB,mBAAA;EACA,aAAA;EACA,kBAAA;ACMJ;ADFI;EFsLI,eAAA;EACA,eAAA;EErLF,kBAAA;EACA,uBGnCC;EHoCD,6BAAA;ACKN;ADHI;EACE,kBAAA;EACA,WAAA;EACA,YAAA;EACA,2BAAA;EACA,iBAAA;EACA,gBAAA;EACA,wBAAA;EACA,cAAA;EACA,UAAA;ACKN;ADJM;EACE,uBAAA;ACMR;ADJM;EACI,kBAAA;ACMV;ADHI;EACE,iBAAA;ACKN;ADHI;EACE,kBAAA;ACKN;ADHM;EACE,WAAA;EACA,cAAA;EACA,yBAAA;EACA,yBAAA;EACA,4BAAA;EACA,kBAAA;EACA,UAAA;EACA,SAAA;EACA,UAAA;ACKR;ADFM;EACE,uBAAA;EACA,WAAA;EACA,wBAAA;EACA,uBAAA;EACA,SAAA;ACIR;ADDM;EACE,wBAAA;EACA,WAAA;EACA,wBAAA;EACA,uBAAA;ACGR;ADGI;EACE,qBAAA;ACDN;ADGI;EACE,aAAA;ACDN;ADKI;EACE,qBAAA;ACHN;ADKI;EACE,aAAA;ACHN;ADOI;EACE,qBAAA;ACLN;ADOI;EACE,aAAA;ACLN","file":"listbox.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-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\n$entryArrowWidthBefore: 20;\n$entryArrowWidthAfter: 20;\n$entryArrowHeight: 150;\n\n.listbox {\n max-width: 1024px;\n margin: auto;\n\n h1 {\n font-family: $headingFont;\n @include font-size(22);\n font-weight: normal;\n }\n h2 {\n font-family: $headingFont;\n @include font-size(18);\n margin: 30px 0 10px;\n }\n\n .list {\n width: 100%;\n }\n\n .box {\n @include simple-border();\n background: $uiClickableDefaultBg;\n margin-bottom: 20px;\n padding: 20px;\n position: relative;\n }\n\n .list-box {\n h1, h3 {\n @include font-size(20);\n margin-bottom: 7px;\n color: $info;\n text-shadow: 1px 1px 1px #fff;\n }\n .text-link {\n position: absolute;\n right: -1px;\n bottom: -1px;\n padding: 20px 20px 8px 20px;\n text-align: right;\n min-width: 100px;\n border-bottom: 3px solid;\n color: $uiClickableHoverBg;\n outline: 0;\n &:hover {\n color: $info;\n }\n [class*=\" icon-\"], [class^=\"icon-\"] {\n margin-right: 10px;\n }\n }\n a {\n min-height: $entryArrowHeight * 1px;\n }\n .box {\n padding-left: 40px;\n\n &:before, &:after {\n content: '';\n height: calc(($entryArrowHeight / 4) * 1px);\n border: solid transparent;\n border-top-width: calc((($entryArrowHeight / 4) / 2) * 1px);\n border-bottom-width: calc((($entryArrowHeight / 4) / 2) * 1px);\n position: absolute;\n left: -1px;\n top: 54px;\n z-index: 2;\n }\n\n &:before {\n border-left-color: $uiGeneralContentBorder;\n width: $entryArrowWidthBefore * 1px;\n border-right-width: calc(($entryArrowWidthBefore / 2) * 1px);\n border-left-width: calc(($entryArrowWidthBefore / 2) * 1px);\n left: 0px;\n }\n\n &:after {\n border-left-color: white;\n width: $entryArrowWidthAfter * 1px;\n border-right-width: calc(($entryArrowWidthAfter / 2) * 1px);\n border-left-width: calc(($entryArrowWidthAfter / 2) * 1px);\n }\n }\n }\n\n &.loading {\n .loading {\n display: inline-block;\n }\n .list, .empty-list, .available-list {\n display: none;\n }\n }\n &.loaded {\n .list, .available-list {\n display: inline-block;\n }\n .loading, .empty-list {\n display: none;\n }\n }\n &.empty {\n .empty-list {\n display: inline-block;\n }\n .loading, .list, .available-list {\n display: none;\n }\n }\n}\n","@import \"inc/bootstrap\";\n\n$entryArrowWidthBefore: 20;\n$entryArrowWidthAfter: 20;\n$entryArrowHeight: 150;\n\n.listbox {\n max-width: 1024px;\n margin: auto;\n\n h1 {\n font-family: $headingFont;\n @include font-size(22);\n font-weight: normal;\n }\n h2 {\n font-family: $headingFont;\n @include font-size(18);\n margin: 30px 0 10px;\n }\n\n .list {\n width: 100%;\n }\n\n .box {\n @include simple-border();\n background: $uiClickableDefaultBg;\n margin-bottom: 20px;\n padding: 20px;\n position: relative;\n }\n\n .list-box {\n h1, h3 {\n @include font-size(20);\n margin-bottom: 7px;\n color: $info;\n text-shadow: 1px 1px 1px #fff;\n }\n .text-link {\n position: absolute;\n right: -1px;\n bottom: -1px;\n padding: 20px 20px 8px 20px;\n text-align: right;\n min-width: 100px;\n border-bottom: 3px solid;\n color: $uiClickableHoverBg;\n outline: 0;\n &:hover {\n color: $info;\n }\n [class*=\" icon-\"], [class^=\"icon-\"] {\n margin-right: 10px;\n }\n }\n a {\n min-height: $entryArrowHeight * 1px;\n }\n .box {\n padding-left: 40px;\n\n &:before, &:after {\n content: '';\n height: calc(($entryArrowHeight / 4) * 1px);\n border: solid transparent;\n border-top-width: calc((($entryArrowHeight / 4) / 2) * 1px);\n border-bottom-width: calc((($entryArrowHeight / 4) / 2) * 1px);\n position: absolute;\n left: -1px;\n top: 54px;\n z-index: 2;\n }\n\n &:before {\n border-left-color: $uiGeneralContentBorder;\n width: $entryArrowWidthBefore * 1px;\n border-right-width: calc(($entryArrowWidthBefore / 2) * 1px);\n border-left-width: calc(($entryArrowWidthBefore / 2) * 1px);\n left: 0px;\n }\n\n &:after {\n border-left-color: white;\n width: $entryArrowWidthAfter * 1px;\n border-right-width: calc(($entryArrowWidthAfter / 2) * 1px);\n border-left-width: calc(($entryArrowWidthAfter / 2) * 1px);\n }\n }\n }\n\n &.loading {\n .loading {\n display: inline-block;\n }\n .list, .empty-list, .available-list {\n display: none;\n }\n }\n &.loaded {\n .list, .available-list {\n display: inline-block;\n }\n .loading, .empty-list {\n display: none;\n }\n }\n &.empty {\n .empty-list {\n display: inline-block;\n }\n .loading, .list, .available-list {\n display: none;\n }\n }\n}\n","$sidebarWidth: 180;\n$sidebarGutter: 0;\n$toolbarHeight: 50;\n$treeSidebar: 280;\n\n// fonts\n$fontPath : 'font/' !default;\n$monospaceFont: Consolas, 'Andale Mono WT', 'Andale Mono', 'Lucida Console', 'Lucida Sans Typewriter', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', 'Liberation Mono', 'Nimbus Mono L', Monaco, 'Courier New', Courier, monospace;\n$regularFont: 'Source Sans Pro', sans-serif;\n$headingFont: 'Source Sans Pro', sans-serif;\n\n\n%clearfix {\n &:before, &:after {\n content: \" \";\n display: table;\n }\n &:after {\n clear: both;\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"]}