Skip to content

E
edx-ora2
Commit 4053e448 by Brian Talbot
Options

Merge pull request #36 from edx/talbs/styling-architecture 

Sass/Styling Architecture
parents eb54cb73 afcd7c9c
Showing with 5390 additions and 103 deletions
apps/openassessment/xblock/static/css/openassessment.css
/* START CSS for OpenAssessmentBlock */ @import url(//fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,400,300,600,700);*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}/*!
* Font Awesome 4.0.3 by @davegandy - http://fontawesome.io - @fontawesome
.openassessment_block .openassessment_prompt { * License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
font-weight: bold; */@font-face{font-family:'FontAwesome';src:url("../fonts/libs/font-awesome/fontawesome-webfont.eot?v=4.0.3");src:url("../fonts/libs/font-awesome/fontawesome-webfont.eot?#iefix&v=4.0.3") format("embedded-opentype"),url("../fonts/libs/font-awesome/fontawesome-webfont.woff?v=4.0.3") format("woff"),url("../fonts/libs/font-awesome/fontawesome-webfont.ttf?v=4.0.3") format("truetype"),url("../fonts/libs/font-awesome/fontawesome-webfont.svg?v=4.0.3#fontawesomeregular") format("svg");font-weight:normal;font-style:normal}.fa{display:inline-block;font-family:FontAwesome;font-style:normal;font-weight:normal;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.fa-lg{font-size:1.33333em;line-height:0.75em;vertical-align:-15%}.fa-2x{font-size:2em}.fa-3x{font-size:3em}.fa-4x{font-size:4em}.fa-5x{font-size:5em}.fa-fw{width:1.28571em;text-align:center}.fa-ul{padding-left:0;margin-left:2.14286em;list-style-type:none}.fa-ul>li{position:relative}.fa-li{position:absolute;left:-2.14286em;width:2.14286em;top:0.14286em;text-align:center}.fa-li.fa-lg{left:-1.85714em}.fa-border{padding:.2em .25em .15em;border:solid 0.08em #eee;border-radius:.1em}.pull-right{float:right}.pull-left{float:left}.fa.pull-left{margin-right:.3em}.fa.pull-right{margin-left:.3em}.fa-spin{-webkit-animation:spin 2s infinite linear;-moz-animation:spin 2s infinite linear;-o-animation:spin 2s infinite linear;animation:spin 2s infinite linear}@-moz-keyframes spin{0%{-moz-transform:rotate(0deg)}100%{-moz-transform:rotate(359deg)}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(359deg)}}@-o-keyframes spin{0%{-o-transform:rotate(0deg)}100%{-o-transform:rotate(359deg)}}@-ms-keyframes spin{0%{-ms-transform:rotate(0deg)}100%{-ms-transform:rotate(359deg)}}@keyframes spin{0%{transform:rotate(0deg)}100%{transform:rotate(359deg)}}.fa-rotate-90{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=$rotation);-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);-ms-transform:rotate(90deg);-o-transform:rotate(90deg);transform:rotate(90deg)}.fa-rotate-180{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=$rotation);-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(180deg)}.fa-rotate-270{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=$rotation);-webkit-transform:rotate(270deg);-moz-transform:rotate(270deg);-ms-transform:rotate(270deg);-o-transform:rotate(270deg);transform:rotate(270deg)}.fa-flip-horizontal{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=$rotation);-webkit-transform:scale(-1, 1);-moz-transform:scale(-1, 1);-ms-transform:scale(-1, 1);-o-transform:scale(-1, 1);transform:scale(-1, 1)}.fa-flip-vertical{filter:progid:DXImageTransform.Microsoft.BasicImage(rotation=$rotation);-webkit-transform:scale(1, -1);-moz-transform:scale(1, -1);-ms-transform:scale(1, -1);-o-transform:scale(1, -1);transform:scale(1, -1)}.fa-stack{position:relative;display:inline-block;width:2em;height:2em;line-height:2em;vertical-align:middle}.fa-stack-1x,.fa-stack-2x{position:absolute;left:0;width:100%;text-align:center}.fa-stack-1x{line-height:inherit}.fa-stack-2x{font-size:2em}.fa-inverse{color:#fff}.fa-glass:before{content:"\f000"}.fa-music:before{content:"\f001"}.fa-search:before{content:"\f002"}.fa-envelope-o:before{content:"\f003"}.fa-heart:before{content:"\f004"}.fa-star:before{content:"\f005"}.fa-star-o:before{content:"\f006"}.fa-user:before{content:"\f007"}.fa-film:before{content:"\f008"}.fa-th-large:before{content:"\f009"}.fa-th:before{content:"\f00a"}.fa-th-list:before{content:"\f00b"}.fa-check:before{content:"\f00c"}.fa-times:before{content:"\f00d"}.fa-search-plus:before{content:"\f00e"}.fa-search-minus:before{content:"\f010"}.fa-power-off:before{content:"\f011"}.fa-signal:before{content:"\f012"}.fa-gear:before,.fa-cog:before{content:"\f013"}.fa-trash-o:before{content:"\f014"}.fa-home:before{content:"\f015"}.fa-file-o:before{content:"\f016"}.fa-clock-o:before{content:"\f017"}.fa-road:before{content:"\f018"}.fa-download:before{content:"\f019"}.fa-arrow-circle-o-down:before{content:"\f01a"}.fa-arrow-circle-o-up:before{content:"\f01b"}.fa-inbox:before{content:"\f01c"}.fa-play-circle-o:before{content:"\f01d"}.fa-rotate-right:before,.fa-repeat:before{content:"\f01e"}.fa-refresh:before{content:"\f021"}.fa-list-alt:before{content:"\f022"}.fa-lock:before{content:"\f023"}.fa-flag:before{content:"\f024"}.fa-headphones:before{content:"\f025"}.fa-volume-off:before{content:"\f026"}.fa-volume-down:before{content:"\f027"}.fa-volume-up:before{content:"\f028"}.fa-qrcode:before{content:"\f029"}.fa-barcode:before{content:"\f02a"}.fa-tag:before{content:"\f02b"}.fa-tags:before{content:"\f02c"}.fa-book:before{content:"\f02d"}.fa-bookmark:before{content:"\f02e"}.fa-print:before{content:"\f02f"}.fa-camera:before{content:"\f030"}.fa-font:before{content:"\f031"}.fa-bold:before{content:"\f032"}.fa-italic:before{content:"\f033"}.fa-text-height:before{content:"\f034"}.fa-text-width:before{content:"\f035"}.fa-align-left:before{content:"\f036"}.fa-align-center:before{content:"\f037"}.fa-align-right:before{content:"\f038"}.fa-align-justify:before{content:"\f039"}.fa-list:before{content:"\f03a"}.fa-dedent:before,.fa-outdent:before{content:"\f03b"}.fa-indent:before{content:"\f03c"}.fa-video-camera:before{content:"\f03d"}.fa-picture-o:before{content:"\f03e"}.fa-pencil:before{content:"\f040"}.fa-map-marker:before{content:"\f041"}.fa-adjust:before{content:"\f042"}.fa-tint:before{content:"\f043"}.fa-edit:before,.fa-pencil-square-o:before{content:"\f044"}.fa-share-square-o:before{content:"\f045"}.fa-check-square-o:before{content:"\f046"}.fa-arrows:before{content:"\f047"}.fa-step-backward:before{content:"\f048"}.fa-fast-backward:before{content:"\f049"}.fa-backward:before{content:"\f04a"}.fa-play:before{content:"\f04b"}.fa-pause:before{content:"\f04c"}.fa-stop:before{content:"\f04d"}.fa-forward:before{content:"\f04e"}.fa-fast-forward:before{content:"\f050"}.fa-step-forward:before{content:"\f051"}.fa-eject:before{content:"\f052"}.fa-chevron-left:before{content:"\f053"}.fa-chevron-right:before{content:"\f054"}.fa-plus-circle:before{content:"\f055"}.fa-minus-circle:before{content:"\f056"}.fa-times-circle:before{content:"\f057"}.fa-check-circle:before{content:"\f058"}.fa-question-circle:before{content:"\f059"}.fa-info-circle:before{content:"\f05a"}.fa-crosshairs:before{content:"\f05b"}.fa-times-circle-o:before{content:"\f05c"}.fa-check-circle-o:before{content:"\f05d"}.fa-ban:before{content:"\f05e"}.fa-arrow-left:before{content:"\f060"}.fa-arrow-right:before{content:"\f061"}.fa-arrow-up:before{content:"\f062"}.fa-arrow-down:before{content:"\f063"}.fa-mail-forward:before,.fa-share:before{content:"\f064"}.fa-expand:before{content:"\f065"}.fa-compress:before{content:"\f066"}.fa-plus:before{content:"\f067"}.fa-minus:before{content:"\f068"}.fa-asterisk:before{content:"\f069"}.fa-exclamation-circle:before{content:"\f06a"}.fa-gift:before{content:"\f06b"}.fa-leaf:before{content:"\f06c"}.fa-fire:before{content:"\f06d"}.fa-eye:before{content:"\f06e"}.fa-eye-slash:before{content:"\f070"}.fa-warning:before,.fa-exclamation-triangle:before{content:"\f071"}.fa-plane:before{content:"\f072"}.fa-calendar:before{content:"\f073"}.fa-random:before{content:"\f074"}.fa-comment:before{content:"\f075"}.fa-magnet:before{content:"\f076"}.fa-chevron-up:before{content:"\f077"}.fa-chevron-down:before{content:"\f078"}.fa-retweet:before{content:"\f079"}.fa-shopping-cart:before{content:"\f07a"}.fa-folder:before{content:"\f07b"}.fa-folder-open:before{content:"\f07c"}.fa-arrows-v:before{content:"\f07d"}.fa-arrows-h:before{content:"\f07e"}.fa-bar-chart-o:before{content:"\f080"}.fa-twitter-square:before{content:"\f081"}.fa-facebook-square:before{content:"\f082"}.fa-camera-retro:before{content:"\f083"}.fa-key:before{content:"\f084"}.fa-gears:before,.fa-cogs:before{content:"\f085"}.fa-comments:before{content:"\f086"}.fa-thumbs-o-up:before{content:"\f087"}.fa-thumbs-o-down:before{content:"\f088"}.fa-star-half:before{content:"\f089"}.fa-heart-o:before{content:"\f08a"}.fa-sign-out:before{content:"\f08b"}.fa-linkedin-square:before{content:"\f08c"}.fa-thumb-tack:before{content:"\f08d"}.fa-external-link:before{content:"\f08e"}.fa-sign-in:before{content:"\f090"}.fa-trophy:before{content:"\f091"}.fa-github-square:before{content:"\f092"}.fa-upload:before{content:"\f093"}.fa-lemon-o:before{content:"\f094"}.fa-phone:before{content:"\f095"}.fa-square-o:before{content:"\f096"}.fa-bookmark-o:before{content:"\f097"}.fa-phone-square:before{content:"\f098"}.fa-twitter:before{content:"\f099"}.fa-facebook:before{content:"\f09a"}.fa-github:before{content:"\f09b"}.fa-unlock:before{content:"\f09c"}.fa-credit-card:before{content:"\f09d"}.fa-rss:before{content:"\f09e"}.fa-hdd-o:before{content:"\f0a0"}.fa-bullhorn:before{content:"\f0a1"}.fa-bell:before{content:"\f0f3"}.fa-certificate:before{content:"\f0a3"}.fa-hand-o-right:before{content:"\f0a4"}.fa-hand-o-left:before{content:"\f0a5"}.fa-hand-o-up:before{content:"\f0a6"}.fa-hand-o-down:before{content:"\f0a7"}.fa-arrow-circle-left:before{content:"\f0a8"}.fa-arrow-circle-right:before{content:"\f0a9"}.fa-arrow-circle-up:before{content:"\f0aa"}.fa-arrow-circle-down:before{content:"\f0ab"}.fa-globe:before{content:"\f0ac"}.fa-wrench:before{content:"\f0ad"}.fa-tasks:before{content:"\f0ae"}.fa-filter:before{content:"\f0b0"}.fa-briefcase:before{content:"\f0b1"}.fa-arrows-alt:before{content:"\f0b2"}.fa-group:before,.fa-users:before{content:"\f0c0"}.fa-chain:before,.fa-link:before{content:"\f0c1"}.fa-cloud:before{content:"\f0c2"}.fa-flask:before{content:"\f0c3"}.fa-cut:before,.fa-scissors:before{content:"\f0c4"}.fa-copy:before,.fa-files-o:before{content:"\f0c5"}.fa-paperclip:before{content:"\f0c6"}.fa-save:before,.fa-floppy-o:before{content:"\f0c7"}.fa-square:before{content:"\f0c8"}.fa-bars:before{content:"\f0c9"}.fa-list-ul:before{content:"\f0ca"}.fa-list-ol:before{content:"\f0cb"}.fa-strikethrough:before{content:"\f0cc"}.fa-underline:before{content:"\f0cd"}.fa-table:before{content:"\f0ce"}.fa-magic:before{content:"\f0d0"}.fa-truck:before{content:"\f0d1"}.fa-pinterest:before{content:"\f0d2"}.fa-pinterest-square:before{content:"\f0d3"}.fa-google-plus-square:before{content:"\f0d4"}.fa-google-plus:before{content:"\f0d5"}.fa-money:before{content:"\f0d6"}.fa-caret-down:before{content:"\f0d7"}.fa-caret-up:before{content:"\f0d8"}.fa-caret-left:before{content:"\f0d9"}.fa-caret-right:before{content:"\f0da"}.fa-columns:before{content:"\f0db"}.fa-unsorted:before,.fa-sort:before{content:"\f0dc"}.fa-sort-down:before,.fa-sort-asc:before{content:"\f0dd"}.fa-sort-up:before,.fa-sort-desc:before{content:"\f0de"}.fa-envelope:before{content:"\f0e0"}.fa-linkedin:before{content:"\f0e1"}.fa-rotate-left:before,.fa-undo:before{content:"\f0e2"}.fa-legal:before,.fa-gavel:before{content:"\f0e3"}.fa-dashboard:before,.fa-tachometer:before{content:"\f0e4"}.fa-comment-o:before{content:"\f0e5"}.fa-comments-o:before{content:"\f0e6"}.fa-flash:before,.fa-bolt:before{content:"\f0e7"}.fa-sitemap:before{content:"\f0e8"}.fa-umbrella:before{content:"\f0e9"}.fa-paste:before,.fa-clipboard:before{content:"\f0ea"}.fa-lightbulb-o:before{content:"\f0eb"}.fa-exchange:before{content:"\f0ec"}.fa-cloud-download:before{content:"\f0ed"}.fa-cloud-upload:before{content:"\f0ee"}.fa-user-md:before{content:"\f0f0"}.fa-stethoscope:before{content:"\f0f1"}.fa-suitcase:before{content:"\f0f2"}.fa-bell-o:before{content:"\f0a2"}.fa-coffee:before{content:"\f0f4"}.fa-cutlery:before{content:"\f0f5"}.fa-file-text-o:before{content:"\f0f6"}.fa-building-o:before{content:"\f0f7"}.fa-hospital-o:before{content:"\f0f8"}.fa-ambulance:before{content:"\f0f9"}.fa-medkit:before{content:"\f0fa"}.fa-fighter-jet:before{content:"\f0fb"}.fa-beer:before{content:"\f0fc"}.fa-h-square:before{content:"\f0fd"}.fa-plus-square:before{content:"\f0fe"}.fa-angle-double-left:before{content:"\f100"}.fa-angle-double-right:before{content:"\f101"}.fa-angle-double-up:before{content:"\f102"}.fa-angle-double-down:before{content:"\f103"}.fa-angle-left:before{content:"\f104"}.fa-angle-right:before{content:"\f105"}.fa-angle-up:before{content:"\f106"}.fa-angle-down:before{content:"\f107"}.fa-desktop:before{content:"\f108"}.fa-laptop:before{content:"\f109"}.fa-tablet:before{content:"\f10a"}.fa-mobile-phone:before,.fa-mobile:before{content:"\f10b"}.fa-circle-o:before{content:"\f10c"}.fa-quote-left:before{content:"\f10d"}.fa-quote-right:before{content:"\f10e"}.fa-spinner:before{content:"\f110"}.fa-circle:before{content:"\f111"}.fa-mail-reply:before,.fa-reply:before{content:"\f112"}.fa-github-alt:before{content:"\f113"}.fa-folder-o:before{content:"\f114"}.fa-folder-open-o:before{content:"\f115"}.fa-smile-o:before{content:"\f118"}.fa-frown-o:before{content:"\f119"}.fa-meh-o:before{content:"\f11a"}.fa-gamepad:before{content:"\f11b"}.fa-keyboard-o:before{content:"\f11c"}.fa-flag-o:before{content:"\f11d"}.fa-flag-checkered:before{content:"\f11e"}.fa-terminal:before{content:"\f120"}.fa-code:before{content:"\f121"}.fa-reply-all:before{content:"\f122"}.fa-mail-reply-all:before{content:"\f122"}.fa-star-half-empty:before,.fa-star-half-full:before,.fa-star-half-o:before{content:"\f123"}.fa-location-arrow:before{content:"\f124"}.fa-crop:before{content:"\f125"}.fa-code-fork:before{content:"\f126"}.fa-unlink:before,.fa-chain-broken:before{content:"\f127"}.fa-question:before{content:"\f128"}.fa-info:before{content:"\f129"}.fa-exclamation:before{content:"\f12a"}.fa-superscript:before{content:"\f12b"}.fa-subscript:before{content:"\f12c"}.fa-eraser:before{content:"\f12d"}.fa-puzzle-piece:before{content:"\f12e"}.fa-microphone:before{content:"\f130"}.fa-microphone-slash:before{content:"\f131"}.fa-shield:before{content:"\f132"}.fa-calendar-o:before{content:"\f133"}.fa-fire-extinguisher:before{content:"\f134"}.fa-rocket:before{content:"\f135"}.fa-maxcdn:before{content:"\f136"}.fa-chevron-circle-left:before{content:"\f137"}.fa-chevron-circle-right:before{content:"\f138"}.fa-chevron-circle-up:before{content:"\f139"}.fa-chevron-circle-down:before{content:"\f13a"}.fa-html5:before{content:"\f13b"}.fa-css3:before{content:"\f13c"}.fa-anchor:before{content:"\f13d"}.fa-unlock-alt:before{content:"\f13e"}.fa-bullseye:before{content:"\f140"}.fa-ellipsis-h:before{content:"\f141"}.fa-ellipsis-v:before{content:"\f142"}.fa-rss-square:before{content:"\f143"}.fa-play-circle:before{content:"\f144"}.fa-ticket:before{content:"\f145"}.fa-minus-square:before{content:"\f146"}.fa-minus-square-o:before{content:"\f147"}.fa-level-up:before{content:"\f148"}.fa-level-down:before{content:"\f149"}.fa-check-square:before{content:"\f14a"}.fa-pencil-square:before{content:"\f14b"}.fa-external-link-square:before{content:"\f14c"}.fa-share-square:before{content:"\f14d"}.fa-compass:before{content:"\f14e"}.fa-toggle-down:before,.fa-caret-square-o-down:before{content:"\f150"}.fa-toggle-up:before,.fa-caret-square-o-up:before{content:"\f151"}.fa-toggle-right:before,.fa-caret-square-o-right:before{content:"\f152"}.fa-euro:before,.fa-eur:before{content:"\f153"}.fa-gbp:before{content:"\f154"}.fa-dollar:before,.fa-usd:before{content:"\f155"}.fa-rupee:before,.fa-inr:before{content:"\f156"}.fa-cny:before,.fa-rmb:before,.fa-yen:before,.fa-jpy:before{content:"\f157"}.fa-ruble:before,.fa-rouble:before,.fa-rub:before{content:"\f158"}.fa-won:before,.fa-krw:before{content:"\f159"}.fa-bitcoin:before,.fa-btc:before{content:"\f15a"}.fa-file:before{content:"\f15b"}.fa-file-text:before{content:"\f15c"}.fa-sort-alpha-asc:before{content:"\f15d"}.fa-sort-alpha-desc:before{content:"\f15e"}.fa-sort-amount-asc:before{content:"\f160"}.fa-sort-amount-desc:before{content:"\f161"}.fa-sort-numeric-asc:before{content:"\f162"}.fa-sort-numeric-desc:before{content:"\f163"}.fa-thumbs-up:before{content:"\f164"}.fa-thumbs-down:before{content:"\f165"}.fa-youtube-square:before{content:"\f166"}.fa-youtube:before{content:"\f167"}.fa-xing:before{content:"\f168"}.fa-xing-square:before{content:"\f169"}.fa-youtube-play:before{content:"\f16a"}.fa-dropbox:before{content:"\f16b"}.fa-stack-overflow:before{content:"\f16c"}.fa-instagram:before{content:"\f16d"}.fa-flickr:before{content:"\f16e"}.fa-adn:before{content:"\f170"}.fa-bitbucket:before{content:"\f171"}.fa-bitbucket-square:before{content:"\f172"}.fa-tumblr:before{content:"\f173"}.fa-tumblr-square:before{content:"\f174"}.fa-long-arrow-down:before{content:"\f175"}.fa-long-arrow-up:before{content:"\f176"}.fa-long-arrow-left:before{content:"\f177"}.fa-long-arrow-right:before{content:"\f178"}.fa-apple:before{content:"\f179"}.fa-windows:before{content:"\f17a"}.fa-android:before{content:"\f17b"}.fa-linux:before{content:"\f17c"}.fa-dribbble:before{content:"\f17d"}.fa-skype:before{content:"\f17e"}.fa-foursquare:before{content:"\f180"}.fa-trello:before{content:"\f181"}.fa-female:before{content:"\f182"}.fa-male:before{content:"\f183"}.fa-gittip:before{content:"\f184"}.fa-sun-o:before{content:"\f185"}.fa-moon-o:before{content:"\f186"}.fa-archive:before{content:"\f187"}.fa-bug:before{content:"\f188"}.fa-vk:before{content:"\f189"}.fa-weibo:before{content:"\f18a"}.fa-renren:before{content:"\f18b"}.fa-pagelines:before{content:"\f18c"}.fa-stack-exchange:before{content:"\f18d"}.fa-arrow-circle-o-right:before{content:"\f18e"}.fa-arrow-circle-o-left:before{content:"\f190"}.fa-toggle-left:before,.fa-caret-square-o-left:before{content:"\f191"}.fa-dot-circle-o:before{content:"\f192"}.fa-wheelchair:before{content:"\f193"}.fa-vimeo-square:before{content:"\f194"}.fa-turkish-lira:before,.fa-try:before{content:"\f195"}.fa-plus-square-o:before{content:"\f196"}.wrapper--xblock{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}.wrapper--xblock article,.wrapper--xblock aside,.wrapper--xblock details,.wrapper--xblock figcaption,.wrapper--xblock figure,.wrapper--xblock footer,.wrapper--xblock header,.wrapper--xblock hgroup,.wrapper--xblock main,.wrapper--xblock nav,.wrapper--xblock section,.wrapper--xblock summary{display:block}.wrapper--xblock audio,.wrapper--xblock canvas,.wrapper--xblock progress,.wrapper--xblock video{display:inline-block;vertical-align:baseline}.wrapper--xblock audio:not([controls]){display:none;height:0}.wrapper--xblock [hidden],.wrapper--xblock template{display:none}.wrapper--xblock a{background:transparent}.wrapper--xblock a:active,.wrapper--xblock a:hover{outline:0}.wrapper--xblock abbr[title]{border-bottom:1px dotted}.wrapper--xblock b,.wrapper--xblock strong{font-weight:bold}.wrapper--xblock dfn{font-style:italic}.wrapper--xblock h1{font-size:2em;margin:0.67em 0}.wrapper--xblock mark{background:#ff0;color:#000}.wrapper--xblock small{font-size:80%}.wrapper--xblock sub,.wrapper--xblock sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}.wrapper--xblock sup{top:-0.5em}.wrapper--xblock sub{bottom:-0.25em}.wrapper--xblock img{border:0}.wrapper--xblock svg:not(:root){overflow:hidden}.wrapper--xblock figure{margin:1em 40px}.wrapper--xblock hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}.wrapper--xblock pre{overflow:auto}.wrapper--xblock code,.wrapper--xblock kbd,.wrapper--xblock pre,.wrapper--xblock samp{font-family:monospace, monospace;font-size:1em}.wrapper--xblock button,.wrapper--xblock input,.wrapper--xblock optgroup,.wrapper--xblock select,.wrapper--xblock textarea{color:inherit;font:inherit;margin:0}.wrapper--xblock button{overflow:visible}.wrapper--xblock button,.wrapper--xblock select{text-transform:none}.wrapper--xblock button,.wrapper--xblock html input[type="button"],.wrapper--xblock input[type="reset"],.wrapper--xblock input[type="submit"]{-webkit-appearance:button;cursor:pointer}.wrapper--xblock button[disabled],.wrapper--xblock html input[disabled]{cursor:default}.wrapper--xblock button::-moz-focus-inner,.wrapper--xblock input::-moz-focus-inner{border:0;padding:0}.wrapper--xblock input{line-height:normal}.wrapper--xblock input[type="checkbox"],.wrapper--xblock input[type="radio"]{box-sizing:border-box;padding:0}.wrapper--xblock input[type="number"]::-webkit-inner-spin-button,.wrapper--xblock input[type="number"]::-webkit-outer-spin-button{height:auto}.wrapper--xblock input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}.wrapper--xblock input[type="search"]::-webkit-search-cancel-button,.wrapper--xblock input[type="search"]::-webkit-search-decoration{-webkit-appearance:none}.wrapper--xblock fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em}.wrapper--xblock legend{border:0;padding:0}.wrapper--xblock textarea{overflow:auto}.wrapper--xblock optgroup{font-weight:bold}.wrapper--xblock table{border-collapse:collapse;border-spacing:0}.wrapper--xblock td,.wrapper--xblock th{padding:0}.wrapper--xblock div,.wrapper--xblock span,.wrapper--xblock applet,.wrapper--xblock object,.wrapper--xblock iframe,.wrapper--xblock h1,.wrapper--xblock h2,.wrapper--xblock h3,.wrapper--xblock h4,.wrapper--xblock h5,.wrapper--xblock h6,.wrapper--xblock p,.wrapper--xblock blockquote,.wrapper--xblock pre,.wrapper--xblock a,.wrapper--xblock abbr,.wrapper--xblock acronym,.wrapper--xblock address,.wrapper--xblock big,.wrapper--xblock cite,.wrapper--xblock code,.wrapper--xblock del,.wrapper--xblock dfn,.wrapper--xblock em,.wrapper--xblock img,.wrapper--xblock ins,.wrapper--xblock kbd,.wrapper--xblock q,.wrapper--xblock s,.wrapper--xblock samp,.wrapper--xblock small,.wrapper--xblock strike,.wrapper--xblock strong,.wrapper--xblock sub,.wrapper--xblock sup,.wrapper--xblock tt,.wrapper--xblock var,.wrapper--xblock b,.wrapper--xblock u,.wrapper--xblock i,.wrapper--xblock center,.wrapper--xblock dl,.wrapper--xblock dt,.wrapper--xblock dd,.wrapper--xblock ol,.wrapper--xblock ul,.wrapper--xblock li,.wrapper--xblock fieldset,.wrapper--xblock form,.wrapper--xblock label,.wrapper--xblock legend,.wrapper--xblock table,.wrapper--xblock caption,.wrapper--xblock tbody,.wrapper--xblock tfoot,.wrapper--xblock thead,.wrapper--xblock tr,.wrapper--xblock th,.wrapper--xblock td,.wrapper--xblock article,.wrapper--xblock aside,.wrapper--xblock canvas,.wrapper--xblock details,.wrapper--xblock figcaption,.wrapper--xblock figure,.wrapper--xblock footer,.wrapper--xblock header,.wrapper--xblock hgroup,.wrapper--xblock menu,.wrapper--xblock nav,.wrapper--xblock section,.wrapper--xblock summary,.wrapper--xblock time,.wrapper--xblock mark,.wrapper--xblock audio,.wrapper--xblock video{margin:0;vertical-align:baseline;border:0;padding:0;outline:0}.wrapper--xblock abbr[title]{border-bottom:none;text-decoration:none;cursor:help}.list--actions:last-child,.list--docs:last-child,.list--steps:last-child,.list--controls:last-child,.list--fields:last-child,.list--help:last-child,.nav--wizard:last-child,.list--tips:last-child,.field--group:last-child{margin-bottom:0;border-bottom:none;padding-bottom:0;margin-right:0;border-right:none;padding-right:0}[class^="wrapper-"]{*zoom:1;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;width:100%}[class^="wrapper-"]:before,[class^="wrapper-"]:after{content:" ";display:table}[class^="wrapper-"]:after{clear:both}@-webkit-keyframes fadeIn{0%{opacity:0.0}50%{opacity:0.5}100%{opacity:1.0}}@-moz-keyframes fadeIn{0%{opacity:0.0}50%{opacity:0.5}100%{opacity:1.0}}@-o-keyframes fadeIn{0%{opacity:0.0}50%{opacity:0.5}100%{opacity:1.0}}@keyframes fadeIn{0%{opacity:0.0}50%{opacity:0.5}100%{opacity:1.0}}@-webkit-keyframes fadeInLeft{0%{-webkit-transform:translateX(-40px);opacity:0}100%{-webkit-transform:translateX(0);opacity:1}}@-moz-keyframes fadeInLeft{0%{-moz-transform:translateX(-40px);opacity:0}100%{-moz-transform:translateX(0);opacity:1}}@-o-keyframes fadeInLeft{0%{-o-transform:translateX(-40px);opacity:0}100%{-o-transform:translateX(0);opacity:1}}@keyframes fadeInLeft{0%{transform:translateX(-40px);opacity:0}100%{transform:translateX(0);opacity:1}}@-webkit-keyframes fadeInRight{0%{-webkit-transform:translateX(40px);opacity:0}100%{-webkit-transform:translateX(0);opacity:1}}@-moz-keyframes fadeInRight{0%{-moz-transform:translateX(40px);opacity:0}100%{-moz-transform:translateX(0);opacity:1}}@-o-keyframes fadeInRight{0%{-o-transform:translateX(40px);opacity:0}100%{-o-transform:translateX(0);opacity:1}}@keyframes fadeInRight{0%{transform:translateX(40px);opacity:0}100%{transform:translateX(0);opacity:1}}@-webkit-keyframes fadeInUp{0%{-webkit-transform:translateY(20px);opacity:0}100%{-webkit-transform:translateY(0);opacity:1}}@-moz-keyframes fadeInUp{0%{-moz-transform:translateY(20px);opacity:0}100%{-moz-transform:translateY(0);opacity:1}}@-o-keyframes fadeInUp{0%{-o-transform:translateY(20px);opacity:0}100%{-o-transform:translateY(0);opacity:1}}@keyframes fadeInUp{0%{transform:translateY(20px);opacity:0}100%{transform:translateY(0);opacity:1}}@-webkit-keyframes fadeInDown{0%{-webkit-transform:translateY(-20px);opacity:0}100%{-webkit-transform:translateY(0);opacity:1}}@-moz-keyframes fadeInDown{0%{-moz-transform:translateY(-20px);opacity:0}100%{-moz-transform:translateY(0);opacity:1}}@-o-keyframes fadeInDown{0%{-o-transform:translateY(-20px);opacity:0}100%{-o-transform:translateY(0);opacity:1}}@keyframes fadeInDown{0%{transform:translateY(-20px);opacity:0}100%{transform:translateY(0);opacity:1}}@-webkit-keyframes fadeOut{0%{opacity:1.0}50%{opacity:0.5}100%{opacity:0.0}}@-moz-keyframes fadeOut{0%{opacity:1.0}50%{opacity:0.5}100%{opacity:0.0}}@-o-keyframes fadeOut{0%{opacity:1.0}50%{opacity:0.5}100%{opacity:0.0}}@keyframes fadeOut{0%{opacity:1.0}50%{opacity:0.5}100%{opacity:0.0}}@-webkit-keyframes slideInLeft{0%{-webkit-transform:translateX(-4000px);opacity:0}100%{-webkit-transform:translateX(0)}}@-moz-keyframes slideInLeft{0%{-moz-transform:translateX(-4000px);opacity:0}100%{-moz-transform:translateX(0)}}@-o-keyframes slideInLeft{0%{-o-transform:translateX(-4000px);opacity:0}100%{-o-transform:translateX(0)}}@keyframes slideInLeft{0%{transform:translateX(-4000px);opacity:0}100%{transform:translateX(0)}}@-webkit-keyframes slideInRight{0%{-webkit-transform:translateX(4000px);opacity:0}100%{-webkit-transform:translateX(0)}}@-moz-keyframes slideInRight{0%{-moz-transform:translateX(4000px);opacity:0}100%{-moz-transform:translateX(0)}}@-o-keyframes slideInRight{0%{-o-transform:translateX(4000px);opacity:0}100%{-o-transform:translateX(0)}}@keyframes slideInRight{0%{transform:translateX(4000px);opacity:0}100%{transform:translateX(0)}}@-webkit-keyframes slideInDown{0%{-webkit-transform:translateY(-4000px);opacity:0}100%{-webkit-transform:translateY(0)}}@-moz-keyframes slideInDown{0%{-moz-transform:translateY(-4000px);opacity:0}100%{-moz-transform:translateY(0)}}@-o-keyframes slideInDown{0%{-o-transform:translateY(-4000px);opacity:0}100%{-o-transform:translateY(0)}}@keyframes slideInDown{0%{transform:translateY(-4000px);opacity:0}100%{transform:translateY(0)}}@-webkit-keyframes slideInUp{0%{-webkit-transform:translateY(4000px);opacity:0}100%{-webkit-transform:translateY(0)}}@-moz-keyframes slideInUp{0%{-moz-transform:translateY(4000px);opacity:0}100%{-moz-transform:translateY(0)}}@-o-keyframes slideInUp{0%{-o-transform:translateY(4000px);opacity:0}100%{-o-transform:translateY(0)}}@keyframes slideInUp{0%{transform:translateY(4000px);opacity:0}100%{transform:translateY(0)}}@-webkit-keyframes slideOutLeft{0%{-webkit-transform:translateX(0)}100%{-webkit-transform:translateX(-4000px);opacity:0}}@-moz-keyframes slideOutLeft{0%{-moz-transform:translateX(0)}100%{-moz-transform:translateX(-4000px);opacity:0}}@-o-keyframes slideOutLeft{0%{-o-transform:translateX(0)}100%{-o-transform:translateX(-4000px);opacity:0}}@keyframes slideOutLeft{0%{transform:translateX(0)}100%{transform:translateX(-4000px);opacity:0}}@-webkit-keyframes slideOutRight{0%{-webkit-transform:translateX(0)}100%{-webkit-transform:translateX(4000px);opacity:0}}@-moz-keyframes slideOutRight{0%{-moz-transform:translateX(0)}100%{-moz-transform:translateX(4000px);opacity:0}}@-o-keyframes slideOutRight{0%{-o-transform:translateX(0)}100%{-o-transform:translateX(4000px);opacity:0}}@keyframes slideOutRight{0%{transform:translateX(0)}100%{transform:translateX(4000px);opacity:0}}@-webkit-keyframes slideOutUp{0%{-webkit-transform:translateY(0)}100%{-webkit-transform:translateY(-4000px);opacity:0}}@-moz-keyframes slideOutUp{0%{-moz-transform:translateY(0)}100%{-moz-transform:translateY(-4000px);opacity:0}}@-o-keyframes slideOutUp{0%{-o-transform:translateY(0)}100%{-o-transform:translateY(-4000px);opacity:0}}@keyframes slideOutUp{0%{transform:translateY(0)}100%{transform:translateY(-4000px);opacity:0}}@-webkit-keyframes rotateUp{0%{-webkit-transform:rotate(0deg)}50%{-webkit-transform:rotate(-90deg)}100%{-webkit-transform:rotate(-180deg)}}@-moz-keyframes rotateUp{0%{-moz-transform:rotate(0deg)}50%{-moz-transform:rotate(-90deg)}100%{-moz-transform:rotate(-180deg)}}@-o-keyframes rotateUp{0%{-o-transform:rotate(0deg)}50%{-o-transform:rotate(-90deg)}100%{-o-transform:rotate(-180deg)}}@keyframes rotateUp{0%{transform:rotate(0deg)}50%{transform:rotate(-90deg)}100%{transform:rotate(-180deg)}}@-webkit-keyframes rotateDown{0%{-webkit-transform:rotate(0deg)}50%{-webkit-transform:rotate(90deg)}100%{-webkit-transform:rotate(180deg)}}@-moz-keyframes rotateDown{0%{-moz-transform:rotate(0deg)}50%{-moz-transform:rotate(90deg)}100%{-moz-transform:rotate(180deg)}}@-o-keyframes rotateDown{0%{-o-transform:rotate(0deg)}50%{-o-transform:rotate(90deg)}100%{-o-transform:rotate(180deg)}}@keyframes rotateDown{0%{transform:rotate(0deg)}50%{transform:rotate(90deg)}100%{transform:rotate(180deg)}}@-webkit-keyframes rotateCW{0%{-webkit-transform:rotate(0deg)}50%{-webkit-transform:rotate(180deg)}100%{-webkit-transform:rotate(360deg)}}@-moz-keyframes rotateCW{0%{-moz-transform:rotate(0deg)}50%{-moz-transform:rotate(180deg)}100%{-moz-transform:rotate(360deg)}}@-o-keyframes rotateCW{0%{-o-transform:rotate(0deg)}50%{-o-transform:rotate(180deg)}100%{-o-transform:rotate(360deg)}}@keyframes rotateCW{0%{transform:rotate(0deg)}50%{transform:rotate(180deg)}100%{transform:rotate(360deg)}}@-webkit-keyframes rotateCCW{0%{-webkit-transform:rotate(0deg)}50%{-webkit-transform:rotate(-180deg)}100%{-webkit-transform:rotate(-360deg)}}@-moz-keyframes rotateCCW{0%{-moz-transform:rotate(0deg)}50%{-moz-transform:rotate(-180deg)}100%{-moz-transform:rotate(-360deg)}}@-o-keyframes rotateCCW{0%{-o-transform:rotate(0deg)}50%{-o-transform:rotate(-180deg)}100%{-o-transform:rotate(-360deg)}}@keyframes rotateCCW{0%{transform:rotate(0deg)}50%{transform:rotate(-180deg)}100%{transform:rotate(-360deg)}}@-webkit-keyframes bounceIn{0%{opacity:0.0;-webkit-transform:scale(0.3)}50%{opacity:1.0;-webkit-transform:scale(1.05)}100%{-webkit-transform:scale(1)}}@-moz-keyframes bounceIn{0%{opacity:0.0;-moz-transform:scale(0.3)}50%{opacity:1.0;-moz-transform:scale(1.05)}100%{-moz-transform:scale(1)}}@-o-keyframes bounceIn{0%{opacity:0.0;-o-transform:scale(0.3)}50%{opacity:1.0;-o-transform:scale(1.05)}100%{-o-transform:scale(1)}}@keyframes bounceIn{0%{opacity:0.0;transform:scale(0.3)}50%{opacity:1.0;transform:scale(1.05)}100%{transform:scale(1)}}@-webkit-keyframes bounceOut{0%{-webkit-transform:scale(1)}50%{opacity:1.0;-webkit-transform:scale(1.05)}100%{opacity:0.0;-webkit-transform:scale(0.3)}}@-moz-keyframes bounceOut{0%{-moz-transform:scale(1)}50%{opacity:1.0;-moz-transform:scale(1.05)}100%{opacity:0.0;-moz-transform:scale(0.3)}}@-o-keyframes bounceOut{0%{-o-transform:scale(1)}50%{opacity:1.0;-o-transform:scale(1.05)}100%{opacity:0.0;-o-transform:scale(0.3)}}@keyframes bounceOut{0%{transform:scale(1)}50%{opacity:1.0;transform:scale(1.05)}100%{opacity:0.0;transform:scale(0.3)}}.wrapper--xblock{overflow-y:scroll;font-size:62.5%;background:#f5f5f5}[class^="wrapper-"]{padding:0}.wrapper--xblock div,.wrapper--xblock span,.wrapper--xblock applet,.wrapper--xblock object,.wrapper--xblock iframe,.wrapper--xblock h1,.wrapper--xblock h2,.wrapper--xblock h3,.wrapper--xblock h4,.wrapper--xblock h5,.wrapper--xblock h6,.wrapper--xblock p,.wrapper--xblock blockquote,.wrapper--xblock pre,.wrapper--xblock a,.wrapper--xblock abbr,.wrapper--xblock acronym,.wrapper--xblock address,.wrapper--xblock big,.wrapper--xblock cite,.wrapper--xblock code,.wrapper--xblock del,.wrapper--xblock dfn,.wrapper--xblock em,.wrapper--xblock img,.wrapper--xblock ins,.wrapper--xblock kbd,.wrapper--xblock q,.wrapper--xblock s,.wrapper--xblock samp,.wrapper--xblock small,.wrapper--xblock strike,.wrapper--xblock strong,.wrapper--xblock sub,.wrapper--xblock sup,.wrapper--xblock tt,.wrapper--xblock var,.wrapper--xblock b,.wrapper--xblock u,.wrapper--xblock i,.wrapper--xblock center,.wrapper--xblock dl,.wrapper--xblock dt,.wrapper--xblock dd,.wrapper--xblock ol,.wrapper--xblock ul,.wrapper--xblock li,.wrapper--xblock fieldset,.wrapper--xblock form,.wrapper--xblock label,.wrapper--xblock legend,.wrapper--xblock table,.wrapper--xblock caption,.wrapper--xblock tbody,.wrapper--xblock tfoot,.wrapper--xblock thead,.wrapper--xblock tr,.wrapper--xblock th,.wrapper--xblock td,.wrapper--xblock article,.wrapper--xblock aside,.wrapper--xblock canvas,.wrapper--xblock details,.wrapper--xblock figcaption,.wrapper--xblock figure,.wrapper--xblock footer,.wrapper--xblock header,.wrapper--xblock hgroup,.wrapper--xblock menu,.wrapper--xblock nav,.wrapper--xblock section,.wrapper--xblock summary,.wrapper--xblock time,.wrapper--xblock mark,.wrapper--xblock audio,.wrapper--xblock video{font-weight:400}.wrapper--xblock strong{font-weight:600}
}
.openassessment_block textarea {
width: 80%;
height: 30%;
}
.openassessment_response_status_block {
background-color: white;
border: 4px solid black;
display: none;
position: absolute;
left: 75;
top: 75;
z-index: 100;
}
.openassessment_response_status_block p {
font-weight: bold;
font-size: xx-large;
}
.openassessment_response_status_block .clickhere {
font-size: small;
color: black;
font-weight: normal;
text-align: center;
}
.openassessment_response_status_block .success {
color: green;
}
.openassessment_response_status_block .failure {
color: red;
}
.clickhere_span {
font-size: small;
font-weight: normal;
}
/* END CSS for OpenAssessmentBlock */
apps/openassessment/xblock/static/sass/main.scss deleted 100644 → 0
// xblock: openassessment - main style compile
// ====================
// app: libraries and resets
// --------------------
@import 'utilities/bourbon/bourbon'; // http://bourbon.io
@import 'utilities/neat/neat'; // http://neat.bourbon.io
@import 'libs/font-awesome/font-awesome'; // http://fontawesome.io/
@import 'libs/normalize'; // http://necolas.github.io/normalize.css/
// app: utilities and assets
// --------------------
// utilities
@import 'utilities/variables'; // settings/values/placeholders
@import 'utilities/mixins'; // mixins and functions
@import 'utilities/extends'; // re-usable extends, placeholders, archetypes
// assets
@import 'assets/fonts'; // imported/used fonts
@import 'assets/graphics'; // sprites, basic img/figure/svg styling
@import 'assets/animations'; // css-based animations
// theme: utilities and assets
// --------------------
@import 'themes/edx/utilities'; // theme-based utilities (variables, mixins, extends)
@import 'themes/edx/assets'; // default theme by default
// app: general, elements, and views
// --------------------
// elements
@import 'elements/base'; // basic styles
@import 'elements/typography'; // font sizes/scale and applied/canned definitions
@import 'elements/controls'; // buttons, link styles, sliders, etc.
@import 'elements/header'; // view/app headers
@import 'elements/footer'; // view/app footers
@import 'elements/navigation'; // navigation sets
@import 'elements/forms'; // form elements
// app: specific views
@import 'views/resume'; // resume
// app: contextual
@import 'contexts/print'; // basic print styling
@import 'contexts/ie'; // ie-specific styling
// app: misc.
@import 'utilities/shame'; // shame file - used for any bad-form/orphaned css
// theme: general, elements, views, and contexts
// --------------------
@import 'themes/edx/base';
@import 'themes/edx/elements';
@import 'themes/edx/views';
@import 'themes/edx/contexts';
apps/openassessment/xblock/static/sass/oa/contexts/_ie.scss 0 → 100644
// openassessment: contexts - internet explorer
// ====================
// NOTES:
// * any openassessment-specific suport-based styling needed for internet explorer should be placed here
// --------------------
// CASE: less than or equal to IE9
// --------------------
.lte9 {
}
// --------------------
// CASE: less than or equal to IE8
// --------------------
.lte8 {
}
// --------------------
// CASE: less than or equal to IE7
// --------------------
.lte7 {
}
apps/openassessment/xblock/static/sass/oa/contexts/_lms.scss 0 → 100644
// openassessment: contexts - lms UI
// ====================
// NOTES:
// * any openassessment-specific suport-based styling needed for the xblock rendering in edX's LMS should be placed here
// --------------------
// CASE: less than or equal to IE9
// --------------------
.is--in-edxlms {
}
apps/openassessment/xblock/static/sass/oa/elements/_footer.scss 0 → 100644
// openassessment: elements - footer
// ====================
// NOTES:
// * The grade/status portion of the openassessment UI
apps/openassessment/xblock/static/sass/oa/elements/_header.scss 0 → 100644
// openassessment: elements - header
// ====================
// NOTES:
// * The prompt/status portion of the openassessment UI
apps/openassessment/xblock/static/sass/oa/elements/_layout.scss 0 → 100644
// openassessment: elements - layouts
// ====================
// NOTES:
// * Grid and common page layout rules
// * any manual layout breakpoints for ORA (a la shirt sizes - s,m,l,xl) - needed since media queries of UI xblocks are contained in don't give enough context
apps/openassessment/xblock/static/sass/oa/elements/_navigation.scss 0 → 100644
// openassessment: elements - navigation
// ====================
// NOTES:
// * openassessment-specific navigation UI
apps/openassessment/xblock/static/sass/oa/utilities/_developer.scss 0 → 100644
// openassessment: utilities - developer
// ====================
// NOTES:
// * use this area for any developer-needed or created styling that needs to be refactored into patterns or visually polished. Please list any template/view that your styles reference when definining them (example below):
// --------------------
// Views: Error
// --------------------
// .crazy-new-feature {
// background: transparent;
// }
apps/openassessment/xblock/static/sass/oa/utilities/_shame.scss 0 → 100644
// openassessment: utilities - shame
// ====================
// NOTES: use for any bad-form/orphaned scss that knowingly violate edX FED architecture/standards (see - http://csswizardry.com/2013/04/shame-css)
apps/openassessment/xblock/static/sass/oa/utilities/_variables.scss 0 → 100644
// openassessment: utilities - variables
// ====================
// NOTES:
// * these are openassessment-specific variable files
apps/openassessment/xblock/static/sass/oa/views/_oa-base.scss 0 → 100644
// openassessment: views - base
// ====================
// NOTES:
// * The basic view and all of its states of the openassessment xblock
apps/openassessment/xblock/static/sass/openassessment.scss 0 → 100644
// xblock: openassessment - main style compile
// ====================
// NOTES:
// * this Sass compiles into the static CSS needed for the openassessment xblock
// * Sass partials that can be re-used are organized in the "xb/" directory and listed in "general xblock" segments
// * theme-based Sass partials are noted by "theme - [theme name]" in the import order to override defaults
// * openassessment-specific styles are collected within the "oa/" directory and listed in "app -" segment
// * openassessment-based layouts are sized like media-query breakpoints, but will be applied by specific classes/variables
// * the system/app digesting this xblock will control general page layout and overall screensize-based breakpoints
// --------------------
// KNOWN ISSUES/CONCERNS:
// * manual syncing of a view's breakpoints/layout with openassessment's sizes is needed on a system/app basis
// * the system/app ingesting this xblock may have conflicts/redundancies/versioning issues with the utilities used
// --------------------
// general - xblocks:
// shared utilities, assets and set up
// --------------------
// xblocks: libraries and resets
@import 'xb/libs/bourbon/bourbon'; // general sass utility (http://bourbon.io)
@import 'xb/libs/neat/neat'; // responsive grid utility (http://neat.bourbon.io)
@import 'xb/libs/font-awesome/font-awesome'; // font-based icons (http://fontawesome.io/)
// xblocks: utilities
@import 'xb/utilities/reset'; // xblocks-based reset
@import 'xb/utilities/variables'; // default settings and values
@import 'xb/utilities/mixins'; // mixins and functions
@import 'xb/utilities/extends'; // re-usable extends, placeholders, archetypes
// general xblocks: assets
@import 'xb/assets/fonts'; // imported/used fonts
@import 'xb/assets/graphics'; // sprites, basic img/figure/svg styling
@import 'xb/assets/animations'; // css-based animations
// --------------------
// theme - edx:
// utilities and assets (needed in this order to override xb variables)
// --------------------
@import 'themes/edx/utilities'; // theme-based utilities (variables, mixins, extends)
@import 'themes/edx/assets'; // theme-based assets (fonts, graphics/sprites, animations)
// --------------------
// general - xblock:
// shared base type, controls, and UI elements
// --------------------
// xblock: elements
@import 'xb/elements/base'; // basic styles
@import 'xb/elements/typography'; // font sizes/scale and applied/canned definitions
@import 'xb/elements/controls'; // buttons, link styles, sliders, etc.
@import 'xb/elements/forms'; // form elements
// xblock: contextual
@import 'xb/contexts/ie'; // Internet Explorer-specific styling
// --------------------
// theme - edx:
// elements, views, and contexts (needed in this order to override xb)
// --------------------
@import 'themes/edx/base';
@import 'themes/edx/elements';
// --------------------
// app - openassessment:
// specific UI for this application
// --------------------
@import 'oa/utilities/variables'; // specific variables and overrides
@import 'oa/elements/header'; // view/app headers
@import 'oa/elements/footer'; // view/app footers
@import 'oa/elements/navigation'; // navigation sets
@import 'oa/elements/layout'; // applied layouts and deliberate class-based breakpoints
@import 'oa/views/oa-base'; // open assessment base view
// openassessment: contextual
@import 'oa/contexts/ie'; // open assessment-specific Internet Explorer-specific styling
@import 'oa/contexts/lms'; // open assessment-specific LMS constraints
// openassessment: misc.
@import 'oa/utilities/developer'; // developer-friendly file: add rough/WIP styling that needs UI triage
@import 'oa/utilities/shame'; // used for any bad-form/orphaned css/clean up code needed
apps/openassessment/xblock/static/sass/themes/edx/_assets.scss 0 → 100644
// edX theme: assets
// ====================
// NOTES:
// * This is where any edX-theme related assets (fonts, graphics/sprites, and animations) are defined
// --------------------
// font: Open Sans - http://www.google.com/fonts/specimen/Open+Sans
// --------------------
@import url(//fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,400,300,600,700);
// --------------------
// EXAMPLE: image - edX logo
// --------------------
// $logo--edx: '../images/logo--edx.png';
apps/openassessment/xblock/static/sass/themes/edx/_base.scss 0 → 100644
// edX theme: base
// ====================
// NOTES:
// * This is where any edX-theme related base styling is defined
apps/openassessment/xblock/static/sass/themes/edx/_elements.scss 0 → 100644
// edX theme: elements
// ====================
// NOTES:
// * This is where any edX-theme related element styling or overrides are included
apps/openassessment/xblock/static/sass/themes/edx/_utilities.scss 0 → 100644
// edX theme: utilities
// ====================
// NOTES:
// * This is where any edX-theme related utilities (variables, mixins, extends) are defined or override previously defined elements
// --------------------
// variables: new
// --------------------
$edx-blue: rgb(58, 162, 224);
$edx-blue-l1: tint($edx-blue,20%);
$edx-blue-l2: tint($edx-blue,40%);
$edx-blue-l3: tint($edx-blue,60%);
$edx-blue-l4: tint($edx-blue,80%);
$edx-blue-l5: tint($edx-blue,90%);
$edx-blue-d1: shade($edx-blue,20%);
$edx-blue-d2: shade($edx-blue,40%);
$edx-blue-d3: shade($edx-blue,60%);
$edx-blue-d4: shade($edx-blue,80%);
$edx-blue-d5: shade($edx-blue,90%);
$edx-blue-s1: saturate($edx-blue,15%);
$edx-blue-s2: saturate($edx-blue,30%);
$edx-blue-s3: saturate($edx-blue,45%);
$edx-blue-u1: desaturate($edx-blue,15%);
$edx-blue-u2: desaturate($edx-blue,30%);
$edx-blue-u3: desaturate($edx-blue,45%);
$edx-blue-t0: rgba($edx-blue,0.125);
$edx-blue-t1: rgba($edx-blue,0.25);
$edx-blue-t2: rgba($edx-blue,0.50);
$edx-blue-t3: rgba($edx-blue,0.75);
$edx-pink: rgb(182,37,104);
$edx-pink-l1: tint($edx-pink,20%);
$edx-pink-l2: tint($edx-pink,40%);
$edx-pink-l3: tint($edx-pink,60%);
$edx-pink-l4: tint($edx-pink,80%);
$edx-pink-l5: tint($edx-pink,90%);
$edx-pink-d1: shade($edx-pink,20%);
$edx-pink-d2: shade($edx-pink,40%);
$edx-pink-d3: shade($edx-pink,60%);
$edx-pink-d4: shade($edx-pink,80%);
$edx-pink-d5: shade($edx-pink,90%);
$edx-pink-s1: saturate($edx-pink,15%);
$edx-pink-s2: saturate($edx-pink,30%);
$edx-pink-s3: saturate($edx-pink,45%);
$edx-pink-u1: desaturate($edx-pink,15%);
$edx-pink-u2: desaturate($edx-pink,30%);
$edx-pink-u3: desaturate($edx-pink,45%);
$edx-pink-t0: rgba($edx-pink,0.125);
$edx-pink-t1: rgba($edx-pink,0.25);
$edx-pink-t2: rgba($edx-pink,0.50);
$edx-pink-t3: rgba($edx-pink,0.75);
// --------------------
// variables: overrides
// --------------------
// application - fonts
$f-serif: 'PT Serif', Cambria, Georgia, 'Times New Roman', Times, serif;
$f-sans-serif: 'Open Sans','Helvetica Neue', Helvetica, Arial, sans-serif;
// application - colors
$color-primary: $edx-blue-d1;
$color-secondary: $edx-blue-l1;
$color-tertiary: $gray-l1;
$color-quarternary: $gray-l2;
// application - colors: decorative
$decorative__color-primary: $edx-blue-u1;
$decorative__color-secondary: $edx-pink-l2;
// application - colors: copy and headings
$heading-color: $gray-d3;
$heading-primary-color: $black;
$heading-secondary-color: $gray;
$heading-tertiary-color: $gray-l4;
$copy-color: $gray-l2;
$copy-color-alt: $gray-d1;
$copy-color-focus: $gray-d4;
$copy-lead__color: $gray;
$copy-lead__color: $gray-d1;
$copy-lead__color-focus: $gray-d4;
$copy-supplemental-color: $gray-l2;
$copy-supplemental-color-alt: $gray-l2;
$copy-supplemental-color-focus: $gray-d1;
// application - colors:states
$selected-bg: $edx-blue-t1;
$selected-color: $edx-blue-s1;
// application - colors: view-based elements
$bg-view: $gray-l6;
$bg-header-main: $white;
$color-header-main: $black;
$bg-content: $gray-l6;
$color-content: $gray-d1;
$bg-content-main: $gray-l5;
$color-content-main: $gray-d1;
// application - colors: view-based elements
$bg-view: $gray-l6;
$bg-content: $white;
// --------------------
// mixins:
// --------------------
// --------------------
// extends:
// --------------------
apps/openassessment/xblock/static/sass/xb/assets/_animations.scss 0 → 100644
// xblock: assets - animations
// ====================
// NOTES:
// * these are bourbon-translated animations that can be used on any xblock
// --------------------
// fade in
// --------------------
@include keyframes(fadeIn) {
0% {
opacity: 0.0;
}
50% {
opacity: 0.5;
}
100% {
opacity: 1.0;
}
}
// canned animation - use if you want out of the box/non-customized anim
%anim-fadeIn {
@include animation(fadeIn $tmg-f2 linear 1);
}
// --------------------
// fade in + left
// --------------------
@include keyframes(fadeInLeft) {
0% {
@include transform(translateX(-($baseline-h)));
opacity: 0;
}
100% {
@include transform(translateX(0));
opacity: 1;
}
}
// canned animation - use if you want out of the box/non-customized anim
%anim-fadeInLeft {
@include animation(fadeInLeft $tmg-f2 linear 1);
}
// --------------------
// fade in + right
// --------------------
@include keyframes(fadeInRight) {
0% {
@include transform(translateX($baseline-h));
opacity: 0;
}
100% {
@include transform(translateX(0));
opacity: 1;
}
}
// canned animation - use if you want out of the box/non-customized anim
%anim-fadeInRight {
@include animation(fadeInRight $tmg-f2 linear 1);
}
// --------------------
// fade in + up
// --------------------
@include keyframes(fadeInUp) {
0% {
@include transform(translateY($baseline-v));
opacity: 0;
}
100% {
@include transform(translateY(0));
opacity: 1;
}
}
// canned animation - use if you want out of the box/non-customized anim
%anim-fadeInUp {
@include animation(fadeInUp $tmg-f2 linear 1);
}
// --------------------
// fade in + down
// --------------------
@include keyframes(fadeInDown) {
0% {
@include transform(translateY(-($baseline-v)));
opacity: 0;
}
100% {
@include transform(translateY(0));
opacity: 1;
}
}
// canned animation - use if you want out of the box/non-customized anim
%anim-fadeInDown {
@include animation(fadeInDown $tmg-f2 linear 1);
}
// --------------------
// fade out
// --------------------
@include keyframes(fadeOut) {
0% {
opacity: 1.0;
}
50% {
opacity: 0.5;
}
100% {
opacity: 0.0;
}
}
// canned animation - use if you want out of the box/non-customized anim
%anim-fadeOut {
@include animation(fadeOut $tmg-f2 linear 1);
}
// --------------------
// slide in left
// --------------------
@include keyframes(slideInLeft) {
0% {
@include transform(translateX(-($anim-distance-offviewport)));
opacity: 0;
}
100% {
@include transform(translateX(0));
}
}
// canned animation - use if you want out of the box/non-customized anim
%anim-slideInLeft {
@include animation(slideInLeft $tmg-f2 linear 1);
}
// --------------------
// slide in right
// --------------------
@include keyframes(slideInRight) {
0% {
@include transform(translateX($anim-distance-offviewport));
opacity: 0;
}
100% {
@include transform(translateX(0));
}
}
// canned animation - use if you want out of the box/non-customized anim
%anim-slideInRight {
@include animation(slideInRight $tmg-f2 linear 1);
}
// --------------------
// slide in down
// --------------------
@include keyframes(slideInDown) {
0% {
@include transform(translateY(-($anim-distance-offviewport)));
opacity: 0;
}
100% {
@include transform(translateY(0));
}
}
// canned animation - use if you want out of the box/non-customized anim
%anim-slideInDown {
@include animation(slideInDown $tmg-f2 linear 1);
}
// --------------------
// slide in up
// --------------------
@include keyframes(slideInUp) {
0% {
@include transform(translateY($anim-distance-offviewport));
opacity: 0;
}
100% {
@include transform(translateY(0));
}
}
// canned animation - use if you want out of the box/non-customized anim
%anim-slideInUp {
@include animation(slideInUp $tmg-f2 linear 1);
}
// --------------------
// slide out left
// --------------------
@include keyframes(slideOutLeft) {
0% {
@include transform(translateX(0));
}
100% {
@include transform(translateX(-($anim-distance-offviewport)));
opacity: 0;
}
}
// canned animation - use if you want out of the box/non-customized anim
%anim-slideOutLeft {
@include animation(slideOutLeft $tmg-f2 linear 1);
}
// --------------------
// slide out right
// --------------------
@include keyframes(slideOutRight) {
0% {
@include transform(translateX(0));
}
100% {
@include transform(translateX($anim-distance-offviewport));
opacity: 0;
}
}
// canned animation - use if you want out of the box/non-customized anim
%anim-slideOutRight {
@include animation(slideOutRight $tmg-f2 linear 1);
}
// --------------------
// slide out up
// --------------------
@include keyframes(slideOutUp) {
0% {
@include transform(translateY(0));
}
100% {
@include transform(translateY(-($anim-distance-offviewport)));
opacity: 0;
}
}
// canned animation - use if you want out of the box/non-customized anim
%anim-slideOutUp {
@include animation(slideOutUp $tmg-f2 linear 1);
}
// --------------------
// rotate up
// --------------------
@include keyframes(rotateUp) {
0% {
@include transform(rotate(0deg));
}
50% {
@include transform(rotate(-90deg));
}
100% {
@include transform(rotate(-180deg));
}
}
// canned animation - use if you want out of the box/non-customized anim
%anim-rotateUp {
@include animation(rotateUp $tmg-f2 ease-in-out 1);
}
// --------------------
// rotate down
// --------------------
@include keyframes(rotateDown) {
0% {
@include transform(rotate(0deg));
}
50% {
@include transform(rotate(90deg));
}
100% {
@include transform(rotate(180deg));
}
}
// canned animation - use if you want out of the box/non-customized anim
%anim-rotateDown {
@include animation(rotateDown $tmg-f2 ease-in-out 1);
}
// --------------------
// rotate clockwise
// --------------------
@include keyframes(rotateCW) {
0% {
@include transform(rotate(0deg));
}
50% {
@include transform(rotate(180deg));
}
100% {
@include transform(rotate(360deg));
}
}
// canned animation - use if you want out of the box/non-customized anim
%anim-rotateCW {
@include animation(rotateCW $tmg-s1 linear infinite);
}
// --------------------
// rotate counter-clockwise
// --------------------
@include keyframes(rotateCCW) {
0% {
@include transform(rotate(0deg));
}
50% {
@include transform(rotate(-180deg));
}
100% {
@include transform(rotate(-360deg));
}
}
// canned animation - use if you want out of the box/non-customized anim
%anim-rotateCCW {
@include animation(rotateCCW $tmg-s1 linear infinite);
}
// --------------------
// bounce in
// --------------------
@include keyframes(bounceIn) {
0% {
opacity: 0.0;
@include transform(scale(0.3));
}
50% {
opacity: 1.0;
@include transform(scale(1.05));
}
100% {
@include transform(scale(1));
}
}
// canned animation - use if you want out of the box/non-customized anim
%anim-bounceIn {
@include animation(bounceIn $tmg-f1 ease-in-out 1);
}
// --------------------
// bounce out
// --------------------
@include keyframes(bounceOut) {
0% {
@include transform(scale(1));
}
50% {
opacity: 1.0;
@include transform(scale(1.05));
}
100% {
opacity: 0.0;
@include transform(scale(0.3));
}
}
// canned animation - use if you want out of the box/non-customized anim
%anim-bounceOut {
@include animation(bounceOut $tmg-f1 ease-in-out 1);
}
apps/openassessment/xblock/static/sass/xb/assets/_fonts.scss 0 → 100644
// xblock: assets - fonts
// ====================
// NOTES:
// * use this area to load external font/typography assets or reference any bundled with xblocks
// --------------------
// EXAMPLE: Google webfonts import
// --------------------
// import from google fonts - Lato (http://www.google.com/fonts/specimen/Lato)
// @import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);
apps/openassessment/xblock/static/sass/xb/assets/_graphics.scss 0 → 100644
// xblock: assets - graphics
// ====================
// NOTES:
// * this is where any rasterized graphics/sprites are defined as well as where images/visual media are styled
// --------------------
// EXAMPLE: image
// --------------------
// $logo--app: '../images/logo--app.png';
apps/openassessment/xblock/static/sass/xb/contexts/_ie.scss 0 → 100644
// xblock: contexts - internet explorer
// ====================
// NOTES:
// * any x-block-specific support-based styling needed for internet explorer should be placed here
// --------------------
// CASE: less than or equal to IE9
// --------------------
.lte9 {
}
// --------------------
// CASE: less than or equal to IE8
// --------------------
.lte8 {
}
// --------------------
// CASE: less than or equal to IE7
// --------------------
.lte7 {
}
apps/openassessment/xblock/static/sass/xb/elements/_base.scss 0 → 100644
// xblock: elements - base
// ====================
// NOTES:
// * all base set-up styles that can be applied to any xblock
// --------------------
// fonts
// --------------------
.wrapper--xblock {
@extend %t-copy-base;
overflow-y: scroll;
font-size: 62.5%;
background: $bg-view;
}
// --------------------
// layout
// --------------------
[class^="wrapper-"] {
@extend %wrapper;
padding: 0;
}
// --------------------
// semantic dividers
// --------------------
.sr, hr.divider {
@extend %ui-text-sr;
}
// --------------------
// semantic lists used for UI
// --------------------
.list--actions,
.list--docs,
.list--steps,
.list--controls,
.list--fields,
.list--help,
.nav--wizard,
.list--tips,
.field--group {
@extend %ui-no-list;
@extend %wipe-last-child;
}
apps/openassessment/xblock/static/sass/xb/elements/_controls.scss 0 → 100644
// xblock: elements - controls
// ====================
// NOTES:
// * all UI-based controls that can be extends in any xlbock
// --------------------
// links
// --------------------
// links - copy
%link-copy {
@include transition(color $tmg-f1 ease-in-out, border $tmg-f1 ease-in-out);
border-bottom: 1px solid transparent;
color: $action-primary-color;
text-decoration: none;
&:hover, &:focus {
color: $action-primary-color-focus;
border-color: $action-primary-color-focus;
}
&:active, &.is--current {
color: $action-primary-color-active;
border-color: $action-primary-color-active;
}
}
// links - meta
%link-meta {
@include transition(color $tmg-f1 ease-in-out, border $tmg-f1 ease-in-out);
border-bottom: 1px solid transparent;
color: $action-secondary-color;
text-decoration: none;
&:hover, &:focus {
color: $action-secondary-color-focus;
border-color: $action-secondary-color-focus;
}
&:active, &.is--current {
color: $action-secondary-color-active;
border-color: $action-secondary-color-active;
}
}
// links - page nav
%link-nav-page {
@include transition(color $tmg-f1 ease-in-out, border $tmg-f1 ease-in-out);
display: block;
border-right: 1px solid solid $gray-l5;
padding: ($baseline-v/2) ($baseline-h/4);
color: $gray-l3;
font-family: $f-action;
text-decoration: none;
&:hover, &:active {
border-left-color: $action-secondary-color-focus;
color: $action-secondary-color-focus;
}
}
// --------------------
// buttons
// --------------------
// buttons - archetypes
%btn {
@include box-sizing(border-box);
@include transition(color 0.25s ease-in-out, background 0.25s ease-in-out, box-shadow 0.25s ease-in-out);
display: inline-block;
cursor: pointer;
text-decoration: none;
&:hover, &:active, &:focus {
text-decoration: none;
}
&.disabled, &[disabled] {
cursor: default;
pointer-events: none;
}
}
%btn-pill {
@extend %btn;
border-radius: $baseline-v/5;
}
%btn-rounded {
@extend %btn;
border-radius: ($baseline-v/2);
}
%btn-edged {
@extend %btn;
border-radius: ($baseline-v/10);
}
// buttons - primary
%btn--primary {
@extend %btn-edged;
@extend %t-weight3;
padding: ($baseline-v/2) ($baseline-h);
background: $action-primary-color;
border-color: saturate($action-primary-color, 15%);
color: tint($action-primary-color, 90%);
&:hover, &:active, &:focus {
background: $action-primary-color-focus;
border-color: $action-primary-color-focus;
color: tint($action-primary-color, 95%);
}
&.current, &.active {
background: $action-primary-color-active;
border-color: $action-primary-color-active;
&:hover, &:active, &:focus {
}
}
&.disabled, &.is-disabled, &[disabled] {
opacity: 0.5;
}
}
// buttons - secondary
%btn--secondary {
@extend %btn-edged;
@extend %t-weight3;
padding: ($baseline-v/2) ($baseline-h);
background: $action-secondary-color;
border-color: saturate($action-secondary-color, 15%);
color: tint($action-secondary-color, 90%);
&:hover, &:active, &:focus {
background: $action-secondary-color-focus;
border-color: $action-secondary-color-focus;
color: tint($action-secondary-color, 95%);
}
&.current, &.active {
background: $action-secondary-color-active;
border-color: $action-secondary-color-active;
&:hover, &:active, &:focus {
}
}
&.disabled, &.is-disabled, &[disabled] {
opacity: 0.5;
}
}
// buttons - tertiary
%btn--tertiary {
@extend %btn-edged;
@extend %t-weight3;
padding: ($baseline-v/2) ($baseline-h);
background: $action-tertiary-color;
border-color: saturate($action-tertiary-color, 15%);
color: tint($action-tertiary-color, 90%);
&:hover, &:active, &:focus {
background: $action-tertiary-color-focus;
border-color: $action-tertiary-color-focus;
color: tint($action-tertiary-color, 95%);
}
&.current, &.active {
background: $action-tertiary-color-active;
border-color: $action-tertiary-color-active;
&:hover, &:active, &:focus {
}
}
&.disabled, &.is-disabled, &[disabled] {
opacity: 0.5;
}
}
apps/openassessment/xblock/static/sass/xb/elements/_forms.scss 0 → 100644
// xblock: elements - forms
// ====================
// NOTES:
// * basic form element (fields, fieldsets/wrappers, actions, and states) styling for all xblocks
apps/openassessment/xblock/static/sass/xb/elements/_typography.scss 0 → 100644
// xblock: elements - typography
// ====================
// NOTES:
// * all typographical settings should be placed here for general xblocks use
// * typographical scale reference: 6, 7, 8, 9, 10, 11, 12, 14, 16, 18, 21, 24, 36, 48, 60, 72
// --------------------
// weight
// --------------------
%t-weight0 {
font-weight: 300;
}
%t-weight1 {
font-weight: 400;
}
%t-weight2 {
font-weight: 500;
}
%t-weight3 {
font-weight: 600;
}
%t-weight4 {
font-weight: 700;
}
// --------------------
// canned icon sizes
// --------------------
%t-icon-s {
@include font-size(12);
}
%t-icon-m {
@include font-size(16);
}
%t-icon-l {
@include font-size(24);
}
%t-icon-xl {
@include font-size(36);
}
// --------------------
// canned headings
// --------------------
%hd-alpha {
@include font-size(48);
@include lh(48);
@extend %t-weight4;
text-transform: uppercase;
font-family: $f-title;
letter-spacing: 0.50rem;
color: $heading-primary-color;
}
%hd-bravo {
@extend %t-weight2;
@include font-size(24);
@include lh(24);
margin: 0 0 ($baseline-v/4) 0;
font-family: $f-title;
color: $heading-primary-color;
}
%hd-charlie {
@extend %t-weight1;
@include font-size(18);
@include lh(18);
margin: 0 0 ($baseline-v/2) 0;
font-family: $f-title;
color: $heading-primary-color;
}
%hd-charlie-alt {
@extend %t-weight2;
@include font-size(18);
@include lh(18);
margin: 0 0 ($baseline-v/4) 0;
font-family: $f-title;
color: $heading-color;
}
%hd-delta {
@extend %t-weight1;
@include font-size(16);
@include lh(16);
margin: 0 0 ($baseline-v/2) 0;
text-transform: uppercase;
font-family: $f-title;
letter-spacing: 0.125rem;
color: $heading-tertiary-color;
}
%hd-epsilon {
@extend %t-weight1;
@include font-size(14);
@include lh(14);
font-family: $f-title;
color: $heading-secondary-color;
}
%hd-foxtrot {
@extend %t-weight1;
@include font-size(16);
@include lh(16);
margin: 0 0 ($baseline-v/10) 0;
font-family: $f-title;
color: $heading-secondary-color;
}
%hd-golf {
@extend %t-weight1;
@include font-size(14);
@include lh(14);
margin: 0 0 ($baseline-v/10) 0;
text-transform: uppercase;
font-family: $f-title;
letter-spacing: 0.25rem;
color: $heading-tertiary-color;
}
%hd-hotel {
@include font-size(24);
@include lh(24);
@extend %t-weight4;
text-transform: uppercase;
font-family: $f-title;
letter-spacing: 0.25rem;
color: $heading-tertiary-color;
}
// --------------------
// canned copy
// --------------------
%copy-base {
@extend %t-weight1;
@include font-size(16);
@include lh(16);
font-family: $f-copy;
color: $copy-color;
}
%copy-lead {
@extend %t-weight0;
@include font-size(24);
@include lh(24);
font-family: $f-copy;
color: $copy-color;
}
%copy-showcase {
@include font-size(18);
@include lh(18);
color: $copy-color;
font-family: $f-copy;
}
%copy-detail {
@include font-size(14);
@include lh(14);
font-family: $f-copy;
color: $copy-color;
}
%copy-metadata {
@include font-size(12);
@include lh(12);
font-family: $f-copy;
color: $copy-supplemental-color;
}
// --------------------
// canned actions
// --------------------
// --------------------
// visual emphasis
// --------------------
%emphasis {
font-style: normal;
}
%emphasis-alpha {
@extend %emphasis;
@extend %t-weight3;
}
%emphasis-bravo {
@extend %emphasis;
@extend %t-weight2;
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/_bourbon-deprecated-upcoming.scss 0 → 100644
//************************************************************************//
// These mixins/functions are deprecated
// They will be removed in the next MAJOR version release
//************************************************************************//
@mixin box-shadow ($shadows...) {
@include prefixer(box-shadow, $shadows, spec);
@warn "box-shadow is deprecated and will be removed in the next major version release";
}
@mixin background-size ($lengths...) {
@include prefixer(background-size, $lengths, spec);
@warn "background-size is deprecated and will be removed in the next major version release";
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/_bourbon.scss 0 → 100644
// Custom Helpers
@import "helpers/deprecated-webkit-gradient";
@import "helpers/gradient-positions-parser";
@import "helpers/linear-positions-parser";
@import "helpers/radial-arg-parser";
@import "helpers/radial-positions-parser";
@import "helpers/render-gradients";
@import "helpers/shape-size-stripper";
// Custom Functions
@import "functions/compact";
@import "functions/flex-grid";
@import "functions/grid-width";
@import "functions/linear-gradient";
@import "functions/modular-scale";
@import "functions/px-to-em";
@import "functions/radial-gradient";
@import "functions/tint-shade";
@import "functions/transition-property-name";
// CSS3 Mixins
@import "css3/animation";
@import "css3/appearance";
@import "css3/backface-visibility";
@import "css3/background";
@import "css3/background-image";
@import "css3/border-image";
@import "css3/border-radius";
@import "css3/box-sizing";
@import "css3/columns";
@import "css3/flex-box";
@import "css3/font-face";
@import "css3/hidpi-media-query";
@import "css3/image-rendering";
@import "css3/inline-block";
@import "css3/keyframes";
@import "css3/linear-gradient";
@import "css3/perspective";
@import "css3/radial-gradient";
@import "css3/transform";
@import "css3/transition";
@import "css3/user-select";
@import "css3/placeholder";
// Addons & other mixins
@import "addons/button";
@import "addons/clearfix";
@import "addons/font-family";
@import "addons/hide-text";
@import "addons/html5-input-types";
@import "addons/position";
@import "addons/prefixer";
@import "addons/retina-image";
@import "addons/size";
@import "addons/timing-functions";
@import "addons/triangle";
// Soon to be deprecated Mixins
@import "bourbon-deprecated-upcoming";
apps/openassessment/xblock/static/sass/xb/libs/bourbon/addons/_button.scss 0 → 100644
@mixin button ($style: simple, $base-color: #4294f0) {
@if type-of($style) == color {
$base-color: $style;
$style: simple;
}
// Grayscale button
@if $base-color == grayscale($base-color) {
@if $style == simple {
@include simple($base-color, $grayscale: true);
}
@else if $style == shiny {
@include shiny($base-color, $grayscale: true);
}
@else if $style == pill {
@include pill($base-color, $grayscale: true);
}
}
// Colored button
@else {
@if $style == simple {
@include simple($base-color);
}
@else if $style == shiny {
@include shiny($base-color);
}
@else if $style == pill {
@include pill($base-color);
}
}
&:disabled {
opacity: 0.5;
cursor: not-allowed;
}
}
// Simple Button
//************************************************************************//
@mixin simple($base-color, $grayscale: false) {
$color: hsl(0, 0, 100%);
$border: adjust-color($base-color, $saturation: 9%, $lightness: -14%);
$inset-shadow: adjust-color($base-color, $saturation: -8%, $lightness: 15%);
$stop-gradient: adjust-color($base-color, $saturation: 9%, $lightness: -11%);
$text-shadow: adjust-color($base-color, $saturation: 15%, $lightness: -18%);
@if lightness($base-color) > 70% {
$color: hsl(0, 0, 20%);
$text-shadow: adjust-color($base-color, $saturation: 10%, $lightness: 4%);
}
@if $grayscale == true {
$border: grayscale($border);
$inset-shadow: grayscale($inset-shadow);
$stop-gradient: grayscale($stop-gradient);
$text-shadow: grayscale($text-shadow);
}
border: 1px solid $border;
border-radius: 3px;
box-shadow: inset 0 1px 0 0 $inset-shadow;
color: $color;
display: inline-block;
font-size: 11px;
font-weight: bold;
@include linear-gradient ($base-color, $stop-gradient);
padding: 7px 18px;
text-decoration: none;
text-shadow: 0 1px 0 $text-shadow;
background-clip: padding-box;
&:hover:not(:disabled) {
$base-color-hover: adjust-color($base-color, $saturation: -4%, $lightness: -5%);
$inset-shadow-hover: adjust-color($base-color, $saturation: -7%, $lightness: 5%);
$stop-gradient-hover: adjust-color($base-color, $saturation: 8%, $lightness: -14%);
@if $grayscale == true {
$base-color-hover: grayscale($base-color-hover);
$inset-shadow-hover: grayscale($inset-shadow-hover);
$stop-gradient-hover: grayscale($stop-gradient-hover);
}
box-shadow: inset 0 1px 0 0 $inset-shadow-hover;
cursor: pointer;
@include linear-gradient ($base-color-hover, $stop-gradient-hover);
}
&:active:not(:disabled) {
$border-active: adjust-color($base-color, $saturation: 9%, $lightness: -14%);
$inset-shadow-active: adjust-color($base-color, $saturation: 7%, $lightness: -17%);
@if $grayscale == true {
$border-active: grayscale($border-active);
$inset-shadow-active: grayscale($inset-shadow-active);
}
border: 1px solid $border-active;
box-shadow: inset 0 0 8px 4px $inset-shadow-active, inset 0 0 8px 4px $inset-shadow-active, 0 1px 1px 0 #eee;
}
}
// Shiny Button
//************************************************************************//
@mixin shiny($base-color, $grayscale: false) {
$color: hsl(0, 0, 100%);
$border: adjust-color($base-color, $red: -117, $green: -111, $blue: -81);
$border-bottom: adjust-color($base-color, $red: -126, $green: -127, $blue: -122);
$fourth-stop: adjust-color($base-color, $red: -79, $green: -70, $blue: -46);
$inset-shadow: adjust-color($base-color, $red: 37, $green: 29, $blue: 12);
$second-stop: adjust-color($base-color, $red: -56, $green: -50, $blue: -33);
$text-shadow: adjust-color($base-color, $red: -140, $green: -141, $blue: -114);
$third-stop: adjust-color($base-color, $red: -86, $green: -75, $blue: -48);
@if lightness($base-color) > 70% {
$color: hsl(0, 0, 20%);
$text-shadow: adjust-color($base-color, $saturation: 10%, $lightness: 4%);
}
@if $grayscale == true {
$border: grayscale($border);
$border-bottom: grayscale($border-bottom);
$fourth-stop: grayscale($fourth-stop);
$inset-shadow: grayscale($inset-shadow);
$second-stop: grayscale($second-stop);
$text-shadow: grayscale($text-shadow);
$third-stop: grayscale($third-stop);
}
border: 1px solid $border;
border-bottom: 1px solid $border-bottom;
border-radius: 5px;
box-shadow: inset 0 1px 0 0 $inset-shadow;
color: $color;
display: inline-block;
font-size: 14px;
font-weight: bold;
@include linear-gradient(top, $base-color 0%, $second-stop 50%, $third-stop 50%, $fourth-stop 100%);
padding: 8px 20px;
text-align: center;
text-decoration: none;
text-shadow: 0 -1px 1px $text-shadow;
&:hover:not(:disabled) {
$first-stop-hover: adjust-color($base-color, $red: -13, $green: -15, $blue: -18);
$second-stop-hover: adjust-color($base-color, $red: -66, $green: -62, $blue: -51);
$third-stop-hover: adjust-color($base-color, $red: -93, $green: -85, $blue: -66);
$fourth-stop-hover: adjust-color($base-color, $red: -86, $green: -80, $blue: -63);
@if $grayscale == true {
$first-stop-hover: grayscale($first-stop-hover);
$second-stop-hover: grayscale($second-stop-hover);
$third-stop-hover: grayscale($third-stop-hover);
$fourth-stop-hover: grayscale($fourth-stop-hover);
}
cursor: pointer;
@include linear-gradient(top, $first-stop-hover 0%,
$second-stop-hover 50%,
$third-stop-hover 50%,
$fourth-stop-hover 100%);
}
&:active:not(:disabled) {
$inset-shadow-active: adjust-color($base-color, $red: -111, $green: -116, $blue: -122);
@if $grayscale == true {
$inset-shadow-active: grayscale($inset-shadow-active);
}
box-shadow: inset 0 0 20px 0 $inset-shadow-active, 0 1px 0 #fff;
}
}
// Pill Button
//************************************************************************//
@mixin pill($base-color, $grayscale: false) {
$color: hsl(0, 0, 100%);
$border-bottom: adjust-color($base-color, $hue: 8, $saturation: -11%, $lightness: -26%);
$border-sides: adjust-color($base-color, $hue: 4, $saturation: -21%, $lightness: -21%);
$border-top: adjust-color($base-color, $hue: -1, $saturation: -30%, $lightness: -15%);
$inset-shadow: adjust-color($base-color, $hue: -1, $saturation: -1%, $lightness: 7%);
$stop-gradient: adjust-color($base-color, $hue: 8, $saturation: 14%, $lightness: -10%);
$text-shadow: adjust-color($base-color, $hue: 5, $saturation: -19%, $lightness: -15%);
@if lightness($base-color) > 70% {
$color: hsl(0, 0, 20%);
$text-shadow: adjust-color($base-color, $saturation: 10%, $lightness: 4%);
}
@if $grayscale == true {
$border-bottom: grayscale($border-bottom);
$border-sides: grayscale($border-sides);
$border-top: grayscale($border-top);
$inset-shadow: grayscale($inset-shadow);
$stop-gradient: grayscale($stop-gradient);
$text-shadow: grayscale($text-shadow);
}
border: 1px solid $border-top;
border-color: $border-top $border-sides $border-bottom;
border-radius: 16px;
box-shadow: inset 0 1px 0 0 $inset-shadow, 0 1px 2px 0 #b3b3b3;
color: $color;
display: inline-block;
font-size: 11px;
font-weight: normal;
line-height: 1;
@include linear-gradient ($base-color, $stop-gradient);
padding: 5px 16px;
text-align: center;
text-decoration: none;
text-shadow: 0 -1px 1px $text-shadow;
background-clip: padding-box;
&:hover:not(:disabled) {
$base-color-hover: adjust-color($base-color, $lightness: -4.5%);
$border-bottom: adjust-color($base-color, $hue: 8, $saturation: 13.5%, $lightness: -32%);
$border-sides: adjust-color($base-color, $hue: 4, $saturation: -2%, $lightness: -27%);
$border-top: adjust-color($base-color, $hue: -1, $saturation: -17%, $lightness: -21%);
$inset-shadow-hover: adjust-color($base-color, $saturation: -1%, $lightness: 3%);
$stop-gradient-hover: adjust-color($base-color, $hue: 8, $saturation: -4%, $lightness: -15.5%);
$text-shadow-hover: adjust-color($base-color, $hue: 5, $saturation: -5%, $lightness: -22%);
@if $grayscale == true {
$base-color-hover: grayscale($base-color-hover);
$border-bottom: grayscale($border-bottom);
$border-sides: grayscale($border-sides);
$border-top: grayscale($border-top);
$inset-shadow-hover: grayscale($inset-shadow-hover);
$stop-gradient-hover: grayscale($stop-gradient-hover);
$text-shadow-hover: grayscale($text-shadow-hover);
}
border: 1px solid $border-top;
border-color: $border-top $border-sides $border-bottom;
box-shadow: inset 0 1px 0 0 $inset-shadow-hover;
cursor: pointer;
@include linear-gradient ($base-color-hover, $stop-gradient-hover);
text-shadow: 0 -1px 1px $text-shadow-hover;
background-clip: padding-box;
}
&:active:not(:disabled) {
$active-color: adjust-color($base-color, $hue: 4, $saturation: -12%, $lightness: -10%);
$border-active: adjust-color($base-color, $hue: 6, $saturation: -2.5%, $lightness: -30%);
$border-bottom-active: adjust-color($base-color, $hue: 11, $saturation: 6%, $lightness: -31%);
$inset-shadow-active: adjust-color($base-color, $hue: 9, $saturation: 2%, $lightness: -21.5%);
$text-shadow-active: adjust-color($base-color, $hue: 5, $saturation: -12%, $lightness: -21.5%);
@if $grayscale == true {
$active-color: grayscale($active-color);
$border-active: grayscale($border-active);
$border-bottom-active: grayscale($border-bottom-active);
$inset-shadow-active: grayscale($inset-shadow-active);
$text-shadow-active: grayscale($text-shadow-active);
}
background: $active-color;
border: 1px solid $border-active;
border-bottom: 1px solid $border-bottom-active;
box-shadow: inset 0 0 6px 3px $inset-shadow-active, 0 1px 0 0 #fff;
text-shadow: 0 -1px 1px $text-shadow-active;
}
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/addons/_clearfix.scss 0 → 100644
// Micro clearfix provides an easy way to contain floats without adding additional markup
//
// Example usage:
//
// // Contain all floats within .wrapper
// .wrapper {
// @include clearfix;
// .content,
// .sidebar {
// float : left;
// }
// }
@mixin clearfix {
*zoom: 1;
&:before,
&:after {
content: " ";
display: table;
}
&:after {
clear: both;
}
}
// Acknowledgements
// Micro clearfix: [Nicolas Gallagher](http://nicolasgallagher.com/micro-clearfix-hack/)
apps/openassessment/xblock/static/sass/xb/libs/bourbon/addons/_font-family.scss 0 → 100644
$georgia: Georgia, Cambria, "Times New Roman", Times, serif;
$helvetica: "Helvetica Neue", Helvetica, Arial, sans-serif;
$lucida-grande: "Lucida Grande", Tahoma, Verdana, Arial, sans-serif;
$monospace: "Bitstream Vera Sans Mono", Consolas, Courier, monospace;
$verdana: Verdana, Geneva, sans-serif;
apps/openassessment/xblock/static/sass/xb/libs/bourbon/addons/_hide-text.scss 0 → 100644
@mixin hide-text {
color: transparent;
font: 0/0 a;
text-shadow: none;
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/addons/_html5-input-types.scss 0 → 100644
//************************************************************************//
// Generate a variable ($all-text-inputs) with a list of all html5
// input types that have a text-based input, excluding textarea.
// http://diveintohtml5.org/forms.html
//************************************************************************//
$inputs-list: 'input[type="email"]',
'input[type="number"]',
'input[type="password"]',
'input[type="search"]',
'input[type="tel"]',
'input[type="text"]',
'input[type="url"]',
// Webkit & Gecko may change the display of these in the future
'input[type="color"]',
'input[type="date"]',
'input[type="datetime"]',
'input[type="datetime-local"]',
'input[type="month"]',
'input[type="time"]',
'input[type="week"]';
$unquoted-inputs-list: ();
@each $input-type in $inputs-list {
$unquoted-inputs-list: append($unquoted-inputs-list, unquote($input-type), comma);
}
$all-text-inputs: $unquoted-inputs-list;
// Hover Pseudo-class
//************************************************************************//
$all-text-inputs-hover: ();
@each $input-type in $unquoted-inputs-list {
$input-type-hover: $input-type + ":hover";
$all-text-inputs-hover: append($all-text-inputs-hover, $input-type-hover, comma);
}
// Focus Pseudo-class
//************************************************************************//
$all-text-inputs-focus: ();
@each $input-type in $unquoted-inputs-list {
$input-type-focus: $input-type + ":focus";
$all-text-inputs-focus: append($all-text-inputs-focus, $input-type-focus, comma);
}
// You must use interpolation on the variable:
// #{$all-text-inputs}
// #{$all-text-inputs-hover}
// #{$all-text-inputs-focus}
// Example
//************************************************************************//
// #{$all-text-inputs}, textarea {
// border: 1px solid red;
// }
apps/openassessment/xblock/static/sass/xb/libs/bourbon/addons/_position.scss 0 → 100644
@mixin position ($position: relative, $coordinates: 0 0 0 0) {
@if type-of($position) == list {
$coordinates: $position;
$position: relative;
}
$top: nth($coordinates, 1);
$right: nth($coordinates, 2);
$bottom: nth($coordinates, 3);
$left: nth($coordinates, 4);
position: $position;
@if $top == auto {
top: $top;
}
@else if not(unitless($top)) {
top: $top;
}
@if $right == auto {
right: $right;
}
@else if not(unitless($right)) {
right: $right;
}
@if $bottom == auto {
bottom: $bottom;
}
@else if not(unitless($bottom)) {
bottom: $bottom;
}
@if $left == auto {
left: $left;
}
@else if not(unitless($left)) {
left: $left;
}
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/addons/_prefixer.scss 0 → 100644
//************************************************************************//
// Example: @include prefixer(border-radius, $radii, webkit ms spec);
//************************************************************************//
$prefix-for-webkit: true !default;
$prefix-for-mozilla: true !default;
$prefix-for-microsoft: true !default;
$prefix-for-opera: true !default;
$prefix-for-spec: true !default; // required for keyframe mixin
@mixin prefixer ($property, $value, $prefixes) {
@each $prefix in $prefixes {
@if $prefix == webkit {
@if $prefix-for-webkit {
-webkit-#{$property}: $value;
}
}
@else if $prefix == moz {
@if $prefix-for-mozilla {
-moz-#{$property}: $value;
}
}
@else if $prefix == ms {
@if $prefix-for-microsoft {
-ms-#{$property}: $value;
}
}
@else if $prefix == o {
@if $prefix-for-opera {
-o-#{$property}: $value;
}
}
@else if $prefix == spec {
@if $prefix-for-spec {
#{$property}: $value;
}
}
@else {
@warn "Unrecognized prefix: #{$prefix}";
}
}
}
@mixin disable-prefix-for-all() {
$prefix-for-webkit: false;
$prefix-for-mozilla: false;
$prefix-for-microsoft: false;
$prefix-for-opera: false;
$prefix-for-spec: false;
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/addons/_retina-image.scss 0 → 100644
@mixin retina-image($filename, $background-size, $extension: png, $retina-filename: null, $asset-pipeline: false) {
@if $asset-pipeline {
background-image: image-url("#{$filename}.#{$extension}");
}
@else {
background-image: url("#{$filename}.#{$extension}");
}
@include hidpi {
@if $asset-pipeline {
@if $retina-filename {
background-image: image-url("#{$retina-filename}.#{$extension}");
}
@else {
background-image: image-url("#{$filename}@2x.#{$extension}");
}
}
@else {
@if $retina-filename {
background-image: url("#{$retina-filename}.#{$extension}");
}
@else {
background-image: url("#{$filename}@2x.#{$extension}");
}
}
background-size: $background-size;
}
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/addons/_size.scss 0 → 100644
@mixin size($size) {
@if length($size) == 1 {
@if $size == auto {
width: $size;
height: $size;
}
@else if unitless($size) {
width: $size + px;
height: $size + px;
}
@else if not(unitless($size)) {
width: $size;
height: $size;
}
}
// Width x Height
@if length($size) == 2 {
$width: nth($size, 1);
$height: nth($size, 2);
@if $width == auto {
width: $width;
}
@else if not(unitless($width)) {
width: $width;
}
@else if unitless($width) {
width: $width + px;
}
@if $height == auto {
height: $height;
}
@else if not(unitless($height)) {
height: $height;
}
@else if unitless($height) {
height: $height + px;
}
}
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/addons/_timing-functions.scss 0 → 100644
// CSS cubic-bezier timing functions. Timing functions courtesy of jquery.easie (github.com/jaukia/easie)
// Timing functions are the same as demo'ed here: http://jqueryui.com/demos/effect/easing.html
// EASE IN
$ease-in-quad: cubic-bezier(0.550, 0.085, 0.680, 0.530);
$ease-in-cubic: cubic-bezier(0.550, 0.055, 0.675, 0.190);
$ease-in-quart: cubic-bezier(0.895, 0.030, 0.685, 0.220);
$ease-in-quint: cubic-bezier(0.755, 0.050, 0.855, 0.060);
$ease-in-sine: cubic-bezier(0.470, 0.000, 0.745, 0.715);
$ease-in-expo: cubic-bezier(0.950, 0.050, 0.795, 0.035);
$ease-in-circ: cubic-bezier(0.600, 0.040, 0.980, 0.335);
$ease-in-back: cubic-bezier(0.600, -0.280, 0.735, 0.045);
// EASE OUT
$ease-out-quad: cubic-bezier(0.250, 0.460, 0.450, 0.940);
$ease-out-cubic: cubic-bezier(0.215, 0.610, 0.355, 1.000);
$ease-out-quart: cubic-bezier(0.165, 0.840, 0.440, 1.000);
$ease-out-quint: cubic-bezier(0.230, 1.000, 0.320, 1.000);
$ease-out-sine: cubic-bezier(0.390, 0.575, 0.565, 1.000);
$ease-out-expo: cubic-bezier(0.190, 1.000, 0.220, 1.000);
$ease-out-circ: cubic-bezier(0.075, 0.820, 0.165, 1.000);
$ease-out-back: cubic-bezier(0.175, 0.885, 0.320, 1.275);
// EASE IN OUT
$ease-in-out-quad: cubic-bezier(0.455, 0.030, 0.515, 0.955);
$ease-in-out-cubic: cubic-bezier(0.645, 0.045, 0.355, 1.000);
$ease-in-out-quart: cubic-bezier(0.770, 0.000, 0.175, 1.000);
$ease-in-out-quint: cubic-bezier(0.860, 0.000, 0.070, 1.000);
$ease-in-out-sine: cubic-bezier(0.445, 0.050, 0.550, 0.950);
$ease-in-out-expo: cubic-bezier(1.000, 0.000, 0.000, 1.000);
$ease-in-out-circ: cubic-bezier(0.785, 0.135, 0.150, 0.860);
$ease-in-out-back: cubic-bezier(0.680, -0.550, 0.265, 1.550);
apps/openassessment/xblock/static/sass/xb/libs/bourbon/addons/_triangle.scss 0 → 100644
@mixin triangle ($size, $color, $direction) {
height: 0;
width: 0;
@if ($direction == up) or ($direction == down) or ($direction == right) or ($direction == left) {
border-color: transparent;
border-style: solid;
border-width: $size / 2;
@if $direction == up {
border-bottom-color: $color;
} @else if $direction == right {
border-left-color: $color;
} @else if $direction == down {
border-top-color: $color;
} @else if $direction == left {
border-right-color: $color;
}
}
@else if ($direction == up-right) or ($direction == up-left) {
border-top: $size solid $color;
@if $direction == up-right {
border-left: $size solid transparent;
} @else if $direction == up-left {
border-right: $size solid transparent;
}
}
@else if ($direction == down-right) or ($direction == down-left) {
border-bottom: $size solid $color;
@if $direction == down-right {
border-left: $size solid transparent;
} @else if $direction == down-left {
border-right: $size solid transparent;
}
}
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/css3/_animation.scss 0 → 100644
// http://www.w3.org/TR/css3-animations/#the-animation-name-property-
// Each of these mixins support comma separated lists of values, which allows different transitions for individual properties to be described in a single style rule. Each value in the list corresponds to the value at that same position in the other properties.
// Official animation shorthand property.
@mixin animation ($animations...) {
@include prefixer(animation, $animations, webkit moz spec);
}
// Individual Animation Properties
@mixin animation-name ($names...) {
@include prefixer(animation-name, $names, webkit moz spec);
}
@mixin animation-duration ($times...) {
@include prefixer(animation-duration, $times, webkit moz spec);
}
@mixin animation-timing-function ($motions...) {
// ease | linear | ease-in | ease-out | ease-in-out
@include prefixer(animation-timing-function, $motions, webkit moz spec);
}
@mixin animation-iteration-count ($values...) {
// infinite | <number>
@include prefixer(animation-iteration-count, $values, webkit moz spec);
}
@mixin animation-direction ($directions...) {
// normal | alternate
@include prefixer(animation-direction, $directions, webkit moz spec);
}
@mixin animation-play-state ($states...) {
// running | paused
@include prefixer(animation-play-state, $states, webkit moz spec);
}
@mixin animation-delay ($times...) {
@include prefixer(animation-delay, $times, webkit moz spec);
}
@mixin animation-fill-mode ($modes...) {
// none | forwards | backwards | both
@include prefixer(animation-fill-mode, $modes, webkit moz spec);
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/css3/_appearance.scss 0 → 100644
@mixin appearance ($value) {
@include prefixer(appearance, $value, webkit moz ms o spec);
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/css3/_backface-visibility.scss 0 → 100644
//************************************************************************//
// Backface-visibility mixin
//************************************************************************//
@mixin backface-visibility($visibility) {
@include prefixer(backface-visibility, $visibility, webkit spec);
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/css3/_background-image.scss 0 → 100644
//************************************************************************//
// Background-image property for adding multiple background images with
// gradients, or for stringing multiple gradients together.
//************************************************************************//
@mixin background-image($images...) {
background-image: _add-prefix($images, webkit);
background-image: _add-prefix($images);
}
@function _add-prefix($images, $vendor: false) {
$images-prefixed: ();
$gradient-positions: false;
@for $i from 1 through length($images) {
$type: type-of(nth($images, $i)); // Get type of variable - List or String
// If variable is a list - Gradient
@if $type == list {
$gradient-type: nth(nth($images, $i), 1); // linear or radial
$gradient-pos: null;
$gradient-args: null;
@if ($gradient-type == linear) or ($gradient-type == radial) {
$gradient-pos: nth(nth($images, $i), 2); // Get gradient position
$gradient-args: nth(nth($images, $i), 3); // Get actual gradient (red, blue)
}
@else {
$gradient-args: nth(nth($images, $i), 2); // Get actual gradient (red, blue)
}
$gradient-positions: _gradient-positions-parser($gradient-type, $gradient-pos);
$gradient: _render-gradients($gradient-positions, $gradient-args, $gradient-type, $vendor);
$images-prefixed: append($images-prefixed, $gradient, comma);
}
// If variable is a string - Image
@else if $type == string {
$images-prefixed: join($images-prefixed, nth($images, $i), comma);
}
}
@return $images-prefixed;
}
//Examples:
//@include background-image(linear-gradient(top, orange, red));
//@include background-image(radial-gradient(50% 50%, cover circle, orange, red));
//@include background-image(url("/images/a.png"), linear-gradient(orange, red));
//@include background-image(url("image.png"), linear-gradient(orange, red), url("image.png"));
//@include background-image(linear-gradient(hsla(0, 100%, 100%, 0.25) 0%, hsla(0, 100%, 100%, 0.08) 50%, transparent 50%), linear-gradient(orange, red));
apps/openassessment/xblock/static/sass/xb/libs/bourbon/css3/_background.scss 0 → 100644
//************************************************************************//
// Background property for adding multiple backgrounds using shorthand
// notation.
//************************************************************************//
@mixin background(
$background-1 , $background-2: false,
$background-3: false, $background-4: false,
$background-5: false, $background-6: false,
$background-7: false, $background-8: false,
$background-9: false, $background-10: false,
$fallback: false
) {
$backgrounds: compact($background-1, $background-2,
$background-3, $background-4,
$background-5, $background-6,
$background-7, $background-8,
$background-9, $background-10);
$fallback-color: false;
@if (type-of($fallback) == color) or ($fallback == "transparent") {
$fallback-color: $fallback;
}
@else {
$fallback-color: _extract-background-color($backgrounds);
}
@if $fallback-color {
background-color: $fallback-color;
}
background: _background-add-prefix($backgrounds, webkit);
background: _background-add-prefix($backgrounds);
}
@function _extract-background-color($backgrounds) {
$final-bg-layer: nth($backgrounds, length($backgrounds));
@if type-of($final-bg-layer) == list {
@for $i from 1 through length($final-bg-layer) {
$value: nth($final-bg-layer, $i);
@if type-of($value) == color {
@return $value;
}
}
}
@return false;
}
@function _background-add-prefix($backgrounds, $vendor: false) {
$backgrounds-prefixed: ();
@for $i from 1 through length($backgrounds) {
$shorthand: nth($backgrounds, $i); // Get member for current index
$type: type-of($shorthand); // Get type of variable - List (gradient) or String (image)
// If shorthand is a list (gradient)
@if $type == list {
$first-member: nth($shorthand, 1); // Get first member of shorthand
// Linear Gradient
@if index(linear radial, nth($first-member, 1)) {
$gradient-type: nth($first-member, 1); // linear || radial
$gradient-args: false;
$gradient-positions: false;
$shorthand-start: false;
@if type-of($first-member) == list { // Linear gradient plus additional shorthand values - lg(red,orange)repeat,...
$gradient-positions: nth($first-member, 2);
$gradient-args: nth($first-member, 3);
$shorthand-start: 2;
}
@else { // Linear gradient only - lg(red,orange),...
$gradient-positions: nth($shorthand, 2);
$gradient-args: nth($shorthand, 3); // Get gradient (red, blue)
}
$gradient-positions: _gradient-positions-parser($gradient-type, $gradient-positions);
$gradient: _render-gradients($gradient-positions, $gradient-args, $gradient-type, $vendor);
// Append any additional shorthand args to gradient
@if $shorthand-start {
@for $j from $shorthand-start through length($shorthand) {
$gradient: join($gradient, nth($shorthand, $j), space);
}
}
$backgrounds-prefixed: append($backgrounds-prefixed, $gradient, comma);
}
// Image with additional properties
@else {
$backgrounds-prefixed: append($backgrounds-prefixed, $shorthand, comma);
}
}
// If shorthand is a simple string (color or image)
@else if $type == string {
$backgrounds-prefixed: join($backgrounds-prefixed, $shorthand, comma);
}
}
@return $backgrounds-prefixed;
}
//Examples:
//@include background(linear-gradient(top, orange, red));
//@include background(radial-gradient(circle at 40% 40%, orange, red));
//@include background(url("/images/a.png") no-repeat, linear-gradient(orange, red));
//@include background(url("image.png") center center, linear-gradient(orange, red), url("image.png"));
apps/openassessment/xblock/static/sass/xb/libs/bourbon/css3/_border-image.scss 0 → 100644
@mixin border-image($images) {
-webkit-border-image: _border-add-prefix($images, webkit);
-moz-border-image: _border-add-prefix($images, moz);
-o-border-image: _border-add-prefix($images, o);
border-image: _border-add-prefix($images);
}
@function _border-add-prefix($images, $vendor: false) {
$border-image: null;
$images-type: type-of(nth($images, 1));
$first-var: nth(nth($images, 1), 1); // Get type of Gradient (Linear || radial)
// If input is a gradient
@if $images-type == string {
@if ($first-var == "linear") or ($first-var == "radial") {
$gradient-type: nth($images, 1); // Get type of gradient (linear || radial)
$gradient-pos: nth($images, 2); // Get gradient position
$gradient-args: nth($images, 3); // Get actual gradient (red, blue)
$gradient-positions: _gradient-positions-parser($gradient-type, $gradient-pos);
$border-image: _render-gradients($gradient-positions, $gradient-args, $gradient-type, $vendor);
}
// If input is a URL
@else {
$border-image: $images;
}
}
// If input is gradient or url + additional args
@else if $images-type == list {
$type: type-of(nth($images, 1)); // Get type of variable - List or String
// If variable is a list - Gradient
@if $type == list {
$gradient: nth($images, 1);
$gradient-type: nth($gradient, 1); // Get type of gradient (linear || radial)
$gradient-pos: nth($gradient, 2); // Get gradient position
$gradient-args: nth($gradient, 3); // Get actual gradient (red, blue)
$gradient-positions: _gradient-positions-parser($gradient-type, $gradient-pos);
$border-image: _render-gradients($gradient-positions, $gradient-args, $gradient-type, $vendor);
@for $i from 2 through length($images) {
$border-image: append($border-image, nth($images, $i));
}
}
}
@return $border-image;
}
//Examples:
// @include border-image(url("image.png"));
// @include border-image(url("image.png") 20 stretch);
// @include border-image(linear-gradient(45deg, orange, yellow));
// @include border-image(linear-gradient(45deg, orange, yellow) stretch);
// @include border-image(linear-gradient(45deg, orange, yellow) 20 30 40 50 stretch round);
// @include border-image(radial-gradient(top, cover, orange, yellow, orange));
apps/openassessment/xblock/static/sass/xb/libs/bourbon/css3/_border-radius.scss 0 → 100644
//************************************************************************//
// Shorthand Border-radius mixins
//************************************************************************//
@mixin border-top-radius($radii) {
@include prefixer(border-top-left-radius, $radii, spec);
@include prefixer(border-top-right-radius, $radii, spec);
}
@mixin border-bottom-radius($radii) {
@include prefixer(border-bottom-left-radius, $radii, spec);
@include prefixer(border-bottom-right-radius, $radii, spec);
}
@mixin border-left-radius($radii) {
@include prefixer(border-top-left-radius, $radii, spec);
@include prefixer(border-bottom-left-radius, $radii, spec);
}
@mixin border-right-radius($radii) {
@include prefixer(border-top-right-radius, $radii, spec);
@include prefixer(border-bottom-right-radius, $radii, spec);
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/css3/_box-sizing.scss 0 → 100644
@mixin box-sizing ($box) {
// content-box | border-box | inherit
@include prefixer(box-sizing, $box, webkit moz spec);
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/css3/_columns.scss 0 → 100644
@mixin columns($arg: auto) {
// <column-count> || <column-width>
@include prefixer(columns, $arg, webkit moz spec);
}
@mixin column-count($int: auto) {
// auto || integer
@include prefixer(column-count, $int, webkit moz spec);
}
@mixin column-gap($length: normal) {
// normal || length
@include prefixer(column-gap, $length, webkit moz spec);
}
@mixin column-fill($arg: auto) {
// auto || length
@include prefixer(columns-fill, $arg, webkit moz spec);
}
@mixin column-rule($arg) {
// <border-width> || <border-style> || <color>
@include prefixer(column-rule, $arg, webkit moz spec);
}
@mixin column-rule-color($color) {
@include prefixer(column-rule-color, $color, webkit moz spec);
}
@mixin column-rule-style($style: none) {
// none | hidden | dashed | dotted | double | groove | inset | inset | outset | ridge | solid
@include prefixer(column-rule-style, $style, webkit moz spec);
}
@mixin column-rule-width ($width: none) {
@include prefixer(column-rule-width, $width, webkit moz spec);
}
@mixin column-span($arg: none) {
// none || all
@include prefixer(column-span, $arg, webkit moz spec);
}
@mixin column-width($length: auto) {
// auto || length
@include prefixer(column-width, $length, webkit moz spec);
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/css3/_flex-box.scss 0 → 100644
// CSS3 Flexible Box Model and property defaults
// Custom shorthand notation for flexbox
@mixin box($orient: inline-axis, $pack: start, $align: stretch) {
@include display-box;
@include box-orient($orient);
@include box-pack($pack);
@include box-align($align);
}
@mixin display-box {
display: -webkit-box;
display: -moz-box;
display: box;
}
@mixin box-orient($orient: inline-axis) {
// horizontal|vertical|inline-axis|block-axis|inherit
@include prefixer(box-orient, $orient, webkit moz spec);
}
@mixin box-pack($pack: start) {
// start|end|center|justify
@include prefixer(box-pack, $pack, webkit moz spec);
}
@mixin box-align($align: stretch) {
// start|end|center|baseline|stretch
@include prefixer(box-align, $align, webkit moz spec);
}
@mixin box-direction($direction: normal) {
// normal|reverse|inherit
@include prefixer(box-direction, $direction, webkit moz spec);
}
@mixin box-lines($lines: single) {
// single|multiple
@include prefixer(box-lines, $lines, webkit moz spec);
}
@mixin box-ordinal-group($int: 1) {
@include prefixer(box-ordinal-group, $int, webkit moz spec);
}
@mixin box-flex($value: 0.0) {
@include prefixer(box-flex, $value, webkit moz spec);
}
@mixin box-flex-group($int: 1) {
@include prefixer(box-flex-group, $int, webkit moz spec);
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/css3/_font-face.scss 0 → 100644
// Order of the includes matters, and it is: normal, bold, italic, bold+italic.
@mixin font-face($font-family, $file-path, $weight: normal, $style: normal, $asset-pipeline: false ) {
@font-face {
font-family: $font-family;
font-weight: $weight;
font-style: $style;
@if $asset-pipeline == true {
src: font-url('#{$file-path}.eot');
src: font-url('#{$file-path}.eot?#iefix') format('embedded-opentype'),
font-url('#{$file-path}.woff') format('woff'),
font-url('#{$file-path}.ttf') format('truetype'),
font-url('#{$file-path}.svg##{$font-family}') format('svg');
} @else {
src: url('#{$file-path}.eot');
src: url('#{$file-path}.eot?#iefix') format('embedded-opentype'),
url('#{$file-path}.woff') format('woff'),
url('#{$file-path}.ttf') format('truetype'),
url('#{$file-path}.svg##{$font-family}') format('svg');
}
}
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/css3/_hidpi-media-query.scss 0 → 100644
// HiDPI mixin. Default value set to 1.3 to target Google Nexus 7 (http://bjango.com/articles/min-device-pixel-ratio/)
@mixin hidpi($ratio: 1.3) {
@media only screen and (-webkit-min-device-pixel-ratio: $ratio),
only screen and (min--moz-device-pixel-ratio: $ratio),
only screen and (-o-min-device-pixel-ratio: #{$ratio}/1),
only screen and (min-resolution: #{round($ratio*96)}dpi),
only screen and (min-resolution: #{$ratio}dppx) {
@content;
}
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/css3/_image-rendering.scss 0 → 100644
@mixin image-rendering ($mode:optimizeQuality) {
@if ($mode == optimize-contrast) {
image-rendering: -moz-crisp-edges;
image-rendering: -o-crisp-edges;
image-rendering: -webkit-optimize-contrast;
image-rendering: optimize-contrast;
}
@else {
image-rendering: $mode;
}
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/css3/_inline-block.scss 0 → 100644
// Legacy support for inline-block in IE7 (maybe IE6)
@mixin inline-block {
display: inline-block;
vertical-align: baseline;
zoom: 1;
*display: inline;
*vertical-align: auto;
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/css3/_keyframes.scss 0 → 100644
// Adds keyframes blocks for supported prefixes, removing redundant prefixes in the block's content
@mixin keyframes($name) {
$original-prefix-for-webkit: $prefix-for-webkit;
$original-prefix-for-mozilla: $prefix-for-mozilla;
$original-prefix-for-microsoft: $prefix-for-microsoft;
$original-prefix-for-opera: $prefix-for-opera;
$original-prefix-for-spec: $prefix-for-spec;
@if $original-prefix-for-webkit {
@include disable-prefix-for-all();
$prefix-for-webkit: true;
@-webkit-keyframes #{$name} {
@content;
}
}
@if $original-prefix-for-mozilla {
@include disable-prefix-for-all();
$prefix-for-mozilla: true;
@-moz-keyframes #{$name} {
@content;
}
}
@if $original-prefix-for-opera {
@include disable-prefix-for-all();
$prefix-for-opera: true;
@-o-keyframes #{$name} {
@content;
}
}
@if $original-prefix-for-spec {
@include disable-prefix-for-all();
$prefix-for-spec: true;
@keyframes #{$name} {
@content;
}
}
$prefix-for-webkit: $original-prefix-for-webkit;
$prefix-for-mozilla: $original-prefix-for-mozilla;
$prefix-for-microsoft: $original-prefix-for-microsoft;
$prefix-for-opera: $original-prefix-for-opera;
$prefix-for-spec: $original-prefix-for-spec;
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/css3/_linear-gradient.scss 0 → 100644
@mixin linear-gradient($pos, $G1, $G2: false,
$G3: false, $G4: false,
$G5: false, $G6: false,
$G7: false, $G8: false,
$G9: false, $G10: false,
$deprecated-pos1: left top,
$deprecated-pos2: left bottom,
$fallback: false) {
// Detect what type of value exists in $pos
$pos-type: type-of(nth($pos, 1));
$pos-spec: null;
$pos-degree: null;
// If $pos is missing from mixin, reassign vars and add default position
@if ($pos-type == color) or (nth($pos, 1) == "transparent") {
$G10: $G9; $G9: $G8; $G8: $G7; $G7: $G6; $G6: $G5;
$G5: $G4; $G4: $G3; $G3: $G2; $G2: $G1; $G1: $pos;
$pos: null;
}
@if $pos {
$positions: _linear-positions-parser($pos);
$pos-degree: nth($positions, 1);
$pos-spec: nth($positions, 2);
}
$full: compact($G1, $G2, $G3, $G4, $G5, $G6, $G7, $G8, $G9, $G10);
// Set $G1 as the default fallback color
$fallback-color: nth($G1, 1);
// If $fallback is a color use that color as the fallback color
@if (type-of($fallback) == color) or ($fallback == "transparent") {
$fallback-color: $fallback;
}
background-color: $fallback-color;
background-image: _deprecated-webkit-gradient(linear, $deprecated-pos1, $deprecated-pos2, $full); // Safari <= 5.0
background-image: -webkit-linear-gradient($pos-degree $full); // Safari 5.1+, Chrome
background-image: unquote("linear-gradient(#{$pos-spec}#{$full})");
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/css3/_perspective.scss 0 → 100644
@mixin perspective($depth: none) {
// none | <length>
@include prefixer(perspective, $depth, webkit moz spec);
}
@mixin perspective-origin($value: 50% 50%) {
@include prefixer(perspective-origin, $value, webkit moz spec);
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/css3/_placeholder.scss 0 → 100644
$placeholders: '-webkit-input-placeholder',
'-moz-placeholder',
'-ms-input-placeholder';
@mixin placeholder {
@each $placeholder in $placeholders {
@if $placeholder == "-webkit-input-placeholder" {
&::#{$placeholder} {
@content;
}
}
@else if $placeholder == "-moz-placeholder" {
// FF 18-
&:#{$placeholder} {
@content;
}
// FF 19+
&::#{$placeholder} {
@content;
}
}
@else {
&:#{$placeholder} {
@content;
}
}
}
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/css3/_radial-gradient.scss 0 → 100644
// Requires Sass 3.1+
@mixin radial-gradient($G1, $G2,
$G3: false, $G4: false,
$G5: false, $G6: false,
$G7: false, $G8: false,
$G9: false, $G10: false,
$pos: null,
$shape-size: null,
$deprecated-pos1: center center,
$deprecated-pos2: center center,
$deprecated-radius1: 0,
$deprecated-radius2: 460,
$fallback: false) {
$data: _radial-arg-parser($G1, $G2, $pos, $shape-size);
$G1: nth($data, 1);
$G2: nth($data, 2);
$pos: nth($data, 3);
$shape-size: nth($data, 4);
$full: compact($G1, $G2, $G3, $G4, $G5, $G6, $G7, $G8, $G9, $G10);
// Strip deprecated cover/contain for spec
$shape-size-spec: _shape-size-stripper($shape-size);
// Set $G1 as the default fallback color
$first-color: nth($full, 1);
$fallback-color: nth($first-color, 1);
@if (type-of($fallback) == color) or ($fallback == "transparent") {
$fallback-color: $fallback;
}
// Add Commas and spaces
$shape-size: if($shape-size, '#{$shape-size}, ', null);
$pos: if($pos, '#{$pos}, ', null);
$pos-spec: if($pos, 'at #{$pos}', null);
$shape-size-spec: if(($shape-size-spec != ' ') and ($pos == null), '#{$shape-size-spec}, ', '#{$shape-size-spec} ');
background-color: $fallback-color;
background-image: _deprecated-webkit-gradient(radial, $deprecated-pos1, $deprecated-pos2, $full, $deprecated-radius1, $deprecated-radius2); // Safari <= 5.0 && IOS 4
background-image: -webkit-radial-gradient(unquote(#{$pos}#{$shape-size}#{$full}));
background-image: unquote("radial-gradient(#{$shape-size-spec}#{$pos-spec}#{$full})");
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/css3/_transform.scss 0 → 100644
@mixin transform($property: none) {
// none | <transform-function>
@include prefixer(transform, $property, webkit moz ms o spec);
}
@mixin transform-origin($axes: 50%) {
// x-axis - left | center | right | length | %
// y-axis - top | center | bottom | length | %
// z-axis - length
@include prefixer(transform-origin, $axes, webkit moz ms o spec);
}
@mixin transform-style ($style: flat) {
@include prefixer(transform-style, $style, webkit moz ms o spec);
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/css3/_transition.scss 0 → 100644
// Shorthand mixin. Supports multiple parentheses-deliminated values for each variable.
// Example: @include transition (all, 2.0s, ease-in-out);
// @include transition ((opacity, width), (1.0s, 2.0s), ease-in, (0, 2s));
// @include transition ($property:(opacity, width), $delay: (1.5s, 2.5s));
@mixin transition ($properties...) {
@if length($properties) >= 1 {
@include prefixer(transition, $properties, webkit moz spec);
}
@else {
$properties: all 0.15s ease-out 0;
@include prefixer(transition, $properties, webkit moz spec);
}
}
@mixin transition-property ($properties...) {
-webkit-transition-property: transition-property-names($properties, 'webkit');
-moz-transition-property: transition-property-names($properties, 'moz');
transition-property: transition-property-names($properties, false);
}
@mixin transition-duration ($times...) {
@include prefixer(transition-duration, $times, webkit moz spec);
}
@mixin transition-timing-function ($motions...) {
// ease | linear | ease-in | ease-out | ease-in-out | cubic-bezier()
@include prefixer(transition-timing-function, $motions, webkit moz spec);
}
@mixin transition-delay ($times...) {
@include prefixer(transition-delay, $times, webkit moz spec);
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/css3/_user-select.scss 0 → 100644
@mixin user-select($arg: none) {
@include prefixer(user-select, $arg, webkit moz ms spec);
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/functions/_compact.scss 0 → 100644
// Remove `false` values from a list
@function compact($vars...) {
$list: ();
@each $var in $vars {
@if $var {
$list: append($list, $var, comma);
}
}
@return $list;
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/functions/_flex-grid.scss 0 → 100644
// Flexible grid
@function flex-grid($columns, $container-columns: $fg-max-columns) {
$width: $columns * $fg-column + ($columns - 1) * $fg-gutter;
$container-width: $container-columns * $fg-column + ($container-columns - 1) * $fg-gutter;
@return percentage($width / $container-width);
}
// Flexible gutter
@function flex-gutter($container-columns: $fg-max-columns, $gutter: $fg-gutter) {
$container-width: $container-columns * $fg-column + ($container-columns - 1) * $fg-gutter;
@return percentage($gutter / $container-width);
}
// The $fg-column, $fg-gutter and $fg-max-columns variables must be defined in your base stylesheet to properly use the flex-grid function.
// This function takes the fluid grid equation (target / context = result) and uses columns to help define each.
//
// The calculation presumes that your column structure will be missing the last gutter:
//
// -- column -- gutter -- column -- gutter -- column
//
// $fg-column: 60px; // Column Width
// $fg-gutter: 25px; // Gutter Width
// $fg-max-columns: 12; // Total Columns For Main Container
//
// div {
// width: flex-grid(4); // returns (315px / 995px) = 31.65829%;
// margin-left: flex-gutter(); // returns (25px / 995px) = 2.51256%;
//
// p {
// width: flex-grid(2, 4); // returns (145px / 315px) = 46.031746%;
// float: left;
// margin: flex-gutter(4); // returns (25px / 315px) = 7.936508%;
// }
//
// blockquote {
// float: left;
// width: flex-grid(2, 4); // returns (145px / 315px) = 46.031746%;
// }
// }
\ No newline at end of file
apps/openassessment/xblock/static/sass/xb/libs/bourbon/functions/_grid-width.scss 0 → 100644
@function grid-width($n) {
@return $n * $gw-column + ($n - 1) * $gw-gutter;
}
// The $gw-column and $gw-gutter variables must be defined in your base stylesheet to properly use the grid-width function.
//
// $gw-column: 100px; // Column Width
// $gw-gutter: 40px; // Gutter Width
//
// div {
// width: grid-width(4); // returns 520px;
// margin-left: $gw-gutter; // returns 40px;
// }
apps/openassessment/xblock/static/sass/xb/libs/bourbon/functions/_linear-gradient.scss 0 → 100644
@function linear-gradient($pos, $gradients...) {
$type: linear;
$pos-type: type-of(nth($pos, 1));
// if $pos doesn't exist, fix $gradient
@if ($pos-type == color) or (nth($pos, 1) == "transparent") {
$gradients: zip($pos $gradients);
$pos: false;
}
$type-gradient: $type, $pos, $gradients;
@return $type-gradient;
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/functions/_modular-scale.scss 0 → 100644
@function modular-scale($value, $increment, $ratio) {
@if $increment > 0 {
@for $i from 1 through $increment {
$value: ($value * $ratio);
}
}
@if $increment < 0 {
$increment: abs($increment);
@for $i from 1 through $increment {
$value: ($value / $ratio);
}
}
@return $value;
}
// div {
// Increment Up GR with positive value
// font-size: modular-scale(14px, 1, 1.618); // returns: 22.652px
//
// Increment Down GR with negative value
// font-size: modular-scale(14px, -1, 1.618); // returns: 8.653px
//
// Can be used with ceil(round up) or floor(round down)
// font-size: floor( modular-scale(14px, 1, 1.618) ); // returns: 22px
// font-size: ceil( modular-scale(14px, 1, 1.618) ); // returns: 23px
// }
//
// modularscale.com
@function golden-ratio($value, $increment) {
@return modular-scale($value, $increment, 1.618)
}
// div {
// font-size: golden-ratio(14px, 1); // returns: 22.652px
// }
//
// goldenratiocalculator.com
apps/openassessment/xblock/static/sass/xb/libs/bourbon/functions/_px-to-em.scss 0 → 100644
// Convert pixels to ems
// eg. for a relational value of 12px write em(12) when the parent is 16px
// if the parent is another value say 24px write em(12, 24)
@function em($pxval, $base: 16) {
@return ($pxval / $base) * 1em;
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/functions/_radial-gradient.scss 0 → 100644
// This function is required and used by the background-image mixin.
@function radial-gradient($G1, $G2,
$G3: false, $G4: false,
$G5: false, $G6: false,
$G7: false, $G8: false,
$G9: false, $G10: false,
$pos: null,
$shape-size: null) {
$data: _radial-arg-parser($G1, $G2, $pos, $shape-size);
$G1: nth($data, 1);
$G2: nth($data, 2);
$pos: nth($data, 3);
$shape-size: nth($data, 4);
$type: radial;
$gradient: compact($G1, $G2, $G3, $G4, $G5, $G6, $G7, $G8, $G9, $G10);
$type-gradient: $type, $shape-size $pos, $gradient;
@return $type-gradient;
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/functions/_tint-shade.scss 0 → 100644
// Add percentage of white to a color
@function tint($color, $percent){
@return mix(white, $color, $percent);
}
// Add percentage of black to a color
@function shade($color, $percent){
@return mix(black, $color, $percent);
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/functions/_transition-property-name.scss 0 → 100644
// Return vendor-prefixed property names if appropriate
// Example: transition-property-names((transform, color, background), moz) -> -moz-transform, color, background
//************************************************************************//
@function transition-property-names($props, $vendor: false) {
$new-props: ();
@each $prop in $props {
$new-props: append($new-props, transition-property-name($prop, $vendor), comma);
}
@return $new-props;
}
@function transition-property-name($prop, $vendor: false) {
// put other properties that need to be prefixed here aswell
@if $vendor and $prop == transform {
@return unquote('-'+$vendor+'-'+$prop);
}
@else {
@return $prop;
}
}
\ No newline at end of file
apps/openassessment/xblock/static/sass/xb/libs/bourbon/helpers/_deprecated-webkit-gradient.scss 0 → 100644
// Render Deprecated Webkit Gradient - Linear || Radial
//************************************************************************//
@function _deprecated-webkit-gradient($type,
$deprecated-pos1, $deprecated-pos2,
$full,
$deprecated-radius1: false, $deprecated-radius2: false) {
$gradient-list: ();
$gradient: false;
$full-length: length($full);
$percentage: false;
$gradient-type: $type;
@for $i from 1 through $full-length {
$gradient: nth($full, $i);
@if length($gradient) == 2 {
$color-stop: color-stop(nth($gradient, 2), nth($gradient, 1));
$gradient-list: join($gradient-list, $color-stop, comma);
}
@else if $gradient != null {
@if $i == $full-length {
$percentage: 100%;
}
@else {
$percentage: ($i - 1) * (100 / ($full-length - 1)) + "%";
}
$color-stop: color-stop(unquote($percentage), $gradient);
$gradient-list: join($gradient-list, $color-stop, comma);
}
}
@if $type == radial {
$gradient: -webkit-gradient(radial, $deprecated-pos1, $deprecated-radius1, $deprecated-pos2, $deprecated-radius2, $gradient-list);
}
@else if $type == linear {
$gradient: -webkit-gradient(linear, $deprecated-pos1, $deprecated-pos2, $gradient-list);
}
@return $gradient;
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/helpers/_gradient-positions-parser.scss 0 → 100644
@function _gradient-positions-parser($gradient-type, $gradient-positions) {
@if $gradient-positions
and ($gradient-type == linear)
and (type-of($gradient-positions) != color) {
$gradient-positions: _linear-positions-parser($gradient-positions);
}
@else if $gradient-positions
and ($gradient-type == radial)
and (type-of($gradient-positions) != color) {
$gradient-positions: _radial-positions-parser($gradient-positions);
}
@return $gradient-positions;
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/helpers/_linear-positions-parser.scss 0 → 100644
@function _linear-positions-parser($pos) {
$type: type-of(nth($pos, 1));
$spec: null;
$degree: null;
$side: null;
$corner: null;
$length: length($pos);
// Parse Side and corner positions
@if ($length > 1) {
@if nth($pos, 1) == "to" { // Newer syntax
$side: nth($pos, 2);
@if $length == 2 { // eg. to top
// Swap for backwards compatability
$degree: _position-flipper(nth($pos, 2));
}
@else if $length == 3 { // eg. to top left
$corner: nth($pos, 3);
}
}
@else if $length == 2 { // Older syntax ("top left")
$side: _position-flipper(nth($pos, 1));
$corner: _position-flipper(nth($pos, 2));
}
@if ("#{$side} #{$corner}" == "left top") or ("#{$side} #{$corner}" == "top left") {
$degree: _position-flipper(#{$side}) _position-flipper(#{$corner});
}
@else if ("#{$side} #{$corner}" == "right top") or ("#{$side} #{$corner}" == "top right") {
$degree: _position-flipper(#{$side}) _position-flipper(#{$corner});
}
@else if ("#{$side} #{$corner}" == "right bottom") or ("#{$side} #{$corner}" == "bottom right") {
$degree: _position-flipper(#{$side}) _position-flipper(#{$corner});
}
@else if ("#{$side} #{$corner}" == "left bottom") or ("#{$side} #{$corner}" == "bottom left") {
$degree: _position-flipper(#{$side}) _position-flipper(#{$corner});
}
$spec: to $side $corner;
}
@else if $length == 1 {
// Swap for backwards compatability
@if $type == string {
$degree: $pos;
$spec: to _position-flipper($pos);
}
@else {
$degree: -270 - $pos; //rotate the gradient opposite from spec
$spec: $pos;
}
}
$degree: unquote($degree + ",");
$spec: unquote($spec + ",");
@return $degree $spec;
}
@function _position-flipper($pos) {
@return if($pos == left, right, null)
if($pos == right, left, null)
if($pos == top, bottom, null)
if($pos == bottom, top, null);
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/helpers/_radial-arg-parser.scss 0 → 100644
@function _radial-arg-parser($G1, $G2, $pos, $shape-size) {
@each $value in $G1, $G2 {
$first-val: nth($value, 1);
$pos-type: type-of($first-val);
$spec-at-index: null;
// Determine if spec was passed to mixin
@if type-of($value) == list {
$spec-at-index: if(index($value, at), index($value, at), false);
}
@if $spec-at-index {
@if $spec-at-index > 1 {
@for $i from 1 through ($spec-at-index - 1) {
$shape-size: $shape-size nth($value, $i);
}
@for $i from ($spec-at-index + 1) through length($value) {
$pos: $pos nth($value, $i);
}
}
@else if $spec-at-index == 1 {
@for $i from ($spec-at-index + 1) through length($value) {
$pos: $pos nth($value, $i);
}
}
$G1: false;
}
// If not spec calculate correct values
@else {
@if ($pos-type != color) or ($first-val != "transparent") {
@if ($pos-type == number)
or ($first-val == "center")
or ($first-val == "top")
or ($first-val == "right")
or ($first-val == "bottom")
or ($first-val == "left") {
$pos: $value;
@if $pos == $G1 {
$G1: false;
}
}
@else if
($first-val == "ellipse")
or ($first-val == "circle")
or ($first-val == "closest-side")
or ($first-val == "closest-corner")
or ($first-val == "farthest-side")
or ($first-val == "farthest-corner")
or ($first-val == "contain")
or ($first-val == "cover") {
$shape-size: $value;
@if $value == $G1 {
$G1: false;
}
@else if $value == $G2 {
$G2: false;
}
}
}
}
}
@return $G1, $G2, $pos, $shape-size;
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/helpers/_radial-positions-parser.scss 0 → 100644
@function _radial-positions-parser($gradient-pos) {
$shape-size: nth($gradient-pos, 1);
$pos: nth($gradient-pos, 2);
$shape-size-spec: _shape-size-stripper($shape-size);
$pre-spec: unquote(if($pos, "#{$pos}, ", null))
unquote(if($shape-size, "#{$shape-size},", null));
$pos-spec: if($pos, "at #{$pos}", null);
$spec: "#{$shape-size-spec} #{$pos-spec}";
// Add comma
@if ($spec != ' ') {
$spec: "#{$spec},"
}
@return $pre-spec $spec;
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/helpers/_render-gradients.scss 0 → 100644
// User for linear and radial gradients within background-image or border-image properties
@function _render-gradients($gradient-positions, $gradients, $gradient-type, $vendor: false) {
$pre-spec: null;
$spec: null;
$vendor-gradients: null;
@if $gradient-type == linear {
@if $gradient-positions {
$pre-spec: nth($gradient-positions, 1);
$spec: nth($gradient-positions, 2);
}
}
@else if $gradient-type == radial {
$pre-spec: nth($gradient-positions, 1);
$spec: nth($gradient-positions, 2);
}
@if $vendor {
$vendor-gradients: -#{$vendor}-#{$gradient-type}-gradient(#{$pre-spec} $gradients);
}
@else if $vendor == false {
$vendor-gradients: "#{$gradient-type}-gradient(#{$spec} #{$gradients})";
$vendor-gradients: unquote($vendor-gradients);
}
@return $vendor-gradients;
}
apps/openassessment/xblock/static/sass/xb/libs/bourbon/helpers/_shape-size-stripper.scss 0 → 100644
@function _shape-size-stripper($shape-size) {
$shape-size-spec: null;
@each $value in $shape-size {
@if ($value == "cover") or ($value == "contain") {
$value: null;
}
$shape-size-spec: "#{$shape-size-spec} #{$value}";
}
@return $shape-size-spec;
}
apps/openassessment/xblock/static/sass/xb/libs/font-awesome/_bordered-pulled.scss 0 → 100644
// Bordered & Pulled
// -------------------------
.#{$fa-css-prefix}-border {
padding: .2em .25em .15em;
border: solid .08em $fa-border-color;
border-radius: .1em;
}
.pull-right { float: right; }
.pull-left { float: left; }
.#{$fa-css-prefix} {
&.pull-left { margin-right: .3em; }
&.pull-right { margin-left: .3em; }
}
apps/openassessment/xblock/static/sass/xb/libs/font-awesome/_core.scss 0 → 100644
// Base Class Definition
// -------------------------
.#{$fa-css-prefix} {
display: inline-block;
font-family: FontAwesome;
font-style: normal;
font-weight: normal;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
apps/openassessment/xblock/static/sass/xb/libs/font-awesome/_fixed-width.scss 0 → 100644
// Fixed Width Icons
// -------------------------
.#{$fa-css-prefix}-fw {
width: (18em / 14);
text-align: center;
}
apps/openassessment/xblock/static/sass/xb/libs/font-awesome/_icons.scss 0 → 100644
/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
readers do not read off random characters that represent icons */
.#{$fa-css-prefix}-glass:before { content: $fa-var-glass; }
.#{$fa-css-prefix}-music:before { content: $fa-var-music; }
.#{$fa-css-prefix}-search:before { content: $fa-var-search; }
.#{$fa-css-prefix}-envelope-o:before { content: $fa-var-envelope-o; }
.#{$fa-css-prefix}-heart:before { content: $fa-var-heart; }
.#{$fa-css-prefix}-star:before { content: $fa-var-star; }
.#{$fa-css-prefix}-star-o:before { content: $fa-var-star-o; }
.#{$fa-css-prefix}-user:before { content: $fa-var-user; }
.#{$fa-css-prefix}-film:before { content: $fa-var-film; }
.#{$fa-css-prefix}-th-large:before { content: $fa-var-th-large; }
.#{$fa-css-prefix}-th:before { content: $fa-var-th; }
.#{$fa-css-prefix}-th-list:before { content: $fa-var-th-list; }
.#{$fa-css-prefix}-check:before { content: $fa-var-check; }
.#{$fa-css-prefix}-times:before { content: $fa-var-times; }
.#{$fa-css-prefix}-search-plus:before { content: $fa-var-search-plus; }
.#{$fa-css-prefix}-search-minus:before { content: $fa-var-search-minus; }
.#{$fa-css-prefix}-power-off:before { content: $fa-var-power-off; }
.#{$fa-css-prefix}-signal:before { content: $fa-var-signal; }
.#{$fa-css-prefix}-gear:before,
.#{$fa-css-prefix}-cog:before { content: $fa-var-cog; }
.#{$fa-css-prefix}-trash-o:before { content: $fa-var-trash-o; }
.#{$fa-css-prefix}-home:before { content: $fa-var-home; }
.#{$fa-css-prefix}-file-o:before { content: $fa-var-file-o; }
.#{$fa-css-prefix}-clock-o:before { content: $fa-var-clock-o; }
.#{$fa-css-prefix}-road:before { content: $fa-var-road; }
.#{$fa-css-prefix}-download:before { content: $fa-var-download; }
.#{$fa-css-prefix}-arrow-circle-o-down:before { content: $fa-var-arrow-circle-o-down; }
.#{$fa-css-prefix}-arrow-circle-o-up:before { content: $fa-var-arrow-circle-o-up; }
.#{$fa-css-prefix}-inbox:before { content: $fa-var-inbox; }
.#{$fa-css-prefix}-play-circle-o:before { content: $fa-var-play-circle-o; }
.#{$fa-css-prefix}-rotate-right:before,
.#{$fa-css-prefix}-repeat:before { content: $fa-var-repeat; }
.#{$fa-css-prefix}-refresh:before { content: $fa-var-refresh; }
.#{$fa-css-prefix}-list-alt:before { content: $fa-var-list-alt; }
.#{$fa-css-prefix}-lock:before { content: $fa-var-lock; }
.#{$fa-css-prefix}-flag:before { content: $fa-var-flag; }
.#{$fa-css-prefix}-headphones:before { content: $fa-var-headphones; }
.#{$fa-css-prefix}-volume-off:before { content: $fa-var-volume-off; }
.#{$fa-css-prefix}-volume-down:before { content: $fa-var-volume-down; }
.#{$fa-css-prefix}-volume-up:before { content: $fa-var-volume-up; }
.#{$fa-css-prefix}-qrcode:before { content: $fa-var-qrcode; }
.#{$fa-css-prefix}-barcode:before { content: $fa-var-barcode; }
.#{$fa-css-prefix}-tag:before { content: $fa-var-tag; }
.#{$fa-css-prefix}-tags:before { content: $fa-var-tags; }
.#{$fa-css-prefix}-book:before { content: $fa-var-book; }
.#{$fa-css-prefix}-bookmark:before { content: $fa-var-bookmark; }
.#{$fa-css-prefix}-print:before { content: $fa-var-print; }
.#{$fa-css-prefix}-camera:before { content: $fa-var-camera; }
.#{$fa-css-prefix}-font:before { content: $fa-var-font; }
.#{$fa-css-prefix}-bold:before { content: $fa-var-bold; }
.#{$fa-css-prefix}-italic:before { content: $fa-var-italic; }
.#{$fa-css-prefix}-text-height:before { content: $fa-var-text-height; }
.#{$fa-css-prefix}-text-width:before { content: $fa-var-text-width; }
.#{$fa-css-prefix}-align-left:before { content: $fa-var-align-left; }
.#{$fa-css-prefix}-align-center:before { content: $fa-var-align-center; }
.#{$fa-css-prefix}-align-right:before { content: $fa-var-align-right; }
.#{$fa-css-prefix}-align-justify:before { content: $fa-var-align-justify; }
.#{$fa-css-prefix}-list:before { content: $fa-var-list; }
.#{$fa-css-prefix}-dedent:before,
.#{$fa-css-prefix}-outdent:before { content: $fa-var-outdent; }
.#{$fa-css-prefix}-indent:before { content: $fa-var-indent; }
.#{$fa-css-prefix}-video-camera:before { content: $fa-var-video-camera; }
.#{$fa-css-prefix}-picture-o:before { content: $fa-var-picture-o; }
.#{$fa-css-prefix}-pencil:before { content: $fa-var-pencil; }
.#{$fa-css-prefix}-map-marker:before { content: $fa-var-map-marker; }
.#{$fa-css-prefix}-adjust:before { content: $fa-var-adjust; }
.#{$fa-css-prefix}-tint:before { content: $fa-var-tint; }
.#{$fa-css-prefix}-edit:before,
.#{$fa-css-prefix}-pencil-square-o:before { content: $fa-var-pencil-square-o; }
.#{$fa-css-prefix}-share-square-o:before { content: $fa-var-share-square-o; }
.#{$fa-css-prefix}-check-square-o:before { content: $fa-var-check-square-o; }
.#{$fa-css-prefix}-arrows:before { content: $fa-var-arrows; }
.#{$fa-css-prefix}-step-backward:before { content: $fa-var-step-backward; }
.#{$fa-css-prefix}-fast-backward:before { content: $fa-var-fast-backward; }
.#{$fa-css-prefix}-backward:before { content: $fa-var-backward; }
.#{$fa-css-prefix}-play:before { content: $fa-var-play; }
.#{$fa-css-prefix}-pause:before { content: $fa-var-pause; }
.#{$fa-css-prefix}-stop:before { content: $fa-var-stop; }
.#{$fa-css-prefix}-forward:before { content: $fa-var-forward; }
.#{$fa-css-prefix}-fast-forward:before { content: $fa-var-fast-forward; }
.#{$fa-css-prefix}-step-forward:before { content: $fa-var-step-forward; }
.#{$fa-css-prefix}-eject:before { content: $fa-var-eject; }
.#{$fa-css-prefix}-chevron-left:before { content: $fa-var-chevron-left; }
.#{$fa-css-prefix}-chevron-right:before { content: $fa-var-chevron-right; }
.#{$fa-css-prefix}-plus-circle:before { content: $fa-var-plus-circle; }
.#{$fa-css-prefix}-minus-circle:before { content: $fa-var-minus-circle; }
.#{$fa-css-prefix}-times-circle:before { content: $fa-var-times-circle; }
.#{$fa-css-prefix}-check-circle:before { content: $fa-var-check-circle; }
.#{$fa-css-prefix}-question-circle:before { content: $fa-var-question-circle; }
.#{$fa-css-prefix}-info-circle:before { content: $fa-var-info-circle; }
.#{$fa-css-prefix}-crosshairs:before { content: $fa-var-crosshairs; }
.#{$fa-css-prefix}-times-circle-o:before { content: $fa-var-times-circle-o; }
.#{$fa-css-prefix}-check-circle-o:before { content: $fa-var-check-circle-o; }
.#{$fa-css-prefix}-ban:before { content: $fa-var-ban; }
.#{$fa-css-prefix}-arrow-left:before { content: $fa-var-arrow-left; }
.#{$fa-css-prefix}-arrow-right:before { content: $fa-var-arrow-right; }
.#{$fa-css-prefix}-arrow-up:before { content: $fa-var-arrow-up; }
.#{$fa-css-prefix}-arrow-down:before { content: $fa-var-arrow-down; }
.#{$fa-css-prefix}-mail-forward:before,
.#{$fa-css-prefix}-share:before { content: $fa-var-share; }
.#{$fa-css-prefix}-expand:before { content: $fa-var-expand; }
.#{$fa-css-prefix}-compress:before { content: $fa-var-compress; }
.#{$fa-css-prefix}-plus:before { content: $fa-var-plus; }
.#{$fa-css-prefix}-minus:before { content: $fa-var-minus; }
.#{$fa-css-prefix}-asterisk:before { content: $fa-var-asterisk; }
.#{$fa-css-prefix}-exclamation-circle:before { content: $fa-var-exclamation-circle; }
.#{$fa-css-prefix}-gift:before { content: $fa-var-gift; }
.#{$fa-css-prefix}-leaf:before { content: $fa-var-leaf; }
.#{$fa-css-prefix}-fire:before { content: $fa-var-fire; }
.#{$fa-css-prefix}-eye:before { content: $fa-var-eye; }
.#{$fa-css-prefix}-eye-slash:before { content: $fa-var-eye-slash; }
.#{$fa-css-prefix}-warning:before,
.#{$fa-css-prefix}-exclamation-triangle:before { content: $fa-var-exclamation-triangle; }
.#{$fa-css-prefix}-plane:before { content: $fa-var-plane; }
.#{$fa-css-prefix}-calendar:before { content: $fa-var-calendar; }
.#{$fa-css-prefix}-random:before { content: $fa-var-random; }
.#{$fa-css-prefix}-comment:before { content: $fa-var-comment; }
.#{$fa-css-prefix}-magnet:before { content: $fa-var-magnet; }
.#{$fa-css-prefix}-chevron-up:before { content: $fa-var-chevron-up; }
.#{$fa-css-prefix}-chevron-down:before { content: $fa-var-chevron-down; }
.#{$fa-css-prefix}-retweet:before { content: $fa-var-retweet; }
.#{$fa-css-prefix}-shopping-cart:before { content: $fa-var-shopping-cart; }
.#{$fa-css-prefix}-folder:before { content: $fa-var-folder; }
.#{$fa-css-prefix}-folder-open:before { content: $fa-var-folder-open; }
.#{$fa-css-prefix}-arrows-v:before { content: $fa-var-arrows-v; }
.#{$fa-css-prefix}-arrows-h:before { content: $fa-var-arrows-h; }
.#{$fa-css-prefix}-bar-chart-o:before { content: $fa-var-bar-chart-o; }
.#{$fa-css-prefix}-twitter-square:before { content: $fa-var-twitter-square; }
.#{$fa-css-prefix}-facebook-square:before { content: $fa-var-facebook-square; }
.#{$fa-css-prefix}-camera-retro:before { content: $fa-var-camera-retro; }
.#{$fa-css-prefix}-key:before { content: $fa-var-key; }
.#{$fa-css-prefix}-gears:before,
.#{$fa-css-prefix}-cogs:before { content: $fa-var-cogs; }
.#{$fa-css-prefix}-comments:before { content: $fa-var-comments; }
.#{$fa-css-prefix}-thumbs-o-up:before { content: $fa-var-thumbs-o-up; }
.#{$fa-css-prefix}-thumbs-o-down:before { content: $fa-var-thumbs-o-down; }
.#{$fa-css-prefix}-star-half:before { content: $fa-var-star-half; }
.#{$fa-css-prefix}-heart-o:before { content: $fa-var-heart-o; }
.#{$fa-css-prefix}-sign-out:before { content: $fa-var-sign-out; }
.#{$fa-css-prefix}-linkedin-square:before { content: $fa-var-linkedin-square; }
.#{$fa-css-prefix}-thumb-tack:before { content: $fa-var-thumb-tack; }
.#{$fa-css-prefix}-external-link:before { content: $fa-var-external-link; }
.#{$fa-css-prefix}-sign-in:before { content: $fa-var-sign-in; }
.#{$fa-css-prefix}-trophy:before { content: $fa-var-trophy; }
.#{$fa-css-prefix}-github-square:before { content: $fa-var-github-square; }
.#{$fa-css-prefix}-upload:before { content: $fa-var-upload; }
.#{$fa-css-prefix}-lemon-o:before { content: $fa-var-lemon-o; }
.#{$fa-css-prefix}-phone:before { content: $fa-var-phone; }
.#{$fa-css-prefix}-square-o:before { content: $fa-var-square-o; }
.#{$fa-css-prefix}-bookmark-o:before { content: $fa-var-bookmark-o; }
.#{$fa-css-prefix}-phone-square:before { content: $fa-var-phone-square; }
.#{$fa-css-prefix}-twitter:before { content: $fa-var-twitter; }
.#{$fa-css-prefix}-facebook:before { content: $fa-var-facebook; }
.#{$fa-css-prefix}-github:before { content: $fa-var-github; }
.#{$fa-css-prefix}-unlock:before { content: $fa-var-unlock; }
.#{$fa-css-prefix}-credit-card:before { content: $fa-var-credit-card; }
.#{$fa-css-prefix}-rss:before { content: $fa-var-rss; }
.#{$fa-css-prefix}-hdd-o:before { content: $fa-var-hdd-o; }
.#{$fa-css-prefix}-bullhorn:before { content: $fa-var-bullhorn; }
.#{$fa-css-prefix}-bell:before { content: $fa-var-bell; }
.#{$fa-css-prefix}-certificate:before { content: $fa-var-certificate; }
.#{$fa-css-prefix}-hand-o-right:before { content: $fa-var-hand-o-right; }
.#{$fa-css-prefix}-hand-o-left:before { content: $fa-var-hand-o-left; }
.#{$fa-css-prefix}-hand-o-up:before { content: $fa-var-hand-o-up; }
.#{$fa-css-prefix}-hand-o-down:before { content: $fa-var-hand-o-down; }
.#{$fa-css-prefix}-arrow-circle-left:before { content: $fa-var-arrow-circle-left; }
.#{$fa-css-prefix}-arrow-circle-right:before { content: $fa-var-arrow-circle-right; }
.#{$fa-css-prefix}-arrow-circle-up:before { content: $fa-var-arrow-circle-up; }
.#{$fa-css-prefix}-arrow-circle-down:before { content: $fa-var-arrow-circle-down; }
.#{$fa-css-prefix}-globe:before { content: $fa-var-globe; }
.#{$fa-css-prefix}-wrench:before { content: $fa-var-wrench; }
.#{$fa-css-prefix}-tasks:before { content: $fa-var-tasks; }
.#{$fa-css-prefix}-filter:before { content: $fa-var-filter; }
.#{$fa-css-prefix}-briefcase:before { content: $fa-var-briefcase; }
.#{$fa-css-prefix}-arrows-alt:before { content: $fa-var-arrows-alt; }
.#{$fa-css-prefix}-group:before,
.#{$fa-css-prefix}-users:before { content: $fa-var-users; }
.#{$fa-css-prefix}-chain:before,
.#{$fa-css-prefix}-link:before { content: $fa-var-link; }
.#{$fa-css-prefix}-cloud:before { content: $fa-var-cloud; }
.#{$fa-css-prefix}-flask:before { content: $fa-var-flask; }
.#{$fa-css-prefix}-cut:before,
.#{$fa-css-prefix}-scissors:before { content: $fa-var-scissors; }
.#{$fa-css-prefix}-copy:before,
.#{$fa-css-prefix}-files-o:before { content: $fa-var-files-o; }
.#{$fa-css-prefix}-paperclip:before { content: $fa-var-paperclip; }
.#{$fa-css-prefix}-save:before,
.#{$fa-css-prefix}-floppy-o:before { content: $fa-var-floppy-o; }
.#{$fa-css-prefix}-square:before { content: $fa-var-square; }
.#{$fa-css-prefix}-bars:before { content: $fa-var-bars; }
.#{$fa-css-prefix}-list-ul:before { content: $fa-var-list-ul; }
.#{$fa-css-prefix}-list-ol:before { content: $fa-var-list-ol; }
.#{$fa-css-prefix}-strikethrough:before { content: $fa-var-strikethrough; }
.#{$fa-css-prefix}-underline:before { content: $fa-var-underline; }
.#{$fa-css-prefix}-table:before { content: $fa-var-table; }
.#{$fa-css-prefix}-magic:before { content: $fa-var-magic; }
.#{$fa-css-prefix}-truck:before { content: $fa-var-truck; }
.#{$fa-css-prefix}-pinterest:before { content: $fa-var-pinterest; }
.#{$fa-css-prefix}-pinterest-square:before { content: $fa-var-pinterest-square; }
.#{$fa-css-prefix}-google-plus-square:before { content: $fa-var-google-plus-square; }
.#{$fa-css-prefix}-google-plus:before { content: $fa-var-google-plus; }
.#{$fa-css-prefix}-money:before { content: $fa-var-money; }
.#{$fa-css-prefix}-caret-down:before { content: $fa-var-caret-down; }
.#{$fa-css-prefix}-caret-up:before { content: $fa-var-caret-up; }
.#{$fa-css-prefix}-caret-left:before { content: $fa-var-caret-left; }
.#{$fa-css-prefix}-caret-right:before { content: $fa-var-caret-right; }
.#{$fa-css-prefix}-columns:before { content: $fa-var-columns; }
.#{$fa-css-prefix}-unsorted:before,
.#{$fa-css-prefix}-sort:before { content: $fa-var-sort; }
.#{$fa-css-prefix}-sort-down:before,
.#{$fa-css-prefix}-sort-asc:before { content: $fa-var-sort-asc; }
.#{$fa-css-prefix}-sort-up:before,
.#{$fa-css-prefix}-sort-desc:before { content: $fa-var-sort-desc; }
.#{$fa-css-prefix}-envelope:before { content: $fa-var-envelope; }
.#{$fa-css-prefix}-linkedin:before { content: $fa-var-linkedin; }
.#{$fa-css-prefix}-rotate-left:before,
.#{$fa-css-prefix}-undo:before { content: $fa-var-undo; }
.#{$fa-css-prefix}-legal:before,
.#{$fa-css-prefix}-gavel:before { content: $fa-var-gavel; }
.#{$fa-css-prefix}-dashboard:before,
.#{$fa-css-prefix}-tachometer:before { content: $fa-var-tachometer; }
.#{$fa-css-prefix}-comment-o:before { content: $fa-var-comment-o; }
.#{$fa-css-prefix}-comments-o:before { content: $fa-var-comments-o; }
.#{$fa-css-prefix}-flash:before,
.#{$fa-css-prefix}-bolt:before { content: $fa-var-bolt; }
.#{$fa-css-prefix}-sitemap:before { content: $fa-var-sitemap; }
.#{$fa-css-prefix}-umbrella:before { content: $fa-var-umbrella; }
.#{$fa-css-prefix}-paste:before,
.#{$fa-css-prefix}-clipboard:before { content: $fa-var-clipboard; }
.#{$fa-css-prefix}-lightbulb-o:before { content: $fa-var-lightbulb-o; }
.#{$fa-css-prefix}-exchange:before { content: $fa-var-exchange; }
.#{$fa-css-prefix}-cloud-download:before { content: $fa-var-cloud-download; }
.#{$fa-css-prefix}-cloud-upload:before { content: $fa-var-cloud-upload; }
.#{$fa-css-prefix}-user-md:before { content: $fa-var-user-md; }
.#{$fa-css-prefix}-stethoscope:before { content: $fa-var-stethoscope; }
.#{$fa-css-prefix}-suitcase:before { content: $fa-var-suitcase; }
.#{$fa-css-prefix}-bell-o:before { content: $fa-var-bell-o; }
.#{$fa-css-prefix}-coffee:before { content: $fa-var-coffee; }
.#{$fa-css-prefix}-cutlery:before { content: $fa-var-cutlery; }
.#{$fa-css-prefix}-file-text-o:before { content: $fa-var-file-text-o; }
.#{$fa-css-prefix}-building-o:before { content: $fa-var-building-o; }
.#{$fa-css-prefix}-hospital-o:before { content: $fa-var-hospital-o; }
.#{$fa-css-prefix}-ambulance:before { content: $fa-var-ambulance; }
.#{$fa-css-prefix}-medkit:before { content: $fa-var-medkit; }
.#{$fa-css-prefix}-fighter-jet:before { content: $fa-var-fighter-jet; }
.#{$fa-css-prefix}-beer:before { content: $fa-var-beer; }
.#{$fa-css-prefix}-h-square:before { content: $fa-var-h-square; }
.#{$fa-css-prefix}-plus-square:before { content: $fa-var-plus-square; }
.#{$fa-css-prefix}-angle-double-left:before { content: $fa-var-angle-double-left; }
.#{$fa-css-prefix}-angle-double-right:before { content: $fa-var-angle-double-right; }
.#{$fa-css-prefix}-angle-double-up:before { content: $fa-var-angle-double-up; }
.#{$fa-css-prefix}-angle-double-down:before { content: $fa-var-angle-double-down; }
.#{$fa-css-prefix}-angle-left:before { content: $fa-var-angle-left; }
.#{$fa-css-prefix}-angle-right:before { content: $fa-var-angle-right; }
.#{$fa-css-prefix}-angle-up:before { content: $fa-var-angle-up; }
.#{$fa-css-prefix}-angle-down:before { content: $fa-var-angle-down; }
.#{$fa-css-prefix}-desktop:before { content: $fa-var-desktop; }
.#{$fa-css-prefix}-laptop:before { content: $fa-var-laptop; }
.#{$fa-css-prefix}-tablet:before { content: $fa-var-tablet; }
.#{$fa-css-prefix}-mobile-phone:before,
.#{$fa-css-prefix}-mobile:before { content: $fa-var-mobile; }
.#{$fa-css-prefix}-circle-o:before { content: $fa-var-circle-o; }
.#{$fa-css-prefix}-quote-left:before { content: $fa-var-quote-left; }
.#{$fa-css-prefix}-quote-right:before { content: $fa-var-quote-right; }
.#{$fa-css-prefix}-spinner:before { content: $fa-var-spinner; }
.#{$fa-css-prefix}-circle:before { content: $fa-var-circle; }
.#{$fa-css-prefix}-mail-reply:before,
.#{$fa-css-prefix}-reply:before { content: $fa-var-reply; }
.#{$fa-css-prefix}-github-alt:before { content: $fa-var-github-alt; }
.#{$fa-css-prefix}-folder-o:before { content: $fa-var-folder-o; }
.#{$fa-css-prefix}-folder-open-o:before { content: $fa-var-folder-open-o; }
.#{$fa-css-prefix}-smile-o:before { content: $fa-var-smile-o; }
.#{$fa-css-prefix}-frown-o:before { content: $fa-var-frown-o; }
.#{$fa-css-prefix}-meh-o:before { content: $fa-var-meh-o; }
.#{$fa-css-prefix}-gamepad:before { content: $fa-var-gamepad; }
.#{$fa-css-prefix}-keyboard-o:before { content: $fa-var-keyboard-o; }
.#{$fa-css-prefix}-flag-o:before { content: $fa-var-flag-o; }
.#{$fa-css-prefix}-flag-checkered:before { content: $fa-var-flag-checkered; }
.#{$fa-css-prefix}-terminal:before { content: $fa-var-terminal; }
.#{$fa-css-prefix}-code:before { content: $fa-var-code; }
.#{$fa-css-prefix}-reply-all:before { content: $fa-var-reply-all; }
.#{$fa-css-prefix}-mail-reply-all:before { content: $fa-var-mail-reply-all; }
.#{$fa-css-prefix}-star-half-empty:before,
.#{$fa-css-prefix}-star-half-full:before,
.#{$fa-css-prefix}-star-half-o:before { content: $fa-var-star-half-o; }
.#{$fa-css-prefix}-location-arrow:before { content: $fa-var-location-arrow; }
.#{$fa-css-prefix}-crop:before { content: $fa-var-crop; }
.#{$fa-css-prefix}-code-fork:before { content: $fa-var-code-fork; }
.#{$fa-css-prefix}-unlink:before,
.#{$fa-css-prefix}-chain-broken:before { content: $fa-var-chain-broken; }
.#{$fa-css-prefix}-question:before { content: $fa-var-question; }
.#{$fa-css-prefix}-info:before { content: $fa-var-info; }
.#{$fa-css-prefix}-exclamation:before { content: $fa-var-exclamation; }
.#{$fa-css-prefix}-superscript:before { content: $fa-var-superscript; }
.#{$fa-css-prefix}-subscript:before { content: $fa-var-subscript; }
.#{$fa-css-prefix}-eraser:before { content: $fa-var-eraser; }
.#{$fa-css-prefix}-puzzle-piece:before { content: $fa-var-puzzle-piece; }
.#{$fa-css-prefix}-microphone:before { content: $fa-var-microphone; }
.#{$fa-css-prefix}-microphone-slash:before { content: $fa-var-microphone-slash; }
.#{$fa-css-prefix}-shield:before { content: $fa-var-shield; }
.#{$fa-css-prefix}-calendar-o:before { content: $fa-var-calendar-o; }
.#{$fa-css-prefix}-fire-extinguisher:before { content: $fa-var-fire-extinguisher; }
.#{$fa-css-prefix}-rocket:before { content: $fa-var-rocket; }
.#{$fa-css-prefix}-maxcdn:before { content: $fa-var-maxcdn; }
.#{$fa-css-prefix}-chevron-circle-left:before { content: $fa-var-chevron-circle-left; }
.#{$fa-css-prefix}-chevron-circle-right:before { content: $fa-var-chevron-circle-right; }
.#{$fa-css-prefix}-chevron-circle-up:before { content: $fa-var-chevron-circle-up; }
.#{$fa-css-prefix}-chevron-circle-down:before { content: $fa-var-chevron-circle-down; }
.#{$fa-css-prefix}-html5:before { content: $fa-var-html5; }
.#{$fa-css-prefix}-css3:before { content: $fa-var-css3; }
.#{$fa-css-prefix}-anchor:before { content: $fa-var-anchor; }
.#{$fa-css-prefix}-unlock-alt:before { content: $fa-var-unlock-alt; }
.#{$fa-css-prefix}-bullseye:before { content: $fa-var-bullseye; }
.#{$fa-css-prefix}-ellipsis-h:before { content: $fa-var-ellipsis-h; }
.#{$fa-css-prefix}-ellipsis-v:before { content: $fa-var-ellipsis-v; }
.#{$fa-css-prefix}-rss-square:before { content: $fa-var-rss-square; }
.#{$fa-css-prefix}-play-circle:before { content: $fa-var-play-circle; }
.#{$fa-css-prefix}-ticket:before { content: $fa-var-ticket; }
.#{$fa-css-prefix}-minus-square:before { content: $fa-var-minus-square; }
.#{$fa-css-prefix}-minus-square-o:before { content: $fa-var-minus-square-o; }
.#{$fa-css-prefix}-level-up:before { content: $fa-var-level-up; }
.#{$fa-css-prefix}-level-down:before { content: $fa-var-level-down; }
.#{$fa-css-prefix}-check-square:before { content: $fa-var-check-square; }
.#{$fa-css-prefix}-pencil-square:before { content: $fa-var-pencil-square; }
.#{$fa-css-prefix}-external-link-square:before { content: $fa-var-external-link-square; }
.#{$fa-css-prefix}-share-square:before { content: $fa-var-share-square; }
.#{$fa-css-prefix}-compass:before { content: $fa-var-compass; }
.#{$fa-css-prefix}-toggle-down:before,
.#{$fa-css-prefix}-caret-square-o-down:before { content: $fa-var-caret-square-o-down; }
.#{$fa-css-prefix}-toggle-up:before,
.#{$fa-css-prefix}-caret-square-o-up:before { content: $fa-var-caret-square-o-up; }
.#{$fa-css-prefix}-toggle-right:before,
.#{$fa-css-prefix}-caret-square-o-right:before { content: $fa-var-caret-square-o-right; }
.#{$fa-css-prefix}-euro:before,
.#{$fa-css-prefix}-eur:before { content: $fa-var-eur; }
.#{$fa-css-prefix}-gbp:before { content: $fa-var-gbp; }
.#{$fa-css-prefix}-dollar:before,
.#{$fa-css-prefix}-usd:before { content: $fa-var-usd; }
.#{$fa-css-prefix}-rupee:before,
.#{$fa-css-prefix}-inr:before { content: $fa-var-inr; }
.#{$fa-css-prefix}-cny:before,
.#{$fa-css-prefix}-rmb:before,
.#{$fa-css-prefix}-yen:before,
.#{$fa-css-prefix}-jpy:before { content: $fa-var-jpy; }
.#{$fa-css-prefix}-ruble:before,
.#{$fa-css-prefix}-rouble:before,
.#{$fa-css-prefix}-rub:before { content: $fa-var-rub; }
.#{$fa-css-prefix}-won:before,
.#{$fa-css-prefix}-krw:before { content: $fa-var-krw; }
.#{$fa-css-prefix}-bitcoin:before,
.#{$fa-css-prefix}-btc:before { content: $fa-var-btc; }
.#{$fa-css-prefix}-file:before { content: $fa-var-file; }
.#{$fa-css-prefix}-file-text:before { content: $fa-var-file-text; }
.#{$fa-css-prefix}-sort-alpha-asc:before { content: $fa-var-sort-alpha-asc; }
.#{$fa-css-prefix}-sort-alpha-desc:before { content: $fa-var-sort-alpha-desc; }
.#{$fa-css-prefix}-sort-amount-asc:before { content: $fa-var-sort-amount-asc; }
.#{$fa-css-prefix}-sort-amount-desc:before { content: $fa-var-sort-amount-desc; }
.#{$fa-css-prefix}-sort-numeric-asc:before { content: $fa-var-sort-numeric-asc; }
.#{$fa-css-prefix}-sort-numeric-desc:before { content: $fa-var-sort-numeric-desc; }
.#{$fa-css-prefix}-thumbs-up:before { content: $fa-var-thumbs-up; }
.#{$fa-css-prefix}-thumbs-down:before { content: $fa-var-thumbs-down; }
.#{$fa-css-prefix}-youtube-square:before { content: $fa-var-youtube-square; }
.#{$fa-css-prefix}-youtube:before { content: $fa-var-youtube; }
.#{$fa-css-prefix}-xing:before { content: $fa-var-xing; }
.#{$fa-css-prefix}-xing-square:before { content: $fa-var-xing-square; }
.#{$fa-css-prefix}-youtube-play:before { content: $fa-var-youtube-play; }
.#{$fa-css-prefix}-dropbox:before { content: $fa-var-dropbox; }
.#{$fa-css-prefix}-stack-overflow:before { content: $fa-var-stack-overflow; }
.#{$fa-css-prefix}-instagram:before { content: $fa-var-instagram; }
.#{$fa-css-prefix}-flickr:before { content: $fa-var-flickr; }
.#{$fa-css-prefix}-adn:before { content: $fa-var-adn; }
.#{$fa-css-prefix}-bitbucket:before { content: $fa-var-bitbucket; }
.#{$fa-css-prefix}-bitbucket-square:before { content: $fa-var-bitbucket-square; }
.#{$fa-css-prefix}-tumblr:before { content: $fa-var-tumblr; }
.#{$fa-css-prefix}-tumblr-square:before { content: $fa-var-tumblr-square; }
.#{$fa-css-prefix}-long-arrow-down:before { content: $fa-var-long-arrow-down; }
.#{$fa-css-prefix}-long-arrow-up:before { content: $fa-var-long-arrow-up; }
.#{$fa-css-prefix}-long-arrow-left:before { content: $fa-var-long-arrow-left; }
.#{$fa-css-prefix}-long-arrow-right:before { content: $fa-var-long-arrow-right; }
.#{$fa-css-prefix}-apple:before { content: $fa-var-apple; }
.#{$fa-css-prefix}-windows:before { content: $fa-var-windows; }
.#{$fa-css-prefix}-android:before { content: $fa-var-android; }
.#{$fa-css-prefix}-linux:before { content: $fa-var-linux; }
.#{$fa-css-prefix}-dribbble:before { content: $fa-var-dribbble; }
.#{$fa-css-prefix}-skype:before { content: $fa-var-skype; }
.#{$fa-css-prefix}-foursquare:before { content: $fa-var-foursquare; }
.#{$fa-css-prefix}-trello:before { content: $fa-var-trello; }
.#{$fa-css-prefix}-female:before { content: $fa-var-female; }
.#{$fa-css-prefix}-male:before { content: $fa-var-male; }
.#{$fa-css-prefix}-gittip:before { content: $fa-var-gittip; }
.#{$fa-css-prefix}-sun-o:before { content: $fa-var-sun-o; }
.#{$fa-css-prefix}-moon-o:before { content: $fa-var-moon-o; }
.#{$fa-css-prefix}-archive:before { content: $fa-var-archive; }
.#{$fa-css-prefix}-bug:before { content: $fa-var-bug; }
.#{$fa-css-prefix}-vk:before { content: $fa-var-vk; }
.#{$fa-css-prefix}-weibo:before { content: $fa-var-weibo; }
.#{$fa-css-prefix}-renren:before { content: $fa-var-renren; }
.#{$fa-css-prefix}-pagelines:before { content: $fa-var-pagelines; }
.#{$fa-css-prefix}-stack-exchange:before { content: $fa-var-stack-exchange; }
.#{$fa-css-prefix}-arrow-circle-o-right:before { content: $fa-var-arrow-circle-o-right; }
.#{$fa-css-prefix}-arrow-circle-o-left:before { content: $fa-var-arrow-circle-o-left; }
.#{$fa-css-prefix}-toggle-left:before,
.#{$fa-css-prefix}-caret-square-o-left:before { content: $fa-var-caret-square-o-left; }
.#{$fa-css-prefix}-dot-circle-o:before { content: $fa-var-dot-circle-o; }
.#{$fa-css-prefix}-wheelchair:before { content: $fa-var-wheelchair; }
.#{$fa-css-prefix}-vimeo-square:before { content: $fa-var-vimeo-square; }
.#{$fa-css-prefix}-turkish-lira:before,
.#{$fa-css-prefix}-try:before { content: $fa-var-try; }
.#{$fa-css-prefix}-plus-square-o:before { content: $fa-var-plus-square-o; }
apps/openassessment/xblock/static/sass/xb/libs/font-awesome/_larger.scss 0 → 100644
// Icon Sizes
// -------------------------
/* makes the font 33% larger relative to the icon container */
.#{$fa-css-prefix}-lg {
font-size: (4em / 3);
line-height: (3em / 4);
vertical-align: -15%;
}
.#{$fa-css-prefix}-2x { font-size: 2em; }
.#{$fa-css-prefix}-3x { font-size: 3em; }
.#{$fa-css-prefix}-4x { font-size: 4em; }
.#{$fa-css-prefix}-5x { font-size: 5em; }
apps/openassessment/xblock/static/sass/xb/libs/font-awesome/_list.scss 0 → 100644
// List Icons
// -------------------------
.#{$fa-css-prefix}-ul {
padding-left: 0;
margin-left: $fa-li-width;
list-style-type: none;
> li { position: relative; }
}
.#{$fa-css-prefix}-li {
position: absolute;
left: -$fa-li-width;
width: $fa-li-width;
top: (2em / 14);
text-align: center;
&.#{$fa-css-prefix}-lg {
left: -$fa-li-width + (4em / 14);
}
}
apps/openassessment/xblock/static/sass/xb/libs/font-awesome/_mixins.scss 0 → 100644
// Mixins
// --------------------------
@mixin fa-icon-rotate($degrees, $rotation) {
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=$rotation);
-webkit-transform: rotate($degrees);
-moz-transform: rotate($degrees);
-ms-transform: rotate($degrees);
-o-transform: rotate($degrees);
transform: rotate($degrees);
}
@mixin fa-icon-flip($horiz, $vert, $rotation) {
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=$rotation);
-webkit-transform: scale($horiz, $vert);
-moz-transform: scale($horiz, $vert);
-ms-transform: scale($horiz, $vert);
-o-transform: scale($horiz, $vert);
transform: scale($horiz, $vert);
}
apps/openassessment/xblock/static/sass/xb/libs/font-awesome/_path.scss 0 → 100644
/* FONT PATH
* -------------------------- */
@font-face {
font-family: 'FontAwesome';
src: url('#{$fa-font-path}/fontawesome-webfont.eot?v=#{$fa-version}');
src: url('#{$fa-font-path}/fontawesome-webfont.eot?#iefix&v=#{$fa-version}') format('embedded-opentype'),
url('#{$fa-font-path}/fontawesome-webfont.woff?v=#{$fa-version}') format('woff'),
url('#{$fa-font-path}/fontawesome-webfont.ttf?v=#{$fa-version}') format('truetype'),
url('#{$fa-font-path}/fontawesome-webfont.svg?v=#{$fa-version}#fontawesomeregular') format('svg');
//src: url('#{$fa-font-path}/FontAwesome.otf') format('opentype'); // used when developing fonts
font-weight: normal;
font-style: normal;
}
apps/openassessment/xblock/static/sass/xb/libs/font-awesome/_rotated-flipped.scss 0 → 100644
// Rotated & Flipped Icons
// -------------------------
.#{$fa-css-prefix}-rotate-90 { @include fa-icon-rotate(90deg, 1); }
.#{$fa-css-prefix}-rotate-180 { @include fa-icon-rotate(180deg, 2); }
.#{$fa-css-prefix}-rotate-270 { @include fa-icon-rotate(270deg, 3); }
.#{$fa-css-prefix}-flip-horizontal { @include fa-icon-flip(-1, 1, 0); }
.#{$fa-css-prefix}-flip-vertical { @include fa-icon-flip(1, -1, 2); }
apps/openassessment/xblock/static/sass/xb/libs/font-awesome/_spinning.scss 0 → 100644
// Spinning Icons
// --------------------------
.#{$fa-css-prefix}-spin {
-webkit-animation: spin 2s infinite linear;
-moz-animation: spin 2s infinite linear;
-o-animation: spin 2s infinite linear;
animation: spin 2s infinite linear;
}
@-moz-keyframes spin {
0% { -moz-transform: rotate(0deg); }
100% { -moz-transform: rotate(359deg); }
}
@-webkit-keyframes spin {
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(359deg); }
}
@-o-keyframes spin {
0% { -o-transform: rotate(0deg); }
100% { -o-transform: rotate(359deg); }
}
@-ms-keyframes spin {
0% { -ms-transform: rotate(0deg); }
100% { -ms-transform: rotate(359deg); }
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(359deg); }
}
apps/openassessment/xblock/static/sass/xb/libs/font-awesome/_stacked.scss 0 → 100644
// Stacked Icons
// -------------------------
.#{$fa-css-prefix}-stack {
position: relative;
display: inline-block;
width: 2em;
height: 2em;
line-height: 2em;
vertical-align: middle;
}
.#{$fa-css-prefix}-stack-1x, .#{$fa-css-prefix}-stack-2x {
position: absolute;
left: 0;
width: 100%;
text-align: center;
}
.#{$fa-css-prefix}-stack-1x { line-height: inherit; }
.#{$fa-css-prefix}-stack-2x { font-size: 2em; }
.#{$fa-css-prefix}-inverse { color: $fa-inverse; }
apps/openassessment/xblock/static/sass/xb/libs/font-awesome/_variables.scss 0 → 100644
// Variables
// --------------------------
$fa-font-path: '../fonts/libs/font-awesome';
// $fa-font-path: "../fonts" !default;
//$fa-font-path: "//netdna.bootstrapcdn.com/font-awesome/4.0.3/fonts" !default; // for referencing Bootstrap CDN font files directly
$fa-css-prefix: fa !default;
$fa-version: "4.0.3" !default;
$fa-border-color: #eee !default;
$fa-inverse: #fff !default;
$fa-li-width: (30em / 14) !default;
$fa-var-glass: "\f000";
$fa-var-music: "\f001";
$fa-var-search: "\f002";
$fa-var-envelope-o: "\f003";
$fa-var-heart: "\f004";
$fa-var-star: "\f005";
$fa-var-star-o: "\f006";
$fa-var-user: "\f007";
$fa-var-film: "\f008";
$fa-var-th-large: "\f009";
$fa-var-th: "\f00a";
$fa-var-th-list: "\f00b";
$fa-var-check: "\f00c";
$fa-var-times: "\f00d";
$fa-var-search-plus: "\f00e";
$fa-var-search-minus: "\f010";
$fa-var-power-off: "\f011";
$fa-var-signal: "\f012";
$fa-var-cog: "\f013";
$fa-var-trash-o: "\f014";
$fa-var-home: "\f015";
$fa-var-file-o: "\f016";
$fa-var-clock-o: "\f017";
$fa-var-road: "\f018";
$fa-var-download: "\f019";
$fa-var-arrow-circle-o-down: "\f01a";
$fa-var-arrow-circle-o-up: "\f01b";
$fa-var-inbox: "\f01c";
$fa-var-play-circle-o: "\f01d";
$fa-var-repeat: "\f01e";
$fa-var-refresh: "\f021";
$fa-var-list-alt: "\f022";
$fa-var-lock: "\f023";
$fa-var-flag: "\f024";
$fa-var-headphones: "\f025";
$fa-var-volume-off: "\f026";
$fa-var-volume-down: "\f027";
$fa-var-volume-up: "\f028";
$fa-var-qrcode: "\f029";
$fa-var-barcode: "\f02a";
$fa-var-tag: "\f02b";
$fa-var-tags: "\f02c";
$fa-var-book: "\f02d";
$fa-var-bookmark: "\f02e";
$fa-var-print: "\f02f";
$fa-var-camera: "\f030";
$fa-var-font: "\f031";
$fa-var-bold: "\f032";
$fa-var-italic: "\f033";
$fa-var-text-height: "\f034";
$fa-var-text-width: "\f035";
$fa-var-align-left: "\f036";
$fa-var-align-center: "\f037";
$fa-var-align-right: "\f038";
$fa-var-align-justify: "\f039";
$fa-var-list: "\f03a";
$fa-var-outdent: "\f03b";
$fa-var-indent: "\f03c";
$fa-var-video-camera: "\f03d";
$fa-var-picture-o: "\f03e";
$fa-var-pencil: "\f040";
$fa-var-map-marker: "\f041";
$fa-var-adjust: "\f042";
$fa-var-tint: "\f043";
$fa-var-pencil-square-o: "\f044";
$fa-var-share-square-o: "\f045";
$fa-var-check-square-o: "\f046";
$fa-var-arrows: "\f047";
$fa-var-step-backward: "\f048";
$fa-var-fast-backward: "\f049";
$fa-var-backward: "\f04a";
$fa-var-play: "\f04b";
$fa-var-pause: "\f04c";
$fa-var-stop: "\f04d";
$fa-var-forward: "\f04e";
$fa-var-fast-forward: "\f050";
$fa-var-step-forward: "\f051";
$fa-var-eject: "\f052";
$fa-var-chevron-left: "\f053";
$fa-var-chevron-right: "\f054";
$fa-var-plus-circle: "\f055";
$fa-var-minus-circle: "\f056";
$fa-var-times-circle: "\f057";
$fa-var-check-circle: "\f058";
$fa-var-question-circle: "\f059";
$fa-var-info-circle: "\f05a";
$fa-var-crosshairs: "\f05b";
$fa-var-times-circle-o: "\f05c";
$fa-var-check-circle-o: "\f05d";
$fa-var-ban: "\f05e";
$fa-var-arrow-left: "\f060";
$fa-var-arrow-right: "\f061";
$fa-var-arrow-up: "\f062";
$fa-var-arrow-down: "\f063";
$fa-var-share: "\f064";
$fa-var-expand: "\f065";
$fa-var-compress: "\f066";
$fa-var-plus: "\f067";
$fa-var-minus: "\f068";
$fa-var-asterisk: "\f069";
$fa-var-exclamation-circle: "\f06a";
$fa-var-gift: "\f06b";
$fa-var-leaf: "\f06c";
$fa-var-fire: "\f06d";
$fa-var-eye: "\f06e";
$fa-var-eye-slash: "\f070";
$fa-var-exclamation-triangle: "\f071";
$fa-var-plane: "\f072";
$fa-var-calendar: "\f073";
$fa-var-random: "\f074";
$fa-var-comment: "\f075";
$fa-var-magnet: "\f076";
$fa-var-chevron-up: "\f077";
$fa-var-chevron-down: "\f078";
$fa-var-retweet: "\f079";
$fa-var-shopping-cart: "\f07a";
$fa-var-folder: "\f07b";
$fa-var-folder-open: "\f07c";
$fa-var-arrows-v: "\f07d";
$fa-var-arrows-h: "\f07e";
$fa-var-bar-chart-o: "\f080";
$fa-var-twitter-square: "\f081";
$fa-var-facebook-square: "\f082";
$fa-var-camera-retro: "\f083";
$fa-var-key: "\f084";
$fa-var-cogs: "\f085";
$fa-var-comments: "\f086";
$fa-var-thumbs-o-up: "\f087";
$fa-var-thumbs-o-down: "\f088";
$fa-var-star-half: "\f089";
$fa-var-heart-o: "\f08a";
$fa-var-sign-out: "\f08b";
$fa-var-linkedin-square: "\f08c";
$fa-var-thumb-tack: "\f08d";
$fa-var-external-link: "\f08e";
$fa-var-sign-in: "\f090";
$fa-var-trophy: "\f091";
$fa-var-github-square: "\f092";
$fa-var-upload: "\f093";
$fa-var-lemon-o: "\f094";
$fa-var-phone: "\f095";
$fa-var-square-o: "\f096";
$fa-var-bookmark-o: "\f097";
$fa-var-phone-square: "\f098";
$fa-var-twitter: "\f099";
$fa-var-facebook: "\f09a";
$fa-var-github: "\f09b";
$fa-var-unlock: "\f09c";
$fa-var-credit-card: "\f09d";
$fa-var-rss: "\f09e";
$fa-var-hdd-o: "\f0a0";
$fa-var-bullhorn: "\f0a1";
$fa-var-bell: "\f0f3";
$fa-var-certificate: "\f0a3";
$fa-var-hand-o-right: "\f0a4";
$fa-var-hand-o-left: "\f0a5";
$fa-var-hand-o-up: "\f0a6";
$fa-var-hand-o-down: "\f0a7";
$fa-var-arrow-circle-left: "\f0a8";
$fa-var-arrow-circle-right: "\f0a9";
$fa-var-arrow-circle-up: "\f0aa";
$fa-var-arrow-circle-down: "\f0ab";
$fa-var-globe: "\f0ac";
$fa-var-wrench: "\f0ad";
$fa-var-tasks: "\f0ae";
$fa-var-filter: "\f0b0";
$fa-var-briefcase: "\f0b1";
$fa-var-arrows-alt: "\f0b2";
$fa-var-users: "\f0c0";
$fa-var-link: "\f0c1";
$fa-var-cloud: "\f0c2";
$fa-var-flask: "\f0c3";
$fa-var-scissors: "\f0c4";
$fa-var-files-o: "\f0c5";
$fa-var-paperclip: "\f0c6";
$fa-var-floppy-o: "\f0c7";
$fa-var-square: "\f0c8";
$fa-var-bars: "\f0c9";
$fa-var-list-ul: "\f0ca";
$fa-var-list-ol: "\f0cb";
$fa-var-strikethrough: "\f0cc";
$fa-var-underline: "\f0cd";
$fa-var-table: "\f0ce";
$fa-var-magic: "\f0d0";
$fa-var-truck: "\f0d1";
$fa-var-pinterest: "\f0d2";
$fa-var-pinterest-square: "\f0d3";
$fa-var-google-plus-square: "\f0d4";
$fa-var-google-plus: "\f0d5";
$fa-var-money: "\f0d6";
$fa-var-caret-down: "\f0d7";
$fa-var-caret-up: "\f0d8";
$fa-var-caret-left: "\f0d9";
$fa-var-caret-right: "\f0da";
$fa-var-columns: "\f0db";
$fa-var-sort: "\f0dc";
$fa-var-sort-asc: "\f0dd";
$fa-var-sort-desc: "\f0de";
$fa-var-envelope: "\f0e0";
$fa-var-linkedin: "\f0e1";
$fa-var-undo: "\f0e2";
$fa-var-gavel: "\f0e3";
$fa-var-tachometer: "\f0e4";
$fa-var-comment-o: "\f0e5";
$fa-var-comments-o: "\f0e6";
$fa-var-bolt: "\f0e7";
$fa-var-sitemap: "\f0e8";
$fa-var-umbrella: "\f0e9";
$fa-var-clipboard: "\f0ea";
$fa-var-lightbulb-o: "\f0eb";
$fa-var-exchange: "\f0ec";
$fa-var-cloud-download: "\f0ed";
$fa-var-cloud-upload: "\f0ee";
$fa-var-user-md: "\f0f0";
$fa-var-stethoscope: "\f0f1";
$fa-var-suitcase: "\f0f2";
$fa-var-bell-o: "\f0a2";
$fa-var-coffee: "\f0f4";
$fa-var-cutlery: "\f0f5";
$fa-var-file-text-o: "\f0f6";
$fa-var-building-o: "\f0f7";
$fa-var-hospital-o: "\f0f8";
$fa-var-ambulance: "\f0f9";
$fa-var-medkit: "\f0fa";
$fa-var-fighter-jet: "\f0fb";
$fa-var-beer: "\f0fc";
$fa-var-h-square: "\f0fd";
$fa-var-plus-square: "\f0fe";
$fa-var-angle-double-left: "\f100";
$fa-var-angle-double-right: "\f101";
$fa-var-angle-double-up: "\f102";
$fa-var-angle-double-down: "\f103";
$fa-var-angle-left: "\f104";
$fa-var-angle-right: "\f105";
$fa-var-angle-up: "\f106";
$fa-var-angle-down: "\f107";
$fa-var-desktop: "\f108";
$fa-var-laptop: "\f109";
$fa-var-tablet: "\f10a";
$fa-var-mobile: "\f10b";
$fa-var-circle-o: "\f10c";
$fa-var-quote-left: "\f10d";
$fa-var-quote-right: "\f10e";
$fa-var-spinner: "\f110";
$fa-var-circle: "\f111";
$fa-var-reply: "\f112";
$fa-var-github-alt: "\f113";
$fa-var-folder-o: "\f114";
$fa-var-folder-open-o: "\f115";
$fa-var-smile-o: "\f118";
$fa-var-frown-o: "\f119";
$fa-var-meh-o: "\f11a";
$fa-var-gamepad: "\f11b";
$fa-var-keyboard-o: "\f11c";
$fa-var-flag-o: "\f11d";
$fa-var-flag-checkered: "\f11e";
$fa-var-terminal: "\f120";
$fa-var-code: "\f121";
$fa-var-reply-all: "\f122";
$fa-var-mail-reply-all: "\f122";
$fa-var-star-half-o: "\f123";
$fa-var-location-arrow: "\f124";
$fa-var-crop: "\f125";
$fa-var-code-fork: "\f126";
$fa-var-chain-broken: "\f127";
$fa-var-question: "\f128";
$fa-var-info: "\f129";
$fa-var-exclamation: "\f12a";
$fa-var-superscript: "\f12b";
$fa-var-subscript: "\f12c";
$fa-var-eraser: "\f12d";
$fa-var-puzzle-piece: "\f12e";
$fa-var-microphone: "\f130";
$fa-var-microphone-slash: "\f131";
$fa-var-shield: "\f132";
$fa-var-calendar-o: "\f133";
$fa-var-fire-extinguisher: "\f134";
$fa-var-rocket: "\f135";
$fa-var-maxcdn: "\f136";
$fa-var-chevron-circle-left: "\f137";
$fa-var-chevron-circle-right: "\f138";
$fa-var-chevron-circle-up: "\f139";
$fa-var-chevron-circle-down: "\f13a";
$fa-var-html5: "\f13b";
$fa-var-css3: "\f13c";
$fa-var-anchor: "\f13d";
$fa-var-unlock-alt: "\f13e";
$fa-var-bullseye: "\f140";
$fa-var-ellipsis-h: "\f141";
$fa-var-ellipsis-v: "\f142";
$fa-var-rss-square: "\f143";
$fa-var-play-circle: "\f144";
$fa-var-ticket: "\f145";
$fa-var-minus-square: "\f146";
$fa-var-minus-square-o: "\f147";
$fa-var-level-up: "\f148";
$fa-var-level-down: "\f149";
$fa-var-check-square: "\f14a";
$fa-var-pencil-square: "\f14b";
$fa-var-external-link-square: "\f14c";
$fa-var-share-square: "\f14d";
$fa-var-compass: "\f14e";
$fa-var-caret-square-o-down: "\f150";
$fa-var-caret-square-o-up: "\f151";
$fa-var-caret-square-o-right: "\f152";
$fa-var-eur: "\f153";
$fa-var-gbp: "\f154";
$fa-var-usd: "\f155";
$fa-var-inr: "\f156";
$fa-var-jpy: "\f157";
$fa-var-rub: "\f158";
$fa-var-krw: "\f159";
$fa-var-btc: "\f15a";
$fa-var-file: "\f15b";
$fa-var-file-text: "\f15c";
$fa-var-sort-alpha-asc: "\f15d";
$fa-var-sort-alpha-desc: "\f15e";
$fa-var-sort-amount-asc: "\f160";
$fa-var-sort-amount-desc: "\f161";
$fa-var-sort-numeric-asc: "\f162";
$fa-var-sort-numeric-desc: "\f163";
$fa-var-thumbs-up: "\f164";
$fa-var-thumbs-down: "\f165";
$fa-var-youtube-square: "\f166";
$fa-var-youtube: "\f167";
$fa-var-xing: "\f168";
$fa-var-xing-square: "\f169";
$fa-var-youtube-play: "\f16a";
$fa-var-dropbox: "\f16b";
$fa-var-stack-overflow: "\f16c";
$fa-var-instagram: "\f16d";
$fa-var-flickr: "\f16e";
$fa-var-adn: "\f170";
$fa-var-bitbucket: "\f171";
$fa-var-bitbucket-square: "\f172";
$fa-var-tumblr: "\f173";
$fa-var-tumblr-square: "\f174";
$fa-var-long-arrow-down: "\f175";
$fa-var-long-arrow-up: "\f176";
$fa-var-long-arrow-left: "\f177";
$fa-var-long-arrow-right: "\f178";
$fa-var-apple: "\f179";
$fa-var-windows: "\f17a";
$fa-var-android: "\f17b";
$fa-var-linux: "\f17c";
$fa-var-dribbble: "\f17d";
$fa-var-skype: "\f17e";
$fa-var-foursquare: "\f180";
$fa-var-trello: "\f181";
$fa-var-female: "\f182";
$fa-var-male: "\f183";
$fa-var-gittip: "\f184";
$fa-var-sun-o: "\f185";
$fa-var-moon-o: "\f186";
$fa-var-archive: "\f187";
$fa-var-bug: "\f188";
$fa-var-vk: "\f189";
$fa-var-weibo: "\f18a";
$fa-var-renren: "\f18b";
$fa-var-pagelines: "\f18c";
$fa-var-stack-exchange: "\f18d";
$fa-var-arrow-circle-o-right: "\f18e";
$fa-var-arrow-circle-o-left: "\f190";
$fa-var-caret-square-o-left: "\f191";
$fa-var-dot-circle-o: "\f192";
$fa-var-wheelchair: "\f193";
$fa-var-vimeo-square: "\f194";
$fa-var-try: "\f195";
$fa-var-plus-square-o: "\f196";
apps/openassessment/xblock/static/sass/xb/libs/font-awesome/font-awesome.scss 0 → 100644
/*!
* Font Awesome 4.0.3 by @davegandy - http://fontawesome.io - @fontawesome
* License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
*/
@import "variables";
@import "mixins";
@import "path";
@import "core";
@import "larger";
@import "fixed-width";
@import "list";
@import "bordered-pulled";
@import "spinning";
@import "rotated-flipped";
@import "stacked";
@import "icons";
apps/openassessment/xblock/static/sass/xb/libs/neat/_neat-helpers.scss 0 → 100644
// Functions
@import "functions/private";
@import "functions/new-breakpoint";
// Settings
@import "settings/grid";
@import "settings/visual-grid";
apps/openassessment/xblock/static/sass/xb/libs/neat/_neat.scss 0 → 100644
// Bourbon Neat 1.5.0
// MIT Licensed
// Copyright (c) 2012-2013 thoughtbot, inc.
// Helpers
@import "neat-helpers";
// Grid
@import "grid/private";
@import "grid/reset";
@import "grid/grid";
@import "grid/omega";
@import "grid/outer-container";
@import "grid/span-columns";
@import "grid/row";
@import "grid/shift";
@import "grid/pad";
@import "grid/fill-parent";
@import "grid/media";
@import "grid/to-deprecate";
@import "grid/visual-grid";
apps/openassessment/xblock/static/sass/xb/libs/neat/functions/_new-breakpoint.scss 0 → 100644
@function new-breakpoint($query:$feature $value $columns, $total-columns: $grid-columns) {
@if length($query) == 1 {
$query: $default-feature nth($query, 1) $total-columns;
}
@else if length($query) == 2 or length($query) == 4 {
$query: append($query, $total-columns);
}
@if not belongs-to($query, $visual-grid-breakpoints) {
$visual-grid-breakpoints: append($visual-grid-breakpoints, $query, comma);
}
@return $query;
}
apps/openassessment/xblock/static/sass/xb/libs/neat/functions/_private.scss 0 → 100644
// Checks if a number is even
@function is-even($int) {
@if $int%2 == 0 {
@return true;
}
@return false;
}
// Checks if an element belongs to a list
@function belongs-to($tested-item, $list) {
@each $item in $list {
@if $item == $tested-item {
@return true;
}
}
@return false;
}
// Contains display value
@function contains-display-value($query) {
@if belongs-to(table, $query) or belongs-to(block, $query) or belongs-to(inline-block, $query) or belongs-to(inline, $query) {
@return true;
}
@return false;
}
// Parses the first argument of span-columns()
@function container-span($span: $span) {
@if length($span) == 3 {
$container-columns: nth($span, 3);
@return $container-columns;
}
@else if length($span) == 2 {
$container-columns: nth($span, 2);
@return $container-columns;
}
@else {
@return $grid-columns;
}
}
@function container-shift($shift: $shift) {
$parent-columns: $grid-columns !default;
@if length($shift) == 3 {
$container-columns: nth($shift, 3);
@return $container-columns;
}
@else if length($shift) == 2 {
$container-columns: nth($shift, 2);
@return $container-columns;
}
@else {
@return $parent-columns;
}
}
// Generates a striped background
@function gradient-stops($grid-columns, $color: $visual-grid-color) {
$transparent: rgba(0,0,0,0);
$column-width: flex-grid(1, $grid-columns);
$gutter-width: flex-gutter($grid-columns);
$column-offset: $column-width;
$values: ($transparent 0, $color 0);
@for $i from 1 to $grid-columns*2 {
@if is-even($i) {
$values: append($values, $transparent $column-offset, comma);
$values: append($values, $color $column-offset, comma);
$column-offset: $column-offset + $column-width;
}
@else {
$values: append($values, $color $column-offset, comma);
$values: append($values, $transparent $column-offset, comma);
$column-offset: $column-offset + $gutter-width;
}
}
@return $values;
}
// Layout direction
@function get-direction($layout, $default) {
$direction: nil;
@if $layout == LTR or $layout == RTL {
$direction: direction-from-layout($layout);
} @else {
$direction: direction-from-layout($default);
}
@return $direction;
}
@function direction-from-layout($layout) {
$direction: nil;
@if $layout == LTR {
$direction: right;
} @else {
$direction: left;
}
@return $direction;
}
@function get-opposite-direction($direction) {
$opposite-direction: left;
@if $direction == left {
$opposite-direction: right;
}
@return $opposite-direction;
}
apps/openassessment/xblock/static/sass/xb/libs/neat/grid/_fill-parent.scss 0 → 100644
@mixin fill-parent() {
width: 100%;
@if $border-box-sizing == false {
@include box-sizing(border-box);
}
}
apps/openassessment/xblock/static/sass/xb/libs/neat/grid/_grid.scss 0 → 100644
@if $border-box-sizing == true {
* {
@include box-sizing(border-box);
}
}
apps/openassessment/xblock/static/sass/xb/libs/neat/grid/_media.scss 0 → 100644
@mixin media($query:$feature $value $columns, $total-columns: $grid-columns) {
@if length($query) == 1 {
@media screen and ($default-feature: nth($query, 1)) {
$default-grid-columns: $grid-columns;
$grid-columns: $total-columns;
@content;
$grid-columns: $default-grid-columns;
}
}
@else if length($query) == 2 {
@media screen and (nth($query, 1): nth($query, 2)) {
$default-grid-columns: $grid-columns;
$grid-columns: $total-columns;
@content;
$grid-columns: $default-grid-columns;
}
}
@else if length($query) == 3 {
@media screen and (nth($query, 1): nth($query, 2)) {
$default-grid-columns: $grid-columns;
$grid-columns: nth($query, 3);
@content;
$grid-columns: $default-grid-columns;
}
}
@else if length($query) == 4 {
@media screen and (nth($query, 1): nth($query, 2)) and (nth($query, 3): nth($query, 4)) {
$default-grid-columns: $grid-columns;
$grid-columns: $total-columns;
@content;
$grid-columns: $default-grid-columns;
}
}
@else if length($query) == 5 {
@media screen and (nth($query, 1): nth($query, 2)) and (nth($query, 3): nth($query, 4)) {
$default-grid-columns: $grid-columns;
$grid-columns: nth($query, 5);
@content;
$grid-columns: $default-grid-columns;
}
}
@else {
@warn "Wrong number of arguments for breakpoint(). Read the documentation for more details.";
}
}
apps/openassessment/xblock/static/sass/xb/libs/neat/grid/_omega.scss 0 → 100644
// Remove last element gutter
@mixin omega($query: block, $direction: default) {
$table: if(belongs-to(table, $query), true, false);
$auto: if(belongs-to(auto, $query), true, false);
@if $direction != default {
@warn "The omega mixin will no longer take a $direction argument. To change the layout direction, use row($direction) or set $default-layout-direction instead."
} @else {
$direction: get-direction($layout-direction, $default-layout-direction);
}
@if length($query) == 1 {
@if $auto {
&:last-child {
margin-#{$direction}: 0;
}
}
@else if contains-display-value($query) {
@if $table {
padding-#{$direction}: 0;
}
@else {
margin-#{$direction}: 0;
}
}
@else {
@include nth-child($query, $direction);
}
}
@else if length($query) == 2 {
@if $table {
@if $auto {
&:last-child {
padding-#{$direction}: 0;
}
}
@else {
&:nth-child(#{nth($query, 1)}) {
padding-#{$direction}: 0;
}
}
}
@else {
@if $auto {
&:last-child {
margin-#{$direction}: 0;
}
}
@else {
@include nth-child(nth($query, 1), $direction);
}
}
}
@else {
@warn "Too many arguments passed to the omega() mixin."
}
}
@mixin nth-child($query, $direction) {
$opposite-direction: get-opposite-direction($direction);
&:nth-child(#{$query}) {
margin-#{$direction}: 0;
}
@if type-of($query) == number {
&:nth-child(#{$query}+1) {
clear: $opposite-direction;
}
}
}
apps/openassessment/xblock/static/sass/xb/libs/neat/grid/_outer-container.scss 0 → 100644
@mixin outer-container {
@include clearfix;
max-width: $max-width;
margin: {
left: auto;
right: auto;
}
}
apps/openassessment/xblock/static/sass/xb/libs/neat/grid/_pad.scss 0 → 100644
@mixin pad($padding: flex-gutter()) {
$padding-list: null;
@each $value in $padding {
$value: if($value == 'default', flex-gutter(), $value);
$padding-list: join($padding-list, $value);
}
padding: $padding-list;
}
apps/openassessment/xblock/static/sass/xb/libs/neat/grid/_private.scss 0 → 100644
$parent-columns: $grid-columns !default;
$fg-column: $column;
$fg-gutter: $gutter;
$fg-max-columns: $grid-columns;
$container-display-table: false !default;
$layout-direction: nil !default;
@function flex-grid($columns, $container-columns: $fg-max-columns) {
$width: $columns * $fg-column + ($columns - 1) * $fg-gutter;
$container-width: $container-columns * $fg-column + ($container-columns - 1) * $fg-gutter;
@return percentage($width / $container-width);
}
@function flex-gutter($container-columns: $fg-max-columns, $gutter: $fg-gutter) {
$container-width: $container-columns * $fg-column + ($container-columns - 1) * $fg-gutter;
@return percentage($gutter / $container-width);
}
@function grid-width($n) {
@return $n * $gw-column + ($n - 1) * $gw-gutter;
}
@function get-parent-columns($columns) {
@if $columns != $grid-columns {
$parent-columns: $columns;
} @else {
$parent-columns: $grid-columns;
}
@return $parent-columns;
}
@function is-display-table($container-is-display-table, $display) {
$display-table: false;
@if $container-is-display-table == true {
$display-table: true;
} @else if $display == table {
$display-table: true;
}
@return $display-table;
}
@function get-padding-for-table-layout($columns, $total-columns) {
$total-padding: flex-gutter($total-columns) * ($columns - 1);
$padding: $total-padding / $columns;
@return $padding;
}
apps/openassessment/xblock/static/sass/xb/libs/neat/grid/_reset.scss 0 → 100644
@mixin reset-display {
$container-display-table: false;
}
@mixin reset-layout-direction {
$layout-direction: $default-layout-direction;
}
@mixin reset-all {
@include reset-display;
@include reset-layout-direction;
}
apps/openassessment/xblock/static/sass/xb/libs/neat/grid/_row.scss 0 → 100644
@mixin row($display: block, $direction: $default-layout-direction) {
@include clearfix;
$layout-direction: $direction;
@if $display == table {
display: table;
@include fill-parent;
table-layout: fixed;
$container-display-table: true;
}
@else {
display: block;
$container-display-table: false;
}
}
apps/openassessment/xblock/static/sass/xb/libs/neat/grid/_shift.scss 0 → 100644
@mixin shift($n-columns: 1) {
@include shift-in-context($n-columns);
}
@mixin shift-in-context($shift: $columns of $container-columns) {
$n-columns: nth($shift, 1);
$parent-columns: container-shift($shift);
$direction: get-direction($layout-direction, $default-layout-direction);
$opposite-direction: get-opposite-direction($direction);
margin-#{$opposite-direction}: $n-columns * flex-grid(1, $parent-columns) + $n-columns * flex-gutter($parent-columns);
// Reset nesting context
$parent-columns: $grid-columns;
}
apps/openassessment/xblock/static/sass/xb/libs/neat/grid/_span-columns.scss 0 → 100644
@mixin span-columns($span: $columns of $container-columns, $display: block) {
$columns: nth($span, 1);
$container-columns: container-span($span);
// Set nesting context (used by shift())
$parent-columns: get-parent-columns($container-columns);
$direction: get-direction($layout-direction, $default-layout-direction);
$opposite-direction: get-opposite-direction($direction);
$display-table: is-display-table($container-display-table, $display);
@if $display-table {
$padding: get-padding-for-table-layout($columns, $container-columns);
display: table-cell;
padding-#{$direction}: $padding;
width: flex-grid($columns, $container-columns) + $padding;
} @else {
float: #{$opposite-direction};
@if $display != no-display {
display: block;
}
@if $display == collapse {
@warn "The 'collapse' argument will be deprecated. Use 'block-collapse' instead."
}
@if $display == collapse or $display == block-collapse {
width: flex-grid($columns, $container-columns) + flex-gutter($container-columns);
&:last-child {
width: flex-grid($columns, $container-columns);
}
} @else {
margin-#{$direction}: flex-gutter($container-columns);
width: flex-grid($columns, $container-columns);
&:last-child {
margin-#{$direction}: 0;
}
}
}
}
apps/openassessment/xblock/static/sass/xb/libs/neat/grid/_to-deprecate.scss 0 → 100644
@mixin breakpoint($query:$feature $value $columns, $total-columns: $grid-columns) {
@warn "The breakpoint() mixin was renamed to media() in Neat 1.0. Please update your project with the new syntax before the next version bump.";
@if length($query) == 1 {
@media screen and ($default-feature: nth($query, 1)) {
$default-grid-columns: $grid-columns;
$grid-columns: $total-columns;
@content;
$grid-columns: $default-grid-columns;
}
}
@else if length($query) == 2 {
@media screen and (nth($query, 1): nth($query, 2)) {
$default-grid-columns: $grid-columns;
$grid-columns: $total-columns;
@content;
$grid-columns: $default-grid-columns;
}
}
@else if length($query) == 3 {
@media screen and (nth($query, 1): nth($query, 2)) {
$default-grid-columns: $grid-columns;
$grid-columns: nth($query, 3);
@content;
$grid-columns: $default-grid-columns;
}
}
@else if length($query) == 4 {
@media screen and (nth($query, 1): nth($query, 2)) and (nth($query, 3): nth($query, 4)) {
$default-grid-columns: $grid-columns;
$grid-columns: $total-columns;
@content;
$grid-columns: $default-grid-columns;
}
}
@else if length($query) == 5 {
@media screen and (nth($query, 1): nth($query, 2)) and (nth($query, 3): nth($query, 4)) {
$default-grid-columns: $grid-columns;
$grid-columns: nth($query, 5);
@content;
$grid-columns: $default-grid-columns;
}
}
@else {
@warn "Wrong number of arguments for breakpoint(). Read the documentation for more details.";
}
}
@mixin nth-omega($nth, $display: block, $direction: default) {
@warn "The nth-omega() mixin is deprecated. Please use omega() instead.";
@include omega($nth $display, $direction);
}
apps/openassessment/xblock/static/sass/xb/libs/neat/grid/_visual-grid.scss 0 → 100644
@mixin grid-column-gradient($values...) {
background-image: deprecated-webkit-gradient(linear, left top, left bottom, $values);
background-image: -webkit-linear-gradient(left, $values);
background-image: -moz-linear-gradient(left, $values);
background-image: -ms-linear-gradient(left, $values);
background-image: -o-linear-gradient(left, $values);
background-image: unquote("linear-gradient(left, #{$values})");
}
@if $visual-grid == true or $visual-grid == yes {
body:before {
content: '';
display: inline-block;
@include grid-column-gradient(gradient-stops($grid-columns));
height: 100%;
left: 0;
margin: 0 auto;
max-width: $max-width;
opacity: $visual-grid-opacity;
position: fixed;
right: 0;
width: 100%;
pointer-events: none;
@if $visual-grid-index == back {
z-index: -1;
}
@else if $visual-grid-index == front {
z-index: 9999;
}
@each $breakpoint in $visual-grid-breakpoints {
@if $breakpoint != nil {
@include media($breakpoint) {
@include grid-column-gradient(gradient-stops($grid-columns));
}
}
}
}
}
apps/openassessment/xblock/static/sass/xb/libs/neat/settings/_grid.scss 0 → 100644
$column: golden-ratio(1em, 3) !default; // Column width
$gutter: golden-ratio(1em, 1) !default; // Gutter between each two columns
$grid-columns: 12 !default; // Total number of columns in the grid
$max-width: em(1088) !default; // Max-width of the outer container
$border-box-sizing: true !default; // Makes all elements have a border-box layout
$default-feature: min-width; // Default @media feature for the breakpoint() mixin
$default-layout-direction: LTR !default;
apps/openassessment/xblock/static/sass/xb/libs/neat/settings/_visual-grid.scss 0 → 100644
$visual-grid: false !default; // Display the base grid
$visual-grid-color: #EEE !default;
$visual-grid-index: back !default; // Show grid behind content (back) or overlay it over the content (front)
$visual-grid-opacity: 0.4 !default;
$visual-grid-breakpoints: () !default;
apps/openassessment/xblock/static/sass/xb/utilities/_extends.scss 0 → 100644
// xblock: utilities - Sass extends
// ====================
// NOTES:
// * these are Sass-placeholders (http://sass-lang.com/documentation/file.SASS_REFERENCE.html#placeholder_selectors_) that can be applied to any xblock
// --------------------
// utility: nth-type style clearing
// --------------------
%wipe-first-child {
&:first-child {
margin-top: 0;
border-top: none;
padding-top: 0;
margin-left: 0;
border-left: none;
padding-left: 0;
}
}
%wipe-last-child {
&:last-child {
margin-bottom: 0;
border-bottom: none;
padding-bottom: 0;
margin-right: 0;
border-right: none;
padding-right: 0;
}
}
// --------------------
// utility: wrapper elements
// --------------------
%wrapper {
@include clearfix();
@include box-sizing(border-box);
width: 100%;
}
// --------------------
// utility: list resets
// --------------------
// lists
%no-list {
list-style: none;
margin: 0;
padding: 0;
text-indent: 0;
}
// --------------------
// utility: image-replacement hidden text
// --------------------
%text-hide {
text-indent: 200%;
white-space: nowrap;
overflow: hidden;
}
// --------------------
// utility: hidden elements for screenreaders
// --------------------
%text-sr {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
// --------------------
// utility: text-wrapping
// --------------------
%text-wrap {
text-wrap: wrap;
white-space: pre-wrap;
white-space: -moz-pre-wrap;
word-wrap: break-word;
}
// --------------------
// utility: visual text overflow
// --------------------
%text-truncate {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
// --------------------
// UI: controls
// --------------------
%fake-link {
cursor: pointer;
}
%state-disabled {
pointer-events: none;
outline: none;
}
%state-enabled {
pointer-events: auto;
outline: invert none medium;
}
// --------------------
// UI: element depth
// --------------------
%depth0 { z-index: 0; }
%depth1 { z-index: 10; }
%depth2 { z-index: 100; }
%depth3 { z-index: 1000; }
%depth4 { z-index: 10000; }
%depth5 { z-index: 100000; }
// --------------------
// UI: transitions
// --------------------
%trans-size {
@include transition(width $tmg-f1 ease-in-out, height $tmg-f1 ease-in-out);
}
%trans-color {
@include transition(color $tmg-f1 ease-in-out);
}
// --------------------
// Decorative: shadows
// --------------------
%deco-shadow-up {
box-shadow: 0 -1px 2px 0 $shadow-d1;
}
%deco-shadow-down {
box-shadow: 0 1px 2px 0 $shadow-d1;
}
%deco-shadow-subtle-up {
box-shadow: 0 -1px 2px 0 $shadow-l1;
}
%deco-shadow-subtle-down {
box-shadow: 0 1px 2px 0 $shadow-l1;
}
// --------------------
// Decorative: round/circular elements
// --------------------
%deco-circle {
border-radius: 99999em;
}
apps/openassessment/xblock/static/sass/xb/utilities/_mixins.scss 0 → 100644
// xblock: utilities - Sass mixins
// ====================
// NOTES:
// * these are Sass-based mixins (http://sass-lang.com/documentation/file.SASS_REFERENCE.html#mixins) that can be applied to any xblock
// --------------------
// shorthand - absolute position
// --------------------
@mixin pos-abs ($top: auto, $right: auto, $bottom: auto, $left: auto) {
position: absolute;
top: $top;
right: $right;
bottom: $bottom;
left: $left;
}
// --------------------
// font-size (rems)
// --------------------
@mixin font-size($sizeValue: 16){
font-size: $sizeValue + px;
font-size: ($sizeValue/10) + rem;
}
// --------------------
// line-height (rems)
// --------------------
@mixin lh($fontSize: auto){
line-height: ($fontSize*1.50) + px;
line-height: (($fontSize/10)*1.50) + rem;
}
apps/openassessment/xblock/static/sass/xb/utilities/_reset.scss 0 → 100644
// xblock: utilities - reset
// ====================
// NOTES:
// * this reset is scoped to just the xblock's markup/elements. The app/system should never be touched.
// * this reset is heavily based on the good work of normalize (http://necolas.github.io/normalize.css/)
// contains all resets inside of the main xblock wrapper
.wrapper--xblock {
// --------------------
// porting of normalize.css v3.0.0 | MIT License | git.io/normalize
// --------------------
font-family: sans-serif; /* 1 */
-ms-text-size-adjust: 100%; /* 2 */
-webkit-text-size-adjust: 100%; /* 2 */
/* HTML5 display definitions
========================================================================== */
/**
* Correct `block` display not defined in IE 8/9.
*/
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
display: block;
}
/**
* 1. Correct `inline-block` display not defined in IE 8/9.
* 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
*/
audio,
canvas,
progress,
video {
display: inline-block; /* 1 */
vertical-align: baseline; /* 2 */
}
/**
* Prevent modern browsers from displaying `audio` without controls.
* Remove excess height in iOS 5 devices.
*/
audio:not([controls]) {
display: none;
height: 0;
}
/**
* Address `[hidden]` styling not present in IE 8/9.
* Hide the `template` element in IE, Safari, and Firefox < 22.
*/
[hidden],
template {
display: none;
}
/* Links
========================================================================== */
/**
* Remove the gray background color from active links in IE 10.
*/
a {
background: transparent;
}
/**
* Improve readability when focused and also mouse hovered in all browsers.
*/
a:active,
a:hover {
outline: 0;
}
/* Text-level semantics
========================================================================== */
/**
* Address styling not present in IE 8/9, Safari 5, and Chrome.
*/
abbr[title] {
border-bottom: 1px dotted;
}
/**
* Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
*/
b,
strong {
font-weight: bold;
}
/**
* Address styling not present in Safari 5 and Chrome.
*/
dfn {
font-style: italic;
}
/**
* Address variable `h1` font-size and margin within `section` and `article`
* contexts in Firefox 4+, Safari 5, and Chrome.
*/
h1 {
font-size: 2em;
margin: 0.67em 0;
}
/**
* Address styling not present in IE 8/9.
*/
mark {
background: #ff0;
color: #000;
}
/**
* Address inconsistent and variable font size in all browsers.
*/
small {
font-size: 80%;
}
/**
* Prevent `sub` and `sup` affecting `line-height` in all browsers.
*/
sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}
sup {
top: -0.5em;
}
sub {
bottom: -0.25em;
}
/* Embedded content
========================================================================== */
/**
* Remove border when inside `a` element in IE 8/9.
*/
img {
border: 0;
}
/**
* Correct overflow displayed oddly in IE 9.
*/
svg:not(:root) {
overflow: hidden;
}
/* Grouping content
========================================================================== */
/**
* Address margin not present in IE 8/9 and Safari 5.
*/
figure {
margin: 1em 40px;
}
/**
* Address differences between Firefox and other browsers.
*/
hr {
-moz-box-sizing: content-box;
box-sizing: content-box;
height: 0;
}
/**
* Contain overflow in all browsers.
*/
pre {
overflow: auto;
}
/**
* Address odd `em`-unit font size rendering in all browsers.
*/
code,
kbd,
pre,
samp {
font-family: monospace, monospace;
font-size: 1em;
}
/* Forms
========================================================================== */
/**
* Known limitation: by default, Chrome and Safari on OS X allow very limited
* styling of `select`, unless a `border` property is set.
*/
/**
* 1. Correct color not being inherited.
* Known issue: affects color of disabled elements.
* 2. Correct font properties not being inherited.
* 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome.
*/
button,
input,
optgroup,
select,
textarea {
color: inherit; /* 1 */
font: inherit; /* 2 */
margin: 0; /* 3 */
}
/**
* Address `overflow` set to `hidden` in IE 8/9/10.
*/
button {
overflow: visible;
}
/**
* Address inconsistent `text-transform` inheritance for `button` and `select`.
* All other form control elements do not inherit `text-transform` values.
* Correct `button` style inheritance in Firefox, IE 8+, and Opera
* Correct `select` style inheritance in Firefox.
*/
button,
select {
text-transform: none;
}
/**
* 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
* and `video` controls.
* 2. Correct inability to style clickable `input` types in iOS.
* 3. Improve usability and consistency of cursor style between image-type
* `input` and others.
*/
button,
html input[type="button"], /* 1 */
input[type="reset"],
input[type="submit"] {
-webkit-appearance: button; /* 2 */
cursor: pointer; /* 3 */
}
/**
* Re-set default cursor for disabled elements.
*/
button[disabled],
html input[disabled] {
cursor: default;
}
/**
* Remove inner padding and border in Firefox 4+.
*/
button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0;
}
/**
* Address Firefox 4+ setting `line-height` on `input` using `!important` in
* the UA stylesheet.
*/
input {
line-height: normal;
}
/**
* It's recommended that you don't attempt to style these elements.
* Firefox's implementation doesn't respect box-sizing, padding, or width.
*
* 1. Address box sizing set to `content-box` in IE 8/9/10.
* 2. Remove excess padding in IE 8/9/10.
*/
input[type="checkbox"],
input[type="radio"] {
box-sizing: border-box; /* 1 */
padding: 0; /* 2 */
}
/**
* Fix the cursor style for Chrome's increment/decrement buttons. For certain
* `font-size` values of the `input`, it causes the cursor style of the
* decrement button to change from `default` to `text`.
*/
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
height: auto;
}
/**
* 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
* 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
* (include `-moz` to future-proof).
*/
input[type="search"] {
-webkit-appearance: textfield; /* 1 */
-moz-box-sizing: content-box;
-webkit-box-sizing: content-box; /* 2 */
box-sizing: content-box;
}
/**
* Remove inner padding and search cancel button in Safari and Chrome on OS X.
* Safari (but not Chrome) clips the cancel button when the search input has
* padding (and `textfield` appearance).
*/
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}
/**
* Define consistent border, margin, and padding.
*/
fieldset {
border: 1px solid #c0c0c0;
margin: 0 2px;
padding: 0.35em 0.625em 0.75em;
}
/**
* 1. Correct `color` not being inherited in IE 8/9.
* 2. Remove padding so people aren't caught out if they zero out fieldsets.
*/
legend {
border: 0; /* 1 */
padding: 0; /* 2 */
}
/**
* Remove default vertical scrollbar in IE 8/9.
*/
textarea {
overflow: auto;
}
/**
* Don't inherit the `font-weight` (applied by a rule above).
* NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
*/
optgroup {
font-weight: bold;
}
/* Tables
========================================================================== */
/**
* Remove most spacing between table cells.
*/
table {
border-collapse: collapse;
border-spacing: 0;
}
td,
th {
padding: 0;
}
// --------------------
// custom reset
// --------------------
div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
@extend %t-weight1;
margin: 0;
vertical-align: baseline;
border: 0;
padding: 0;
outline: 0;
}
abbr[title] {
border-bottom: none;
text-decoration: none;
cursor: help;
}
strong {
@extend %t-weight3;
}
// --------------------
// context base reset: edX LMS
// --------------------
// TODO: fill this in when xblock is rendered in edX LMS
// --------------------
// context base reset: LTI
// --------------------
// TODO: fill this in when xblock is rendered in LTI contexts
}
apps/openassessment/xblock/static/sass/xb/utilities/_variables.scss 0 → 100644
// xblock: utilities - Sass variables
// ====================
// NOTES:
// * these are general variables to be set and overriden later by theming and particular xblock _variables.scss files
// --------------------
// units
// --------------------
$baseline-v: 20px; // vertical baseline
$baseline-h: 40px; // horizontal baseline
// --------------------
// colors - basic
// --------------------
// grays
$gray: rgb(55, 59, 68);
$gray-l1: tint($gray,20%);
$gray-l2: tint($gray,40%);
$gray-l3: tint($gray,60%);
$gray-l4: tint($gray,80%);
$gray-l5: tint($gray,90%);
$gray-l6: tint($gray,95%);
$gray-l7: tint($gray,99.50%);
$gray-d1: shade($gray,20%);
$gray-d2: shade($gray,40%);
$gray-d3: shade($gray,60%);
$gray-d4: shade($gray,80%);
$gray-d5: shade($gray,90%);
$gray-d6: shade($gray,95%);
$gray-d7: shade($gray,99%);
$gray-t0: rgba($gray,0.125);
$gray-t1: rgba($gray,0.25);
$gray-t2: rgba($gray,0.50);
$gray-t3: rgba($gray,0.75);
// blacks
$black: $gray-d6; // system black
$black-t: $gray-d7;
$black-t0: rgba($black,0.125);
$black-t1: rgba($black,0.25);
$black-t2: rgba($black,0.50);
$black-t3: rgba($black,0.75);
// whites
$white: $gray-l6; // system white
$white-t: $gray-l7;
$white-t0: rgba($white,0.125);
$white-t1: rgba($white,0.25);
$white-t2: rgba($white,0.50);
$white-t3: rgba($white,0.75);
// shadows
$shadow: rgba($black,0.2);
$shadow-l1: rgba($black,0.1);
$shadow-l2: rgba($black,0.05);
$shadow-d1: rgba($black,0.4);
$shadow-d2: rgba($black,0.6);
// blue
$blue: rgb(128, 169, 204);
$blue-l1: tint($blue,20%);
$blue-l2: tint($blue,40%);
$blue-l3: tint($blue,60%);
$blue-l4: tint($blue,80%);
$blue-l5: tint($blue,90%);
$blue-d1: shade($blue,20%);
$blue-d2: shade($blue,40%);
$blue-d3: shade($blue,60%);
$blue-d4: shade($blue,80%);
$blue-d5: shade($blue,90%);
$blue-s1: saturate($blue,15%);
$blue-s2: saturate($blue,30%);
$blue-s3: saturate($blue,45%);
$blue-u1: desaturate($blue,15%);
$blue-u2: desaturate($blue,30%);
$blue-u3: desaturate($blue,45%);
$blue-t0: rgba($blue,0.125);
$blue-t1: rgba($blue,0.25);
$blue-t2: rgba($blue,0.50);
$blue-t3: rgba($blue,0.75);
// --------------------
// fonts
// --------------------
$f-serif: 'Poly', Cambria, Georgia, 'Times New Roman', Times, serif;
$f-sans-serif: 'Lato', 'Helvetica Neue', Helvetica, Arial, sans-serif;
$f-monospace: 'Bitstream Vera Sans Mono', Consolas, Courier, monospace;
// --------------------
// animation/transitions
// --------------------
// timing - used for animation/transition mixin syncing
$tmg-s3: 3.0s;
$tmg-s2: 2.0s;
$tmg-s1: 1.0s;
$tmg-avg: 0.75s;
$tmg-f1: 0.50s;
$tmg-f2: 0.25s;
$tmg-f3: 0.125s;
// animation-based settings
$anim-distance-offviewport: ($baseline-h*100); // for larger/page-level animations
// --------------------
// application - fonts
// --------------------
$f-title: $f-sans-serif;
$f-copy: $f-serif;
$f-action: $f-sans-serif;
// --------------------
// application - colors
// --------------------
$color-primary: $blue-s2;
$color-secondary: $blue;
$color-teritary: $blue-u2;
// application - colors: decorative
$color-decorative-primary: $blue-u2;
$color-decorative-secondary: $gray-t0;
// application - colors: actions
$action-primary-color: tint($color-primary,10%);
$action-primary-color-focus: saturate($color-primary,25%);
$action-primary-color-active: $color-primary;
$action-primary-color-visited: shade($color-primary,20%);
$action-secondary-color: $color-secondary;
$action-secondary-color-focus: saturate($color-secondary,25%);
$action-secondary-color-active: $color-secondary;
$action-secondary-color-visited: shade($color-secondary,20%);
$action-tertiary-color: tint($color-teritary,10%);
$action-tertiary-color-focus: saturate($color-teritary,25%);
$action-tertiary-color-active: $color-teritary;
$action-tertiary-color-visited: shade($color-teritary,20%);
// application - colors: copy and headings
$heading-color: $gray-d5;
$heading-primary-color: $black;
$heading-secondary-color: $gray-l3;
$heading-tertiary-color: $gray-l4;
$copy-color: $gray-l2;
$copy-color-alt: $gray-d1;
$copy-color-focus: $gray-d4;
$copy-lead-color: $gray;
$copy-lead-color: $gray-d1;
$copy-lead-color-focus: $gray-d4;
$copy-supplemental-color: $gray-l2;
$copy-supplemental-color-alt: $gray-l2;
$copy-supplemental-color-focus: $gray-d1;
// application - colors: states
$selected-bg: $blue-t1;
$selected-color: $blue-s1;
// application - colors: view-based elements
$bg-view: $gray-l6;
$bg-content: $white;
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment