Skip to content

E
edx-ora2
Commit 1c84bf4f by David Ormsbee
Options

Merge branch 'master' into store_rubrics 

Conflicts:
	apps/openassessment/xblock/assessment_mixin.py
	apps/openassessment/xblock/peer_assessment_mixin.py
	apps/openassessment/xblock/self_assessment_mixin.py
	apps/openassessment/xblock/test/test_openassessment.py
parents 6194d195 b491ad87
Showing with 2997 additions and 192 deletions
apps/openassessment/peer/api.py
......@@ -148,7 +148,7 @@ def create_assessment(
# Check if the submission is finished and its Author has graded enough.
student_item = submission.student_item
_check_if_finished_and_create_score(
_score_if_finished(
student_item,
submission,
required_assessments_for_student,
......@@ -167,7 +167,7 @@ def create_assessment(
student_item=scorer_item
).order_by("-attempt_number")
_check_if_finished_and_create_score(
_score_if_finished(
scorer_item,
scorer_submissions[0],
required_assessments_for_student,
......@@ -185,11 +185,11 @@ def create_assessment(
raise PeerAssessmentInternalError(error_message)
def _check_if_finished_and_create_score(student_item,
submission,
required_assessments_for_student,
required_assessments_for_submission):
"""Basic function for checking if a student is finished with peer workflow.
def _score_if_finished(student_item,
submission,
required_assessments_for_student,
required_assessments_for_submission):
"""Calculate final grade iff peer evaluation flow is satisfied.
Checks if the student is finished with the peer assessment workflow. If the
student already has a final grade calculated, there is no need to proceed.
......
apps/openassessment/xblock/assessment_mixin.py deleted 100644 → 0
from django.template import Context
from django.template.loader import get_template
from webob import Response
class AssessmentMixin(object):
def render(self, path, context_dict=None):
"""Render an Assessment Module's HTML
Given the name of an assessment module, find it in the list of
configured modules, and ask for its rendered HTML.
"""
if not context_dict:
context_dict = {}
# TODO: these shouldn't overwrite
context_dict["xblock_trace"] = self.get_xblock_trace()
context_dict["rubric_instructions"] = self.rubric_instructions
context_dict["rubric_criteria"] = self.rubric_criteria
template = get_template(path)
context = Context(context_dict)
return Response(template.render(context), content_type='application/html', charset='UTF-8')
apps/openassessment/xblock/openassessmentblock.py
"""An XBlock where students can read a question and compose their response"""
import datetime
import pkg_resources
from django.template.context import Context
from django.template.loader import get_template
import pkg_resources
from webob import Response
from xblock.core import XBlock
from xblock.fields import List, Scope, String
......@@ -271,3 +272,21 @@ class OpenAssessmentBlock(XBlock, SubmissionMixin, PeerAssessmentMixin, SelfAsse
"message": "You have not started this problem",
}
return grade_state
def render_assessment(self, path, context_dict=None):
"""Render an Assessment Module's HTML
Given the name of an assessment module, find it in the list of
configured modules, and ask for its rendered HTML.
"""
if not context_dict:
context_dict = {}
context_dict["xblock_trace"] = self.get_xblock_trace()
context_dict["rubric_instructions"] = self.rubric_instructions
context_dict["rubric_criteria"] = self.rubric_criteria
template = get_template(path)
context = Context(context_dict)
return Response(template.render(context), content_type='application/html', charset='UTF-8')
apps/openassessment/xblock/peer_assessment_mixin.py
from xblock.core import XBlock
from openassessment.peer import api as peer_api
from openassessment.peer.api import PeerAssessmentWorkflowError
from openassessment.xblock.assessment_mixin import AssessmentMixin
class PeerAssessmentMixin(AssessmentMixin):
class PeerAssessmentMixin(object):
@XBlock.json_handler
def assess(self, data, suffix=''):
"""Place an assessment into OpenAssessment system
"""
assessment_ui_model = self.get_assessment_module('peer-assessment')
if assessment_ui_model:
rubric_dict = {
'criteria': self.rubric_criteria
}
assessment_dict = {
"feedback": "Not yet implemented.",
"options_selected": data["options_selected"],
}
assessment = peer_api.create_assessment(
data["submission_uuid"],
self.get_student_item_dict()["student_id"],
int(assessment_ui_model.must_grade),
int(assessment_ui_model.must_be_graded_by),
assessment_dict,
rubric_dict,
)
rubric_dict = {
'criteria': self.rubric_criteria
}
assessment_dict = {
#"points_earned": map(int, data["points_earned"]),
#"points_possible": sum(c['total_value'] for c in self.rubric_criteria),
"feedback": "Not yet implemented.",
"options_selected": data["options_selected"],
}
assessment = peer_api.create_assessment(
data["submission_uuid"],
self.get_student_item_dict()["student_id"],
int(assessment_ui_model.must_grade),
int(assessment_ui_model.must_be_graded_by),
assessment_dict,
rubric_dict,
)
# Temp kludge until we fix JSON serialization for datetime
assessment["scored_at"] = str(assessment["scored_at"])
# Temp kludge until we fix JSON serialization for datetime
assessment["scored_at"] = str(assessment["scored_at"])
return {}
......@@ -39,16 +36,10 @@ class PeerAssessmentMixin(AssessmentMixin):
@XBlock.handler
def render_peer_assessment(self, data, suffix=''):
assessment = self.get_assessment_module('peer-assessment')
# TODO: Throw some error if not assessment
context_dict = {"peer_submission": self.get_peer_submission(
self.get_student_item_dict(),
assessment
)}
return super(PeerAssessmentMixin, self).render(
'static/html/oa_peer_assessment.html',
context_dict
)
if assessment:
peer_sub = self.get_peer_submission(self.get_student_item_dict(), assessment)
context_dict = {"peer_submission": peer_sub}
return self.render_assessment('static/html/oa_peer_assessment.html', context_dict)
def get_peer_submission(self, student_item_dict, assessment):
peer_submission = False
......
apps/openassessment/xblock/self_assessment_mixin.py
from xblock.core import XBlock
from openassessment.xblock.assessment_mixin import AssessmentMixin
class SelfAssessmentMixin(AssessmentMixin):
class SelfAssessmentMixin(object):
@XBlock.handler
def render_self_assessment(self, data, suffix=''):
return super(SelfAssessmentMixin, self).render('static/html/oa_self_assessment.html')
return self.render_assessment('static/html/oa_self_assessment.html')
apps/openassessment/xblock/static/html/t-base.html
......@@ -15,15 +15,15 @@
<h1 class="openassessment__title">
<span class="openassessment__title--super">
Speech Assignment Number 1 - Tell Us About Yourself
Assignment Number 1 - Censorship in Libraries
</span>
<span class="openassessment__title--sub">
<span class="problem-type problem-type--open-ended-response">Open Ended Response</span>
+
<span class="problem-type problem-type--peer-evaluation">Peer</span>
<span class="problem-type problem-type--peer-assessment">Peer</span>
+
<span class="problem-type problem-type--self-evaluation">Self Evaluation</span>
<span class="problem-type problem-type--self-assessment">Self Assessment</span>
</span>
</h1>
......@@ -36,10 +36,10 @@
<a class="action" href="#openassessment__response">Your response to this problem</a>
</li>
<li class="list--nav__item">
<a class="action" href="#openassessment__peer-evaluation">Your evaluation(s) of peer responses</a>
<a class="action" href="#openassessment__peer-assessment">Your assessment(s) of peer responses</a>
</li>
<li class="list--nav__item">
<a class="action" href="#openassessment__self-evaluation">Your evaluation of your response</a>
<a class="action" href="#openassessment__self-assessment">Your assessment of your response</a>
</li>
<li class="list--nav__item">
<a class="action" href="#openassessment__grade">Your grade for this problem</a>
......@@ -84,13 +84,13 @@
<!-- ==== -->
<!-- STEP: peer evaluation -->
<!-- SEE t-peer-evaluation.html for all cases -->
<!-- STEP: peer assessment -->
<!-- SEE t-peer-assessment.html for all cases -->
<!-- ==== -->
<!-- STEP: self evaluation -->
<!-- SEE t-self-evaluation.html for all cases -->
<!-- STEP: self assessment -->
<!-- SEE t-self-assessment.html for all cases -->
</ol>
<!-- STATUS: problem grade -->
......
apps/openassessment/xblock/static/html/t-grade.html
......@@ -29,18 +29,18 @@
<div class="openassessment__grade__content">
<span class="grade__value">Incomplete</span>
<p>You have not completed the <span class="step">Response</span>, <span class="step">Peer Evaluation</span>, and <span class="step">Self Evaluation</span> portions of this problem</p>
<p>You have not completed the <span class="step">Response</span>, <span class="step">Peer Assessment</span>, and <span class="step">Self Assessment</span> portions of this problem</p>
</div>
</div>
<!-- CASE: is in-progress and incomplete (peer responses to evaluate) -->
<!-- CASE: is in-progress and incomplete (peer responses to assess) -->
<div id="openassessment__grade" class="openassessment__grade is--incomplete awaiting--peer-responses">
<h2 class="openassessment__grade__title">Your Grade:</h2>
<div class="openassessment__grade__content">
<span class="grade__value">Incomplete</span>
<p>You have not completed the <span class="step">Peer Evaluation</span>, and <span class="step">Self Evaluation</span> portions of this problem.</p>
<p>You have not completed the <span class="step">Peer Assessment</span>, and <span class="step">Self Assessment</span> portions of this problem.</p>
</div>
</div>
......@@ -50,19 +50,19 @@
<h2 class="openassessment__grade__title">Your Grade:</h2>
<div class="openassessment__grade__content">
<span class="grade__value">Waiting for Peers to Evaluate Your Response</span>
<span class="grade__value">Waiting for Peers to Assess Your Response</span>
<p>Your response is still being evaluated by your peers. Once complete, you will receive a final grade and detailed feedback from their evaluations.</p>
</div>
</div>
<!-- CASE: is in-progress and incomplete (no self evaluation) -->
<div id="openassessment__grade" class="openassessment__grade is--incomplete needs--self-evaluation">
<!-- CASE: is in-progress and incomplete (no self assessment) -->
<div id="openassessment__grade" class="openassessment__grade is--incomplete needs--self-assessment">
<h2 class="openassessment__grade__title">Your Grade:</h2>
<div class="openassessment__grade__content">
<span class="grade__value">Incomplete</span>
<p>You have not completed the <span class="step">Self Evaluation</span> portion of this problem.</p>
<p>You have not completed the <span class="step">Self Assessment</span> portion of this problem.</p>
</div>
</div>
......@@ -73,7 +73,7 @@
<div class="openassessment__grade__content">
<span class="grade__value">Incomplete</span>
<p>You did not complete the <span class="step">Peer Evaluation</span>, and <span class="step">Self Evaluation</span> portions of this problem.</p>
<p>You did not complete the <span class="step">Peer Assessment</span>, and <span class="step">Self Assessment</span> portions of this problem.</p>
</div>
</div>
......
apps/openassessment/xblock/static/html/t-messages.html
......@@ -15,25 +15,15 @@
<h2 class="message__title">You still need to submit your response to this question</h2>
<div class="message__copy">
<p>Please note that self evaluations are due on: <span class="step__deadline">due <span class="date">Jan 24, 2014</span> at <span class="time">15:00 UTC</span></span></p>
<p>Please note that self assessments are due on: <span class="step__deadline">due <span class="date">Jan 24, 2014</span> at <span class="time">15:00 UTC</span></span></p>
</div>
</div>
<!-- CASE: completion status is incomplete and peer evaluations are needed -->
<div class="message message--warning">
<h2 class="message__title">You still need to evaluate 2 peers’ responses</h2>
<div class="message__copy">
<p>Please note that self evaluations are due on: <span class="step__deadline">due <span class="date">Jan 24, 2014</span> at <span class="time">15:00 UTC</span></span></p>
</div>
</div>
<!-- CASE: completion status is incomplete and self evaluation is needed -->
<!-- CASE: completion status is incomplete and self assessment is needed -->
<div class="message message--warning">
<h2 class="message__title">You still need to complete your self evaluation</h2>
<h2 class="message__title">You still need to complete your self assessment</h2>
<div class="message__copy">
<p>Please note that self evaluations are due on: <span class="step__deadline">due <span class="date">Jan 24, 2014</span> at <span class="time">15:00 UTC</span></span></p>
<p>Please note that self assessments are due on: <span class="step__deadline">due <span class="date">Jan 30, 2014</span> at <span class="time">15:00 UTC</span></span></p>
</div>
</div>
......
apps/openassessment/xblock/static/html/t-peer-evaluation.html → apps/openassessment/xblock/static/html/t-peer-assessment.html
<!-- TEMPLATE: peer evaluation -->
<!-- TEMPLATE: peer assessment -->
<!-- NOTES:
* class of is--unavailable is added when step is not available
* each .peer-evaluation item needs a unique id attribute formatted as #peer-evaluation--###
* each .peer-assessment item needs a unique id attribute formatted as #peer-assessment--###
* individual rubric questions' answers need specific id attributes in several places
-->
<!-- CASE: default/not started -->
<li id="openassessment__peer-evaluation" class="openassessment__steps__step step--peer-evaluation">
<li id="openassessment__peer-assessment" class="openassessment__steps__step step--peer-assessment">
<header class="step__header">
<h2 class="step__title">
<span class="step__label">Evaluate Peers' Responses</span>
<span class="step__label">Assess Peers' Responses</span>
<span class="step__deadline">due <span class="date">January 30, 2014</span> at <span class="time">15:00 UTC</span></span>
</h2>
......@@ -28,15 +28,15 @@
</header>
<div class="step__instruction">
<p>Please read and evaluate the following response from one of your peers in the course.</p>
<p>Please read and assess the following response from one of your peers in the course.</p>
</div>
<div class="step__content">
<ul class="list--peer-evaluations">
<li class="list--peer-evaluations__item">
<article class="peer-evaluation" id="peer-evaluation--001">
<article class="peer-assessment" id="peer-assessment--001">
<header class="peer-evaluation__header">
<h3 class="peer-evaluation__title">Evaluation #
<h3 class="peer-evaluation__title">assessment #
<span class="peer-evaluation__number--current">1</span> of
<span class="peer-evaluation__number--required">3</span>
</h3>
......@@ -58,7 +58,7 @@
<p>Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam quis risus eget urna mollis ornare vel eu leo. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Vestibulum id ligula porta felis euismod semper.</p>
</div>
<form id="peer-evaluation--001__evaluation" class="peer-evaluation__evaluation" method="post">
<form id="peer-assessment--001__evaluation" class="peer-evaluation__evaluation" method="post">
<fieldset class="evaluation__fields">
<legend class="evaluation__instruction">Please provide your thoughts on the following (note: required questions are indicated by an asterisk *):</legend>
......@@ -224,7 +224,7 @@
<ul class="list list--actions">
<li class="list--actions__item">
<button type="submit" id="peer-evaluation--001__evaluation__submit" class="action action--submit">Submit your evaluation &amp; move to response #2</button>
<button type="submit" id="peer-assessment--001__evaluation__submit" class="action action--submit">Submit your assessment &amp; move to response #2</button>
</li>
</ul>
</form>
......@@ -236,10 +236,10 @@
<!-- CASE: started, but incomplete -->
<li id="openassessment__peer-evaluation" class="openassessment__steps__step step--peer-evaluation">
<li id="openassessment__peer-assessment" class="openassessment__steps__step step--peer-assessment">
<header class="step__header">
<h2 class="step__title">
<span class="step__label">Evaluate Peers' Responses</span>
<span class="step__label">Assess Peers' Responses</span>
<span class="step__deadline">due <span class="date">January 30, 2014</span> at <span class="time">15:00 UTC</span></span>
</h2>
......@@ -253,15 +253,15 @@
</header>
<div class="step__instruction">
<p>Please read and evaluate the following response from one of your peers in the course.</p>
<p>Please read and assess the following response from one of your peers in the course.</p>
</div>
<div class="step__content">
<ul class="list--peer-evaluations">
<li class="list--peer-evaluations__item">
<article class="peer-evaluation" id="peer-evaluation--002">
<article class="peer-assessment" id="peer-assessment--002">
<header class="peer-evaluation__header">
<h3 class="peer-evaluation__title">Evaluation #
<h3 class="peer-evaluation__title">assessment #
<span class="peer-evaluation__number--current">2</span> of
<span class="peer-evaluation__number--required">3</span>
</h3>
......@@ -283,7 +283,7 @@
<p>Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam quis risus eget urna mollis ornare vel eu leo. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Vestibulum id ligula porta felis euismod semper.</p>
</div>
<form id="peer-evaluation--002__evaluation" class="peer-evaluation__evaluation" method="post">
<form id="peer-assessment--002__evaluation" class="peer-evaluation__evaluation" method="post">
<fieldset class="evaluation__fields">
<legend class="evaluation__instruction">Please provide your thoughts on the following (note: required questions are indicated by an asterisk *):</legend>
......@@ -449,7 +449,7 @@
<ul class="list list--actions">
<li class="list--actions__item">
<button type="submit" id="peer-evaluation--001__evaluation__submit" class="action action--submit">Submit your evaluation &amp; move to response #2</button>
<button type="submit" id="peer-assessment--001__evaluation__submit" class="action action--submit">Submit your assessment &amp; move to response #2</button>
</li>
</ul>
</form>
......@@ -461,10 +461,10 @@
<!-- CASE: started, but incomplete and problem closed -->
<li id="openassessment__peer-evaluation"class="openassessment__steps__step step--peer-evaluation is--unavailable">
<li id="openassessment__peer-assessment"class="openassessment__steps__step step--peer-assessment is--unavailable">
<header class="step__header">
<h2 class="step__title">
<span class="step__label">Evaluate Peers' Responses</span>
<span class="step__label">Assess Peers' Responses</span>
<span class="step__deadline">due <span class="date">January 30, 2014</span> at <span class="time">15:00 UTC</span></span>
</h2>
......@@ -480,11 +480,11 @@
</li>
<!-- CASE: no peer responses to evaluate -->
<li id="openassessment__peer-evaluation" class="openassessment__steps__step step--peer-evaluation is--unavailable">
<!-- CASE: no peer responses to assess -->
<li id="openassessment__peer-assessment" class="openassessment__steps__step step--peer-assessment is--unavailable">
<header class="step__header">
<h2 class="step__title">
<span class="step__label">Evaluate Peers' Responses</span>
<span class="step__label">Assess Peers' Responses</span>
<span class="step__deadline">due <span class="date">January 30, 2014</span> at <span class="time">15:00 UTC</span></span>
</h2>
......@@ -500,10 +500,10 @@
<!-- CASE: completed -->
<li id="openassessment__peer-evaluation" class="openassessment__steps__step step--peer-evaluation">
<li id="openassessment__peer-assessment" class="openassessment__steps__step step--peer-assessment">
<header class="step__header">
<h2 class="step__title">
<span class="step__label">Evaluate Peers' Responses</span>
<span class="step__label">Assess Peers' Responses</span>
<span class="step__deadline">due <span class="date">January 30, 2014</span> at <span class="time">15:00 UTC</span></span>
</h2>
......
apps/openassessment/xblock/static/html/t-self-evaluation.html → apps/openassessment/xblock/static/html/t-self-assessment.html
<!-- TEMPLATE: self evaluation -->
<!-- TEMPLATE: self assessment -->
<!-- NOTES:
......@@ -7,10 +7,10 @@
-->
<!-- CASE: default/not started -->
<li id="openassessment__self-evaluation" class="openassessment__steps__step step--self-evaluation ui-toggle-visibility">
<li id="openassessment__self-assessment" class="openassessment__steps__step step--self-assessment ui-toggle-visibility">
<header class="step__header ui-toggle-visibility__control">
<h2 class="step__title">
<span class="step__title__label">Evaluate Your Response</span>
<span class="step__title__label">Assess Your Response</span>
<span class="step__title__deadline">due <span class="date">January 31, 2014</span> at <span class="time">15:00 UTC</span></span>
</h2>
......@@ -21,7 +21,7 @@
</header>
<div class="step--content">
<article class="self-evaluation" id="self-evaluation">
<article class="self-assessment" id="self-assessment">
<header class="self-evaluation__header">
<h3 class="self-evaluation__title">Your Submitted Response</h3>
</header>
......@@ -203,7 +203,7 @@
<ul class="list list--actions">
<li class="list--actions__item">
<button type="submit" id="self-evaluation__evaluation__submit" class="action action--submit">Submit your self evaluation</button>
<button type="submit" id="self-evaluation__evaluation__submit" class="action action--submit">Submit your self assessment</button>
</li>
</ul>
</form>
......@@ -212,10 +212,10 @@
</li>
<!-- CASE: not started and problem closed -->
<li id="openassessment__self-evaluation" class="openassessment__steps__step step--self-evaluation is--unavailable ui-toggle-visibility">
<li id="openassessment__self-assessment" class="openassessment__steps__step step--self-assessment is--unavailable ui-toggle-visibility">
<header class="step__header ui-toggle-visibility__control">
<h2 class="step__title">
<span class="step__title__label">Evaluate Your Response</span>
<span class="step__title__label">Assess Your Response</span>
<span class="step__title__deadline">due <span class="date">January 31, 2014</span> at <span class="time">15:00 UTC</span></span>
</h2>
......@@ -226,14 +226,14 @@
</span>
</header>
<!-- TO-DO: static self evaluation (if present) -->
<!-- TO-DO: static self assessment (if present) -->
</li>
<!-- CASE: complete -->
<li id="openassessment__self-evaluation" class="openassessment__steps__step step--self-evaluation ui-toggle-visibility">
<li id="openassessment__self-assessment" class="openassessment__steps__step step--self-assessment ui-toggle-visibility">
<header class="step__header ui-toggle-visibility__control">
<h2 class="step__title">
<span class="step__title__label">Evaluate Your Response</span>
<span class="step__title__label">Assess Your Response</span>
<span class="step__title__deadline">due <span class="date">January 31, 2014</span> at <span class="time">15:00 UTC</span></span>
</h2>
......@@ -244,5 +244,5 @@
</span>
</header>
<!-- ?: should this view be rolled into the general peer evaluation output and not separated out? -->
<!-- ?: should this view be rolled into the general peer assessment output and not separated out? -->
</li>
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/_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/_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; }
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