Commit 807fed39 by Andy Armstrong

Merge pull request #12092 from edx/revert-uxpl-asset-changes-in-master

Revert "Introduce Pattern Library test pages"
parents c7bc0490 4671970f
......@@ -568,6 +568,20 @@ PIPELINE_CSS = {
],
'output_filename': 'css/cms-style-vendor-tinymce-skin.css',
},
'style-main': {
# this is unnecessary and can be removed
'source_filenames': [
'css/studio-main.css',
],
'output_filename': 'css/studio-main.css',
},
'style-main-rtl': {
# this is unnecessary and can be removed
'source_filenames': [
'css/studio-main-rtl.css',
],
'output_filename': 'css/studio-main-rtl.css',
},
'style-edx-icons': {
'source_filenames': [
'css/edx-icons.css',
......
// ------------------------------
// Studio: Shared Build Compile
// Version 2 - introduces the Pattern Library
// Configuration
@import 'config';
// Extensions
// ------------------------------
// Studio: Shared Build Compile
// Version 1 styling (pre-Pattern Library)
// About: Sass compile for Studio that are shared between LTR and RTL UI. Configuration and vendor specific imports happen before this shared set of imports are compiled in the studio-main-*.scss files.
......
// ------------------------------
// Studio configuration settings
// ------------------------------
// #VARIABLES
// ------------------------------
......@@ -17,4 +17,4 @@
@import 'bourbon/bourbon'; // lib - bourbon
@import 'vendor/bi-app/bi-app-rtl'; // set the layout for right to left languages
@import 'build-v1'; // shared app style assets/rendering
@import 'build'; // shared app style assets/rendering
// ------------------------------
// Studio main styling
// Version 2 - introduces the Pattern Library
// NOTE: This is the right-to-left (RTL) configured style compile.
// It should mirror main-ltr w/ the exception of bi-app references.
// Load the RTL version of the edX Pattern Library
$pattern-library-path: '../edx-pattern-library' !default;
@import 'edx-pattern-library/pattern-library/sass/edx-pattern-library-rtl';
// Load the shared build
@import 'build-v2';
// ------------------------------
// Studio main styling
// Version 2 - introduces the Pattern Library
// NOTE: This is the left-to-right (LTR) configured style compile.
// It should mirror main-rtl w/ the exception of bi-app references.
// Load the LTR version of the edX Pattern Library
$pattern-library-path: '../edx-pattern-library' !default;
@import 'edx-pattern-library/pattern-library/sass/edx-pattern-library-ltr';
// Load the shared build
@import 'build-v2';
// Studio - css architecture
// Version 1 styling (pre-Pattern Library)
// studio - css architecture
// ====================
// Table of Contents
......@@ -18,4 +17,4 @@
@import 'bourbon/bourbon'; // lib - bourbon
@import 'vendor/bi-app/bi-app-ltr'; // set the layout for left to right languages
@import 'build-v1'; // shared app style assets/rendering
@import 'build'; // shared app style assets/rendering
## coding=utf-8
## Pages currently use v1 styling by default. Once the Pattern Library
## rollout has been completed, this default can be switched to v2.
<%! main_css = "css/studio-main-v1.css" %>
## Standard imports
<%namespace name='static' file='static_content.html'/>
<%!
from django.utils.translation import ugettext as _
......@@ -13,7 +7,6 @@ from openedx.core.djangolib.js_utils import (
dump_js_escaped_json, js_escaped_string
)
%>
<%page expression_filter="h"/>
<!doctype html>
<!--[if lte IE 9]><html class="ie9 lte9" lang="${LANGUAGE_CODE}"><![endif]-->
......@@ -43,8 +36,7 @@ from openedx.core.djangolib.js_utils import (
<%static:css group='style-vendor'/>
<%static:css group='style-vendor-tinymce-content'/>
<%static:css group='style-vendor-tinymce-skin'/>
<%static:css group='${self.attr.main_css}'/>
<%static:css group='style-main'/>
<%include file="widgets/segment-io.html" />
......
......@@ -24,7 +24,6 @@
<ul>
<li><a href="container.html">Container page</a></li>
<li><a href="unit.html">Unit page</a></li>
<li><a href="pattern-library-test.html">Pattern Library test page</a></li>
</ul>
</section>
</li>
......
## Override the default styles_version to the Pattern Library version (version 2)
<%! main_css = "css/studio-main-v2.css" %>
<%inherit file="../../base.html" />
<%block name="title">Pattern Library Test Page</%block>
<%block name="bodyclass">is-signedin pattern-library</%block>
<%block name="content">
<h3 class="hd-6 example-set-hd">Warning Alert with Message Only</h3>
<div class="example-set">
<div class="alert alert-warning" role="alert" aria-labelledby="alert-warning-publish-title" tabindex="-1">
<span class="icon alert-icon icon-warning" aria-hidden="true"></span>
<div class="alert-message">
<p class="alert-copy">
Interesting pattern library content to come...
</p>
</div>
</div>
</div>
</%block>
......@@ -10,7 +10,7 @@ from django.contrib.staticfiles.storage import staticfiles_storage
def compressed_css(package_name, raw=False):
package = pipeline_css_info(package_name)
package = settings.PIPELINE_CSS.get(package_name, {})
if package:
package = {package_name: package}
packager = Packager(css_packages=package, js_packages={})
......@@ -24,28 +24,6 @@ def compressed_css(package_name, raw=False):
return render_individual_css(package, paths, raw=raw)
def pipeline_css_info(package_name):
"""
Returns information about a CSS package needed for the Django pipeline.
Note: if the package name was not registered, then the information
returned is based on the package_name being a relative path to a
single CSS file.
Args:
package_name: The name of the CSS package.
Returns:
A dictionary with information about the CSS package.
"""
if package_name in settings.PIPELINE_CSS:
return settings.PIPELINE_CSS[package_name]
return {
'source_filenames': [package_name],
'output_filename': package_name,
}
def render_css(package, path, raw=False):
template_name = package.template_name or "mako/css.html"
context = package.extra_context
......
<%!
from django.contrib.staticfiles.storage import staticfiles_storage
from pipeline_mako import compressed_css, compressed_js, pipeline_css_info
from pipeline_mako import compressed_css, compressed_js
from django.utils.translation import get_language_bidi
from mako.exceptions import TemplateLookupException
......@@ -40,7 +40,7 @@ except:
% if settings.PIPELINE_ENABLED:
${compressed_css(group, raw=raw)}
% else:
% for filename in pipeline_css_info(group)['source_filenames']:
% for filename in settings.PIPELINE_CSS[group]['source_filenames']:
<link rel="stylesheet" href="${staticfiles_storage.url(filename.replace('.scss', '.css'))}${"?raw" if raw else ""}" type="text/css" media="all" / >
% endfor
%endif
......
......@@ -104,8 +104,8 @@ class TestComprehensiveTheming(TestCase):
"""
Test that static files finders are adjusted according to the applied comprehensive theme.
"""
result = staticfiles.finders.find('red-theme/css/lms-main-v1.css')
self.assertEqual(result, settings.REPO_ROOT / "themes/red-theme/lms/static/css/lms-main-v1.css")
result = staticfiles.finders.find('red-theme/css/lms-main.css')
self.assertEqual(result, settings.REPO_ROOT / "themes/red-theme/lms/static/css/lms-main.css")
lms_main_css = ""
with open(result) as css_file:
......@@ -117,8 +117,8 @@ class TestComprehensiveTheming(TestCase):
"""
Test default css is served if no theme is applied
"""
result = staticfiles.finders.find('css/lms-main-v1.css')
self.assertEqual(result, settings.REPO_ROOT / "lms/static/css/lms-main-v1.css")
result = staticfiles.finders.find('css/lms-main.css')
self.assertEqual(result, settings.REPO_ROOT / "lms/static/css/lms-main.css")
lms_main_css = ""
with open(result) as css_file:
......
......@@ -1390,6 +1390,20 @@ PIPELINE_CSS = {
],
'output_filename': 'css/lms-style-vendor-tinymce-skin.css',
},
'style-main': {
# this is unnecessary and can be removed
'source_filenames': [
'css/lms-main.css',
],
'output_filename': 'css/lms-main.css',
},
'style-main-rtl': {
# this is unnecessary and can be removed
'source_filenames': [
'css/lms-main-rtl.css',
],
'output_filename': 'css/lms-main-rtl.css',
},
'style-course-vendor': {
'source_filenames': [
'js/vendor/CodeMirror/codemirror.css',
......
// ------------------------------
// Open edX Certificates: Shared Build Compile
// About: Sass compile for Open edX Certificates elements that are shared between LTR and RTL UI.
// Configuration and vendor specific imports happen before this shared set of imports are compiled
// in the main-*.scss files.
// About: Sass compile for Open edX Certificates elements that are shared between LTR and RTL UI. Configuration and vendor specific imports happen before this shared set of imports are compiled in the main-*.scss files.
// Configuration
// ------------------------------
// #CONFIG + LIB
// ------------------------------
@import 'lib';
@import 'config';
@import '../../../../node_modules/edx-pattern-library/pattern-library/sass/edx-pattern-library';
// Extensions
// ------------------------------
// #EXTENSIONS
// ------------------------------
@import 'utilities';
@import 'base';
@import 'components';
......
// ------------------------------
// Open edX Certificates: Config
// About: variable and configuration overrides
// #VARIABLES
// ------------------------------
// #VARIABLES
// ------------------------------
$pattern-library-path: '../../edx-pattern-library' !default;
// certificate characteristics
$cert-base-color: palette(grayscale-cool, dark);
......
// ------------------------------
// Open edX Certificates: Main Style Compile
// About: third party libraries and dependencies import
@import '../../../../node_modules/edx-pattern-library/node_modules/bourbon/app/assets/stylesheets/bourbon';
@import '../../../../node_modules/edx-pattern-library/node_modules/susy/sass/susy';
@import '../../../../node_modules/edx-pattern-library/node_modules/breakpoint-sass/stylesheets/breakpoint';
// ------------------------------
// Open edX Certificates: Main Style Compile
// About: Sass partial for defining settings and utilities for LTR-centric layouts.
// #SETTINGS
// #LIB
// ----------------------------
// #SETTINGS
// ----------------------------
$layout-direction: ltr;
// currently needed since platform Sass won't obey https://github.com/edx/ux-pattern-library/blob/master/pattern-library/sass/patterns/_grid.scss#L23
$grid-direction-default: ltr;
$grid-direction-reversed: ltr;
// ----------------------------
// #LIB
// ----------------------------
@import '../../../../node_modules/edx-pattern-library/node_modules/bi-app-sass/bi-app/bi-app-ltr';
// ------------------------------
// Open edX Certificates: Main Style Compile
// About: Sass partial for defining settings and utilities for LTR-centric layouts.
// #SETTINGS
// #LIB
// ----------------------------
// #SETTINGS
// ----------------------------
$layout-direction: rtl;
// currently needed since platform Sass won't obey https://github.com/edx/ux-pattern-library/blob/master/pattern-library/sass/patterns/_grid.scss#L23
$grid-direction-default: rtl;
$grid-direction-reversed: ltr;
// ----------------------------
// #LIB
// ----------------------------
@import '../../../../node_modules/edx-pattern-library/node_modules/bi-app-sass/bi-app/bi-app-rtl';
......@@ -3,13 +3,16 @@
// About: Sass compile for the Open edX Certificates Elements.
// NOTE: This is the left to right (LTR) configured style compile.
// It should mirror main-rtl w/ the exception of bi-app references.
// NOTE: This is the left to right (LTR) configured style compile. It should mirror main-rtl w/ the exception of bi-app references.
// Load the LTR version of the edX Pattern Library
$pattern-library-path: '../../edx-pattern-library' !default;
@import 'edx-pattern-library/pattern-library/sass/edx-pattern-library-ltr';
// ------------------------------
// #CONFIG - layout direction
// ------------------------------
@import 'ltr'; // LTR-specifc settings and utilities
// Load the shared build
@import 'build';
// ------------------------------
// #BUILD
// ------------------------------
@import 'build'; // shared compile/build order for both LTR and RTL UI
......@@ -3,13 +3,16 @@
// About: Sass compile for the Open edX Certificates Elements.
// NOTE: This is the right to left (RTL) configured style compile.
// It should mirror main-ltr w/ the exception of bi-app references.
// NOTE: This is the right to left (RTL) configured style compile. It should mirror main-ltr w/ the exception of bi-app references.
// Load the RTL version of the edX Pattern Library
$pattern-library-path: '../../edx-pattern-library' !default;
@import 'edx-pattern-library/pattern-library/sass/edx-pattern-library-rtl';
// ------------------------------
// #CONFIG - layout direction
// ------------------------------
@import 'rtl'; // RTL-specifc settings and utilities
// Load the shared build
@import 'build';
// ------------------------------
// #BUILD
// ------------------------------
@import 'build'; // shared compile/build order for both LTR and RTL UI
// ------------------------------
// LMS: Shared Build Compile
// Version 2 - introduces the Pattern Library
// Configuration
@import 'config';
// Extensions
// ------------------------------
// LMS configuration settings
// ------------------------------
// #VARIABLES
// ------------------------------
// LMS - CSS application architecture
// Version 1 styling (pre-Pattern Library)
// lms - css application architecture
// ====================
// libs and resets *do not edit*
......@@ -19,4 +18,4 @@
// theme, for old-style deprecated theming.
//<THEME-OVERRIDE>
@import 'build-lms-v1'; // shared app style assets/rendering
@import 'build-lms'; // shared app style assets/rendering
// ------------------------------
// LMS main styling
// Version 2 - introduces the Pattern Library
// NOTE: This is the right-to-left (RTL) configured style compile.
// It should mirror lms-main-v2 w/ the exception of bi-app references.
// Load the RTL version of the edX Pattern Library
$pattern-library-path: '../edx-pattern-library' !default;
@import 'edx-pattern-library/pattern-library/sass/edx-pattern-library-rtl';
// Load the shared build
@import 'build-lms-v2';
// ------------------------------
// LMS main styling
// Version 2 - introduces the Pattern Library
// NOTE: This is the left-to-right (LTR) configured style compile.
// It should mirror lms-main-v2-rtl w/ the exception of bi-app references.
// Load the RTL version of the edX Pattern Library
$pattern-library-path: '../edx-pattern-library' !default;
@import 'edx-pattern-library/pattern-library/sass/edx-pattern-library-ltr';
// Load the shared build
@import 'build-lms-v2';
// LMS - CSS application architecture
// Version 1 styling (pre-Pattern Library)
// lms - css application architecture
// ====================
// libs and resets *do not edit*
......@@ -18,4 +17,4 @@
// theme, for old-style deprecated theming.
//<THEME-OVERRIDE>
@import 'build-lms-v1'; // shared app style assets/rendering
@import 'build-lms'; // shared app style assets/rendering
## coding=utf-8
## Pages currently use v1 styling by default. Once the Pattern Library
## rollout has been completed, this default can be switched to v2.
<%! main_css = "css/lms-main-v1.css" %>
<%namespace name='static' file='static_content.html'/>
<%!
from django.core.urlresolvers import reverse
......@@ -55,7 +49,17 @@ from pipeline_mako import render_require_js_path_overrides
<link rel="icon" type="image/x-icon" href="${static.url(static.get_value('favicon_path', settings.FAVICON_PATH))}" />
<%static:css group='style-vendor'/>
<%static:css group='${self.attr.main_css}'/>
## We could do <%static:css group='style-main'/>, but that's only useful
## if the group contains multiple files, and the 'style-main' group doesn't.
## Instead, we'll construct this <link> element manually, to improve clarity.
## When nothing in the system is referencing the 'style-main' group, it can
## be removed from the environment file.
<%
application_css_path = "css/lms-main{rtl}.css".format(
rtl="-rtl" if get_language_bidi() else "",
)
%>
<link rel="stylesheet" href="${static.url(application_css_path)}" type="text/css" media="all" />
% if disable_courseware_js:
<%static:js group='base_vendor'/>
......
<%page expression_filter="h"/>
<%inherit file="/main.html" />
<%namespace name='static' file='/static_content.html'/>
<%block name="pagetitle">UX Reference</%block>
<%block name="nav_skip">#content</%block>
<%block name="bodyclass">view-ux-reference</%block>
<%block name="content">
<div class="main-wrapper">
<div class="inner-wrapper">
<div class="main-column">
<article class="window unit-body">
<h1>UX Style Reference</h1>
<section class="xblock xblock-student_view xmodule_display xmodule_HtmlModule">
<h2>Page Types</h2>
<ul>
<li><a href="pattern-library-test.html">Pattern Library test page</a></li>
</ul>
</section>
</article>
</div>
</div>
</div>
</%block>
## Override the default styles_version to the Pattern Library version (version 2)
<%! main_css = "css/lms-main-v2.css" %>
<%page expression_filter="h"/>
<%inherit file="/main.html" />
<%block name="pagetitle">Pattern Library Test</%block>
<%block name="nav_skip">#content</%block>
<%block name="bodyclass">pattern-library</%block>
<%block name="content">
<h3 class="hd-6 example-set-hd">Warning Alert with Message Only</h3>
<div class="example-set">
<div class="alert alert-warning" role="alert" aria-labelledby="alert-warning-publish-title" tabindex="-1">
<span class="icon alert-icon icon-warning" aria-hidden="true"></span>
<div class="alert-message">
<p class="alert-copy">
Interesting pattern library content to come...
</p>
</div>
</div>
</div>
</%block>
......@@ -63,8 +63,8 @@ class TestComprehensiveThemeLMS(TestCase):
"""
Test that theme sass files are used instead of default sass files.
"""
result = staticfiles.finders.find('test-theme/css/lms-main-v1.css')
self.assertEqual(result, settings.TEST_THEME / "lms/static/css/lms-main-v1.css")
result = staticfiles.finders.find('test-theme/css/lms-main.css')
self.assertEqual(result, settings.TEST_THEME / "lms/static/css/lms-main.css")
lms_main_css = ""
with open(result) as css_file:
......@@ -115,8 +115,8 @@ class TestComprehensiveThemeCMS(TestCase):
"""
Test that theme sass files are used instead of default sass files.
"""
result = staticfiles.finders.find('test-theme/css/studio-main-v1.css')
self.assertEqual(result, settings.TEST_THEME / "cms/static/css/studio-main-v1.css")
result = staticfiles.finders.find('test-theme/css/studio-main.css')
self.assertEqual(result, settings.TEST_THEME / "cms/static/css/studio-main.css")
cms_main_css = ""
with open(result) as css_file:
......@@ -161,8 +161,8 @@ class TestComprehensiveThemeDisabledLMS(TestCase):
"""
Test that default css files served without comprehensive themes applied.
"""
result = staticfiles.finders.find('css/lms-main-v1.css')
self.assertEqual(result, settings.REPO_ROOT / "lms/static/css/lms-main-v1.css")
result = staticfiles.finders.find('css/lms-main.css')
self.assertEqual(result, settings.REPO_ROOT / "lms/static/css/lms-main.css")
lms_main_css = ""
with open(result) as css_file:
......@@ -208,8 +208,8 @@ class TestComprehensiveThemeDisabledCMS(TestCase):
"""
Test that default css files served without comprehensive themes applied..
"""
result = staticfiles.finders.find('css/studio-main-v1.css')
self.assertEqual(result, settings.REPO_ROOT / "cms/static/css/studio-main-v1.css")
result = staticfiles.finders.find('css/studio-main.css')
self.assertEqual(result, settings.REPO_ROOT / "cms/static/css/studio-main.css")
cms_main_css = ""
with open(result) as css_file:
......
......@@ -3,8 +3,8 @@
"version": "0.1.0",
"dependencies": {
"coffee-script": "1.6.1",
"edx-pattern-library": "~0.12.1",
"edx-ui-toolkit": "~0.9.1",
"edx-pattern-library": "0.10.4",
"edx-ui-toolkit": "0.9.0",
"requirejs": "~2.1.22",
"uglify-js": "2.4.24",
"underscore": "~1.8.3",
......
......@@ -33,12 +33,9 @@ SYSTEMS = {
}
# Common lookup paths that are added to the lookup paths for all sass compilations
COMMON_LOOKUP_PATHS = [
COMMON_LOOKUP_DIRS = [
path("common/static"),
path("common/static/sass"),
path("node_modules"),
path("node_modules/edx-pattern-library/node_modules"),
]
# A list of NPM installed libraries that should be copied into the common
......@@ -111,7 +108,10 @@ def get_common_sass_directories():
applicable_directories.append({
"sass_source_dir": path("common/static/sass"),
"css_destination_dir": path("common/static/css"),
"lookup_paths": COMMON_LOOKUP_PATHS,
"lookup_paths": [
path("common/static"),
path("common/static/sass"),
],
})
return applicable_directories
......@@ -223,7 +223,7 @@ def get_watcher_dirs(themes_base_dir=None, themes=None):
(list): dirs that need to be added to sass watchers.
"""
dirs = []
dirs.extend(COMMON_LOOKUP_PATHS)
dirs.extend(COMMON_LOOKUP_DIRS)
if themes_base_dir and themes:
# Register sass watchers for all the given themes
theme_dirs = [(path(themes_base_dir) / theme) for theme in themes if theme]
......@@ -559,7 +559,7 @@ def _compile_sass(system, theme, debug, force, timing_info):
else:
sass.compile(
dirname=(sass_source_dir, css_dir),
include_paths=COMMON_LOOKUP_PATHS + lookup_paths,
include_paths=COMMON_LOOKUP_DIRS + lookup_paths,
source_comments=source_comments,
output_style=output_style,
)
......
......@@ -148,8 +148,6 @@ class TestPaverWatchAssetTasks(TestCase):
self.expected_sass_directories = [
path('common/static/sass'),
path('common/static'),
path('node_modules'),
path('node_modules/edx-pattern-library/node_modules'),
path('lms/static/sass/partials'),
path('lms/static/sass'),
path('lms/static/certificates/sass'),
......@@ -158,10 +156,6 @@ class TestPaverWatchAssetTasks(TestCase):
]
super(TestPaverWatchAssetTasks, self).setUp()
def tearDown(self):
self.expected_sass_directories = []
super(TestPaverWatchAssetTasks, self).tearDown()
def test_watch_assets(self):
"""
Test the "compile_sass" task.
......@@ -204,3 +198,7 @@ class TestPaverWatchAssetTasks(TestCase):
self.assertIsInstance(sass_watcher_args[0], PollingObserver)
self.assertIsInstance(sass_watcher_args[1], list)
self.assertItemsEqual(sass_watcher_args[1], self.expected_sass_directories)
def tearDown(self):
self.expected_sass_directories = []
super(TestPaverWatchAssetTasks, self).tearDown()
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment