Merge pull request #2682 from edx/frances/experiments/rtl
RTL platform support
This commit is contained in:
frances botsford
6
.gitignore
vendored
6
.gitignore
vendored
@@ -71,13 +71,19 @@ lms/static/css/
|
||||
lms/static/sass/*.css
|
||||
lms/static/sass/*.css.map
|
||||
lms/static/sass/application.scss
|
||||
lms/static/sass/application-rtl.scss
|
||||
lms/static/sass/application-extend1.scss
|
||||
lms/static/sass/application-extend1-rtl.scss
|
||||
lms/static/sass/application-extend2.scss
|
||||
lms/static/sass/application-extend2-rtl.scss
|
||||
lms/static/sass/course.scss
|
||||
lms/static/sass/course-rtl.scss
|
||||
cms/static/css/
|
||||
cms/static/sass/*.css
|
||||
cms/static/sass/*.css.map
|
||||
|
||||
|
||||
|
||||
### Logging artifacts
|
||||
log/
|
||||
logs
|
||||
|
||||
@@ -307,6 +307,7 @@ STATICFILES_DIRS = [
|
||||
# Locale/Internationalization
|
||||
TIME_ZONE = 'America/New_York' # http://en.wikipedia.org/wiki/List_of_tz_zones_by_name
|
||||
LANGUAGE_CODE = 'en' # http://www.i18nguy.com/unicode/language-identifiers.html
|
||||
LANGUAGES_BIDI = lms.envs.common.LANGUAGES_BIDI
|
||||
|
||||
LANGUAGES = lms.envs.common.LANGUAGES
|
||||
LANGUAGE_DICT = dict(LANGUAGES)
|
||||
@@ -369,12 +370,30 @@ PIPELINE_CSS = {
|
||||
],
|
||||
'output_filename': 'css/cms-style-app-extend1.css',
|
||||
},
|
||||
'style-app-rtl': {
|
||||
'source_filenames': [
|
||||
'sass/style-app-rtl.css',
|
||||
],
|
||||
'output_filename': 'css/cms-style-app-rtl.css',
|
||||
},
|
||||
'style-app-extend1-rtl': {
|
||||
'source_filenames': [
|
||||
'sass/style-app-extend1-rtl.css',
|
||||
],
|
||||
'output_filename': 'css/cms-style-app-extend1-rtl.css',
|
||||
},
|
||||
'style-xmodule': {
|
||||
'source_filenames': [
|
||||
'sass/style-xmodule.css',
|
||||
],
|
||||
'output_filename': 'css/cms-style-xmodule.css',
|
||||
},
|
||||
'style-xmodule-rtl': {
|
||||
'source_filenames': [
|
||||
'sass/style-xmodule-rtl.css',
|
||||
],
|
||||
'output_filename': 'css/cms-style-xmodule-rtl.css',
|
||||
},
|
||||
'style-xmodule-annotations': {
|
||||
'source_filenames': [
|
||||
'css/vendor/ova/annotator.css',
|
||||
|
||||
@@ -279,25 +279,25 @@ p, ul, ol, dl {
|
||||
@include clearfix();
|
||||
|
||||
.page-header {
|
||||
float: left;
|
||||
@include float(left);
|
||||
@include margin-right(flex-gutter());
|
||||
width: flex-grid(6,12);
|
||||
margin-right: flex-gutter();
|
||||
}
|
||||
|
||||
.nav-actions {
|
||||
@include float(left);
|
||||
@include text-align(right);
|
||||
position: relative;
|
||||
bottom: -($baseline*0.75);
|
||||
float: right;
|
||||
width: flex-grid(6,12);
|
||||
text-align: right;
|
||||
|
||||
.nav-item {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
margin-right: ($baseline/2);
|
||||
@include margin-right($baseline/2);
|
||||
|
||||
&:last-child {
|
||||
margin-right: 0;
|
||||
@include margin-right(0);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -500,21 +500,21 @@ p, ul, ol, dl {
|
||||
|
||||
.main-column {
|
||||
clear: both;
|
||||
float: left;
|
||||
@include float(left);
|
||||
width: 70%;
|
||||
}
|
||||
|
||||
.sidebar {
|
||||
float: right;
|
||||
@include float(right);
|
||||
width: 28%;
|
||||
}
|
||||
|
||||
.left {
|
||||
float: left;
|
||||
@include float(left);
|
||||
}
|
||||
|
||||
.right {
|
||||
float: right;
|
||||
@include float(right);
|
||||
}
|
||||
|
||||
// ====================
|
||||
@@ -539,7 +539,7 @@ p, ul, ol, dl {
|
||||
.item-actions {
|
||||
position: absolute;
|
||||
top: 5px;
|
||||
right: 5px;
|
||||
@include right(5px);
|
||||
|
||||
.edit-button,
|
||||
.delete-button,
|
||||
|
||||
@@ -278,7 +278,16 @@
|
||||
height: ($baseline*1.2);
|
||||
width: ($baseline);
|
||||
margin: 0;
|
||||
background: transparent url("../img/drag-handles.png") no-repeat right center;
|
||||
|
||||
// CASE: right to left layout
|
||||
@include rtl {
|
||||
background: transparent url("../img/drag-handles.png") no-repeat left center;
|
||||
}
|
||||
|
||||
// CASE: left to right layout
|
||||
@include ltr {
|
||||
background: transparent url("../img/drag-handles.png") no-repeat right center;
|
||||
}
|
||||
}
|
||||
|
||||
&.toggle-action {
|
||||
|
||||
@@ -27,14 +27,14 @@
|
||||
}
|
||||
|
||||
.wrapper-l {
|
||||
float: left;
|
||||
@include float(left);
|
||||
width: flex-grid(7,12);
|
||||
}
|
||||
|
||||
.wrapper-r {
|
||||
float: right;
|
||||
@include float(right);
|
||||
width: flex-grid(4,12);
|
||||
text-align: right;
|
||||
@include text-align(right);
|
||||
}
|
||||
|
||||
.branding, .info-course, .nav-course, .nav-account, .nav-pitch {
|
||||
@@ -128,8 +128,8 @@
|
||||
|
||||
// specific elements - course name/info
|
||||
.info-course {
|
||||
margin-right: flex-gutter();
|
||||
border-right: 1px solid $gray-l4;
|
||||
@include margin-right(flex-gutter());
|
||||
@include border-right(1px solid $gray-l4);
|
||||
padding: ($baseline*0.75) flex-gutter() ($baseline*0.75) 0;
|
||||
|
||||
.course-org, .course-number {
|
||||
@@ -144,7 +144,7 @@
|
||||
}
|
||||
|
||||
.course-org {
|
||||
margin-right: ($baseline/4);
|
||||
@include margin-right($baseline/4);
|
||||
}
|
||||
|
||||
.course-title {
|
||||
@@ -184,7 +184,7 @@
|
||||
padding: ($baseline*0.75) 0;
|
||||
|
||||
.nav-sub {
|
||||
text-align: left;
|
||||
@include text-align(left);
|
||||
}
|
||||
|
||||
.nav-account-help {
|
||||
@@ -238,7 +238,7 @@
|
||||
|
||||
.branding {
|
||||
width: 20%;
|
||||
margin-right: 2%;
|
||||
@include margin-right(2%);
|
||||
}
|
||||
|
||||
.nav-account {
|
||||
@@ -263,7 +263,7 @@
|
||||
|
||||
.branding {
|
||||
width: 20%;
|
||||
margin-right: 2%;
|
||||
@include margin-right(2%);
|
||||
}
|
||||
|
||||
.info-course {
|
||||
|
||||
@@ -12,14 +12,14 @@
|
||||
.icon-inline {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin-right: ($baseline/4);
|
||||
@include margin-right($baseline/4);
|
||||
}
|
||||
|
||||
// ui - badges
|
||||
.wrapper-ui-badge {
|
||||
position: absolute;
|
||||
top: -1px;
|
||||
left: ($baseline*1.5);
|
||||
@include left($baseline*1.5);
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
|
||||
@@ -40,25 +40,25 @@
|
||||
@include clearfix();
|
||||
|
||||
.page-header {
|
||||
float: left;
|
||||
@include float(left);
|
||||
width: flex-grid(6,12);
|
||||
margin-right: flex-gutter();
|
||||
@include margin-right(flex-gutter());
|
||||
}
|
||||
|
||||
.nav-actions {
|
||||
position: relative;
|
||||
bottom: -($baseline*0.75);
|
||||
float: right;
|
||||
@include float(right);
|
||||
width: flex-grid(6,12);
|
||||
text-align: right;
|
||||
@include text-align(right);
|
||||
|
||||
.nav-item {
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
margin-right: ($baseline/2);
|
||||
@include margin-right(($baseline/2));
|
||||
|
||||
&:last-child {
|
||||
margin-right: 0;
|
||||
@include margin-right(0);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -214,8 +214,8 @@
|
||||
// 3/4 - 1/4 two col layout
|
||||
%two-col-1 {
|
||||
.content-primary {
|
||||
float: left;
|
||||
margin-right: flex-gutter();
|
||||
@include float(left);
|
||||
@include margin-right(flex-gutter());
|
||||
width: flex-grid(9,12);
|
||||
box-shadow: none;
|
||||
border: 0;
|
||||
@@ -223,7 +223,7 @@
|
||||
}
|
||||
|
||||
.content-supplementary {
|
||||
float: left;
|
||||
@include float(left);
|
||||
width: flex-grid(3,12);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -300,7 +300,7 @@ $outline-indent-width: $baseline;
|
||||
|
||||
.icon {
|
||||
@extend %t-icon5;
|
||||
margin-right: ($baseline/4);
|
||||
@include margin-right($baseline/4);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -34,7 +34,7 @@ nav {
|
||||
|
||||
.ui-toggle-dd {
|
||||
@include transition(all $tmg-f2 ease-in-out 0s);
|
||||
margin-left: ($baseline/10);
|
||||
margin: 0 ($baseline/10);
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
}
|
||||
@@ -148,7 +148,7 @@ nav {
|
||||
}
|
||||
|
||||
.nav-sub {
|
||||
text-align: left;
|
||||
@include text-align(left);
|
||||
|
||||
// ui triangle/nub
|
||||
&:after {
|
||||
@@ -167,20 +167,20 @@ nav {
|
||||
&.ui-right {
|
||||
|
||||
.wrapper-nav-sub {
|
||||
left: none;
|
||||
right: 0;
|
||||
@include left(none);
|
||||
@include right(0);
|
||||
}
|
||||
|
||||
.nav-sub {
|
||||
|
||||
// ui triangle/nub
|
||||
&:after {
|
||||
right: $baseline;
|
||||
@include right($baseline);
|
||||
margin-right: -10px;
|
||||
}
|
||||
|
||||
&:before {
|
||||
right: $baseline;
|
||||
@include right($baseline);
|
||||
margin-right: -11px;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -35,7 +35,7 @@
|
||||
|
||||
[class^="icon-"] {
|
||||
@extend %t-icon6;
|
||||
margin-right: ($baseline/4);
|
||||
@include margin-right($baseline/4);
|
||||
}
|
||||
|
||||
&:hover {
|
||||
@@ -84,11 +84,11 @@
|
||||
@include clearfix();
|
||||
|
||||
.action-item {
|
||||
float: left;
|
||||
margin-right: ($baseline/2);
|
||||
@include float(left);
|
||||
@include margin-right($baseline/2);
|
||||
|
||||
&:last-child {
|
||||
margin-right: 0;
|
||||
@include margin-right(0);
|
||||
}
|
||||
|
||||
.action {
|
||||
@@ -98,7 +98,7 @@
|
||||
[class^="icon-"] {
|
||||
@extend %t-icon4;
|
||||
vertical-align: middle;
|
||||
margin-right: $baseline/4;
|
||||
@include margin-right($baseline/4);
|
||||
|
||||
}
|
||||
|
||||
|
||||
@@ -210,7 +210,7 @@
|
||||
vertical-align: middle;
|
||||
width: $baseline*17.5;
|
||||
border: 4px solid $black;
|
||||
text-align: left;
|
||||
@include text-align(left);
|
||||
|
||||
.copy {
|
||||
border-top: 4px solid $blue;
|
||||
@@ -225,10 +225,10 @@
|
||||
|
||||
.nav-item {
|
||||
display: inline-block;
|
||||
margin-right: ($baseline*0.75);
|
||||
@include margin-right($baseline*0.75);
|
||||
|
||||
&:last-child {
|
||||
margin-right: 0;
|
||||
@include margin-right(0);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -437,22 +437,22 @@
|
||||
|
||||
.copy {
|
||||
width: flex-grid(7, 12);
|
||||
margin-right: flex-gutter();
|
||||
@include margin-right(flex-gutter());
|
||||
}
|
||||
|
||||
.nav-actions {
|
||||
width: flex-grid(4, 12);
|
||||
float: right;
|
||||
@include float(left);
|
||||
margin-top: ($baseline/4);
|
||||
text-align: right;
|
||||
|
||||
.nav-item {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin-right: ($baseline/2);
|
||||
@include margin-right($baseline/2);
|
||||
|
||||
&:last-child {
|
||||
margin-right: 0;
|
||||
@include margin-right(0);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -610,25 +610,25 @@
|
||||
width: flex-grid(1, 12);
|
||||
}
|
||||
|
||||
.copy {
|
||||
width: flex-grid(7, 12);
|
||||
margin-right: flex-gutter();
|
||||
}
|
||||
.copy {
|
||||
width: flex-grid(7, 12);
|
||||
@include margin-right(flex-gutter());
|
||||
}
|
||||
|
||||
.nav-actions {
|
||||
width: flex-grid(4, 12);
|
||||
float: right;
|
||||
margin-top: ($baseline/2);
|
||||
text-align: right;
|
||||
.nav-actions {
|
||||
width: flex-grid(4, 12);
|
||||
@include float(left);
|
||||
margin-top: ($baseline/2);
|
||||
text-align: right;
|
||||
|
||||
.nav-item {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin-right: ($baseline/2);
|
||||
.nav-item {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
@include margin-right($baseline/2);
|
||||
|
||||
&:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
&:last-child {
|
||||
@include margin-right(0);
|
||||
}
|
||||
|
||||
.action-primary {
|
||||
@extend %t-action4;
|
||||
@@ -829,7 +829,7 @@ body.uxdesign.alerts {
|
||||
.content-primary {
|
||||
@extend %ui-window;
|
||||
width: flex-grid(12, 12);
|
||||
margin-right: flex-gutter();
|
||||
@include margin-right(flex-gutter());
|
||||
padding: $baseline ($baseline*1.5);
|
||||
|
||||
> section {
|
||||
@@ -856,9 +856,9 @@ body.uxdesign.alerts {
|
||||
}
|
||||
|
||||
a {
|
||||
float: left;
|
||||
@include float(left);
|
||||
width: flex-grid(5, 12);
|
||||
margin-right: flex-gutter();
|
||||
@include margin-right(flex-gutter());
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -882,7 +882,7 @@ body.uxdesign.alerts {
|
||||
@include clearfix;
|
||||
|
||||
.alert-message {
|
||||
float: left;
|
||||
@include float(left);
|
||||
margin: 4px 0 0 0;
|
||||
color: $gray-d3;
|
||||
}
|
||||
@@ -892,7 +892,7 @@ body.uxdesign.alerts {
|
||||
}
|
||||
|
||||
.alert-action {
|
||||
float: right;
|
||||
@include float(left);
|
||||
|
||||
&.secondary {
|
||||
@include orange-button;
|
||||
|
||||
@@ -24,17 +24,17 @@
|
||||
@include clearfix();
|
||||
|
||||
.copy {
|
||||
float: left;
|
||||
@include float(left);
|
||||
width: flex-grid(8,12);
|
||||
margin-right: flex-gutter();
|
||||
@include margin-right(flex-gutter());
|
||||
}
|
||||
|
||||
.nav-introduction-supplementary {
|
||||
@extend %t-copy-sub2;
|
||||
float: right;
|
||||
@include float(right);
|
||||
width: flex-grid(4,12);
|
||||
display: block;
|
||||
text-align: right;
|
||||
@include text-align(right);
|
||||
|
||||
.icon {
|
||||
@extend %t-action3;
|
||||
|
||||
@@ -41,7 +41,7 @@
|
||||
display: inline-block;
|
||||
width: 49%;
|
||||
vertical-align: middle;
|
||||
text-align: right;
|
||||
@include text-align(right);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
62
cms/static/sass/style-app-extend1-rtl.scss
Normal file
62
cms/static/sass/style-app-extend1-rtl.scss
Normal file
@@ -0,0 +1,62 @@
|
||||
// studio - css architecture
|
||||
// ====================
|
||||
|
||||
// libs and resets *do not edit*
|
||||
@import 'bourbon/bourbon'; // lib - bourbon
|
||||
@import 'vendor/bi-app/bi-app-rtl'; // set the layout for right to left languages
|
||||
|
||||
// VENDOR + REBASE *referenced/used vendor presentation and reset*
|
||||
// ====================
|
||||
@import 'reset';
|
||||
|
||||
// BASE *default edX offerings*
|
||||
// ====================
|
||||
// base - utilities
|
||||
@import 'variables';
|
||||
@import 'mixins';
|
||||
@import 'mixins-inherited';
|
||||
|
||||
// base - assets
|
||||
@import 'assets/fonts';
|
||||
@import 'assets/graphics'; // sprites, basic img/figure/svg styling
|
||||
@import 'assets/anims'; // animations
|
||||
|
||||
// base - starter
|
||||
@import 'base';
|
||||
|
||||
// base - elements
|
||||
@import 'elements/typography';
|
||||
@import 'elements/icons'; // references to icons used
|
||||
@import 'elements/controls'; // buttons, link styles, sliders, etc.
|
||||
@import 'elements/xblocks'; // studio rendering chrome for xblocks
|
||||
@import 'elements/modules'; // content module patterns
|
||||
@import 'elements/layout'; // various standard layouts
|
||||
|
||||
// base - specific views
|
||||
@import 'views/account';
|
||||
@import 'views/assets';
|
||||
@import 'views/updates';
|
||||
@import 'views/dashboard';
|
||||
@import 'views/export';
|
||||
@import 'views/index';
|
||||
@import 'views/course-create';
|
||||
@import 'views/import';
|
||||
@import 'views/outline';
|
||||
@import 'views/settings';
|
||||
@import 'views/static-pages';
|
||||
@import 'views/unit';
|
||||
@import 'views/container';
|
||||
@import 'views/users';
|
||||
@import 'views/checklists';
|
||||
@import 'views/textbooks';
|
||||
@import 'views/export-git';
|
||||
@import 'views/group-configuration';
|
||||
|
||||
// base - contexts
|
||||
@import 'contexts/ie'; // ie-specific rules (mostly for known/older bugs)
|
||||
|
||||
// temp - inherited
|
||||
@import 'assets/content-types';
|
||||
|
||||
@import 'developer'; // used for any developer-created scss that needs further polish/refactoring
|
||||
@import 'shame'; // used for any bad-form/orphaned scss
|
||||
@@ -1,6 +1,8 @@
|
||||
// studio - css architecture
|
||||
// ====================
|
||||
|
||||
@import 'vendor/bi-app/bi-app-ltr'; // set the layout for left to right languages
|
||||
|
||||
// libs and resets *do not edit*
|
||||
@import 'bourbon/bourbon'; // lib - bourbon
|
||||
|
||||
|
||||
43
cms/static/sass/style-app-rtl.scss
Normal file
43
cms/static/sass/style-app-rtl.scss
Normal file
@@ -0,0 +1,43 @@
|
||||
// studio - css architecture
|
||||
// ====================
|
||||
|
||||
// libs and resets *do not edit*
|
||||
@import 'bourbon/bourbon'; // lib - bourbon
|
||||
@import 'vendor/bi-app/bi-app-rtl'; // set the layout for right to left languages
|
||||
|
||||
// VENDOR + REBASE *referenced/used vendor presentation and reset*
|
||||
// ====================
|
||||
@import 'reset';
|
||||
|
||||
// BASE *default edX offerings*
|
||||
// ====================
|
||||
// base - utilities
|
||||
@import 'variables';
|
||||
@import 'mixins';
|
||||
@import 'mixins-inherited';
|
||||
|
||||
// base - assets
|
||||
@import 'assets/fonts';
|
||||
@import 'assets/graphics'; // sprites, basic img/figure/svg styling
|
||||
@import 'assets/anims'; // animations
|
||||
|
||||
// base - starter
|
||||
@import 'base';
|
||||
|
||||
// base - elements
|
||||
@import 'elements/typography';
|
||||
@import 'elements/icons'; // references to icons used
|
||||
@import 'elements/controls'; // buttons, link styles, sliders, etc.
|
||||
@import 'elements/modules'; // content module patterns
|
||||
@import 'elements/navigation'; // all archetypes of navigation
|
||||
@import 'elements/layout'; // various standard layouts
|
||||
@import 'elements/forms';
|
||||
@import 'elements/header';
|
||||
@import 'elements/footer';
|
||||
@import 'elements/sock';
|
||||
@import 'elements/tender-widget';
|
||||
@import 'elements/system-feedback'; // alerts, notifications, states
|
||||
@import 'elements/system-help'; // help UI
|
||||
@import 'elements/modal'; // interstitial UI, dialogs, modal windows
|
||||
@import 'elements/vendor'; // overrides to vendor-provided styling
|
||||
@import 'elements/modal-window';
|
||||
@@ -1,6 +1,8 @@
|
||||
// studio - css architecture
|
||||
// ====================
|
||||
|
||||
@import 'vendor/bi-app/bi-app-ltr'; // set the layout for left to right languages
|
||||
|
||||
// libs and resets *do not edit*
|
||||
@import 'bourbon/bourbon'; // lib - bourbon
|
||||
|
||||
|
||||
36
cms/static/sass/style-xmodule-rtl.scss
Normal file
36
cms/static/sass/style-xmodule-rtl.scss
Normal file
@@ -0,0 +1,36 @@
|
||||
// studio - xmodule architecture
|
||||
// ====================
|
||||
|
||||
// libs and resets *do not edit*
|
||||
@import 'bourbon/bourbon'; // lib - bourbon
|
||||
@import 'vendor/bi-app/bi-app-rtl'; // set the layout for right to left languages
|
||||
|
||||
// VENDOR + REBASE *referenced/used vendor presentation and reset*
|
||||
// ====================
|
||||
@import 'reset';
|
||||
|
||||
// BASE *default edX offerings*
|
||||
// ====================
|
||||
// base - utilities
|
||||
@import 'variables';
|
||||
@import 'mixins';
|
||||
@import 'mixins-inherited';
|
||||
|
||||
// base - assets
|
||||
@import 'assets/fonts';
|
||||
@import 'assets/graphics'; // sprites, basic img/figure/svg styling
|
||||
@import 'assets/anims'; // animations
|
||||
|
||||
// base - starter
|
||||
@import 'base';
|
||||
|
||||
// base - elements
|
||||
@import 'elements/typography';
|
||||
@import 'elements/icons'; // references to icons used
|
||||
@import 'elements/controls'; // buttons, link styles, sliders, etc.
|
||||
@import 'elements/navigation'; // all archetypes of navigation
|
||||
|
||||
// xmodule
|
||||
@import 'xmodule/modules/css/module-styles.scss';
|
||||
@import 'xmodule/descriptors/css/module-styles.scss';
|
||||
@import 'elements/xmodules'; // styling for Studio-specific contexts
|
||||
@@ -3,6 +3,7 @@
|
||||
|
||||
// libs and resets *do not edit*
|
||||
@import 'bourbon/bourbon'; // lib - bourbon
|
||||
@import 'vendor/bi-app/bi-app-ltr'; // set the layout for left to right languages
|
||||
|
||||
// VENDOR + REBASE *referenced/used vendor presentation and reset*
|
||||
// ====================
|
||||
|
||||
11
cms/static/sass/vendor/bi-app/_bi-app-ltr.scss
vendored
Executable file
11
cms/static/sass/vendor/bi-app/_bi-app-ltr.scss
vendored
Executable file
@@ -0,0 +1,11 @@
|
||||
// ------------------------------------------
|
||||
// left to right module
|
||||
// authors:
|
||||
// twitter.com/anasnakawa
|
||||
// twitter.com/victorzamfir
|
||||
// licensed under the MIT license
|
||||
// http://www.opensource.org/licenses/mit-license.php
|
||||
// ------------------------------------------
|
||||
|
||||
@import 'variables-ltr';
|
||||
@import 'mixins';
|
||||
11
cms/static/sass/vendor/bi-app/_bi-app-rtl.scss
vendored
Executable file
11
cms/static/sass/vendor/bi-app/_bi-app-rtl.scss
vendored
Executable file
@@ -0,0 +1,11 @@
|
||||
// ------------------------------------------
|
||||
// right to left module
|
||||
// authors:
|
||||
// twitter.com/anasnakawa
|
||||
// twitter.com/victorzamfir
|
||||
// licensed under the MIT license
|
||||
// http://www.opensource.org/licenses/mit-license.php
|
||||
// ------------------------------------------
|
||||
|
||||
@import 'variables-rtl';
|
||||
@import 'mixins';
|
||||
294
cms/static/sass/vendor/bi-app/_mixins.scss
vendored
Executable file
294
cms/static/sass/vendor/bi-app/_mixins.scss
vendored
Executable file
@@ -0,0 +1,294 @@
|
||||
// ------------------------------------------
|
||||
// bi app mixins
|
||||
// authors:
|
||||
// twitter.com/anasnakawa
|
||||
// twitter.com/victorzamfir
|
||||
// licensed under the MIT license
|
||||
// http://www.opensource.org/licenses/mit-license.php
|
||||
// ------------------------------------------
|
||||
|
||||
// ------------------------------------------
|
||||
// Table of contents
|
||||
// ------------------------------------------
|
||||
// padding
|
||||
// margin
|
||||
// float
|
||||
// text align
|
||||
// clear
|
||||
// left / right
|
||||
// border
|
||||
// - width
|
||||
// - style
|
||||
// - color
|
||||
// - generic
|
||||
// - radius
|
||||
// ltr / rtl contents
|
||||
// ------------------------------------------
|
||||
|
||||
// generic mixin for properties with values
|
||||
// (top right bottom left)
|
||||
// ------------------------------------------
|
||||
@mixin bi-app-compact($property, $top, $right, $bottom, $left) {
|
||||
@if $bi-app-direction == ltr {
|
||||
#{$property}: $top $right $bottom $left;
|
||||
} @else {
|
||||
#{$property}: $top $left $bottom $right;
|
||||
}
|
||||
}
|
||||
|
||||
// padding
|
||||
// ------------------------------------------
|
||||
@mixin padding-left($distance) {
|
||||
padding-#{$bi-app-left}: $distance;
|
||||
}
|
||||
|
||||
@mixin padding-right($distance) {
|
||||
padding-#{$bi-app-right}: $distance;
|
||||
}
|
||||
|
||||
@mixin padding($top, $right, $bottom, $left) {
|
||||
@include bi-app-compact(padding, $top, $right, $bottom, $left);
|
||||
}
|
||||
|
||||
// margin
|
||||
// ------------------------------------------
|
||||
@mixin margin-left($distance) {
|
||||
margin-#{$bi-app-left}: $distance;
|
||||
}
|
||||
|
||||
@mixin margin-right($distance) {
|
||||
margin-#{$bi-app-right}: $distance;
|
||||
}
|
||||
|
||||
@mixin margin($top, $right, $bottom, $left) {
|
||||
@include bi-app-compact(margin, $top, $right, $bottom, $left);
|
||||
}
|
||||
|
||||
// float
|
||||
// ------------------------------------------
|
||||
@mixin bi-app-float-left {
|
||||
float: $bi-app-left;
|
||||
}
|
||||
|
||||
@mixin bi-app-float-right {
|
||||
float: $bi-app-right;
|
||||
}
|
||||
|
||||
@mixin float($direction) {
|
||||
@if $direction == left {
|
||||
@include bi-app-float-left;
|
||||
} @else if $direction == right {
|
||||
@include bi-app-float-right;
|
||||
} @else {
|
||||
float: $direction;
|
||||
}
|
||||
}
|
||||
|
||||
// text align
|
||||
// ------------------------------------------
|
||||
@mixin bi-app-text-align-left {
|
||||
text-align: $bi-app-left;
|
||||
}
|
||||
|
||||
@mixin bi-app-text-align-right {
|
||||
text-align: $bi-app-right;
|
||||
}
|
||||
|
||||
@mixin text-align($direction) {
|
||||
@if $direction == left {
|
||||
@include bi-app-text-align-left;
|
||||
} @else if $direction == right {
|
||||
@include bi-app-text-align-right;
|
||||
} @else {
|
||||
text-align: $direction;
|
||||
}
|
||||
}
|
||||
|
||||
// clear
|
||||
// ------------------------------------------
|
||||
@mixin bi-app-clear-left {
|
||||
clear: $bi-app-left;
|
||||
}
|
||||
|
||||
@mixin bi-app-clear-right {
|
||||
clear: $bi-app-right;
|
||||
}
|
||||
|
||||
@mixin clear($direction) {
|
||||
@if $direction == left {
|
||||
@include bi-app-clear-left;
|
||||
} @else if $direction == right {
|
||||
@include bi-app-clear-right;
|
||||
} @else {
|
||||
clear: $direction;
|
||||
}
|
||||
}
|
||||
|
||||
// left / right
|
||||
// ------------------------------------------
|
||||
@mixin left($distance) {
|
||||
@if $bi-app-direction == ltr {
|
||||
left: $distance;
|
||||
} @else if $bi-app-direction == rtl {
|
||||
right: $distance;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin right($distance) {
|
||||
@if $bi-app-direction == ltr {
|
||||
right: $distance;
|
||||
} @else if $bi-app-direction == rtl {
|
||||
left: $distance;
|
||||
}
|
||||
}
|
||||
|
||||
// border
|
||||
// ------------------------------------------
|
||||
|
||||
// width
|
||||
@mixin border-left-width($width) {
|
||||
border-#{$bi-app-left}-width: $width;
|
||||
}
|
||||
|
||||
@mixin border-right-width($width) {
|
||||
border-#{$bi-app-right}-width: $width;
|
||||
}
|
||||
|
||||
@mixin border-width($top, $right, $bottom, $left) {
|
||||
@include bi-app-compact(border-width, $top, $right, $bottom, $left);
|
||||
}
|
||||
|
||||
// style
|
||||
@mixin border-left-style($style) {
|
||||
border-#{$bi-app-left}-style: $style;
|
||||
}
|
||||
|
||||
@mixin border-right-style($style) {
|
||||
border-#{$bi-app-right}-style: $style;
|
||||
}
|
||||
|
||||
@mixin border-style($top, $right, $bottom, $left) {
|
||||
@include bi-app-compact(border-style, $top, $right, $bottom, $left);
|
||||
}
|
||||
|
||||
// color
|
||||
@mixin border-left-color($color) {
|
||||
border-#{$bi-app-left}-color: $color;
|
||||
}
|
||||
|
||||
@mixin border-right-color($color) {
|
||||
border-#{$bi-app-right}-color: $color;
|
||||
}
|
||||
|
||||
@mixin border-color($top, $right, $bottom, $left) {
|
||||
@include bi-app-compact(border-color, $top, $right, $bottom, $left);
|
||||
}
|
||||
|
||||
// generic
|
||||
@mixin border-left($border-style) {
|
||||
border-#{$bi-app-left}: $border-style;
|
||||
}
|
||||
|
||||
@mixin border-right($border-style) {
|
||||
border-#{$bi-app-right}: $border-style;
|
||||
}
|
||||
|
||||
// radius
|
||||
@mixin border-top-left-radius($radius) {
|
||||
-webkit-border-top-#{$bi-app-left}-radius: $radius;
|
||||
-moz-border-top#{$bi-app-left}-radius: $radius;
|
||||
border-top-#{$bi-app-left}-radius: $radius;
|
||||
}
|
||||
|
||||
@mixin border-top-right-radius($radius) {
|
||||
-webkit-border-top-#{$bi-app-right}-radius: $radius;
|
||||
-moz-border-top#{$bi-app-right}-radius: $radius;
|
||||
border-top-#{$bi-app-right}-radius: $radius;
|
||||
}
|
||||
|
||||
@mixin border-bottom-left-radius($radius) {
|
||||
-webkit-border-bottom-#{$bi-app-left}-radius: $radius;
|
||||
-moz-border-bottom#{$bi-app-left}-radius: $radius;
|
||||
border-bottom-#{$bi-app-left}-radius: $radius;
|
||||
}
|
||||
|
||||
@mixin border-bottom-right-radius($radius) {
|
||||
-webkit-border-bottom-#{$bi-app-right}-radius: $radius;
|
||||
-moz-border-bottom#{$bi-app-right}-radius: $radius;
|
||||
border-bottom-#{$bi-app-right}-radius: $radius;
|
||||
}
|
||||
|
||||
@mixin border-right-radius($radius) {
|
||||
@include border-top-right-radius($radius);
|
||||
@include border-bottom-right-radius($radius);
|
||||
}
|
||||
|
||||
@mixin border-left-radius($radius) {
|
||||
@include border-top-left-radius($radius);
|
||||
@include border-bottom-left-radius($radius);
|
||||
}
|
||||
|
||||
@mixin border-top-radius($radius) {
|
||||
@include border-top-left-radius($radius);
|
||||
@include border-top-right-radius($radius);
|
||||
}
|
||||
|
||||
@mixin border-bottom-radius($radius) {
|
||||
@include border-bottom-left-radius($radius);
|
||||
@include border-bottom-right-radius($radius);
|
||||
}
|
||||
|
||||
@mixin border-radius($topLeft, $topRight: null, $bottomRight: null, $bottomLeft: null) {
|
||||
@if $topRight != null {
|
||||
@include border-top-left-radius($topLeft);
|
||||
@include border-top-right-radius($topRight);
|
||||
@include border-bottom-right-radius($bottomRight);
|
||||
@include border-bottom-left-radius($bottomLeft);
|
||||
} @else {
|
||||
-webkit-border-radius: $topLeft;
|
||||
-moz-border-radius: $topLeft;
|
||||
-ms-border-radius: $topLeft;
|
||||
-o-border-radius: $topLeft;
|
||||
border-radius: $topLeft;
|
||||
}
|
||||
}
|
||||
|
||||
// Returns "en" or "ar", useful for image suffixes.
|
||||
// Usage: background-image: url(/img/header-#{lang()}.png);
|
||||
@function lang() {
|
||||
@if $bi-app-direction == ltr {
|
||||
@return 'en';
|
||||
} @else {
|
||||
@return 'ar';
|
||||
}
|
||||
}
|
||||
|
||||
// Support for "direction" declaration (renders ltr/rtl).
|
||||
// Useful for form elements as they swap the text-indent property and align the text accordingly.
|
||||
@mixin direction {
|
||||
direction: $bi-app-direction;
|
||||
}
|
||||
|
||||
// Inverts a percentage value. Example: 97% becames 3%.
|
||||
// Useful for background-position.
|
||||
@function bi-app-invert-percentage($percentage) {
|
||||
@if $bi-app-direction == rtl {
|
||||
@return 100% - $percentage;
|
||||
} @else {
|
||||
@return $percentage;
|
||||
}
|
||||
}
|
||||
|
||||
// ltr / rtl contents
|
||||
// ------------------------------------------
|
||||
@mixin ltr {
|
||||
@if $bi-app-direction == ltr {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin rtl {
|
||||
@if $bi-app-direction == rtl {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
15
cms/static/sass/vendor/bi-app/_variables-ltr.scss
vendored
Executable file
15
cms/static/sass/vendor/bi-app/_variables-ltr.scss
vendored
Executable file
@@ -0,0 +1,15 @@
|
||||
// ------------------------------------------
|
||||
// left to right variables to be used by bi-app mixins
|
||||
// authors:
|
||||
// twitter.com/anasnakawa
|
||||
// twitter.com/victorzamfir
|
||||
// licensed under the MIT license
|
||||
// http://www.opensource.org/licenses/mit-license.php
|
||||
// ------------------------------------------
|
||||
|
||||
// namespacing variables with bi-app to
|
||||
// avoid conflicting with other global variables
|
||||
$bi-app-left : left;
|
||||
$bi-app-right : right;
|
||||
$bi-app-direction : ltr;
|
||||
$bi-app-invert-direction: rtl;
|
||||
15
cms/static/sass/vendor/bi-app/_variables-rtl.scss
vendored
Executable file
15
cms/static/sass/vendor/bi-app/_variables-rtl.scss
vendored
Executable file
@@ -0,0 +1,15 @@
|
||||
// ------------------------------------------
|
||||
// right to left variables to be used by bi-app mixins
|
||||
// authors:
|
||||
// twitter.com/anasnakawa
|
||||
// twitter.com/victorzamfir
|
||||
// licensed under the MIT license
|
||||
// http://www.opensource.org/licenses/mit-license.php
|
||||
// ------------------------------------------
|
||||
|
||||
// namespacing variables with bi-app to
|
||||
// avoid conflicting with other global variables
|
||||
$bi-app-left : right;
|
||||
$bi-app-right : left;
|
||||
$bi-app-direction : rtl;
|
||||
$bi-app-invert-direction: ltr;
|
||||
@@ -37,7 +37,7 @@
|
||||
.action {
|
||||
@extend %t-action3;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
@include right(0);
|
||||
top: 40%;
|
||||
}
|
||||
}
|
||||
@@ -50,12 +50,10 @@
|
||||
|
||||
.content-primary, .content-supplementary {
|
||||
@include box-sizing(border-box);
|
||||
float: left;
|
||||
}
|
||||
|
||||
.content-primary {
|
||||
width: flex-grid(8, 12);
|
||||
margin-right: flex-gutter();
|
||||
@extend .ui-col-wide;
|
||||
|
||||
form {
|
||||
@include box-sizing(border-box);
|
||||
@@ -211,7 +209,7 @@
|
||||
}
|
||||
|
||||
.content-supplementary {
|
||||
width: flex-grid(4, 12);
|
||||
@extend .ui-col-narrow;
|
||||
|
||||
.bit {
|
||||
@extend %t-copy-sub1;
|
||||
@@ -243,7 +241,7 @@
|
||||
@extend %t-action3;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
@include right(0);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5,16 +5,14 @@
|
||||
|
||||
.content-primary, .content-supplementary {
|
||||
@include box-sizing(border-box);
|
||||
float: left;
|
||||
}
|
||||
|
||||
.content-primary {
|
||||
width: flex-grid(9, 12);
|
||||
margin-right: flex-gutter();
|
||||
@extend .ui-col-wide;
|
||||
}
|
||||
|
||||
.content-supplementary {
|
||||
width: flex-grid(3, 12);
|
||||
@extend .ui-col-narrow;
|
||||
}
|
||||
|
||||
.nav-actions {
|
||||
@@ -36,10 +34,10 @@
|
||||
|
||||
.new-button {
|
||||
@extend %t-action3;
|
||||
margin-left: $baseline;
|
||||
@include margin-left($baseline);
|
||||
|
||||
[class^="icon-"] {
|
||||
margin-right: ($baseline/2);
|
||||
@include margin-right($baseline/2);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -70,7 +68,7 @@
|
||||
width: flex-grid(3, 12);
|
||||
|
||||
&.pagination-compact {
|
||||
text-align: right;
|
||||
@include text-align(right);
|
||||
}
|
||||
|
||||
&.pagination-full {
|
||||
@@ -136,7 +134,7 @@
|
||||
.current-page {
|
||||
@extend %ui-depth1;
|
||||
position: absolute;
|
||||
left: -($baseline/4);
|
||||
@include left(-($baseline/4));
|
||||
}
|
||||
|
||||
.page-divider {
|
||||
|
||||
@@ -5,12 +5,10 @@
|
||||
|
||||
.content-primary, .content-supplementary {
|
||||
@include box-sizing(border-box);
|
||||
float: left;
|
||||
}
|
||||
|
||||
.content-primary {
|
||||
width: flex-grid(9, 12);
|
||||
margin-right: flex-gutter();
|
||||
@extend .ui-col-wide;
|
||||
}
|
||||
|
||||
// checklists - general
|
||||
@@ -58,15 +56,16 @@
|
||||
.checklist-title {
|
||||
@include transition(color $tmg-f2 ease-in-out 0s);
|
||||
width: flex-grid(6, 9);
|
||||
margin: 0 flex-gutter() 0 0;
|
||||
float: left;
|
||||
margin: 0;
|
||||
@include margin-right(flex-gutter());
|
||||
@include float(left);
|
||||
|
||||
.ui-toggle-expansion {
|
||||
@include transition(all $tmg-f2 ease-in-out 0s);
|
||||
@extend %t-action1;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin-right: ($baseline/2);
|
||||
@include margin-right($baseline/2);
|
||||
color: $gray-l4;
|
||||
}
|
||||
|
||||
@@ -86,9 +85,9 @@
|
||||
.checklist-status {
|
||||
@extend %t-copy-sub1;
|
||||
width: flex-grid(3, 9);
|
||||
float: right;
|
||||
@include float(right);
|
||||
margin-top: ($baseline/2);
|
||||
text-align: right;
|
||||
@include text-align(right);
|
||||
color: $gray-l2;
|
||||
|
||||
|
||||
@@ -127,7 +126,7 @@
|
||||
|
||||
.action-primary {
|
||||
@include green-button();
|
||||
float: left;
|
||||
@include float(left);
|
||||
|
||||
.icon-add {
|
||||
@extend %t-icon7;
|
||||
@@ -141,7 +140,7 @@
|
||||
@include grey-button();
|
||||
@extend %t-action3;
|
||||
@extend %t-regular;
|
||||
float: right;
|
||||
@include float(right);
|
||||
|
||||
.icon-delete {
|
||||
@extend %t-icon7;
|
||||
@@ -227,15 +226,16 @@
|
||||
.task-input {
|
||||
display: inline-block;
|
||||
vertical-align: text-top;
|
||||
float: left;
|
||||
margin: ($baseline/2) flex-gutter() 0 0;
|
||||
@include float(left);
|
||||
margin-top: ($baseline/2);
|
||||
@include margin-right(flex-gutter());
|
||||
}
|
||||
|
||||
.task-details {
|
||||
@extend %t-strong;
|
||||
display: inline-block;
|
||||
vertical-align: text-top;
|
||||
float: left;
|
||||
@include float(left);
|
||||
width: flex-grid(6,9);
|
||||
|
||||
.task-name {
|
||||
@@ -264,7 +264,7 @@
|
||||
@include clearfix();
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
float: right;
|
||||
@include float(right);
|
||||
width: flex-grid(2,9);
|
||||
margin: ($baseline/2) 0 0 flex-gutter();
|
||||
opacity: 0.0;
|
||||
@@ -336,6 +336,6 @@
|
||||
}
|
||||
|
||||
.content-supplementary {
|
||||
width: flex-grid(3, 12);
|
||||
@extend .ui-col-narrow;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -17,16 +17,14 @@
|
||||
// basic layout
|
||||
.content-primary, .content-supplementary {
|
||||
@include box-sizing(border-box);
|
||||
float: left;
|
||||
}
|
||||
|
||||
.content-primary {
|
||||
width: flex-grid(9, 12);
|
||||
margin-right: flex-gutter();
|
||||
@extend .ui-col-wide;
|
||||
}
|
||||
|
||||
.content-supplementary {
|
||||
width: flex-grid(3, 12);
|
||||
@extend .ui-col-narrow;
|
||||
}
|
||||
|
||||
// ====================
|
||||
@@ -439,13 +437,13 @@
|
||||
.course-link {
|
||||
@extend %ui-depth2;
|
||||
width: flex-grid(6, 9);
|
||||
margin-right: flex-gutter();
|
||||
@include margin-right(flex-gutter());
|
||||
}
|
||||
|
||||
// course title
|
||||
.course-title {
|
||||
@extend %t-title4;
|
||||
margin: 0 ($baseline*2) ($baseline/4) 0;
|
||||
@include margin(0, ($baseline*2), ($baseline/4), 0);
|
||||
font-weight: 300;
|
||||
}
|
||||
|
||||
@@ -486,17 +484,17 @@
|
||||
@extend %ui-depth3;
|
||||
position: static;
|
||||
width: flex-grid(3, 9);
|
||||
text-align: right;
|
||||
@include text-align(right);
|
||||
opacity: 0;
|
||||
pointer-events: none;
|
||||
|
||||
.action {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin-right: ($baseline/2);
|
||||
@include margin-right($baseline/2);
|
||||
|
||||
&:last-child {
|
||||
margin-right: 0;
|
||||
@include margin-right(0);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -6,16 +6,14 @@
|
||||
// UI: basic layout
|
||||
.content-primary, .content-supplementary {
|
||||
@include box-sizing(border-box);
|
||||
float: left;
|
||||
}
|
||||
|
||||
.content-primary {
|
||||
width: flex-grid(9,12);
|
||||
margin-right: flex-gutter();
|
||||
@extend .ui-col-wide;
|
||||
}
|
||||
|
||||
.content-supplementary {
|
||||
width: flex-grid(3,12);
|
||||
@extend .ui-col-narrow;
|
||||
}
|
||||
|
||||
|
||||
|
||||
6
cms/static/sass/views/_import.scss
vendored
6
cms/static/sass/views/_import.scss
vendored
@@ -5,16 +5,14 @@
|
||||
|
||||
.content-primary, .content-supplementary {
|
||||
@include box-sizing(border-box);
|
||||
float: left;
|
||||
}
|
||||
|
||||
.content-primary {
|
||||
width: flex-grid(9,12);
|
||||
margin-right: flex-gutter();
|
||||
@extend .ui-col-wide;
|
||||
}
|
||||
|
||||
.content-supplementary {
|
||||
width: flex-grid(3,12);
|
||||
@extend .ui-col-narrow;
|
||||
}
|
||||
|
||||
// UI: export controls
|
||||
|
||||
@@ -70,12 +70,10 @@
|
||||
.content-primary,
|
||||
.content-supplementary {
|
||||
@include box-sizing(border-box);
|
||||
float: left;
|
||||
}
|
||||
|
||||
.content-primary {
|
||||
width: flex-grid(9, 12);
|
||||
margin-right: flex-gutter();
|
||||
@extend .ui-col-wide;
|
||||
|
||||
.no-content {
|
||||
@extend %no-content;
|
||||
@@ -83,7 +81,7 @@
|
||||
}
|
||||
|
||||
.content-supplementary {
|
||||
width: flex-grid(3, 12);
|
||||
@extend .ui-col-narrow;
|
||||
}
|
||||
|
||||
|
||||
@@ -297,7 +295,7 @@
|
||||
}
|
||||
|
||||
.section-header-details {
|
||||
float: left;
|
||||
@include float(left);
|
||||
width: flex-grid(6, 9);
|
||||
|
||||
.icon, .wrapper-section-title {
|
||||
@@ -306,7 +304,7 @@
|
||||
}
|
||||
|
||||
.icon {
|
||||
margin-right: ($baseline/4);
|
||||
@include margin-right($baseline/4);
|
||||
}
|
||||
|
||||
.wrapper-section-title {
|
||||
@@ -316,10 +314,10 @@
|
||||
}
|
||||
|
||||
.section-header-actions {
|
||||
float: right;
|
||||
@include float(right);
|
||||
width: flex-grid(3, 9);
|
||||
margin-top: -($baseline/4);
|
||||
text-align: right;
|
||||
@include text-align(right);
|
||||
|
||||
.actions-list {
|
||||
@extend %actions-list;
|
||||
@@ -385,7 +383,7 @@
|
||||
}
|
||||
|
||||
.subsection-header-details {
|
||||
float: left;
|
||||
@include float(left);
|
||||
width: flex-grid(6, 9);
|
||||
|
||||
.icon, .wrapper-subsection-title {
|
||||
@@ -394,7 +392,7 @@
|
||||
}
|
||||
|
||||
.icon {
|
||||
margin-right: ($baseline/4);
|
||||
@include margin-right($baseline/4);
|
||||
}
|
||||
|
||||
.wrapper-subsection-title {
|
||||
@@ -405,10 +403,10 @@
|
||||
}
|
||||
|
||||
.subsection-header-actions {
|
||||
float: right;
|
||||
@include float(right);
|
||||
width: flex-grid(3, 9);
|
||||
margin-top: -($baseline/4);
|
||||
text-align: right;
|
||||
@include text-align(right);
|
||||
|
||||
.actions-list {
|
||||
@extend %actions-list;
|
||||
@@ -424,7 +422,7 @@
|
||||
|
||||
// status
|
||||
.subsection-status {
|
||||
margin: 0 0 0 $outline-indent-width;
|
||||
@include margin(0, 0, 0, $outline-indent-width);
|
||||
}
|
||||
|
||||
// content
|
||||
@@ -467,16 +465,16 @@
|
||||
}
|
||||
|
||||
.unit-header-details {
|
||||
float: left;
|
||||
@include float(left);
|
||||
width: flex-grid(6, 9);
|
||||
margin-top: ($baseline/4);
|
||||
}
|
||||
|
||||
.unit-header-actions {
|
||||
float: right;
|
||||
@include float(right);
|
||||
width: flex-grid(3, 9);
|
||||
margin-top: -($baseline/10);
|
||||
text-align: right;
|
||||
@include text-align(right);
|
||||
|
||||
.actions-list {
|
||||
@extend %actions-list;
|
||||
@@ -497,7 +495,7 @@
|
||||
.icon {
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
margin-right: ($baseline/2);
|
||||
@include margin-right($baseline/2);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -5,13 +5,11 @@
|
||||
|
||||
.content-primary, .content-supplementary {
|
||||
@include box-sizing(border-box);
|
||||
float: left;
|
||||
}
|
||||
|
||||
.content-primary {
|
||||
@extend %ui-window;
|
||||
width: flex-grid(9, 12);
|
||||
margin-right: flex-gutter();
|
||||
@extend .ui-col-wide;
|
||||
padding: $baseline ($baseline*1.5);
|
||||
}
|
||||
|
||||
@@ -67,16 +65,17 @@
|
||||
|
||||
.title-2 {
|
||||
width: flex-grid(4, 9);
|
||||
margin: 0 flex-gutter() 0 0;
|
||||
float: left;
|
||||
margin: 0;
|
||||
@include margin-right(flex-gutter());
|
||||
@include float(left);
|
||||
}
|
||||
|
||||
.tip {
|
||||
@extend %t-copy-sub2;
|
||||
width: flex-grid(5, 9);
|
||||
float: right;
|
||||
@include float(right);
|
||||
margin-top: ($baseline/2);
|
||||
text-align: right;
|
||||
@include text-align(right);
|
||||
color: $gray-l2;
|
||||
}
|
||||
}
|
||||
@@ -372,7 +371,7 @@
|
||||
}
|
||||
|
||||
.field {
|
||||
float: left;
|
||||
@include float(left);
|
||||
width: flex-grid(3, 9);
|
||||
margin-bottom: ($baseline/4);
|
||||
margin-right: flex-gutter();
|
||||
@@ -384,7 +383,7 @@
|
||||
.tip {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
@include right(0);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -598,6 +597,7 @@
|
||||
|
||||
.grade-specific-bar {
|
||||
height: 50px !important;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.grades {
|
||||
@@ -897,13 +897,13 @@
|
||||
}
|
||||
|
||||
.content-supplementary {
|
||||
width: flex-grid(3, 12);
|
||||
@extend .ui-col-narrow;
|
||||
}
|
||||
|
||||
|
||||
.wrapper-modal-window {
|
||||
|
||||
|
||||
.validation-error-modal-content {
|
||||
|
||||
|
||||
.error-header {
|
||||
p {
|
||||
strong {
|
||||
@@ -911,28 +911,28 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
hr {
|
||||
margin: 25px 0;
|
||||
}
|
||||
|
||||
|
||||
.error-list {
|
||||
.error-item {
|
||||
.error-item-title {
|
||||
color: $error-red;
|
||||
}
|
||||
|
||||
|
||||
.error-item-message {
|
||||
width:100%;
|
||||
border: none;
|
||||
resize: none;
|
||||
|
||||
|
||||
&:focus {
|
||||
outline: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -203,7 +203,7 @@
|
||||
position: absolute;
|
||||
display: block;
|
||||
top: 0;
|
||||
right: 0;
|
||||
@include right(0);
|
||||
z-index: 11;
|
||||
width: 35px;
|
||||
height: 100%;
|
||||
@@ -238,8 +238,8 @@
|
||||
.component-actions,
|
||||
.course-nav-item-actions {
|
||||
display: inline-block;
|
||||
float: right;
|
||||
margin-right: ($baseline*2);
|
||||
@include float(right);
|
||||
@include margin-right($baseline*2);
|
||||
padding: 8px 0px;
|
||||
vertical-align: middle;
|
||||
text-align: center;
|
||||
|
||||
@@ -5,12 +5,10 @@
|
||||
|
||||
.content-primary, .content-supplementary {
|
||||
@include box-sizing(border-box);
|
||||
float: left;
|
||||
}
|
||||
|
||||
.content-primary {
|
||||
width: flex-grid(9, 12);
|
||||
margin-right: flex-gutter();
|
||||
@extend .ui-col-wide;
|
||||
|
||||
.no-textbook-content {
|
||||
@extend %no-content;
|
||||
@@ -31,7 +29,7 @@
|
||||
.textbook-title {
|
||||
@extend %t-title4;
|
||||
@extend %t-strong;
|
||||
margin-right: ($baseline*14);
|
||||
@include margin-right($baseline*14);
|
||||
}
|
||||
|
||||
.ui-toggle-expansion {
|
||||
@@ -85,7 +83,7 @@
|
||||
opacity: 0.0;
|
||||
position: absolute;
|
||||
top: $baseline;
|
||||
right: $baseline;
|
||||
@include right($baseline);
|
||||
|
||||
.action {
|
||||
display: inline-block;
|
||||
@@ -305,9 +303,9 @@
|
||||
display: block;
|
||||
width: 46%;
|
||||
border-bottom: none;
|
||||
margin: 0 ($baseline*0.75) 0 0;
|
||||
@include margin(0, ($baseline*0.75), 0, 0);
|
||||
padding: ($baseline/4) 0 0 0;
|
||||
float: left;
|
||||
@include float(left);
|
||||
position: relative;
|
||||
|
||||
input, textarea {
|
||||
@@ -318,7 +316,7 @@
|
||||
@extend %ui-btn-flat-outline;
|
||||
position: absolute;
|
||||
top: 3px;
|
||||
right: 0;
|
||||
@include right(0);
|
||||
}
|
||||
|
||||
}
|
||||
@@ -354,6 +352,6 @@
|
||||
}
|
||||
}
|
||||
.content-supplementary {
|
||||
width: flex-grid(3, 12);
|
||||
@extend .ui-col-narrow;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -3,5 +3,5 @@
|
||||
// .view-unit styles will go here once we split it from container
|
||||
|
||||
.view-unit {
|
||||
|
||||
|
||||
}
|
||||
|
||||
@@ -160,31 +160,31 @@
|
||||
}
|
||||
|
||||
.course-handouts {
|
||||
@extend %ui-window;
|
||||
width: 30%;
|
||||
padding: 20px 30px;
|
||||
margin: 0;
|
||||
border-radius: 0 3px 3px 0;
|
||||
border-left: none;
|
||||
background: $lightGrey;
|
||||
@extend %ui-window;
|
||||
width: 30%;
|
||||
padding: 20px 30px;
|
||||
margin: 0;
|
||||
@include border-radius(0, 3px, 3px, 0);
|
||||
@include border-left(none);
|
||||
background: $lightGrey;
|
||||
|
||||
.title {
|
||||
@extend %t-title4;
|
||||
.title {
|
||||
@extend %t-title4;
|
||||
@extend %t-light;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
.edit-button {
|
||||
@include white-button();
|
||||
.edit-button {
|
||||
@include white-button;
|
||||
@extend %t-action4;
|
||||
@extend %t-regular;
|
||||
float: right;
|
||||
float: right;
|
||||
padding: 3px 10px 4px;
|
||||
margin-left: 7px;
|
||||
|
||||
.edit-icon,
|
||||
.delete-icon {
|
||||
margin-right: 4px;
|
||||
@include margin-right($baseline/5);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -6,16 +6,14 @@
|
||||
// LAYOUT: page
|
||||
.content-primary, .content-supplementary {
|
||||
@include box-sizing(border-box);
|
||||
float: left;
|
||||
}
|
||||
|
||||
.content-primary {
|
||||
width: flex-grid(9, 12);
|
||||
margin-right: flex-gutter();
|
||||
@extend .ui-col-wide;
|
||||
}
|
||||
|
||||
.content-supplementary {
|
||||
width: flex-grid(3, 12);
|
||||
@extend .ui-col-narrow;
|
||||
}
|
||||
|
||||
// ELEM: content
|
||||
@@ -123,7 +121,7 @@
|
||||
// ELEM: item - metadata
|
||||
.item-metadata {
|
||||
width: flex-grid(5, 9);
|
||||
margin-right: flex-gutter();
|
||||
@include margin-right(flex-gutter());
|
||||
|
||||
.user-username, .user-email {
|
||||
display: inline-block;
|
||||
@@ -134,7 +132,7 @@
|
||||
@include transition(color $tmg-f2 ease-in-out 0s);
|
||||
@extend %t-title4;
|
||||
@extend %t-strong;
|
||||
margin: 0 ($baseline/2) ($baseline/10) 0;
|
||||
@include margin(0, ($baseline/2), ($baseline/10), 0);
|
||||
color: $gray-d4;
|
||||
}
|
||||
|
||||
|
||||
@@ -8,7 +8,12 @@
|
||||
<!--[if IE 8]><html class="ie8 lte9 lte8" lang="${LANGUAGE_CODE}"><![endif]-->
|
||||
<!--[if IE 9]><html class="ie9 lte9" lang="${LANGUAGE_CODE}"><![endif]-->
|
||||
<!--[if gt IE 9]><!--><html lang="${LANGUAGE_CODE}"><!--<![endif]-->
|
||||
<head>
|
||||
<%
|
||||
# set doc language direction
|
||||
from django.utils.translation import get_language_bidi
|
||||
dir_rtl = 'rtl' if get_language_bidi() else 'ltr'
|
||||
%>
|
||||
<head dir="${dir_rtl}">
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
<title>
|
||||
@@ -35,7 +40,7 @@
|
||||
<%block name="header_extras"></%block>
|
||||
</head>
|
||||
|
||||
<body class="<%block name='bodyclass'></%block> hide-wip lang_${LANGUAGE_CODE}">
|
||||
<body class="${dir_rtl} <%block name='bodyclass'></%block> hide-wip lang_${LANGUAGE_CODE}">
|
||||
<%block name="view_notes"></%block>
|
||||
|
||||
<a class="nav-skip" href="#content">${_("Skip to this view's content")}</a>
|
||||
@@ -341,7 +346,7 @@
|
||||
% endif
|
||||
|
||||
<!-- view -->
|
||||
<div class="wrapper wrapper-view">
|
||||
<div class="wrapper wrapper-view" dir="${dir_rtl}">
|
||||
<% online_help_token = self.online_help_token() if hasattr(self, 'online_help_token') else None %>
|
||||
<%include file="widgets/header.html" args="online_help_token=online_help_token" />
|
||||
|
||||
|
||||
@@ -14,7 +14,7 @@
|
||||
<%= date_added %>
|
||||
</td>
|
||||
<td class="embed-col">
|
||||
<input type="text" class="embeddable-xml-input" value="<%= portable_url %>" readonly>
|
||||
<input type="text" class="embeddable-xml-input" value="<%= portable_url %>" readonly dir="ltr">
|
||||
</td>
|
||||
<td class="embed-col">
|
||||
<input type="text" class="embeddable-xml-input" value="<%= external_url %>" readonly>
|
||||
@@ -30,4 +30,4 @@
|
||||
<div class="action-button"><i class="icon-lock"></i><i class="icon-unlock-alt"></i></div>
|
||||
</li>
|
||||
</ul>
|
||||
</td>
|
||||
</td>
|
||||
|
||||
@@ -7,7 +7,7 @@
|
||||
<div class="input-wrap field text required field-add-chapter-asset chapter<%= order %>-asset
|
||||
<% if (error && error.attributes && error.attributes.asset_path) { print('error'); } %>">
|
||||
<label for="chapter<%= order %>-asset-path"><%= gettext("Chapter Asset") %></label>
|
||||
<input id="chapter<%= order %>-asset-path" name="chapter<%= order %>-asset-path" class="chapter-asset-path" placeholder="<%= _.str.sprintf(gettext("path/to/introductionToCookieBaking-CH%d.pdf"), order) %>" value="<%= asset_path %>" type="text">
|
||||
<input id="chapter<%= order %>-asset-path" name="chapter<%= order %>-asset-path" class="chapter-asset-path" placeholder="<%= _.str.sprintf(gettext("path/to/introductionToCookieBaking-CH%d.pdf"), order) %>" value="<%= asset_path %>" type="text" dir="ltr">
|
||||
<span class="tip tip-stacked"><%= gettext("upload a PDF file or provide the path to a Studio asset file") %></span>
|
||||
<button class="action action-upload"><%= gettext("Upload PDF") %></button>
|
||||
</div>
|
||||
|
||||
@@ -12,7 +12,7 @@
|
||||
<%= chapters.length %> PDF Chapters
|
||||
</a></p>
|
||||
<% } else if(chapters.length === 1) { %>
|
||||
<p>
|
||||
<p dir="ltr">
|
||||
<%= chapters.at(0).get("asset_path") %>
|
||||
</p>
|
||||
<% } %>
|
||||
|
||||
@@ -261,7 +261,7 @@ require(["domReady!", "jquery", "js/models/settings/course_details", "js/views/s
|
||||
|
||||
<div class="wrapper-input">
|
||||
<div class="input">
|
||||
<input type="text" class="long new-course-image-url" id="course-image-url" value="" placeholder="Your course image URL" autocomplete="off" />
|
||||
<input type="text" dir="ltr" class="long new-course-image-url" id="course-image-url" value="" placeholder="Your course image URL" autocomplete="off" />
|
||||
<span class="tip tip-stacked">${_("Please provide a valid path and name to your course image (Note: only JPEG or PNG format supported)")}</span>
|
||||
</div>
|
||||
<button type="button" class="action action-upload-image">${_("Upload Course Image")}</button>
|
||||
@@ -281,7 +281,7 @@ require(["domReady!", "jquery", "js/models/settings/course_details", "js/views/s
|
||||
</div>
|
||||
|
||||
<div class="input">
|
||||
<input type="text" class="long new-course-introduction-video add-video-data" id="course-introduction-video" value="" placeholder="your YouTube video's ID" autocomplete="off" />
|
||||
<input type="text" dir="ltr" class="long new-course-introduction-video add-video-data" id="course-introduction-video" value="" placeholder="your YouTube video's ID" autocomplete="off" />
|
||||
<span class="tip tip-stacked">${_("Enter your YouTube video's ID (along with any restriction parameters)")}</span>
|
||||
</div>
|
||||
</li>
|
||||
|
||||
@@ -63,7 +63,7 @@ require(["domReady!", "jquery", "js/views/settings/grading", "js/models/settings
|
||||
<li class="field" id="field-course-grading-range">
|
||||
<div class="grade-controls course-grading-range well">
|
||||
<a href="#" class="new-grade-button"><span class="plus-icon"></span></a>
|
||||
<div class="grade-slider">
|
||||
<div class="grade-slider" dir="ltr">
|
||||
<div class="grade-bar">
|
||||
<ol class="increments">
|
||||
<li class="increment-0">0</li>
|
||||
|
||||
@@ -1,6 +1,7 @@
|
||||
<%!
|
||||
from staticfiles.storage import staticfiles_storage
|
||||
from pipeline_mako import compressed_css, compressed_js
|
||||
from django.utils.translation import get_language_bidi
|
||||
%>
|
||||
|
||||
<%def name='url(file, raw=False)'><%
|
||||
@@ -11,6 +12,13 @@ except:
|
||||
%>${url}${"?raw" if raw else ""}</%def>
|
||||
|
||||
<%def name='css(group, raw=False)'>
|
||||
<%
|
||||
rtl_group = '{}-rtl'.format(group)
|
||||
|
||||
if get_language_bidi() and rtl_group in settings.PIPELINE_CSS:
|
||||
group = rtl_group
|
||||
%>
|
||||
|
||||
% if settings.FEATURES['USE_DJANGO_PIPELINE']:
|
||||
${compressed_css(group, raw=raw)}
|
||||
% else:
|
||||
|
||||
@@ -12,6 +12,8 @@ from django.core import cache
|
||||
|
||||
# If we can't find a 'general' CACHE defined in settings.py, we simply fall back
|
||||
# to returning the default cache. This will happen with dev machines.
|
||||
from django.utils.translation import get_language
|
||||
|
||||
try:
|
||||
cache = cache.get_cache('general')
|
||||
except Exception:
|
||||
@@ -45,7 +47,7 @@ def cache_if_anonymous(view_func):
|
||||
# same view accessed through different domain names may
|
||||
# return different things, so include the domain name in the key.
|
||||
domain = str(request.META.get('HTTP_HOST')) + '.'
|
||||
cache_key = domain + "cache_if_anonymous." + request.path
|
||||
cache_key = domain + "cache_if_anonymous." + get_language() + '.' + request.path
|
||||
response = cache.get(cache_key)
|
||||
if not response:
|
||||
response = view_func(request, *args, **kwargs)
|
||||
|
||||
@@ -61,7 +61,7 @@ div.problem {
|
||||
width: 100px;
|
||||
|
||||
label {
|
||||
float: left;
|
||||
@include float(left);
|
||||
clear: both;
|
||||
margin-bottom: 5px;
|
||||
|
||||
@@ -81,23 +81,23 @@ div.problem {
|
||||
}
|
||||
|
||||
.indicator_container {
|
||||
float: left;
|
||||
@include float(left);
|
||||
width: 25px;
|
||||
height: 1px;
|
||||
margin-right: 15px;
|
||||
@include margin-right(15px);
|
||||
}
|
||||
|
||||
fieldset {
|
||||
@include box-sizing(border-box);
|
||||
margin: 0px 0px $baseline;
|
||||
padding-left: $baseline;
|
||||
border-left: 1px solid #ddd;
|
||||
@include padding-left($baseline);
|
||||
@include border-left(1px solid #ddd);
|
||||
}
|
||||
|
||||
input[type="radio"],
|
||||
input[type="checkbox"] {
|
||||
float: left;
|
||||
margin: 4px 8px 0 0;
|
||||
@include float(left);
|
||||
@include margin(4px, 8px, 0, 0);
|
||||
}
|
||||
|
||||
text {
|
||||
@@ -633,7 +633,8 @@ div.problem {
|
||||
// padding: 8px 12px;
|
||||
// margin-top: 10px;
|
||||
display: inline-block;
|
||||
margin: 8px 0 0 $baseline/2;
|
||||
margin-top: 8px;
|
||||
@include margin-left($baseline/2);
|
||||
color: #666;
|
||||
font-style: italic;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
|
||||
@@ -276,6 +276,7 @@ nav.sequence-nav {
|
||||
height: 100%;
|
||||
width: 40px;
|
||||
text-indent: -9999px;
|
||||
overflow: hidden;
|
||||
@include transition(all .2s $ease-in-out-quad 0s);
|
||||
|
||||
/* &:focus {
|
||||
@@ -294,23 +295,41 @@ nav.sequence-nav {
|
||||
}
|
||||
|
||||
&.prev {
|
||||
left: -10px;
|
||||
border-radius: 35px 0 0 35px;
|
||||
@include left(-10px);
|
||||
@include border-radius(35px, 0, 0, 35px);
|
||||
|
||||
a {
|
||||
background-image: url('../images/sequence-nav/previous-icon.png');
|
||||
background-position: center 15px;
|
||||
|
||||
// CASE: left to right layout
|
||||
@include ltr {
|
||||
background-image: url('../images/sequence-nav/previous-icon.png');
|
||||
}
|
||||
|
||||
// CASE: right to left layout
|
||||
@include rtl {
|
||||
background-image: url('../images/sequence-nav/next-icon.png');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.next {
|
||||
right: -10px;
|
||||
border-radius: 0 35px 35px 0;
|
||||
@include right(-10px);
|
||||
@include border-radius(0, 35px, 35px, 0);
|
||||
|
||||
a {
|
||||
margin-left: 30px;
|
||||
background-image: url('../images/sequence-nav/next-icon.png');
|
||||
@include margin-left(30px);
|
||||
background-position: center 15px;
|
||||
|
||||
// CASE: left to right layout
|
||||
@include ltr {
|
||||
background-image: url('../images/sequence-nav/next-icon.png');
|
||||
}
|
||||
|
||||
// CASE: right to left layout
|
||||
@include rtl {
|
||||
background-image: url('../images/sequence-nav/previous-icon.png');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -334,7 +353,7 @@ nav.sequence-bottom {
|
||||
display: inline-block;
|
||||
|
||||
li {
|
||||
float: left;
|
||||
@include float(left);
|
||||
width: 50px;
|
||||
height: 44px;
|
||||
border: 1px solid #ccc;
|
||||
@@ -351,6 +370,7 @@ nav.sequence-bottom {
|
||||
display: block;
|
||||
padding: lh(.5) 4px;
|
||||
text-indent: -9999px;
|
||||
overflow: hidden;
|
||||
@include transition(all .2s $ease-in-out-quad 0s);
|
||||
|
||||
&:hover, &:focus {
|
||||
@@ -369,21 +389,39 @@ nav.sequence-bottom {
|
||||
}
|
||||
|
||||
&.prev {
|
||||
border-radius: 35px 0 0 35px;
|
||||
@include border-radius(35px, 0, 0, 35px);
|
||||
|
||||
a {
|
||||
background-image: url('../images/sequence-nav/previous-icon.png');
|
||||
background-position: center 15px;
|
||||
|
||||
// CASE: left to right layout
|
||||
@include ltr {
|
||||
background-image: url('../images/sequence-nav/previous-icon.png');
|
||||
}
|
||||
|
||||
// CASE: right to left layout
|
||||
@include rtl {
|
||||
background-image: url('../images/sequence-nav/next-icon.png');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.next {
|
||||
border-radius: 0 35px 35px 0;
|
||||
border-left: none;
|
||||
@include border-radius(0, 35px, 35px, 0);
|
||||
@include border-left(none);
|
||||
|
||||
a {
|
||||
background-image: url('../images/sequence-nav/next-icon.png');
|
||||
background-position: center 15px;
|
||||
|
||||
// CASE: left to right layout
|
||||
@include ltr {
|
||||
background-image: url('../images/sequence-nav/next-icon.png');
|
||||
}
|
||||
|
||||
// CASE: right to left layout
|
||||
@include rtl {
|
||||
background-image: url('../images/sequence-nav/previous-icon.png');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -23,7 +23,7 @@
|
||||
|
||||
.edit-header {
|
||||
@include box-sizing(border-box);
|
||||
padding: 18px 0 18px $baseline;
|
||||
padding: 18px $baseline;
|
||||
top: 0 !important; // ugly override for second level tab override
|
||||
right: 0;
|
||||
background-color: $blue;
|
||||
|
||||
@@ -179,6 +179,7 @@ div.video {
|
||||
line-height: 46px;
|
||||
margin: 0;
|
||||
padding: 0 0 0 15px;
|
||||
overflow: hidden;
|
||||
text-indent: -9999px;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
box-shadow: 1px 0 0 #555, inset 1px 0 0 #555;
|
||||
|
||||
@@ -87,6 +87,20 @@
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
// layout placeholders
|
||||
.ui-col-wide {
|
||||
width: flex-grid(9, 12);
|
||||
@include margin-right(flex-gutter());
|
||||
@include float(left);
|
||||
}
|
||||
|
||||
.ui-col-narrow {
|
||||
width: flex-grid(3, 12);
|
||||
@include float(left);
|
||||
}
|
||||
|
||||
|
||||
|
||||
// extends - UI - window
|
||||
%ui-window {
|
||||
@include clearfix();
|
||||
|
||||
@@ -86,6 +86,7 @@ locales:
|
||||
dummy_locales:
|
||||
- eo
|
||||
- fake2
|
||||
- en@rtl
|
||||
|
||||
# Directories we don't search for strings.
|
||||
ignore_dirs:
|
||||
|
||||
@@ -17,7 +17,7 @@ class I18nTestCase(TestCase):
|
||||
self.assertIn('<html lang="en">', response.content)
|
||||
self.assertEqual(response['Content-Language'], 'en')
|
||||
self.assertTrue(re.search('<body.*class=".*lang_en">', response.content))
|
||||
|
||||
|
||||
def test_esperanto(self):
|
||||
response = self.client.get('/', HTTP_ACCEPT_LANGUAGE='eo')
|
||||
self.assertIn('<html lang="eo">', response.content)
|
||||
|
||||
@@ -671,11 +671,14 @@ FAVICON_PATH = 'images/favicon.ico'
|
||||
# Locale/Internationalization
|
||||
TIME_ZONE = 'America/New_York' # http://en.wikipedia.org/wiki/List_of_tz_zones_by_name
|
||||
LANGUAGE_CODE = 'en' # http://www.i18nguy.com/unicode/language-identifiers.html
|
||||
# these languages display right to left
|
||||
LANGUAGES_BIDI = ("en@rtl", "he", "ar", "fa", "ur", "fa-ir")
|
||||
|
||||
# Sourced from http://www.localeplanet.com/icu/ and wikipedia
|
||||
LANGUAGES = (
|
||||
('en', u'English'),
|
||||
('eo', u'Dummy Language (Esperanto)'), # Dummy language used for testing
|
||||
('en@rtl', u'English (right-to-left)'),
|
||||
('eo', u'Dummy Language (Esperanto)'), # Dummy languaged used for testing
|
||||
('fake2', u'Fake translations'), # Another dummy language for testing (not pushed to prod)
|
||||
|
||||
('am', u'አማርኛ'), # Amharic
|
||||
@@ -1066,6 +1069,25 @@ PIPELINE_CSS = {
|
||||
],
|
||||
'output_filename': 'css/lms-style-app-extend2.css',
|
||||
},
|
||||
'style-app-rtl': {
|
||||
'source_filenames': [
|
||||
'sass/application-rtl.css',
|
||||
'sass/ie-rtl.css'
|
||||
],
|
||||
'output_filename': 'css/lms-style-app-rtl.css',
|
||||
},
|
||||
'style-app-extend1-rtl': {
|
||||
'source_filenames': [
|
||||
'sass/application-extend1-rtl.css',
|
||||
],
|
||||
'output_filename': 'css/lms-style-app-extend1-rtl.css',
|
||||
},
|
||||
'style-app-extend2-rtl': {
|
||||
'source_filenames': [
|
||||
'sass/application-extend2-rtl.css',
|
||||
],
|
||||
'output_filename': 'css/lms-style-app-extend2-rtl.css',
|
||||
},
|
||||
'style-course-vendor': {
|
||||
'source_filenames': [
|
||||
'js/vendor/CodeMirror/codemirror.css',
|
||||
@@ -1081,6 +1103,13 @@ PIPELINE_CSS = {
|
||||
],
|
||||
'output_filename': 'css/lms-style-course.css',
|
||||
},
|
||||
'style-course-rtl': {
|
||||
'source_filenames': [
|
||||
'sass/course-rtl.css',
|
||||
'xmodule/modules.css',
|
||||
],
|
||||
'output_filename': 'css/lms-style-course-rtl.css',
|
||||
},
|
||||
'style-xmodule-annotations': {
|
||||
'source_filenames': [
|
||||
'css/vendor/ova/annotator.css',
|
||||
|
||||
61
lms/static/sass/application-extend1-rtl.scss.mako
Normal file
61
lms/static/sass/application-extend1-rtl.scss.mako
Normal file
@@ -0,0 +1,61 @@
|
||||
## NOTE: This Sass infrastructure is redundant, but needed in order to address an IE9 rule limit within CSS - http://blogs.msdn.com/b/ieinternals/archive/2011/05/14/10164546.aspx
|
||||
|
||||
// lms - css application architecture (platform)
|
||||
// ====================
|
||||
|
||||
// libs and resets *do not edit*
|
||||
@import 'bourbon/bourbon'; // lib - bourbon
|
||||
@import 'vendor/bi-app/bi-app-rtl'; // set the layout for right to left languages
|
||||
|
||||
// BASE *default edX offerings*
|
||||
// ====================
|
||||
|
||||
// base - utilities
|
||||
@import 'base/reset';
|
||||
@import 'base/variables';
|
||||
@import 'base/mixins';
|
||||
|
||||
## THEMING
|
||||
## -------
|
||||
## Set up this file to import an edX theme library if the environment
|
||||
## indicates that a theme should be used. The assumption is that the
|
||||
## theme resides outside of this main edX repository, in a directory
|
||||
## called themes/<theme-name>/, with its base Sass file in
|
||||
## themes/<theme-name>/static/sass/_<theme-name>.scss. That one entry
|
||||
## point can be used to @import in as many other things as needed.
|
||||
% if env["FEATURES"].get("USE_CUSTOM_THEME", False):
|
||||
// import theme's Sass overrides
|
||||
@import '${env.get('THEME_NAME')}';
|
||||
% endif
|
||||
|
||||
@import 'base/base';
|
||||
|
||||
// base - assets
|
||||
@import 'base/font_face';
|
||||
@import 'base/extends';
|
||||
@import 'base/animations';
|
||||
|
||||
// base - starter
|
||||
@import 'base/base';
|
||||
|
||||
// base - elements
|
||||
@import 'elements/typography';
|
||||
@import 'elements/controls';
|
||||
|
||||
// shared - platform
|
||||
@import 'multicourse/home';
|
||||
@import 'multicourse/dashboard';
|
||||
@import 'multicourse/account';
|
||||
@import 'multicourse/courses';
|
||||
@import 'multicourse/course_about';
|
||||
@import 'multicourse/jobs';
|
||||
@import 'multicourse/media-kit';
|
||||
@import 'multicourse/about_pages';
|
||||
@import 'multicourse/press_release';
|
||||
@import 'multicourse/error-pages';
|
||||
@import 'multicourse/help';
|
||||
@import 'multicourse/edge';
|
||||
|
||||
@import 'developer'; // used for any developer-created scss that needs further polish/refactoring
|
||||
@import 'shame'; // used for any bad-form/orphaned scss
|
||||
## NOTE: needed here for cascade and dependency purposes, but not a great permanent solution
|
||||
@@ -1,11 +1,11 @@
|
||||
## NOTE: This Sass infrastructure is redundant, but needed in order to address an IE9 rule limit within CSS - http://blogs.msdn.com/b/ieinternals/archive/2011/05/14/10164546.aspx
|
||||
|
||||
|
||||
// lms - css application architecture (platform)
|
||||
// ====================
|
||||
|
||||
// libs and resets *do not edit*
|
||||
@import 'bourbon/bourbon'; // lib - bourbon
|
||||
@import 'vendor/bi-app/bi-app-ltr'; // set the layout for left to right languages
|
||||
|
||||
// BASE *default edX offerings*
|
||||
// ====================
|
||||
|
||||
69
lms/static/sass/application-extend2-rtl.scss.mako
Normal file
69
lms/static/sass/application-extend2-rtl.scss.mako
Normal file
@@ -0,0 +1,69 @@
|
||||
## NOTE: This Sass infrastructure is redundant, but needed in order to address an IE9 rule limit within CSS - http://blogs.msdn.com/b/ieinternals/archive/2011/05/14/10164546.aspx
|
||||
|
||||
// lms - css application architecture (platform)
|
||||
// ====================
|
||||
|
||||
// libs and resets *do not edit*
|
||||
@import 'bourbon/bourbon'; // lib - bourbon
|
||||
@import 'vendor/bi-app/bi-app-rtl'; // set the layout for right to left languages
|
||||
|
||||
// BASE *default edX offerings*
|
||||
// ====================
|
||||
|
||||
// base - utilities
|
||||
@import 'base/reset';
|
||||
@import 'base/variables';
|
||||
@import 'base/mixins';
|
||||
|
||||
## THEMING
|
||||
## -------
|
||||
## Set up this file to import an edX theme library if the environment
|
||||
## indicates that a theme should be used. The assumption is that the
|
||||
## theme resides outside of this main edX repository, in a directory
|
||||
## called themes/<theme-name>/, with its base Sass file in
|
||||
## themes/<theme-name>/static/sass/_<theme-name>.scss. That one entry
|
||||
## point can be used to @import in as many other things as needed.
|
||||
% if env["FEATURES"].get("USE_CUSTOM_THEME", False):
|
||||
// import theme's Sass overrides
|
||||
@import '${env.get('THEME_NAME')}';
|
||||
% endif
|
||||
|
||||
@import 'base/base';
|
||||
|
||||
// base - assets
|
||||
@import 'base/font_face';
|
||||
@import 'base/extends';
|
||||
@import 'base/animations';
|
||||
|
||||
// base - starter
|
||||
@import 'base/base';
|
||||
|
||||
// base - elements
|
||||
@import 'elements/typography';
|
||||
@import 'elements/controls';
|
||||
@import 'elements/system-feedback';
|
||||
|
||||
// base - specific views
|
||||
@import 'views/verification';
|
||||
@import 'views/shoppingcart';
|
||||
|
||||
// applications
|
||||
@import "discussion/utilities/variables";
|
||||
@import "discussion/mixins";
|
||||
@import 'discussion/discussion'; // Process old file after definitions but before everything else
|
||||
@import "discussion/elements/actions";
|
||||
@import "discussion/elements/editor";
|
||||
@import "discussion/elements/labels";
|
||||
@import "discussion/elements/navigation";
|
||||
@import "discussion/views/thread";
|
||||
@import "discussion/views/create-edit-post";
|
||||
@import "discussion/views/response";
|
||||
@import 'discussion/utilities/developer';
|
||||
@import 'discussion/utilities/shame';
|
||||
|
||||
@import 'news';
|
||||
|
||||
// temp - shame and developer
|
||||
@import 'developer'; // used for any developer-created scss that needs further polish/refactoring
|
||||
@import 'shame'; // used for any bad-form/orphaned scss
|
||||
## NOTE: needed here for cascade and dependency purposes, but not a great permanent solution
|
||||
@@ -1,11 +1,11 @@
|
||||
## NOTE: This Sass infrastructure is redundant, but needed in order to address an IE9 rule limit within CSS - http://blogs.msdn.com/b/ieinternals/archive/2011/05/14/10164546.aspx
|
||||
|
||||
|
||||
// lms - css application architecture (platform)
|
||||
// ====================
|
||||
|
||||
// libs and resets *do not edit*
|
||||
@import 'bourbon/bourbon'; // lib - bourbon
|
||||
@import 'vendor/bi-app/bi-app-ltr'; // set the layout for left to right languages
|
||||
|
||||
// BASE *default edX offerings*
|
||||
// ====================
|
||||
|
||||
57
lms/static/sass/application-rtl.scss.mako
Normal file
57
lms/static/sass/application-rtl.scss.mako
Normal file
@@ -0,0 +1,57 @@
|
||||
## Note: This Sass infrastructure is repeated in application-extend1 and application-extend2, but needed in order to address an IE9 rule limit within CSS - http://blogs.msdn.com/b/ieinternals/archive/2011/05/14/10164546.aspx
|
||||
|
||||
// lms - css application architecture
|
||||
// ====================
|
||||
|
||||
// libs and resets *do not edit*
|
||||
@import 'bourbon/bourbon'; // lib - bourbon
|
||||
@import 'vendor/bi-app/bi-app-rtl'; // set the layout for right to left languages
|
||||
|
||||
// BASE *default edX offerings*
|
||||
// ====================
|
||||
|
||||
// base - utilities
|
||||
@import 'base/reset';
|
||||
@import 'base/variables';
|
||||
@import 'base/mixins';
|
||||
|
||||
## THEMING
|
||||
## -------
|
||||
## Set up this file to import an edX theme library if the environment
|
||||
## indicates that a theme should be used. The assumption is that the
|
||||
## theme resides outside of this main edX repository, in a directory
|
||||
## called themes/<theme-name>/, with its base Sass file in
|
||||
## themes/<theme-name>/static/sass/_<theme-name>.scss. That one entry
|
||||
## point can be used to @import in as many other things as needed.
|
||||
% if env["FEATURES"].get("USE_CUSTOM_THEME", False):
|
||||
// import theme's Sass overrides
|
||||
@import '${env.get('THEME_NAME')}';
|
||||
% endif
|
||||
|
||||
@import 'base/base';
|
||||
|
||||
// base - assets
|
||||
@import 'base/font_face';
|
||||
@import 'base/extends';
|
||||
@import 'base/animations';
|
||||
|
||||
// base - starter
|
||||
@import 'base/base';
|
||||
|
||||
// base - elements
|
||||
@import 'elements/typography';
|
||||
@import 'elements/controls';
|
||||
|
||||
// shared - course
|
||||
@import 'shared/forms';
|
||||
@import 'shared/footer';
|
||||
@import 'shared/header';
|
||||
@import 'shared/course_object';
|
||||
@import 'shared/course_filter';
|
||||
@import 'shared/modal';
|
||||
@import 'shared/activation_messages';
|
||||
@import 'shared/unsubscribe';
|
||||
|
||||
@import 'developer'; // used for any developer-created scss that needs further polish/refactoring
|
||||
@import 'shame'; // used for any bad-form/orphaned scss
|
||||
## NOTE: needed here for cascade and dependency purposes, but not a great permanent solution
|
||||
@@ -5,6 +5,7 @@
|
||||
|
||||
// libs and resets *do not edit*
|
||||
@import 'bourbon/bourbon'; // lib - bourbon
|
||||
@import 'vendor/bi-app/bi-app-ltr'; // set the layout for left to right languages
|
||||
|
||||
// BASE *default edX offerings*
|
||||
// ====================
|
||||
|
||||
@@ -54,7 +54,6 @@
|
||||
|
||||
// ====================
|
||||
|
||||
|
||||
// extends - UI - used for page/view-level wrappers (for centering/grids)
|
||||
%ui-wrapper {
|
||||
@include clearfix();
|
||||
|
||||
@@ -1,3 +1,5 @@
|
||||
// lms variables
|
||||
|
||||
// base
|
||||
$baseline: 20px;
|
||||
|
||||
|
||||
77
lms/static/sass/course-rtl.scss.mako
Normal file
77
lms/static/sass/course-rtl.scss.mako
Normal file
@@ -0,0 +1,77 @@
|
||||
@import 'bourbon/bourbon';
|
||||
@import 'vendor/bi-app/bi-app-rtl'; // set the layout for right to left languages
|
||||
|
||||
@import 'base/reset';
|
||||
@import 'base/font_face';
|
||||
@import 'base/variables';
|
||||
@import 'base/mixins';
|
||||
|
||||
## THEMING
|
||||
## -------
|
||||
## Set up this file to import an edX theme library if the environment
|
||||
## indicates that a theme should be used. The assumption is that the
|
||||
## theme resides outside of this main edX repository, in a directory
|
||||
## called themes/<theme-name>/, with its base Sass file in
|
||||
## themes/<theme-name>/static/sass/_<theme-name>.scss. That one entry
|
||||
## point can be used to @import in as many other things as needed.
|
||||
% if env["FEATURES"].get("USE_CUSTOM_THEME", False):
|
||||
// import theme's Sass overrides
|
||||
@import '${env.get('THEME_NAME')}';
|
||||
% endif
|
||||
|
||||
@import 'base/base';
|
||||
@import 'base/extends';
|
||||
@import 'base/animations';
|
||||
@import 'shared/tooltips';
|
||||
|
||||
// base - elements
|
||||
@import 'elements/typography';
|
||||
@import 'elements/controls';
|
||||
|
||||
// Course base / layout styles
|
||||
@import 'course/layout/courseware_header';
|
||||
@import 'course/layout/footer';
|
||||
@import 'course/base/mixins';
|
||||
@import 'course/base/base';
|
||||
@import 'course/base/extends';
|
||||
@import 'xmodule/modules/css/module-styles.scss';
|
||||
|
||||
// courseware
|
||||
@import 'course/courseware/courseware';
|
||||
@import 'course/courseware/sidebar';
|
||||
@import 'course/courseware/amplifier';
|
||||
@import 'course/layout/calculator';
|
||||
@import 'course/layout/timer';
|
||||
@import 'course/layout/chat';
|
||||
|
||||
// course-specific courseware (all styles in these files should be gated by a
|
||||
// course-specific class). This should be replaced with a better way of
|
||||
// providing course-specific styling.
|
||||
@import "course/courseware/courses/_cs188.scss";
|
||||
|
||||
// wiki
|
||||
@import "course/wiki/basic-html";
|
||||
@import "course/wiki/sidebar";
|
||||
@import "course/wiki/create";
|
||||
@import "course/wiki/wiki";
|
||||
@import "course/wiki/table";
|
||||
|
||||
// pages
|
||||
@import "course/info";
|
||||
@import "course/syllabus"; // TODO arjun replace w/ custom tabs, see courseware/courses.py
|
||||
@import "course/textbook";
|
||||
@import "course/profile";
|
||||
@import "course/gradebook";
|
||||
@import "course/tabs";
|
||||
@import "course/staff_grading";
|
||||
@import "course/rubric";
|
||||
@import "course/open_ended_grading";
|
||||
|
||||
// instructor
|
||||
@import "course/instructor/instructor";
|
||||
@import "course/instructor/instructor_2";
|
||||
@import "course/instructor/email";
|
||||
@import "xmodule/descriptors/css/module-styles.scss";
|
||||
|
||||
// discussion
|
||||
@import "course/discussion/form-wmd-toolbar";
|
||||
@@ -1,4 +1,5 @@
|
||||
@import 'bourbon/bourbon';
|
||||
@import 'vendor/bi-app/bi-app-ltr'; // set the layout for left to right languages
|
||||
|
||||
@import 'base/reset';
|
||||
@import 'base/font_face';
|
||||
|
||||
@@ -80,7 +80,7 @@ div.info-wrapper {
|
||||
section.handouts {
|
||||
@extend .sidebar;
|
||||
border-radius: 0 4px 4px 0;
|
||||
border-left: 1px solid #ddd;
|
||||
@include border-left(1px solid #ddd);
|
||||
box-shadow: none;
|
||||
font-size: 14px;
|
||||
|
||||
|
||||
@@ -141,7 +141,7 @@
|
||||
margin-bottom: lh();
|
||||
|
||||
h1 {
|
||||
float: left;
|
||||
@include float(left);
|
||||
font-size: 1em;
|
||||
font-weight: 100;
|
||||
margin: 0;
|
||||
@@ -188,7 +188,7 @@
|
||||
}
|
||||
|
||||
h2 {
|
||||
border-right: 1px dashed #ddd;
|
||||
@include border-right(1px dashed #ddd);
|
||||
@include box-sizing(border-box);
|
||||
display: table-cell;
|
||||
letter-spacing: 0;
|
||||
@@ -201,7 +201,7 @@
|
||||
|
||||
.sections {
|
||||
display: table-cell;
|
||||
padding-left: flex-gutter(9);
|
||||
@include padding-left(flex-gutter(9));
|
||||
width: flex-grid(7, 9);
|
||||
|
||||
> div {
|
||||
|
||||
@@ -6,7 +6,7 @@ body {
|
||||
}
|
||||
|
||||
body, h1, h2, h3, h4, h5, h6, p, p a:link, p a:visited, a, label {
|
||||
text-align: left;
|
||||
@include text-align(left);
|
||||
font-family: $sans-serif;
|
||||
}
|
||||
|
||||
@@ -49,7 +49,7 @@ form {
|
||||
form.choicegroup {
|
||||
label {
|
||||
clear: both;
|
||||
float: left;
|
||||
@include float(left);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
h1.top-header {
|
||||
border-bottom: 1px solid $border-color-2;
|
||||
text-align: left;
|
||||
@include text-align(left);
|
||||
font-size: em(24);
|
||||
font-weight: 100;
|
||||
padding-bottom: lh();
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
|
||||
@mixin blue-button {
|
||||
display: block;
|
||||
height: 35px;
|
||||
@@ -54,4 +55,4 @@
|
||||
&:hover, &:focus {
|
||||
background: -webkit-linear-gradient(top, #888, #666);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -23,7 +23,7 @@ html.video-fullscreen{
|
||||
|
||||
.instructor-info-action {
|
||||
@extend %t-copy-sub2;
|
||||
float: right;
|
||||
@include float(right);
|
||||
margin-left: ($baseline/2);
|
||||
padding: ($baseline/4) ($baseline/2);
|
||||
border-radius: ($baseline/4);
|
||||
|
||||
@@ -1,8 +1,8 @@
|
||||
.course-index {
|
||||
@extend .sidebar;
|
||||
@extend .tran;
|
||||
border-radius: 3px 0 0 3px;
|
||||
border-right: 1px solid $border-color-2;
|
||||
@include border-right(1px solid $border-color-2);
|
||||
@include border-radius(3px, 0, 0, 3px);
|
||||
|
||||
#open_close_accordion {
|
||||
display: none;
|
||||
@@ -47,7 +47,7 @@
|
||||
a {
|
||||
border-radius: 0;
|
||||
box-shadow: none;
|
||||
padding-left: 19px;
|
||||
@include padding-left(19px);
|
||||
color: $link-color;
|
||||
}
|
||||
|
||||
@@ -61,9 +61,22 @@
|
||||
}
|
||||
|
||||
span.ui-icon {
|
||||
left: 0;
|
||||
background-image: url("/static/images/ui-icons_222222_256x240.png");
|
||||
@include left(0);
|
||||
opacity: 0.3;
|
||||
background-image: url("/static/images/ui-icons_222222_256x240.png"); // jQuery UI sprite
|
||||
|
||||
&.ui-icon-triangle-1-e {
|
||||
|
||||
// CASE: left to right layout
|
||||
@include ltr {
|
||||
background-position: -32px -16px; // jQuery UI east arrow position
|
||||
}
|
||||
|
||||
// CASE: right to left layout
|
||||
@include rtl {
|
||||
background-position: -96px -16px; // jQuery UI west arrow position
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -185,3 +185,8 @@
|
||||
|
||||
}
|
||||
|
||||
.rtl .instructor-dashboard-wrapper .beta-button-wrapper,
|
||||
.rtl .instructor-dashboard-wrapper .studio-edit-link {
|
||||
left: 2em;
|
||||
right: auto;
|
||||
}
|
||||
|
||||
@@ -785,7 +785,6 @@ section.instructor-dashboard-content-2 {
|
||||
.info {
|
||||
@include box-sizing(border-box);
|
||||
padding: ($baseline/2);
|
||||
|
||||
border: 1px solid $light-gray;
|
||||
color: $lighter-base-font-color;
|
||||
line-height: 1.3em;
|
||||
@@ -833,7 +832,7 @@ section.instructor-dashboard-content-2 {
|
||||
input[type="button"].add {
|
||||
@include idashbutton($blue);
|
||||
position: absolute;
|
||||
right: $baseline;
|
||||
@include right($baseline);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1621,3 +1620,8 @@ input[name="subject"] {
|
||||
}
|
||||
}
|
||||
|
||||
.rtl .instructor-dashboard-wrapper-2 .olddash-button-wrapper,
|
||||
.rtl .instructor-dashboard-wrapper-2 .studio-edit-link {
|
||||
left: 2em;
|
||||
right: auto;
|
||||
}
|
||||
|
||||
@@ -16,10 +16,10 @@ nav.course-material {
|
||||
@include border-top-radius(4px);
|
||||
@include clearfix;
|
||||
padding: 28px 0 10px 0;
|
||||
margin-left: 10px;
|
||||
@include margin-left(10px);
|
||||
|
||||
li {
|
||||
float: left;
|
||||
@include float(left);
|
||||
list-style: none;
|
||||
margin-right: 6px;
|
||||
|
||||
@@ -120,7 +120,7 @@ header.global.slim {
|
||||
|
||||
h1.logo {
|
||||
margin: 0 10px 0 13px;
|
||||
padding-right: 20px;
|
||||
@include padding-right(20px);
|
||||
|
||||
&:before {
|
||||
@extend %faded-vertical-divider;
|
||||
@@ -128,7 +128,7 @@ header.global.slim {
|
||||
display: block;
|
||||
height: 35px;
|
||||
position: absolute;
|
||||
right: 3px;
|
||||
@include right(3px);
|
||||
top: 0;
|
||||
width: 1px;
|
||||
}
|
||||
@@ -156,7 +156,7 @@ header.global.slim {
|
||||
h2 {
|
||||
display: block;
|
||||
width: 700px;
|
||||
float: left;
|
||||
@include float(left);
|
||||
font-size: 0.9em;
|
||||
font-weight: 600;
|
||||
color: $lighter-base-font-color;
|
||||
|
||||
@@ -18,7 +18,7 @@ nav.course-material {
|
||||
padding: 10px 0 0 0;
|
||||
|
||||
li {
|
||||
float: left;
|
||||
@include float(left);
|
||||
list-style: none;
|
||||
|
||||
a {
|
||||
|
||||
@@ -3,15 +3,16 @@
|
||||
body.discussion {
|
||||
|
||||
.course-tabs .right {
|
||||
float: right;
|
||||
@include float(right);
|
||||
|
||||
.new-post-btn {
|
||||
@include blue-button;
|
||||
margin-right: 4px;
|
||||
@include margin-right(4px);
|
||||
}
|
||||
|
||||
.new-post-icon {
|
||||
margin: 8px 7px 0 0;
|
||||
margin-top: 8px;
|
||||
@include margin-right(7px);
|
||||
font-size: 16px;
|
||||
vertical-align: middle;
|
||||
color: $white;
|
||||
@@ -241,7 +242,7 @@ body.discussion {
|
||||
}
|
||||
|
||||
.discussion-column {
|
||||
float: right;
|
||||
@include float(right);
|
||||
@include box-sizing(border-box);
|
||||
width: 68%;
|
||||
max-width: 800px;
|
||||
@@ -368,7 +369,7 @@ body.discussion {
|
||||
.notification-checkbox {
|
||||
display: inline-block;
|
||||
padding: $baseline/4 0 $baseline/2 0;
|
||||
margin-right: $baseline/2;
|
||||
@include margin-right($baseline/2);
|
||||
border-radius: 5px;
|
||||
border: 1px solid gray;
|
||||
|
||||
@@ -376,7 +377,7 @@ body.discussion {
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
margin-left: $baseline/2;
|
||||
@include margin-left($baseline/2);
|
||||
}
|
||||
|
||||
.icon {
|
||||
@@ -531,6 +532,13 @@ body.discussion {
|
||||
border-radius: 3px 3px 0 0;
|
||||
padding: $baseline;
|
||||
background-color: $white;
|
||||
|
||||
.response-body {
|
||||
ol, ul { // Fix up the RTL-only _reset.scss, but only in specific places
|
||||
@include padding-left(40px);
|
||||
@include padding-right(0);
|
||||
}
|
||||
}
|
||||
}
|
||||
.posted-by {
|
||||
font-weight: 700;
|
||||
@@ -549,11 +557,21 @@ body.discussion {
|
||||
padding: 0 18px;
|
||||
width: 100%;
|
||||
box-shadow: 0 1px 1px $shadow-l1;
|
||||
text-align: left;
|
||||
@include text-align(left);
|
||||
font-size: 13px;
|
||||
|
||||
.icon-reply:before { // flip the icon for RTL
|
||||
@include ltr {
|
||||
content: "\f112"; // FA icon arrow to the left
|
||||
}
|
||||
|
||||
@include rtl {
|
||||
content: "\f064"; // FA icon arrow to the right
|
||||
}
|
||||
}
|
||||
|
||||
span.add-response-btn-text {
|
||||
padding-left: ($baseline/5);
|
||||
@include padding-left($baseline/5);
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -638,7 +656,7 @@ body.discussion {
|
||||
|
||||
.discussion-submit-post {
|
||||
@include blue-button;
|
||||
float: left;
|
||||
@include float(left);
|
||||
}
|
||||
|
||||
.wmd-button {
|
||||
@@ -674,7 +692,17 @@ body.discussion {
|
||||
padding-left: ($baseline*1.5);
|
||||
width: 100%;
|
||||
box-shadow: 0 1px 1px $shadow-l1;
|
||||
text-align: left;
|
||||
@include text-align(left);
|
||||
|
||||
.icon-reply:before {
|
||||
@include ltr {
|
||||
content: "\f112"; // FA icon arrow to the left
|
||||
}
|
||||
|
||||
@include rtl {
|
||||
content: "\f064"; // FA icon arrow to the right
|
||||
}
|
||||
}
|
||||
|
||||
&:hover, &:focus {
|
||||
@include linear-gradient(top, $white 35%, #ddd);
|
||||
@@ -706,7 +734,7 @@ body.discussion {
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
top: 5px;
|
||||
margin-right: 6px;
|
||||
@include margin-right(6px);
|
||||
width: 21px;
|
||||
height: 19px;
|
||||
background: url(../images/show-hide-discussion-icon.png) no-repeat;
|
||||
@@ -716,7 +744,7 @@ body.discussion {
|
||||
|
||||
.new-post-btn {
|
||||
display: inline-block;
|
||||
float: right;
|
||||
@include float(right);
|
||||
}
|
||||
|
||||
section.discussion {
|
||||
@@ -895,9 +923,10 @@ body.discussion {
|
||||
float: left;
|
||||
width: 16px;
|
||||
height: 17px;
|
||||
margin: 8px 7px 0 0;
|
||||
margin-top: 8px;
|
||||
@include margin-right(7px);
|
||||
font-size: 16px;
|
||||
padding-right: $baseline/2;
|
||||
@include padding-right($baseline/2);
|
||||
vertical-align: middle;
|
||||
color: $white;
|
||||
}
|
||||
|
||||
@@ -89,7 +89,7 @@
|
||||
|
||||
@mixin discussion-wmd-preview-label {
|
||||
padding-top: 3px;
|
||||
padding-left: 5px;
|
||||
@include padding-left(5px);
|
||||
width: 100%;
|
||||
color: #bbb;
|
||||
text-transform: uppercase;
|
||||
@@ -100,6 +100,11 @@
|
||||
padding: 10px 20px;
|
||||
width: 100%;
|
||||
color: #333;
|
||||
|
||||
ol, ul { // Fix up the RTL-only _reset.scss, but only in specific places
|
||||
@include padding-left(40px);
|
||||
@include padding-right(0);
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes fadeIn {
|
||||
@@ -130,11 +135,11 @@
|
||||
color: $color;
|
||||
|
||||
.icon {
|
||||
margin-right: ($baseline/5);
|
||||
@include margin-right($baseline/5);
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
margin-right: 0;
|
||||
@include margin-right(0);
|
||||
}
|
||||
|
||||
&.is-hidden {
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
.response-actions-list,
|
||||
.comment-actions-list {
|
||||
@extend %ui-no-list;
|
||||
text-align: right;
|
||||
@include text-align(right);
|
||||
|
||||
.actions-item {
|
||||
@include box-sizing(border-box);
|
||||
@@ -58,7 +58,7 @@
|
||||
&:after,
|
||||
&:before {
|
||||
bottom: 100%;
|
||||
right: 3px;
|
||||
@include right(3px);
|
||||
border: solid transparent;
|
||||
content: " ";
|
||||
height: 0;
|
||||
@@ -71,7 +71,7 @@
|
||||
border-color: $transparent;
|
||||
border-bottom-color: $white;
|
||||
border-width: 6px;
|
||||
margin-right: 1px;
|
||||
@include margin-right(1px);
|
||||
}
|
||||
|
||||
&:before {
|
||||
@@ -254,7 +254,7 @@
|
||||
display: block;
|
||||
padding: ($baseline/10) 0;
|
||||
white-space: nowrap;
|
||||
text-align: right;
|
||||
@include text-align(right);
|
||||
color: $gray-l1;
|
||||
|
||||
&:hover, &:focus {
|
||||
|
||||
@@ -3,7 +3,7 @@
|
||||
|
||||
.forum-nav {
|
||||
@include box-sizing(border-box);
|
||||
float: left;
|
||||
@include float(left);
|
||||
position: relative;
|
||||
width: 31%;
|
||||
border: 1px solid #aaa;
|
||||
@@ -34,7 +34,7 @@
|
||||
|
||||
.icon {
|
||||
@include font-size(14);
|
||||
margin-right: ($baseline/4);
|
||||
@include margin-right($baseline/4);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -43,7 +43,7 @@
|
||||
}
|
||||
|
||||
.forum-nav-browse-drop-arrow {
|
||||
margin-left: ($baseline/4);
|
||||
@include margin-left($baseline/4);
|
||||
}
|
||||
|
||||
.forum-nav-search {
|
||||
@@ -60,7 +60,7 @@
|
||||
position: absolute;
|
||||
margin-top: -6px;
|
||||
top: 50%;
|
||||
right: ($baseline/4 + 1px + $baseline / 4); // Wrapper padding + border + input padding
|
||||
@include right($baseline/4 + 1px + $baseline / 4); // Wrapper padding + border + input padding
|
||||
}
|
||||
|
||||
.forum-nav-search-input {
|
||||
@@ -115,7 +115,7 @@
|
||||
}
|
||||
|
||||
.forum-nav-browse-title .icon {
|
||||
margin-right: ($baseline/2);
|
||||
@include margin-right($baseline/2);
|
||||
}
|
||||
|
||||
// -------------------
|
||||
@@ -135,14 +135,14 @@
|
||||
@include box-sizing(border-box);
|
||||
display: inline-block;
|
||||
width: 50%;
|
||||
text-align: left;
|
||||
@include text-align(left);
|
||||
}
|
||||
|
||||
.forum-nav-filter-cohort, .forum-nav-sort {
|
||||
@include box-sizing(border-box);
|
||||
display: inline-block;
|
||||
width: 50%;
|
||||
text-align: right;
|
||||
@include text-align(right);
|
||||
}
|
||||
|
||||
%forum-nav-select {
|
||||
@@ -200,6 +200,13 @@
|
||||
|
||||
.icon {
|
||||
@include font-size(14);
|
||||
|
||||
&:before {
|
||||
|
||||
@include rtl {
|
||||
@include transform(scale(-1, 1)); // RTL for font awesome question mark
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.icon-comments {
|
||||
@@ -223,7 +230,7 @@
|
||||
.forum-nav-thread-wrapper-2 {
|
||||
@extend %forum-nav-thread-wrapper;
|
||||
width: 13%;
|
||||
text-align: right;
|
||||
@include text-align(right);
|
||||
}
|
||||
|
||||
.forum-nav-thread-title {
|
||||
@@ -251,7 +258,7 @@
|
||||
@extend %forum-nav-thread-wrapper-2-content;
|
||||
@extend %t-weight4;
|
||||
position: relative;
|
||||
margin-left: ($baseline/4);
|
||||
@include margin-left($baseline/4);
|
||||
margin-bottom: ($baseline/4); // Because tail is position: absolute
|
||||
border-radius: 2px;
|
||||
padding: ($baseline/10) ($baseline/5);
|
||||
@@ -264,12 +271,12 @@
|
||||
display: block;
|
||||
position: absolute;
|
||||
bottom: (-$baseline/4);
|
||||
right: ($baseline/4);
|
||||
@include right($baseline/4);
|
||||
width: 0;
|
||||
height: 0;
|
||||
border-style: solid;
|
||||
border-width: 0 ($baseline/4) ($baseline/4) 0;
|
||||
border-color: transparent $gray-l3 transparent transparent;
|
||||
@include border-width(0, ($baseline/4), ($baseline/4), 0);
|
||||
@include border-color(transparent, $gray-l3, transparent, transparent);
|
||||
}
|
||||
|
||||
&.is-unread {
|
||||
|
||||
@@ -46,7 +46,7 @@
|
||||
.field-help {
|
||||
@include box-sizing(border-box);
|
||||
display: inline-block;
|
||||
padding-left: $baseline;
|
||||
@include padding-left($baseline);
|
||||
width: 50%;
|
||||
font-size: 12px;
|
||||
}
|
||||
@@ -131,7 +131,7 @@
|
||||
.post-option {
|
||||
@include box-sizing(border-box);
|
||||
display: inline-block;
|
||||
margin-right: $baseline;
|
||||
@include margin-right($baseline);
|
||||
border: 1px solid transparent;
|
||||
border-radius: 3px;
|
||||
padding: ($baseline/2);
|
||||
|
||||
@@ -17,7 +17,7 @@ body.discussion, .discussion-module {
|
||||
|
||||
.post-header-actions {
|
||||
display: inline-block;
|
||||
float: right;
|
||||
@include float(right);
|
||||
vertical-align: middle;
|
||||
width: flex-grid(3,12);
|
||||
}
|
||||
@@ -44,7 +44,7 @@ body.discussion, .discussion-module {
|
||||
|
||||
.response-header-actions {
|
||||
width: flex-grid(3,12);
|
||||
float: right;
|
||||
@include float(right);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -123,16 +123,16 @@
|
||||
// CASE: normal typographical headings
|
||||
h1 {
|
||||
@extend %heading-2;
|
||||
@include text-align(left);
|
||||
margin-bottom: $baseline;
|
||||
padding-bottom: $baseline;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
// CASE: marketing/imageery-based headings
|
||||
.title {
|
||||
position: absolute;
|
||||
top: ($baseline*2.5);
|
||||
left:($baseline*1.5);
|
||||
@include left($baseline*1.5);
|
||||
|
||||
.title-super, .title-sub {
|
||||
@extend %t-weight1;
|
||||
@@ -149,7 +149,7 @@
|
||||
|
||||
.title-sub {
|
||||
@include font-size(20);
|
||||
margin-left: ($baseline*2);
|
||||
@include margin-left($baseline*2);
|
||||
text-transform: lowercase;
|
||||
color: $header-graphic-sub-color;
|
||||
}
|
||||
@@ -197,14 +197,14 @@
|
||||
}
|
||||
|
||||
.content {
|
||||
margin-right: ($baseline*2);
|
||||
@include float(left);
|
||||
@include margin-right($baseline*2);
|
||||
width: 600px;
|
||||
float: left;
|
||||
}
|
||||
|
||||
aside {
|
||||
@include float(left);
|
||||
width: 280px;
|
||||
float: left;
|
||||
|
||||
p, ol, ul {
|
||||
font-size: 14px !important;
|
||||
@@ -273,10 +273,10 @@
|
||||
margin: 0 0 $baseline 0;
|
||||
|
||||
.field {
|
||||
@include float(left);
|
||||
@include margin(0, ($baseline*1.5), 0, 0);
|
||||
display: block;
|
||||
float: left;
|
||||
border-bottom: none;
|
||||
margin: 0 ($baseline*1.5) 0 0;
|
||||
padding-bottom: 0;
|
||||
|
||||
input, textarea {
|
||||
@@ -336,7 +336,7 @@
|
||||
.tip {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
@include right(0);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -378,7 +378,7 @@
|
||||
input[type="checkbox"] {
|
||||
display: inline-block;
|
||||
width: auto;
|
||||
margin-right: ($baseline/4);
|
||||
@include margin-right($baseline/4);
|
||||
}
|
||||
|
||||
label {
|
||||
@@ -702,7 +702,7 @@
|
||||
|
||||
h2 {
|
||||
@extend %heading-2;
|
||||
text-align: left;
|
||||
@include text-align(left);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -295,7 +295,7 @@
|
||||
}
|
||||
|
||||
.details {
|
||||
float: left;
|
||||
@include float(left);
|
||||
margin-right: flex-gutter();
|
||||
width: flex-grid(8);
|
||||
font: normal 1em/1.6em $serif;
|
||||
@@ -384,7 +384,7 @@
|
||||
|
||||
.course-sidebar {
|
||||
@include box-sizing(border-box);
|
||||
float: left;
|
||||
@include float(left);
|
||||
width: flex-grid(4);
|
||||
|
||||
> section {
|
||||
|
||||
@@ -42,14 +42,14 @@
|
||||
|
||||
.logo {
|
||||
display: inline-block;
|
||||
@include border-right(1px solid $light-gray);
|
||||
height: 80px;
|
||||
margin-right: 30px;
|
||||
padding-right: 30px;
|
||||
@include margin-right(30px);
|
||||
@include padding-right(30px);
|
||||
position: relative;
|
||||
vertical-align: middle;
|
||||
|
||||
&::after {
|
||||
@extend %faded-vertical-divider;
|
||||
content: "";
|
||||
display: block;
|
||||
height: 80px;
|
||||
|
||||
@@ -6,8 +6,9 @@
|
||||
padding: ($baseline*2) 0 0 0;
|
||||
|
||||
.profile-sidebar {
|
||||
float: left;
|
||||
margin-right: flex-gutter();
|
||||
background: transparent;
|
||||
@include float(left);
|
||||
@include margin-right(flex-gutter());
|
||||
width: flex-grid(3);
|
||||
background: transparent;
|
||||
box-shadow: 0 0 1px $shadow-l1;
|
||||
@@ -278,7 +279,7 @@
|
||||
|
||||
// course listings
|
||||
.my-courses {
|
||||
float: left;
|
||||
@include float(left);
|
||||
margin: 0px;
|
||||
width: flex-grid(9);
|
||||
|
||||
@@ -355,7 +356,7 @@
|
||||
@include transition(all 0.15s linear 0s);
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
float: left;
|
||||
@include float(left);
|
||||
height: 100%;
|
||||
max-height: 100%;
|
||||
width: 200px;
|
||||
@@ -374,7 +375,7 @@
|
||||
|
||||
.info {
|
||||
@include clearfix;
|
||||
padding: 0 10px 0 230px;
|
||||
@include padding(0, 10px, 0, 230px);
|
||||
|
||||
> hgroup {
|
||||
padding: 0;
|
||||
@@ -393,7 +394,7 @@
|
||||
.date-block {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
@include right(0);
|
||||
font-family: $sans-serif;
|
||||
font-size: 13px;
|
||||
font-style: italic;
|
||||
@@ -451,7 +452,7 @@
|
||||
@include box-sizing(border-box);
|
||||
border-radius: 3px;
|
||||
display: block;
|
||||
float: left;
|
||||
@include float(left);
|
||||
font: normal 15px/1.6rem $sans-serif;
|
||||
letter-spacing: 0;
|
||||
padding: 6px 32px 7px;
|
||||
@@ -888,7 +889,7 @@
|
||||
}
|
||||
|
||||
a.unenroll {
|
||||
float: right;
|
||||
@include float(right);
|
||||
display: block;
|
||||
font-style: italic;
|
||||
color: $lighter-base-font-color;
|
||||
@@ -903,7 +904,7 @@
|
||||
|
||||
a.email-settings {
|
||||
@extend a.unenroll;
|
||||
margin-right: 10px;
|
||||
@include margin-right(10px);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@@ -1,13 +1,13 @@
|
||||
section.outside-app {
|
||||
@extend .container;
|
||||
text-align: left;
|
||||
@include text-align(left);
|
||||
padding: 80px 0;
|
||||
|
||||
h1 {
|
||||
@extend h2;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
|
||||
p {
|
||||
max-width: 600px;
|
||||
margin: 0 auto;
|
||||
|
||||
@@ -5,11 +5,11 @@
|
||||
|
||||
.university-column {
|
||||
width: flex-grid(4);
|
||||
margin-right: flex-gutter();
|
||||
@include margin-right(flex-gutter());
|
||||
float: left;
|
||||
|
||||
&:nth-child(3n+3) {
|
||||
margin-right: 0;
|
||||
@include margin-right(0);
|
||||
}
|
||||
}
|
||||
|
||||
@@ -21,11 +21,11 @@
|
||||
|
||||
.courses-listing-item {
|
||||
width: flex-grid(4);
|
||||
margin-right: flex-gutter();
|
||||
float: left;
|
||||
@include margin-right(flex-gutter());
|
||||
@include float(left);
|
||||
|
||||
&:nth-child(3n+3) {
|
||||
margin-right: 0;
|
||||
@include margin-right(0);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -32,16 +32,16 @@
|
||||
|
||||
// colophon
|
||||
.colophon {
|
||||
margin-right: flex-gutter();
|
||||
@include margin-right(flex-gutter());
|
||||
width: flex-grid(8,12);
|
||||
float: left;
|
||||
@include float(left);
|
||||
|
||||
.nav-colophon {
|
||||
@include clearfix();
|
||||
margin: $footer_margin;
|
||||
|
||||
li {
|
||||
float: left;
|
||||
@include float(left);
|
||||
margin-right: ($baseline*0.75);
|
||||
|
||||
a {
|
||||
@@ -102,12 +102,12 @@
|
||||
margin: -2px 0 8px 0;
|
||||
font-size: em(11);
|
||||
color: $gray-l2;
|
||||
text-align: left;
|
||||
@include text-align(left);
|
||||
}
|
||||
|
||||
.nav-legal {
|
||||
@include clearfix();
|
||||
text-align: left;
|
||||
@include text-align(left);
|
||||
|
||||
li {
|
||||
display: inline-block;
|
||||
@@ -154,10 +154,11 @@
|
||||
|
||||
// platform Open edX logo and link
|
||||
.powered-by {
|
||||
@include float(right);
|
||||
width: flex-grid(3,12);
|
||||
display: inline-block;
|
||||
vertical-align: bottom;
|
||||
text-align: right;
|
||||
@include text-align(right);
|
||||
|
||||
a {
|
||||
display: inline-block;
|
||||
|
||||
@@ -17,8 +17,8 @@ header.global {
|
||||
}
|
||||
|
||||
h1.logo {
|
||||
float: left;
|
||||
margin: -2px 39px 0px 0px;
|
||||
@include float(left);
|
||||
@include margin(-2px, 39px, 0, 0);
|
||||
position: relative;
|
||||
|
||||
a {
|
||||
@@ -27,11 +27,11 @@ header.global {
|
||||
}
|
||||
|
||||
.left {
|
||||
float: left;
|
||||
@include float(left);
|
||||
}
|
||||
|
||||
.guest {
|
||||
float: right;
|
||||
@include float(right);
|
||||
}
|
||||
|
||||
> li {
|
||||
@@ -104,12 +104,12 @@ header.global {
|
||||
}
|
||||
|
||||
.user {
|
||||
float: right;
|
||||
@include float(right);
|
||||
margin-top: 4px;
|
||||
|
||||
> .primary {
|
||||
display: block;
|
||||
float: left;
|
||||
@include float(left);
|
||||
margin: 0px;
|
||||
position: relative;
|
||||
|
||||
@@ -120,14 +120,14 @@ header.global {
|
||||
|
||||
&:last-child {
|
||||
> a {
|
||||
border-radius: 0 4px 4px 0;
|
||||
border-left: none;
|
||||
@include border-radius(0, 4px, 4px, 0);
|
||||
@include border-left(none);
|
||||
padding: 5px 8px 7px 8px;
|
||||
|
||||
&.shopping-cart {
|
||||
border-radius: 4px;
|
||||
border: 1px solid $border-color-2;
|
||||
margin-right: 10px;
|
||||
@include margin-right(10px);
|
||||
padding-bottom: 6px;
|
||||
}
|
||||
}
|
||||
@@ -135,7 +135,7 @@ header.global {
|
||||
}
|
||||
|
||||
a.user-link {
|
||||
padding: 6px 12px 8px 35px;
|
||||
@include padding(6px, 12px, 8px, 35px);
|
||||
position: relative;
|
||||
text-transform: none;
|
||||
font-size: 14px;
|
||||
@@ -145,9 +145,15 @@ header.global {
|
||||
.avatar {
|
||||
@include background-image(url('../images/small-header-home-icon.png'));
|
||||
background-repeat: no-repeat;
|
||||
|
||||
// CASE: right to left layout
|
||||
@include rtl {
|
||||
background-position: top right;
|
||||
}
|
||||
|
||||
height: 26px;
|
||||
display: inline-block;
|
||||
left: 8px;
|
||||
@include left(8px);
|
||||
opacity: 0.5;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
@@ -171,7 +177,7 @@ header.global {
|
||||
display: none;
|
||||
padding: 5px 10px;
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
@include right(0px);
|
||||
top: 34px;
|
||||
width: 170px;
|
||||
z-index: 3;
|
||||
@@ -194,7 +200,7 @@ header.global {
|
||||
height: 0px;
|
||||
position: absolute;
|
||||
@include transform(rotate(-45deg));
|
||||
right: 12px;
|
||||
@include right(12px);
|
||||
top: -6px;
|
||||
width: 0px;
|
||||
}
|
||||
@@ -236,7 +242,7 @@ header.global {
|
||||
.nav-global {
|
||||
margin-top: ($baseline/2);
|
||||
list-style: none;
|
||||
float: left;
|
||||
@include float(left);
|
||||
|
||||
li,
|
||||
div {
|
||||
@@ -279,7 +285,7 @@ header.global {
|
||||
}
|
||||
|
||||
.nav-courseware {
|
||||
float: right;
|
||||
@include float(right);
|
||||
margin-top: ($baseline/4);
|
||||
list-style: none;
|
||||
|
||||
@@ -394,7 +400,7 @@ header.global-new {
|
||||
}
|
||||
|
||||
.primary {
|
||||
margin-right: 5px;
|
||||
@include margin-right(5px);
|
||||
|
||||
> a {
|
||||
@include background-image($button-bg-image);
|
||||
@@ -415,7 +421,7 @@ header.global-new {
|
||||
vertical-align: middle;
|
||||
|
||||
&:last-child {
|
||||
margin-right: 0px;
|
||||
@include margin-right(0);
|
||||
}
|
||||
|
||||
&:hover, &:focus, &:active {
|
||||
@@ -430,13 +436,13 @@ header.global-new {
|
||||
|
||||
> .primary {
|
||||
display: block;
|
||||
float: left;
|
||||
margin: 0px;
|
||||
@include float(left);
|
||||
margin: 0;
|
||||
position: relative;
|
||||
|
||||
> a {
|
||||
margin: 0px;
|
||||
@include border-right-radius(0px);
|
||||
@include border-right-radius(0);
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
@@ -456,7 +462,7 @@ header.global-new {
|
||||
}
|
||||
|
||||
a.user-link {
|
||||
padding: 6px 12px 8px 35px;
|
||||
@include padding(6px, 12px, 8px, 35px);
|
||||
position: relative;
|
||||
text-transform: none;
|
||||
font-size: 14px;
|
||||
@@ -468,7 +474,7 @@ header.global-new {
|
||||
background-repeat: no-repeat;
|
||||
height: 26px;
|
||||
display: inline-block;
|
||||
left: 8px;
|
||||
@include left(8px);
|
||||
opacity: 0.5;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
@@ -492,7 +498,7 @@ header.global-new {
|
||||
display: none;
|
||||
padding: 5px 10px;
|
||||
position: absolute;
|
||||
right: 0px;
|
||||
@include right(0);
|
||||
top: 34px;
|
||||
width: 170px;
|
||||
z-index: 3;
|
||||
@@ -515,7 +521,7 @@ header.global-new {
|
||||
height: 0px;
|
||||
position: absolute;
|
||||
@include transform(rotate(-45deg));
|
||||
right: 12px;
|
||||
@include right(12px);
|
||||
top: -6px;
|
||||
width: 0px;
|
||||
}
|
||||
|
||||
11
lms/static/sass/vendor/bi-app/_bi-app-ltr.scss
vendored
Executable file
11
lms/static/sass/vendor/bi-app/_bi-app-ltr.scss
vendored
Executable file
@@ -0,0 +1,11 @@
|
||||
// ------------------------------------------
|
||||
// left to right module
|
||||
// authors:
|
||||
// twitter.com/anasnakawa
|
||||
// twitter.com/victorzamfir
|
||||
// licensed under the MIT license
|
||||
// http://www.opensource.org/licenses/mit-license.php
|
||||
// ------------------------------------------
|
||||
|
||||
@import 'variables-ltr';
|
||||
@import 'mixins';
|
||||
11
lms/static/sass/vendor/bi-app/_bi-app-rtl.scss
vendored
Executable file
11
lms/static/sass/vendor/bi-app/_bi-app-rtl.scss
vendored
Executable file
@@ -0,0 +1,11 @@
|
||||
// ------------------------------------------
|
||||
// right to left module
|
||||
// authors:
|
||||
// twitter.com/anasnakawa
|
||||
// twitter.com/victorzamfir
|
||||
// licensed under the MIT license
|
||||
// http://www.opensource.org/licenses/mit-license.php
|
||||
// ------------------------------------------
|
||||
|
||||
@import 'variables-rtl';
|
||||
@import 'mixins';
|
||||
294
lms/static/sass/vendor/bi-app/_mixins.scss
vendored
Executable file
294
lms/static/sass/vendor/bi-app/_mixins.scss
vendored
Executable file
@@ -0,0 +1,294 @@
|
||||
// ------------------------------------------
|
||||
// bi app mixins
|
||||
// authors:
|
||||
// twitter.com/anasnakawa
|
||||
// twitter.com/victorzamfir
|
||||
// licensed under the MIT license
|
||||
// http://www.opensource.org/licenses/mit-license.php
|
||||
// ------------------------------------------
|
||||
|
||||
// ------------------------------------------
|
||||
// Table of contents
|
||||
// ------------------------------------------
|
||||
// padding
|
||||
// margin
|
||||
// float
|
||||
// text align
|
||||
// clear
|
||||
// left / right
|
||||
// border
|
||||
// - width
|
||||
// - style
|
||||
// - color
|
||||
// - generic
|
||||
// - radius
|
||||
// ltr / rtl contents
|
||||
// ------------------------------------------
|
||||
|
||||
// generic mixin for properties with values
|
||||
// (top right bottom left)
|
||||
// ------------------------------------------
|
||||
@mixin bi-app-compact($property, $top, $right, $bottom, $left) {
|
||||
@if $bi-app-direction == ltr {
|
||||
#{$property}: $top $right $bottom $left;
|
||||
} @else {
|
||||
#{$property}: $top $left $bottom $right;
|
||||
}
|
||||
}
|
||||
|
||||
// padding
|
||||
// ------------------------------------------
|
||||
@mixin padding-left($distance) {
|
||||
padding-#{$bi-app-left}: $distance;
|
||||
}
|
||||
|
||||
@mixin padding-right($distance) {
|
||||
padding-#{$bi-app-right}: $distance;
|
||||
}
|
||||
|
||||
@mixin padding($top, $right, $bottom, $left) {
|
||||
@include bi-app-compact(padding, $top, $right, $bottom, $left);
|
||||
}
|
||||
|
||||
// margin
|
||||
// ------------------------------------------
|
||||
@mixin margin-left($distance) {
|
||||
margin-#{$bi-app-left}: $distance;
|
||||
}
|
||||
|
||||
@mixin margin-right($distance) {
|
||||
margin-#{$bi-app-right}: $distance;
|
||||
}
|
||||
|
||||
@mixin margin($top, $right, $bottom, $left) {
|
||||
@include bi-app-compact(margin, $top, $right, $bottom, $left);
|
||||
}
|
||||
|
||||
// float
|
||||
// ------------------------------------------
|
||||
@mixin bi-app-float-left {
|
||||
float: $bi-app-left;
|
||||
}
|
||||
|
||||
@mixin bi-app-float-right {
|
||||
float: $bi-app-right;
|
||||
}
|
||||
|
||||
@mixin float($direction) {
|
||||
@if $direction == left {
|
||||
@include bi-app-float-left;
|
||||
} @else if $direction == right {
|
||||
@include bi-app-float-right;
|
||||
} @else {
|
||||
float: $direction;
|
||||
}
|
||||
}
|
||||
|
||||
// text align
|
||||
// ------------------------------------------
|
||||
@mixin bi-app-text-align-left {
|
||||
text-align: $bi-app-left;
|
||||
}
|
||||
|
||||
@mixin bi-app-text-align-right {
|
||||
text-align: $bi-app-right;
|
||||
}
|
||||
|
||||
@mixin text-align($direction) {
|
||||
@if $direction == left {
|
||||
@include bi-app-text-align-left;
|
||||
} @else if $direction == right {
|
||||
@include bi-app-text-align-right;
|
||||
} @else {
|
||||
text-align: $direction;
|
||||
}
|
||||
}
|
||||
|
||||
// clear
|
||||
// ------------------------------------------
|
||||
@mixin bi-app-clear-left {
|
||||
clear: $bi-app-left;
|
||||
}
|
||||
|
||||
@mixin bi-app-clear-right {
|
||||
clear: $bi-app-right;
|
||||
}
|
||||
|
||||
@mixin clear($direction) {
|
||||
@if $direction == left {
|
||||
@include bi-app-clear-left;
|
||||
} @else if $direction == right {
|
||||
@include bi-app-clear-right;
|
||||
} @else {
|
||||
clear: $direction;
|
||||
}
|
||||
}
|
||||
|
||||
// left / right
|
||||
// ------------------------------------------
|
||||
@mixin left($distance) {
|
||||
@if $bi-app-direction == ltr {
|
||||
left: $distance;
|
||||
} @else if $bi-app-direction == rtl {
|
||||
right: $distance;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin right($distance) {
|
||||
@if $bi-app-direction == ltr {
|
||||
right: $distance;
|
||||
} @else if $bi-app-direction == rtl {
|
||||
left: $distance;
|
||||
}
|
||||
}
|
||||
|
||||
// border
|
||||
// ------------------------------------------
|
||||
|
||||
// width
|
||||
@mixin border-left-width($width) {
|
||||
border-#{$bi-app-left}-width: $width;
|
||||
}
|
||||
|
||||
@mixin border-right-width($width) {
|
||||
border-#{$bi-app-right}-width: $width;
|
||||
}
|
||||
|
||||
@mixin border-width($top, $right, $bottom, $left) {
|
||||
@include bi-app-compact(border-width, $top, $right, $bottom, $left);
|
||||
}
|
||||
|
||||
// style
|
||||
@mixin border-left-style($style) {
|
||||
border-#{$bi-app-left}-style: $style;
|
||||
}
|
||||
|
||||
@mixin border-right-style($style) {
|
||||
border-#{$bi-app-right}-style: $style;
|
||||
}
|
||||
|
||||
@mixin border-style($top, $right, $bottom, $left) {
|
||||
@include bi-app-compact(border-style, $top, $right, $bottom, $left);
|
||||
}
|
||||
|
||||
// color
|
||||
@mixin border-left-color($color) {
|
||||
border-#{$bi-app-left}-color: $color;
|
||||
}
|
||||
|
||||
@mixin border-right-color($color) {
|
||||
border-#{$bi-app-right}-color: $color;
|
||||
}
|
||||
|
||||
@mixin border-color($top, $right, $bottom, $left) {
|
||||
@include bi-app-compact(border-color, $top, $right, $bottom, $left);
|
||||
}
|
||||
|
||||
// generic
|
||||
@mixin border-left($border-style) {
|
||||
border-#{$bi-app-left}: $border-style;
|
||||
}
|
||||
|
||||
@mixin border-right($border-style) {
|
||||
border-#{$bi-app-right}: $border-style;
|
||||
}
|
||||
|
||||
// radius
|
||||
@mixin border-top-left-radius($radius) {
|
||||
-webkit-border-top-#{$bi-app-left}-radius: $radius;
|
||||
-moz-border-top#{$bi-app-left}-radius: $radius;
|
||||
border-top-#{$bi-app-left}-radius: $radius;
|
||||
}
|
||||
|
||||
@mixin border-top-right-radius($radius) {
|
||||
-webkit-border-top-#{$bi-app-right}-radius: $radius;
|
||||
-moz-border-top#{$bi-app-right}-radius: $radius;
|
||||
border-top-#{$bi-app-right}-radius: $radius;
|
||||
}
|
||||
|
||||
@mixin border-bottom-left-radius($radius) {
|
||||
-webkit-border-bottom-#{$bi-app-left}-radius: $radius;
|
||||
-moz-border-bottom#{$bi-app-left}-radius: $radius;
|
||||
border-bottom-#{$bi-app-left}-radius: $radius;
|
||||
}
|
||||
|
||||
@mixin border-bottom-right-radius($radius) {
|
||||
-webkit-border-bottom-#{$bi-app-right}-radius: $radius;
|
||||
-moz-border-bottom#{$bi-app-right}-radius: $radius;
|
||||
border-bottom-#{$bi-app-right}-radius: $radius;
|
||||
}
|
||||
|
||||
@mixin border-right-radius($radius) {
|
||||
@include border-top-right-radius($radius);
|
||||
@include border-bottom-right-radius($radius);
|
||||
}
|
||||
|
||||
@mixin border-left-radius($radius) {
|
||||
@include border-top-left-radius($radius);
|
||||
@include border-bottom-left-radius($radius);
|
||||
}
|
||||
|
||||
@mixin border-top-radius($radius) {
|
||||
@include border-top-left-radius($radius);
|
||||
@include border-top-right-radius($radius);
|
||||
}
|
||||
|
||||
@mixin border-bottom-radius($radius) {
|
||||
@include border-bottom-left-radius($radius);
|
||||
@include border-bottom-right-radius($radius);
|
||||
}
|
||||
|
||||
@mixin border-radius($topLeft, $topRight: null, $bottomRight: null, $bottomLeft: null) {
|
||||
@if $topRight != null {
|
||||
@include border-top-left-radius($topLeft);
|
||||
@include border-top-right-radius($topRight);
|
||||
@include border-bottom-right-radius($bottomRight);
|
||||
@include border-bottom-left-radius($bottomLeft);
|
||||
} @else {
|
||||
-webkit-border-radius: $topLeft;
|
||||
-moz-border-radius: $topLeft;
|
||||
-ms-border-radius: $topLeft;
|
||||
-o-border-radius: $topLeft;
|
||||
border-radius: $topLeft;
|
||||
}
|
||||
}
|
||||
|
||||
// Returns "en" or "ar", useful for image suffixes.
|
||||
// Usage: background-image: url(/img/header-#{lang()}.png);
|
||||
@function lang() {
|
||||
@if $bi-app-direction == ltr {
|
||||
@return 'en';
|
||||
} @else {
|
||||
@return 'ar';
|
||||
}
|
||||
}
|
||||
|
||||
// Support for "direction" declaration (renders ltr/rtl).
|
||||
// Useful for form elements as they swap the text-indent property and align the text accordingly.
|
||||
@mixin direction {
|
||||
direction: $bi-app-direction;
|
||||
}
|
||||
|
||||
// Inverts a percentage value. Example: 97% becames 3%.
|
||||
// Useful for background-position.
|
||||
@function bi-app-invert-percentage($percentage) {
|
||||
@if $bi-app-direction == rtl {
|
||||
@return 100% - $percentage;
|
||||
} @else {
|
||||
@return $percentage;
|
||||
}
|
||||
}
|
||||
|
||||
// ltr / rtl contents
|
||||
// ------------------------------------------
|
||||
@mixin ltr {
|
||||
@if $bi-app-direction == ltr {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
|
||||
@mixin rtl {
|
||||
@if $bi-app-direction == rtl {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
15
lms/static/sass/vendor/bi-app/_variables-ltr.scss
vendored
Executable file
15
lms/static/sass/vendor/bi-app/_variables-ltr.scss
vendored
Executable file
@@ -0,0 +1,15 @@
|
||||
// ------------------------------------------
|
||||
// left to right variables to be used by bi-app mixins
|
||||
// authors:
|
||||
// twitter.com/anasnakawa
|
||||
// twitter.com/victorzamfir
|
||||
// licensed under the MIT license
|
||||
// http://www.opensource.org/licenses/mit-license.php
|
||||
// ------------------------------------------
|
||||
|
||||
// namespacing variables with bi-app to
|
||||
// avoid conflicting with other global variables
|
||||
$bi-app-left : left;
|
||||
$bi-app-right : right;
|
||||
$bi-app-direction : ltr;
|
||||
$bi-app-invert-direction: rtl;
|
||||
15
lms/static/sass/vendor/bi-app/_variables-rtl.scss
vendored
Executable file
15
lms/static/sass/vendor/bi-app/_variables-rtl.scss
vendored
Executable file
@@ -0,0 +1,15 @@
|
||||
// ------------------------------------------
|
||||
// right to left variables to be used by bi-app mixins
|
||||
// authors:
|
||||
// twitter.com/anasnakawa
|
||||
// twitter.com/victorzamfir
|
||||
// licensed under the MIT license
|
||||
// http://www.opensource.org/licenses/mit-license.php
|
||||
// ------------------------------------------
|
||||
|
||||
// namespacing variables with bi-app to
|
||||
// avoid conflicting with other global variables
|
||||
$bi-app-left : right;
|
||||
$bi-app-right : left;
|
||||
$bi-app-direction : rtl;
|
||||
$bi-app-invert-direction: ltr;
|
||||
@@ -3,7 +3,12 @@
|
||||
<!--[if IE 8]><html class="ie ie8 lte9 lte8" lang="${LANGUAGE_CODE}"><![endif]-->
|
||||
<!--[if IE 9]><html class="ie ie9 lte9" lang="${LANGUAGE_CODE}"><![endif]-->
|
||||
<!--[if gt IE 9]><!--><html lang="${LANGUAGE_CODE}"><!--<![endif]-->
|
||||
<head>
|
||||
<%
|
||||
# set doc language direction
|
||||
from django.utils.translation import get_language_bidi
|
||||
dir_rtl = 'rtl' if get_language_bidi() else 'ltr'
|
||||
%>
|
||||
<head dir="${dir_rtl}">
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<%! from django.utils.translation import ugettext as _ %>
|
||||
@@ -117,20 +122,27 @@
|
||||
|
||||
</head>
|
||||
|
||||
<body class="<%block name='bodyclass'/> lang_${LANGUAGE_CODE}">
|
||||
<a class="nav-skip" href="<%block name="nav_skip">#content</%block>">${_("Skip to this view's content")}</a>
|
||||
<body class="${dir_rtl} <%block name='bodyclass'/> lang_${LANGUAGE_CODE}">
|
||||
<div class="window-wrap" dir="${dir_rtl}">
|
||||
<a class="nav-skip" href="<%block name="nav_skip">#content</%block>">${_("Skip to this view's content")}</a>
|
||||
|
||||
<%include file="mathjax_accessible.html" />
|
||||
<%include file="mathjax_accessible.html" />
|
||||
|
||||
<%include file="${header_file}" />
|
||||
% if not suppress_toplevel_navigation:
|
||||
<%include file="${header_file}" />
|
||||
%endif
|
||||
|
||||
<div class="content-wrapper" id="content">
|
||||
${self.body()}
|
||||
<%block name="bodyextra"/>
|
||||
</div>
|
||||
|
||||
% if not suppress_toplevel_navigation:
|
||||
<%include file="${footer_file}" />
|
||||
% endif
|
||||
|
||||
<div class="content-wrapper" id="content">
|
||||
${self.body()}
|
||||
<%block name="bodyextra"/>
|
||||
</div>
|
||||
|
||||
<%include file="${footer_file}" />
|
||||
|
||||
<script>window.baseUrl = "${settings.STATIC_URL}";</script>
|
||||
% if not disable_courseware_js:
|
||||
<%static:js group='application'/>
|
||||
|
||||
Reference in New Issue
Block a user