*/
public function standard_top_of_body_html() {
global $CFG;
- $output = $this->page->requires->get_top_of_body_code();
+ $output = $this->page->requires->get_top_of_body_code($this);
if ($this->page->pagelayout !== 'embedded' && !empty($CFG->additionalhtmltopofbody)) {
$output .= "\n".$CFG->additionalhtmltopofbody;
}
return $this->render_context_header($contextheader);
}
+ /**
+ * Renders the skip links for the page.
+ *
+ * @param array $links List of skip links.
+ * @return string HTML for the skip links.
+ */
+ public function render_skip_links($links) {
+ $context = [ 'links' => []];
+
+ foreach ($links as $url => $text) {
+ $context['links'][] = [ 'url' => $url, 'text' => $text];
+ }
+
+ return $this->render_from_template('core/skip_links', $context);
+ }
+
/**
* Renders the header bar.
*
* Normally, this method is called automatically by the code that prints the
* <head> tag. You should not normally need to call it in your own code.
*
+ * @param renderer_base $renderer
* @return string the HTML code to go at the start of the <body> tag.
*/
- public function get_top_of_body_code() {
+ public function get_top_of_body_code(renderer_base $renderer) {
// First the skip links.
- $links = '';
- $attributes = array('class' => 'skip');
- foreach ($this->skiplinks as $url => $text) {
- $links .= html_writer::link('#'.$url, $text, $attributes);
- }
- $output = html_writer::tag('div', $links, array('class'=>'skiplinks')) . "\n";
- $this->js_init_call('M.util.init_skiplink');
+ $output = $renderer->render_skip_links($this->skiplinks);
// YUI3 JS needs to be loaded early in the body. It should be cached well by the browser.
$output .= $this->get_yui3lib_headcode();
--- /dev/null
+<div class="skiplinks">
+{{#links}}
+ <a href="{{{url}}}" class="skip">{{{text}}}</a>
+{{/links}}
+</div>
+{{#js}}
+require(['core/yui'], function(Y) {
+ M.util.init_skiplink(Y);
+});
+{{/js}}
\ No newline at end of file
--- /dev/null
+<?php
+// This file is part of Moodle - http://moodle.org/
+//
+// Moodle is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// Moodle is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU General Public License for more details.
+//
+// You should have received a copy of the GNU General Public License
+// along with Moodle. If not, see <http://www.gnu.org/licenses/>.
+
+namespace theme_noname\output;
+
+use html_writer;
+use tabobject;
+use tabtree;
+use custom_menu_item;
+use custom_menu;
+
+defined('MOODLE_INTERNAL') || die;
+
+/**
+ * Renderers to align Moodle's HTML with that expected by Bootstrap
+ *
+ * @package theme_noname
+ * @copyright 2012 Bas Brands, www.basbrands.nl
+ * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+
+class core_renderer extends \core_renderer {
+
+ /** @var custom_menu_item language The language menu if created */
+ protected $language = null;
+
+ /**
+ * The standard tags that should be included in the <head> tag
+ * including a meta description for the front page
+ *
+ * @return string HTML fragment.
+ */
+ public function standard_head_html() {
+ global $SITE, $PAGE;
+
+ $output = parent::standard_head_html();
+ if ($PAGE->pagelayout == 'frontpage') {
+ $summary = s(strip_tags(format_text($SITE->summary, FORMAT_HTML)));
+ if (!empty($summary)) {
+ $output .= "<meta name=\"description\" content=\"$summary\" />\n";
+ }
+ }
+
+ return $output;
+ }
+
+ /*
+ * This renders the navbar.
+ * Uses bootstrap compatible html.
+ */
+ public function navbar() {
+ $items = $this->page->navbar->get_items();
+ if (empty($items)) {
+ return '';
+ }
+
+ $breadcrumbs = array();
+ foreach ($items as $item) {
+ $item->hideicon = true;
+ $breadcrumbs[] = $this->render($item);
+ }
+ $list_items = '<li>'.join(" </li><li>", $breadcrumbs).'</li>';
+ $title = '<span class="accesshide" id="navbar-label">'.get_string('pagepath').'</span>';
+ return $title . '<nav aria-labelledby="navbar-label"><ul class="breadcrumb">' .
+ $list_items . '</ul></nav>';
+ }
+
+ /*
+ * Overriding the custom_menu function ensures the custom menu is
+ * always shown, even if no menu items are configured in the global
+ * theme settings page.
+ */
+ public function custom_menu($custommenuitems = '') {
+ global $CFG;
+
+ if (empty($custommenuitems) && !empty($CFG->custommenuitems)) {
+ $custommenuitems = $CFG->custommenuitems;
+ }
+ $custommenu = new custom_menu($custommenuitems, current_language());
+ return $this->render_custom_menu($custommenu);
+ }
+
+ /*
+ * This renders the bootstrap top menu.
+ *
+ * This renderer is needed to enable the Bootstrap style navigation.
+ */
+ protected function render_custom_menu(custom_menu $menu) {
+ global $CFG;
+
+ $langs = get_string_manager()->get_list_of_translations();
+ $haslangmenu = $this->lang_menu() != '';
+
+ if (!$menu->has_children() && !$haslangmenu) {
+ return '';
+ }
+
+ if ($haslangmenu) {
+ $strlang = get_string('language');
+ $currentlang = current_language();
+ if (isset($langs[$currentlang])) {
+ $currentlang = $langs[$currentlang];
+ } else {
+ $currentlang = $strlang;
+ }
+ $this->language = $menu->add($currentlang, new moodle_url('#'), $strlang, 10000);
+ foreach ($langs as $langtype => $langname) {
+ $this->language->add($langname, new moodle_url($this->page->url, array('lang' => $langtype)), $langname);
+ }
+ }
+
+ $content = '<ul class="nav">';
+ foreach ($menu->get_children() as $item) {
+ $content .= $this->render_custom_menu_item($item, 1);
+ }
+
+ return $content.'</ul>';
+ }
+
+ /*
+ * This code renders the custom menu items for the
+ * bootstrap dropdown menu.
+ */
+ protected function render_custom_menu_item(custom_menu_item $menunode, $level = 0 ) {
+ static $submenucount = 0;
+
+ $content = '';
+ if ($menunode->has_children()) {
+
+ if ($level == 1) {
+ $class = 'dropdown';
+ } else {
+ $class = 'dropdown-submenu';
+ }
+
+ if ($menunode === $this->language) {
+ $class .= ' langmenu';
+ }
+ $content = html_writer::start_tag('li', array('class' => $class));
+ // If the child has menus render it as a sub menu.
+ $submenucount++;
+ if ($menunode->get_url() !== null) {
+ $url = $menunode->get_url();
+ } else {
+ $url = '#cm_submenu_'.$submenucount;
+ }
+ $content .= html_writer::start_tag('a', array('href'=>$url, 'class'=>'dropdown-toggle', 'data-toggle'=>'dropdown', 'title'=>$menunode->get_title()));
+ $content .= $menunode->get_text();
+ if ($level == 1) {
+ $content .= '<b class="caret"></b>';
+ }
+ $content .= '</a>';
+ $content .= '<ul class="dropdown-menu">';
+ foreach ($menunode->get_children() as $menunode) {
+ $content .= $this->render_custom_menu_item($menunode, 0);
+ }
+ $content .= '</ul>';
+ } else {
+ // The node doesn't have children so produce a final menuitem.
+ // Also, if the node's text matches '####', add a class so we can treat it as a divider.
+ if (preg_match("/^#+$/", $menunode->get_text())) {
+ // This is a divider.
+ $content = '<li class="divider"> </li>';
+ } else {
+ $content = '<li>';
+ if ($menunode->get_url() !== null) {
+ $url = $menunode->get_url();
+ } else {
+ $url = '#';
+ }
+ $content .= html_writer::link($url, $menunode->get_text(), array('title' => $menunode->get_title()));
+ $content .= '</li>';
+ }
+ }
+ return $content;
+ }
+
+ /**
+ * This code renders the navbar button to control the display of the custom menu
+ * on smaller screens.
+ *
+ * Do not display the button if the menu is empty.
+ *
+ * @return string HTML fragment
+ */
+ public function navbar_button() {
+ global $CFG;
+
+ if (empty($CFG->custommenuitems) && $this->lang_menu() == '') {
+ return '';
+ }
+
+ $iconbar = html_writer::tag('span', '', array('class' => 'icon-bar'));
+ $button = html_writer::tag('a', $iconbar . "\n" . $iconbar. "\n" . $iconbar, array(
+ 'class' => 'btn btn-navbar',
+ 'data-toggle' => 'collapse',
+ 'data-target' => '.nav-collapse'
+ ));
+ return $button;
+ }
+
+ /**
+ * Renders tabtree
+ *
+ * @param tabtree $tabtree
+ * @return string
+ */
+ protected function render_tabtree(tabtree $tabtree) {
+ if (empty($tabtree->subtree)) {
+ return '';
+ }
+ $firstrow = $secondrow = '';
+ foreach ($tabtree->subtree as $tab) {
+ $firstrow .= $this->render($tab);
+ if (($tab->selected || $tab->activated) && !empty($tab->subtree) && $tab->subtree !== array()) {
+ $secondrow = $this->tabtree($tab->subtree);
+ }
+ }
+ return html_writer::tag('ul', $firstrow, array('class' => 'nav nav-tabs')) . $secondrow;
+ }
+
+ /**
+ * Renders tabobject (part of tabtree)
+ *
+ * This function is called from {@link core_renderer::render_tabtree()}
+ * and also it calls itself when printing the $tabobject subtree recursively.
+ *
+ * @param tabobject $tabobject
+ * @return string HTML fragment
+ */
+ protected function render_tabobject(tabobject $tab) {
+ if (($tab->selected and (!$tab->linkedwhenselected)) or $tab->activated) {
+ return html_writer::tag('li', html_writer::tag('a', $tab->text), array('class' => 'active'));
+ } else if ($tab->inactive) {
+ return html_writer::tag('li', html_writer::tag('a', $tab->text), array('class' => 'disabled'));
+ } else {
+ if (!($tab->link instanceof moodle_url)) {
+ // backward compartibility when link was passed as quoted string
+ $link = "<a href=\"$tab->link\" title=\"$tab->title\">$tab->text</a>";
+ } else {
+ $link = html_writer::link($tab->link, $tab->text, array('title' => $tab->title));
+ }
+ $params = $tab->selected ? array('class' => 'active') : null;
+ return html_writer::tag('li', $link, $params);
+ }
+ }
+}
$THEME->editor_sheets = ['editor'];
$THEME->layouts = [
- 'standard' => [
- 'file' => 'default.php',
- 'regions' => ['side-pre', 'side-post'],
- ],
+ // Most backwards compatible layout without the blocks - this is the layout used by default.
+ 'base' => array(
+ 'file' => 'columns1.php',
+ 'regions' => array(),
+ ),
+ // Standard layout with blocks, this is recommended for most pages with general information.
+ 'standard' => array(
+ 'file' => 'columns3.php',
+ 'regions' => array('side-pre', 'side-post'),
+ 'defaultregion' => 'side-pre',
+ ),
+ // Main course page.
+ 'course' => array(
+ 'file' => 'columns3.php',
+ 'regions' => array('side-pre', 'side-post'),
+ 'defaultregion' => 'side-pre',
+ 'options' => array('langmenu' => true),
+ ),
+ 'coursecategory' => array(
+ 'file' => 'columns3.php',
+ 'regions' => array('side-pre', 'side-post'),
+ 'defaultregion' => 'side-pre',
+ ),
+ // Part of course, typical for modules - default page layout if $cm specified in require_login().
+ 'incourse' => array(
+ 'file' => 'columns3.php',
+ 'regions' => array('side-pre', 'side-post'),
+ 'defaultregion' => 'side-pre',
+ ),
+ // The site home page.
+ 'frontpage' => array(
+ 'file' => 'columns3.php',
+ 'regions' => array('side-pre', 'side-post'),
+ 'defaultregion' => 'side-pre',
+ 'options' => array('nonavbar' => true),
+ ),
+ // Server administration scripts.
+ 'admin' => array(
+ 'file' => 'columns2.php',
+ 'regions' => array('side-pre'),
+ 'defaultregion' => 'side-pre',
+ ),
+ // My dashboard page.
+ 'mydashboard' => array(
+ 'file' => 'columns3.php',
+ 'regions' => array('side-pre', 'side-post'),
+ 'defaultregion' => 'side-pre',
+ 'options' => array('langmenu' => true),
+ ),
+ // My public page.
+ 'mypublic' => array(
+ 'file' => 'columns2.php',
+ 'regions' => array('side-pre'),
+ 'defaultregion' => 'side-pre',
+ ),
+ 'login' => array(
+ 'file' => 'columns1.php',
+ 'regions' => array(),
+ 'options' => array('langmenu' => true),
+ ),
- // 'course' => [],
- // 'coursecategory' => [],
- // 'incourse' => [],
- // 'frontpage' => [],
- // 'admin' => [],
- // 'mydashboard' => [],
- // 'mypublic' => [],
- // 'report' => [],
- // 'login' => [],
-
- // General purpose.
- // 'embedded' => [],
- // 'frametop' => [],
- // 'maintenance' => [],
- // 'popup' => [],
- // 'print' => [],
- // 'redirect' => [],
- // 'secure' => [],
+ // Pages that appear in pop-up windows - no navigation, no blocks, no header.
+ 'popup' => array(
+ 'file' => 'columns1.php',
+ 'regions' => array(),
+ 'options' => array('nofooter' => true, 'nonavbar' => true),
+ ),
+ // No blocks and minimal footer - used for legacy frame layouts only!
+ 'frametop' => array(
+ 'file' => 'columns1.php',
+ 'regions' => array(),
+ 'options' => array('nofooter' => true, 'nocoursefooter' => true),
+ ),
+ // Embeded pages, like iframe/object embeded in moodleform - it needs as much space as possible.
+ 'embedded' => array(
+ 'file' => 'embedded.php',
+ 'regions' => array()
+ ),
+ // Used during upgrade and install, and for the 'This site is undergoing maintenance' message.
+ // This must not have any blocks, links, or API calls that would lead to database or cache interaction.
+ // Please be extremely careful if you are modifying this layout.
+ 'maintenance' => array(
+ 'file' => 'maintenance.php',
+ 'regions' => array(),
+ ),
+ // Should display the content and basic headers only.
+ 'print' => array(
+ 'file' => 'columns1.php',
+ 'regions' => array(),
+ 'options' => array('nofooter' => true, 'nonavbar' => false),
+ ),
+ // The pagelayout used when a redirection is occuring.
+ 'redirect' => array(
+ 'file' => 'embedded.php',
+ 'regions' => array(),
+ ),
+ // The pagelayout used for reports.
+ 'report' => array(
+ 'file' => 'columns2.php',
+ 'regions' => array('side-pre'),
+ 'defaultregion' => 'side-pre',
+ ),
+ // The pagelayout used for safebrowser and securewindow.
+ 'secure' => array(
+ 'file' => 'secure.php',
+ 'regions' => array('side-pre', 'side-post'),
+ 'defaultregion' => 'side-pre'
+ )
];
// $THEME->javascripts = array();
--- /dev/null
+<?php
+// This file is part of Moodle - http://moodle.org/
+//
+// Moodle is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// Moodle is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU General Public License for more details.
+//
+// You should have received a copy of the GNU General Public License
+// along with Moodle. If not, see <http://www.gnu.org/licenses/>.
+
+/**
+ * A one column layout for the noname theme.
+ *
+ * @package theme_noname
+ * @copyright 2016 Damyon Wiese
+ * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+$templatecontext = [
+ 'sitename' => format_string($SITE->shortname, true, array('context' => context_course::instance(SITEID))),
+ 'output' => $OUTPUT
+];
+
+echo $OUTPUT->render_from_template('theme_noname/columns1', $templatecontext);
\ No newline at end of file
--- /dev/null
+<?php
+// This file is part of Moodle - http://moodle.org/
+//
+// Moodle is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// Moodle is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU General Public License for more details.
+//
+// You should have received a copy of the GNU General Public License
+// along with Moodle. If not, see <http://www.gnu.org/licenses/>.
+
+/**
+ * A two column layout for the noname theme.
+ *
+ * @package theme_noname
+ * @copyright 2016 Damyon Wiese
+ * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+$templatecontext = [
+ 'sitename' => format_string($SITE->shortname, true, array('context' => context_course::instance(SITEID))),
+ 'output' => $OUTPUT,
+ 'sidepreblocks' => $OUTPUT->blocks('side-pre', 'col-md-3 col-md-pull-9'),
+];
+
+echo $OUTPUT->render_from_template('theme_noname/columns2', $templatecontext);
\ No newline at end of file
--- /dev/null
+<?php
+// This file is part of Moodle - http://moodle.org/
+//
+// Moodle is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// Moodle is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU General Public License for more details.
+//
+// You should have received a copy of the GNU General Public License
+// along with Moodle. If not, see <http://www.gnu.org/licenses/>.
+
+/**
+ * A three column layout for the noname theme.
+ *
+ * @package theme_noname
+ * @copyright 2016 Damyon Wiese
+ * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+$templatecontext = [
+ 'sitename' => format_string($SITE->shortname, true, array('context' => context_course::instance(SITEID))),
+ 'output' => $OUTPUT,
+ 'sidepreblocks' => $OUTPUT->blocks('side-pre', 'col-md-4 col-md-pull-8 col-lg-3 col-lg-pull-9'),
+ 'sidepostblocks' => $OUTPUT->blocks('side-post', 'col-md-3')
+];
+
+echo $OUTPUT->render_from_template('theme_noname/columns3', $templatecontext);
+
+++ /dev/null
-<?php
-// This file is part of Moodle - http://moodle.org/
-//
-// Moodle is free software: you can redistribute it and/or modify
-// it under the terms of the GNU General Public License as published by
-// the Free Software Foundation, either version 3 of the License, or
-// (at your option) any later version.
-//
-// Moodle is distributed in the hope that it will be useful,
-// but WITHOUT ANY WARRANTY; without even the implied warranty of
-// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
-// GNU General Public License for more details.
-//
-// You should have received a copy of the GNU General Public License
-// along with Moodle. If not, see <http://www.gnu.org/licenses/>.
-
-/**
- * Default layout.
- *
- * @package theme_noname
- * @copyright 2016 Frédéric Massart - FMCorz.net
- * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
- */
-
-$regionmain = 'span9 pull-right';
-$sidepre = 'span3 desktop-first-column';
-if (right_to_left()) {
- $regionmain = 'span9';
- $sidepre = 'span3 pull-right';
-}
-
-echo $OUTPUT->doctype() ?>
-<html <?php echo $OUTPUT->htmlattributes(); ?>>
-<head>
- <title><?php echo $OUTPUT->page_title(); ?></title>
- <link rel="shortcut icon" href="<?php echo $OUTPUT->favicon(); ?>" />
- <?php echo $OUTPUT->standard_head_html() ?>
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
-</head>
-
-<body <?php echo $OUTPUT->body_attributes('two-column'); ?>>
-
-<?php echo $OUTPUT->standard_top_of_body_html() ?>
-
-<header role="banner" class="navbar navbar-fixed-top moodle-has-zindex">
- <nav role="navigation" class="navbar-inner">
- <div class="container-fluid">
- <a class="brand" href="<?php echo $CFG->wwwroot;?>"><?php
- echo format_string($SITE->shortname, true, array('context' => context_course::instance(SITEID)));
- ?></a>
- <?php echo $OUTPUT->navbar_button(); ?>
- <?php echo $OUTPUT->user_menu(); ?>
- <?php echo $OUTPUT->search_box(); ?>
- <div class="nav-collapse collapse">
- <?php echo $OUTPUT->custom_menu(); ?>
- <ul class="nav pull-right">
- <li><?php echo $OUTPUT->page_heading_menu(); ?></li>
- </ul>
- </div>
- </div>
- </nav>
-</header>
-
-<div id="page" class="container-fluid">
- <?php echo $OUTPUT->full_header(); ?>
- <div id="page-content" class="row-fluid">
- <section id="region-main" class="<?php echo $regionmain; ?>">
- <?php
- echo $OUTPUT->course_content_header();
- echo $OUTPUT->main_content();
- echo $OUTPUT->course_content_footer();
- ?>
- </section>
- <?php echo $OUTPUT->blocks('side-pre', $sidepre); ?>
- </div>
-
- <footer id="page-footer">
- <div id="course-footer"><?php echo $OUTPUT->course_footer(); ?></div>
- <p class="helplink"><?php echo $OUTPUT->page_doc_link(); ?></p>
- <?php
- echo $OUTPUT->login_info();
- echo $OUTPUT->home_link();
- echo $OUTPUT->standard_footer_html();
- ?>
- </footer>
-
- <?php echo $OUTPUT->standard_end_of_body_html() ?>
-
-</div>
-</body>
-</html>
--- /dev/null
+<?php
+// This file is part of Moodle - http://moodle.org/
+//
+// Moodle is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// Moodle is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU General Public License for more details.
+//
+// You should have received a copy of the GNU General Public License
+// along with Moodle. If not, see <http://www.gnu.org/licenses/>.
+
+/**
+ * An embedded layout for the noname theme.
+ *
+ * @package theme_noname
+ * @copyright 2016 Damyon Wiese
+ * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+$templatecontext = [
+ 'sitename' => format_string($SITE->shortname, true, array('context' => context_course::instance(SITEID))),
+ 'output' => $OUTPUT
+];
+
+echo $OUTPUT->render_from_template('theme_noname/embedded', $templatecontext);
\ No newline at end of file
--- /dev/null
+<?php
+// This file is part of Moodle - http://moodle.org/
+//
+// Moodle is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// Moodle is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU General Public License for more details.
+//
+// You should have received a copy of the GNU General Public License
+// along with Moodle. If not, see <http://www.gnu.org/licenses/>.
+
+/**
+ * A maintenance layout for the noname theme.
+ *
+ * @package theme_noname
+ * @copyright 2016 Damyon Wiese
+ * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+$templatecontext = [
+ 'sitename' => format_string($SITE->shortname, true, array('context' => context_course::instance(SITEID))),
+ 'output' => $OUTPUT
+];
+
+echo $OUTPUT->render_from_template('theme_noname/maintenance', $templatecontext);
\ No newline at end of file
--- /dev/null
+<?php
+// This file is part of Moodle - http://moodle.org/
+//
+// Moodle is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// Moodle is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU General Public License for more details.
+//
+// You should have received a copy of the GNU General Public License
+// along with Moodle. If not, see <http://www.gnu.org/licenses/>.
+
+/**
+ * A three column layout for the noname theme.
+ *
+ * @package theme_noname
+ * @copyright 2016 Damyon Wiese
+ * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+$templatecontext = [
+ 'sitename' => format_string($SITE->shortname, true, array('context' => context_course::instance(SITEID))),
+ 'output' => $OUTPUT,
+ 'sidepreblocks' => $OUTPUT->blocks('side-pre', 'col-md-4 col-md-pull-8 col-lg-3 col-lg-pull-9'),
+ 'sidepostblocks' => $OUTPUT->blocks('side-post', 'col-md-3')
+];
+
+echo $OUTPUT->render_from_template('theme_noname/secure', $templatecontext);
+
--- /dev/null
+Description of Twitter bootstrap import into Moodle
+
+Twitter bootstrap
+-----------------
+This theme uses the original unmodified version 4.0.0-alpha-3 Twitter bootstrap sass files.
+The bootstrap repository is available on:
+
+https://github.com/twitter/bootstrap.git
+
+To update to the latest release of twitter bootstrap:
+* remove all files from scss/bootstrap,
+* download the new scss files and store them in scss/bootstrap
+* update ./thirdpartylibs.xml
+
--- /dev/null
+The MIT License (MIT)
+
+Copyright (c) 2011-2016 Twitter, Inc.
+Copyright (c) 2011-2016 The Bootstrap Authors
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in
+all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+THE SOFTWARE.
--- /dev/null
+//
+// Base styles
+//
+
+.alert {
+ padding: $alert-padding;
+ margin-bottom: $spacer-y;
+ border: $alert-border-width solid transparent;
+ @include border-radius($alert-border-radius);
+}
+
+// Headings for larger alerts
+.alert-heading {
+ // Specified to prevent conflicts of changing $headings-color
+ color: inherit;
+}
+
+// Provide class for links that match alerts
+.alert-link {
+ font-weight: $alert-link-font-weight;
+}
+
+
+// Dismissible alerts
+//
+// Expand the right padding and account for the close button's positioning.
+
+.alert-dismissible {
+ padding-right: ($alert-padding + 20px);
+
+ // Adjust close link position
+ .close {
+ position: relative;
+ top: -2px;
+ right: -21px;
+ color: inherit;
+ }
+}
+
+
+// Alternate styles
+//
+// Generate contextual modifier classes for colorizing the alert.
+
+.alert-success {
+ @include alert-variant($alert-success-bg, $alert-success-border, $alert-success-text);
+}
+.alert-info {
+ @include alert-variant($alert-info-bg, $alert-info-border, $alert-info-text);
+}
+.alert-warning {
+ @include alert-variant($alert-warning-bg, $alert-warning-border, $alert-warning-text);
+}
+.alert-danger {
+ @include alert-variant($alert-danger-bg, $alert-danger-border, $alert-danger-text);
+}
--- /dev/null
+.fade {
+ opacity: 0;
+ transition: opacity .15s linear;
+
+ &.in {
+ opacity: 1;
+ }
+}
+
+.collapse {
+ display: none;
+
+ &.in {
+ display: block;
+ }
+ // tr&.in { display: table-row; }
+ // tbody&.in { display: table-row-group; }
+}
+
+.collapsing {
+ position: relative;
+ height: 0;
+ overflow: hidden;
+ transition-timing-function: ease;
+ transition-duration: .35s;
+ transition-property: height;
+}
--- /dev/null
+.breadcrumb {
+ padding: $breadcrumb-padding-y $breadcrumb-padding-x;
+ margin-bottom: $spacer-y;
+ list-style: none;
+ background-color: $breadcrumb-bg;
+ @include border-radius($border-radius);
+ @include clearfix;
+}
+
+.breadcrumb-item {
+ float: left;
+
+ // The separator between breadcrumbs (by default, a forward-slash: "/")
+ + .breadcrumb-item::before {
+ display: inline-block; // Suppress underlining of the separator in modern browsers
+ padding-right: $breadcrumb-item-padding;
+ padding-left: $breadcrumb-item-padding;
+ color: $breadcrumb-divider-color;
+ content: "#{$breadcrumb-divider}";
+ }
+
+ // IE9-11 hack to properly handle hyperlink underlines for breadcrumbs built
+ // without `<ul>`s. The `::before` pseudo-element generates an element
+ // *within* the .breadcrumb-item and thereby inherits the `text-decoration`.
+ //
+ // To trick IE into suppressing the underline, we give the pseudo-element an
+ // underline and then immediately remove it.
+ + .breadcrumb-item:hover::before {
+ text-decoration: underline;
+ }
+ + .breadcrumb-item:hover::before {
+ text-decoration: none;
+ }
+
+ &.active {
+ color: $breadcrumb-active-color;
+ }
+}
--- /dev/null
+// scss-lint:disable QualifyingElement
+
+// Make the div behave like a button
+.btn-group,
+.btn-group-vertical {
+ position: relative;
+ display: inline-block;
+ vertical-align: middle; // match .btn alignment given font-size hack above
+
+ > .btn {
+ position: relative;
+ float: left;
+
+ // Bring the "active" button to the front
+ &:focus,
+ &:active,
+ &.active {
+ z-index: 2;
+ }
+ @include hover {
+ z-index: 2;
+ }
+ }
+}
+
+// Prevent double borders when buttons are next to each other
+.btn-group {
+ .btn + .btn,
+ .btn + .btn-group,
+ .btn-group + .btn,
+ .btn-group + .btn-group {
+ margin-left: -$input-btn-border-width;
+ }
+}
+
+// Optional: Group multiple button groups together for a toolbar
+.btn-toolbar {
+ margin-left: -$btn-toolbar-margin; // Offset the first child's margin
+ @include clearfix();
+
+ .btn-group,
+ .input-group {
+ float: left;
+ }
+
+ > .btn,
+ > .btn-group,
+ > .input-group {
+ margin-left: $btn-toolbar-margin;
+ }
+}
+
+.btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {
+ border-radius: 0;
+}
+
+// Set corners individual because sometimes a single button can be in a .btn-group and we need :first-child and :last-child to both match
+.btn-group > .btn:first-child {
+ margin-left: 0;
+
+ &:not(:last-child):not(.dropdown-toggle) {
+ @include border-right-radius(0);
+ }
+}
+// Need .dropdown-toggle since :last-child doesn't apply given a .dropdown-menu immediately after it
+.btn-group > .btn:last-child:not(:first-child),
+.btn-group > .dropdown-toggle:not(:first-child) {
+ @include border-left-radius(0);
+}
+
+// Custom edits for including btn-groups within btn-groups (useful for including dropdown buttons within a btn-group)
+.btn-group > .btn-group {
+ float: left;
+}
+.btn-group > .btn-group:not(:first-child):not(:last-child) > .btn {
+ border-radius: 0;
+}
+.btn-group > .btn-group:first-child:not(:last-child) {
+ > .btn:last-child,
+ > .dropdown-toggle {
+ @include border-right-radius(0);
+ }
+}
+.btn-group > .btn-group:last-child:not(:first-child) > .btn:first-child {
+ @include border-left-radius(0);
+}
+
+// On active and open, don't show outline
+.btn-group .dropdown-toggle:active,
+.btn-group.open .dropdown-toggle {
+ outline: 0;
+}
+
+
+// Sizing
+//
+// Remix the default button sizing classes into new ones for easier manipulation.
+
+.btn-group-sm > .btn { @extend .btn-sm; }
+.btn-group-lg > .btn { @extend .btn-lg; }
+
+
+//
+// Split button dropdowns
+//
+
+.btn + .dropdown-toggle-split {
+ padding-right: $btn-padding-x * .75;
+ padding-left: $btn-padding-x * .75;
+
+ &::after {
+ margin-left: 0;
+ }
+}
+
+.btn-sm + .dropdown-toggle-split {
+ padding-right: $btn-padding-x-sm * .75;
+ padding-left: $btn-padding-x-sm * .75;
+}
+
+.btn-lg + .dropdown-toggle-split {
+ padding-right: $btn-padding-x-lg * .75;
+ padding-left: $btn-padding-x-lg * .75;
+}
+
+
+// The clickable button for toggling the menu
+// Remove the gradient and set the same inset shadow as the :active state
+.btn-group.open .dropdown-toggle {
+ @include box-shadow($btn-active-box-shadow);
+
+ // Show no shadow for `.btn-link` since it has no other button styles.
+ &.btn-link {
+ @include box-shadow(none);
+ }
+}
+
+
+// Reposition the caret
+.btn .caret {
+ margin-left: 0;
+}
+// Carets in other button sizes
+.btn-lg .caret {
+ border-width: $caret-width-lg $caret-width-lg 0;
+ border-bottom-width: 0;
+}
+// Upside down carets for .dropup
+.dropup .btn-lg .caret {
+ border-width: 0 $caret-width-lg $caret-width-lg;
+}
+
+
+
+//
+// Vertical button groups
+//
+
+.btn-group-vertical {
+ > .btn,
+ > .btn-group,
+ > .btn-group > .btn {
+ display: block;
+ float: none;
+ width: 100%;
+ max-width: 100%;
+ }
+
+ // Clear floats so dropdown menus can be properly placed
+ > .btn-group {
+ @include clearfix();
+
+ > .btn {
+ float: none;
+ }
+ }
+
+ > .btn + .btn,
+ > .btn + .btn-group,
+ > .btn-group + .btn,
+ > .btn-group + .btn-group {
+ margin-top: -$input-btn-border-width;
+ margin-left: 0;
+ }
+}
+
+.btn-group-vertical > .btn {
+ &:not(:first-child):not(:last-child) {
+ border-radius: 0;
+ }
+ &:first-child:not(:last-child) {
+ @include border-bottom-radius(0);
+ }
+ &:last-child:not(:first-child) {
+ @include border-top-radius(0);
+ }
+}
+.btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn {
+ border-radius: 0;
+}
+.btn-group-vertical > .btn-group:first-child:not(:last-child) {
+ > .btn:last-child,
+ > .dropdown-toggle {
+ @include border-bottom-radius(0);
+ }
+}
+.btn-group-vertical > .btn-group:last-child:not(:first-child) > .btn:first-child {
+ @include border-top-radius(0);
+}
+
+
+// Checkbox and radio options
+//
+// In order to support the browser's form validation feedback, powered by the
+// `required` attribute, we have to "hide" the inputs via `clip`. We cannot use
+// `display: none;` or `visibility: hidden;` as that also hides the popover.
+// Simply visually hiding the inputs via `opacity` would leave them clickable in
+// certain cases which is prevented by using `clip` and `pointer-events`.
+// This way, we ensure a DOM element is visible to position the popover from.
+//
+// See https://github.com/twbs/bootstrap/pull/12794 and
+// https://github.com/twbs/bootstrap/pull/14559 for more information.
+
+[data-toggle="buttons"] {
+ > .btn,
+ > .btn-group > .btn {
+ input[type="radio"],
+ input[type="checkbox"] {
+ position: absolute;
+ clip: rect(0,0,0,0);
+ pointer-events: none;
+ }
+ }
+}
--- /dev/null
+// scss-lint:disable QualifyingElement
+
+//
+// Base styles
+//
+
+.btn {
+ display: inline-block;
+ font-weight: $btn-font-weight;
+ line-height: $btn-line-height;
+ text-align: center;
+ white-space: nowrap;
+ vertical-align: middle;
+ cursor: pointer;
+ user-select: none;
+ border: $input-btn-border-width solid transparent;
+ @include button-size($btn-padding-y, $btn-padding-x, $font-size-base, $btn-border-radius);
+ @include transition(all .2s ease-in-out);
+
+ &,
+ &:active,
+ &.active {
+ &:focus,
+ &.focus {
+ @include tab-focus();
+ }
+ }
+
+ @include hover-focus {
+ text-decoration: none;
+ }
+ &.focus {
+ text-decoration: none;
+ }
+
+ &:active,
+ &.active {
+ background-image: none;
+ outline: 0;
+ @include box-shadow($btn-active-box-shadow);
+ }
+
+ &.disabled,
+ &:disabled {
+ cursor: $cursor-disabled;
+ opacity: .65;
+ @include box-shadow(none);
+ }
+}
+
+// Future-proof disabling of clicks on `<a>` elements
+a.btn.disabled,
+fieldset[disabled] a.btn {
+ pointer-events: none;
+}
+
+
+//
+// Alternate buttons
+//
+
+.btn-primary {
+ @include button-variant($btn-primary-color, $btn-primary-bg, $btn-primary-border);
+}
+.btn-secondary {
+ @include button-variant($btn-secondary-color, $btn-secondary-bg, $btn-secondary-border);
+}
+.btn-info {
+ @include button-variant($btn-info-color, $btn-info-bg, $btn-info-border);
+}
+.btn-success {
+ @include button-variant($btn-success-color, $btn-success-bg, $btn-success-border);
+}
+.btn-warning {
+ @include button-variant($btn-warning-color, $btn-warning-bg, $btn-warning-border);
+}
+.btn-danger {
+ @include button-variant($btn-danger-color, $btn-danger-bg, $btn-danger-border);
+}
+
+// Remove all backgrounds
+.btn-outline-primary {
+ @include button-outline-variant($btn-primary-bg);
+}
+.btn-outline-secondary {
+ @include button-outline-variant($btn-secondary-border);
+}
+.btn-outline-info {
+ @include button-outline-variant($btn-info-bg);
+}
+.btn-outline-success {
+ @include button-outline-variant($btn-success-bg);
+}
+.btn-outline-warning {
+ @include button-outline-variant($btn-warning-bg);
+}
+.btn-outline-danger {
+ @include button-outline-variant($btn-danger-bg);
+}
+
+
+//
+// Link buttons
+//
+
+// Make a button look and behave like a link
+.btn-link {
+ font-weight: normal;
+ color: $link-color;
+ border-radius: 0;
+
+ &,
+ &:active,
+ &.active,
+ &:disabled {
+ background-color: transparent;
+ @include box-shadow(none);
+ }
+ &,
+ &:focus,
+ &:active {
+ border-color: transparent;
+ }
+ @include hover {
+ border-color: transparent;
+ }
+ @include hover-focus {
+ color: $link-hover-color;
+ text-decoration: $link-hover-decoration;
+ background-color: transparent;
+ }
+ &:disabled {
+ @include hover-focus {
+ color: $btn-link-disabled-color;
+ text-decoration: none;
+ }
+ }
+}
+
+
+//
+// Button Sizes
+//
+
+.btn-lg {
+ // line-height: ensure even-numbered height of button next to large input
+ @include button-size($btn-padding-y-lg, $btn-padding-x-lg, $font-size-lg, $btn-border-radius-lg);
+}
+.btn-sm {
+ // line-height: ensure proper height of button next to small input
+ @include button-size($btn-padding-y-sm, $btn-padding-x-sm, $font-size-sm, $btn-border-radius-sm);
+}
+
+
+//
+// Block button
+//
+
+.btn-block {
+ display: block;
+ width: 100%;
+}
+
+// Vertically space out multiple block buttons
+.btn-block + .btn-block {
+ margin-top: $btn-block-spacing-y;
+}
+
+// Specificity overrides
+input[type="submit"],
+input[type="reset"],
+input[type="button"] {
+ &.btn-block {
+ width: 100%;
+ }
+}
--- /dev/null
+//
+// Base styles
+//
+
+.card {
+ position: relative;
+ display: block;
+ margin-bottom: $card-spacer-y;
+ background-color: $card-bg;
+ // border: $card-border-width solid $card-border-color;
+ @include border-radius($card-border-radius);
+ border: $card-border-width solid $card-border-color;
+}
+
+.card-block {
+ @include clearfix;
+ padding: $card-spacer-x;
+}
+
+.card-title {
+ margin-bottom: $card-spacer-y;
+}
+
+.card-subtitle {
+ margin-top: -($card-spacer-y / 2);
+ margin-bottom: 0;
+}
+
+.card-text:last-child {
+ margin-bottom: 0;
+}
+
+// .card-actions {
+// padding: $card-spacer-y $card-spacer-x;
+
+// .card-link + .card-link {
+// margin-left: $card-spacer-x;
+// }
+// }
+
+.card-link {
+ @include hover {
+ text-decoration: none;
+ }
+
+ + .card-link {
+ margin-left: $card-spacer-x;
+ }
+}
+
+.card {
+ > .list-group:first-child {
+ .list-group-item:first-child {
+ @include border-top-radius($card-border-radius);
+ }
+ }
+
+ > .list-group:last-child {
+ .list-group-item:last-child {
+ @include border-bottom-radius($card-border-radius);
+ }
+ }
+}
+
+
+//
+// Optional textual caps
+//
+
+.card-header {
+ @include clearfix;
+ padding: $card-spacer-y $card-spacer-x;
+ background-color: $card-cap-bg;
+ border-bottom: $card-border-width solid $card-border-color;
+
+ &:first-child {
+ @include border-radius($card-border-radius-inner $card-border-radius-inner 0 0);
+ }
+}
+
+.card-footer {
+ @include clearfix;
+ padding: $card-spacer-y $card-spacer-x;
+ background-color: $card-cap-bg;
+ border-top: $card-border-width solid $card-border-color;
+
+ &:last-child {
+ @include border-radius(0 0 $card-border-radius-inner $card-border-radius-inner);
+ }
+}
+
+
+//
+// Header navs
+//
+
+.card-header-tabs {
+ margin-right: -($card-spacer-x / 2);
+ margin-bottom: -$card-spacer-y;
+ margin-left: -($card-spacer-x / 2);
+ border-bottom: 0;
+}
+
+.card-header-pills {
+ margin-right: -($card-spacer-x / 2);
+ margin-left: -($card-spacer-x / 2);
+}
+
+
+//
+// Background variations
+//
+
+.card-primary {
+ @include card-variant($brand-primary, $brand-primary);
+}
+.card-success {
+ @include card-variant($brand-success, $brand-success);
+}
+.card-info {
+ @include card-variant($brand-info, $brand-info);
+}
+.card-warning {
+ @include card-variant($brand-warning, $brand-warning);
+}
+.card-danger {
+ @include card-variant($brand-danger, $brand-danger);
+}
+
+// Remove all backgrounds
+.card-outline-primary {
+ @include card-outline-variant($btn-primary-bg);
+}
+.card-outline-secondary {
+ @include card-outline-variant($btn-secondary-border);
+}
+.card-outline-info {
+ @include card-outline-variant($btn-info-bg);
+}
+.card-outline-success {
+ @include card-outline-variant($btn-success-bg);
+}
+.card-outline-warning {
+ @include card-outline-variant($btn-warning-bg);
+}
+.card-outline-danger {
+ @include card-outline-variant($btn-danger-bg);
+}
+
+//
+// Inverse text within a card for use with dark backgrounds
+//
+
+.card-inverse {
+ @include card-inverse;
+}
+
+//
+// Blockquote
+//
+
+.card-blockquote {
+ padding: 0;
+ margin-bottom: 0;
+ border-left: 0;
+}
+
+// Card image
+.card-img {
+ // margin: -1.325rem;
+ @include border-radius(.25rem);
+}
+.card-img-overlay {
+ position: absolute;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ padding: $card-img-overlay-padding;
+}
+
+
+
+// Card image caps
+.card-img-top {
+ @include border-top-radius($card-border-radius-inner);
+}
+.card-img-bottom {
+ @include border-bottom-radius($card-border-radius-inner);
+}
+
+
+// Card set
+//
+// Heads up! We do some funky style resetting here for margins across our two
+// variations (one flex, one table). Individual cards have margin-bottom by
+// default, but they're ignored due to table styles. For a consistent design,
+// we've done the same to the flex variation.
+//
+// Those changes are noted by `// Margin balancing`.
+
+@if $enable-flex {
+ @include media-breakpoint-up(sm) {
+ .card-deck {
+ display: flex;
+ flex-flow: row wrap;
+ margin-right: -$card-deck-margin;
+ margin-bottom: $card-spacer-y; // Margin balancing
+ margin-left: -$card-deck-margin;
+
+ .card {
+ flex: 1 0 0;
+ margin-right: $card-deck-margin;
+ margin-bottom: 0; // Margin balancing
+ margin-left: $card-deck-margin;
+ }
+ }
+ }
+} @else {
+ @include media-breakpoint-up(sm) {
+ $space-between-cards: (2 * $card-deck-margin);
+ .card-deck {
+ display: table;
+ width: 100%;
+ margin-bottom: $card-spacer-y; // Margin balancing
+ table-layout: fixed;
+ border-spacing: $space-between-cards 0;
+
+ .card {
+ display: table-cell;
+ margin-bottom: 0; // Margin balancing
+ vertical-align: top;
+ }
+ }
+ .card-deck-wrapper {
+ margin-right: (-$space-between-cards);
+ margin-left: (-$space-between-cards);
+ }
+ }
+}
+
+//
+// Card groups
+//
+
+@include media-breakpoint-up(sm) {
+ .card-group {
+ @if $enable-flex {
+ display: flex;
+ flex-flow: row wrap;
+ } @else {
+ display: table;
+ width: 100%;
+ table-layout: fixed;
+ }
+
+ .card {
+ @if $enable-flex {
+ flex: 1 0 0;
+ } @else {
+ display: table-cell;
+ vertical-align: top;
+ }
+
+ + .card {
+ margin-left: 0;
+ border-left: 0;
+ }
+
+ // Handle rounded corners
+ @if $enable-rounded {
+ &:first-child {
+ @include border-right-radius(0);
+
+ .card-img-top {
+ border-top-right-radius: 0;
+ }
+ .card-img-bottom {
+ border-bottom-right-radius: 0;
+ }
+ }
+ &:last-child {
+ @include border-left-radius(0);
+
+ .card-img-top {
+ border-top-left-radius: 0;
+ }
+ .card-img-bottom {
+ border-bottom-left-radius: 0;
+ }
+ }
+
+ &:not(:first-child):not(:last-child) {
+ border-radius: 0;
+
+ .card-img-top,
+ .card-img-bottom {
+ border-radius: 0;
+ }
+ }
+ }
+ }
+ }
+}
+
+
+//
+// Card
+//
+
+@include media-breakpoint-up(sm) {
+ .card-columns {
+ column-count: 3;
+ column-gap: $card-columns-sm-up-column-gap;
+
+ .card {
+ display: inline-block;
+ width: 100%; // Don't let them exceed the column width
+ }
+ }
+}
--- /dev/null
+// Wrapper for the slide container and indicators
+.carousel {
+ position: relative;
+}
+
+.carousel-inner {
+ position: relative;
+ width: 100%;
+ overflow: hidden;
+
+ > .carousel-item {
+ position: relative;
+ display: none;
+ transition: .6s ease-in-out left;
+
+ // Account for jankitude on images
+ > img,
+ > a > img {
+ @extend .img-fluid;
+ line-height: 1;
+ }
+
+ // WebKit CSS3 transforms for supported devices
+ @media all and (transform-3d), (-webkit-transform-3d) {
+ transition: transform .6s ease-in-out;
+ backface-visibility: hidden;
+ perspective: 1000px;
+
+ &.next,
+ &.active.right {
+ left: 0;
+ transform: translate3d(100%, 0, 0);
+ }
+ &.prev,
+ &.active.left {
+ left: 0;
+ transform: translate3d(-100%, 0, 0);
+ }
+ &.next.left,
+ &.prev.right,
+ &.active {
+ left: 0;
+ transform: translate3d(0, 0, 0);
+ }
+ }
+ }
+
+ > .active,
+ > .next,
+ > .prev {
+ display: block;
+ }
+
+ > .active {
+ left: 0;
+ }
+
+ > .next,
+ > .prev {
+ position: absolute;
+ top: 0;
+ width: 100%;
+ }
+
+ > .next {
+ left: 100%;
+ }
+ > .prev {
+ left: -100%;
+ }
+ > .next.left,
+ > .prev.right {
+ left: 0;
+ }
+
+ > .active.left {
+ left: -100%;
+ }
+ > .active.right {
+ left: 100%;
+ }
+}
+
+
+//
+// Left/right controls for nav
+//
+
+.carousel-control {
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ width: $carousel-control-width;
+ font-size: $carousel-control-font-size;
+ color: $carousel-control-color;
+ text-align: center;
+ text-shadow: $carousel-text-shadow;
+ opacity: $carousel-control-opacity;
+ // We can't have this transition here because WebKit cancels the carousel
+ // animation if you trip this while in the middle of another animation.
+
+ // Set gradients for backgrounds
+ &.left {
+ @include gradient-x($start-color: rgba(0,0,0,.5), $end-color: rgba(0,0,0,.0001));
+ }
+ &.right {
+ right: 0;
+ left: auto;
+ @include gradient-x($start-color: rgba(0,0,0,.0001), $end-color: rgba(0,0,0,.5));
+ }
+
+ // Hover/focus state
+ @include hover-focus {
+ color: $carousel-control-color;
+ text-decoration: none;
+ outline: 0;
+ opacity: .9;
+ }
+
+ // Toggles
+ .icon-prev,
+ .icon-next {
+ position: absolute;
+ top: 50%;
+ z-index: 5;
+ display: inline-block;
+ width: $carousel-icon-width;
+ height: $carousel-icon-width;
+ margin-top: -($carousel-icon-width / 2);
+ font-family: serif;
+ line-height: 1;
+ }
+ .icon-prev {
+ left: 50%;
+ margin-left: -($carousel-icon-width / 2);
+ }
+ .icon-next {
+ right: 50%;
+ margin-right: -($carousel-icon-width / 2);
+ }
+
+ .icon-prev {
+ &::before {
+ content: "\2039";// SINGLE LEFT-POINTING ANGLE QUOTATION MARK (U+2039)
+ }
+ }
+ .icon-next {
+ &::before {
+ content: "\203a";// SINGLE RIGHT-POINTING ANGLE QUOTATION MARK (U+203A)
+ }
+ }
+}
+
+
+// Optional indicator pips
+//
+// Add an unordered list with the following class and add a list item for each
+// slide your carousel holds.
+
+.carousel-indicators {
+ position: absolute;
+ bottom: 10px;
+ left: 50%;
+ z-index: 15;
+ width: $carousel-indicators-width;
+ padding-left: 0;
+ margin-left: -($carousel-indicators-width / 2);
+ text-align: center;
+ list-style: none;
+
+ li {
+ display: inline-block;
+ width: $carousel-indicator-size;
+ height: $carousel-indicator-size;
+ margin: 1px;
+ text-indent: -999px;
+ cursor: pointer;
+ // IE9 hack for event handling
+ //
+ // Internet Explorer 9 does not properly handle clicks on elements with a `background-color` of `transparent`,
+ // so we use `rgba(0,0,0,0)` instead since it's a non-buggy equivalent.
+ // See https://developer.mozilla.org/en-US/docs/Web/Events/click#Internet_Explorer
+ background-color: rgba(0,0,0,0); // IE9
+ border: 1px solid $carousel-indicator-border-color;
+ border-radius: $carousel-indicator-size;
+ }
+
+ .active {
+ width: $carousel-indicator-active-size;
+ height: $carousel-indicator-active-size;
+ margin: 0;
+ background-color: $carousel-indicator-active-bg;
+ }
+}
+
+
+// Optional captions
+//
+// Hidden by default for smaller viewports.
+
+.carousel-caption {
+ position: absolute;
+ right: ((100% - $carousel-caption-width) / 2);
+ bottom: 20px;
+ left: ((100% - $carousel-caption-width) / 2);
+ z-index: 10;
+ padding-top: 20px;
+ padding-bottom: 20px;
+ color: $carousel-caption-color;
+ text-align: center;
+ text-shadow: $carousel-text-shadow;
+
+ .btn {
+ text-shadow: none; // No shadow for button elements in carousel-caption
+ }
+}
+
+
+//
+// Responsive variations
+//
+
+@include media-breakpoint-up(sm) {
+ // Scale up the controls a smidge
+ .carousel-control {
+ .icon-prev,
+ .icon-next {
+ width: $carousel-control-sm-up-size;
+ height: $carousel-control-sm-up-size;
+ margin-top: -($carousel-control-sm-up-size / 2);
+ font-size: $carousel-control-sm-up-size;
+ }
+ .icon-prev {
+ margin-left: -($carousel-control-sm-up-size / 2);
+ }
+ .icon-next {
+ margin-right: -($carousel-control-sm-up-size / 2);
+ }
+ }
+
+ // Show and left align the captions
+ .carousel-caption {
+ right: ((100% - $carousel-caption-sm-up-width) / 2);
+ left: ((100% - $carousel-caption-sm-up-width) / 2);
+ padding-bottom: 30px;
+ }
+
+ // Move up the indicators
+ .carousel-indicators {
+ bottom: 20px;
+ }
+}
--- /dev/null
+.close {
+ float: right;
+ font-size: ($font-size-base * 1.5);
+ font-weight: $close-font-weight;
+ line-height: 1;
+ color: $close-color;
+ text-shadow: $close-text-shadow;
+ opacity: .2;
+
+ @include hover-focus {
+ color: $close-color;
+ text-decoration: none;
+ cursor: pointer;
+ opacity: .5;
+ }
+}
+
+// Additional properties for button version
+// iOS requires the button element instead of an anchor tag.
+// If you want the anchor version, it requires `href="#"`.
+// See https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile
+
+// scss-lint:disable QualifyingElement
+button.close {
+ padding: 0;
+ cursor: pointer;
+ background: transparent;
+ border: 0;
+ -webkit-appearance: none;
+}
+// scss-lint:enable QualifyingElement
--- /dev/null
+// Inline and block code styles
+code,
+kbd,
+pre,
+samp {
+ font-family: $font-family-monospace;
+}
+
+// Inline code
+code {
+ padding: $code-padding-y $code-padding-x;
+ font-size: $code-font-size;
+ color: $code-color;
+ background-color: $code-bg;
+ @include border-radius($border-radius);
+}
+
+// User input typically entered via keyboard
+kbd {
+ padding: $code-padding-y $code-padding-x;
+ font-size: $code-font-size;
+ color: $kbd-color;
+ background-color: $kbd-bg;
+ @include border-radius($border-radius-sm);
+ @include box-shadow($kbd-box-shadow);
+
+ kbd {
+ padding: 0;
+ font-size: 100%;
+ font-weight: $nested-kbd-font-weight;
+ @include box-shadow(none);
+ }
+}
+
+// Blocks of code
+pre {
+ display: block;
+ margin-top: 0;
+ margin-bottom: 1rem;
+ font-size: $code-font-size;
+ color: $pre-color;
+
+ // Account for some code outputs that place code tags in pre tags
+ code {
+ padding: 0;
+ font-size: inherit;
+ color: inherit;
+ background-color: transparent;
+ border-radius: 0;
+ }
+}
+
+// Enable scrollable blocks of code
+.pre-scrollable {
+ max-height: $pre-scrollable-max-height;
+ overflow-y: scroll;
+}
--- /dev/null
+// scss-lint:disable PropertyCount
+
+// Embedded icons from Open Iconic.
+// Released under MIT and copyright 2014 Waybury.
+// http://useiconic.com/open
+
+
+// Checkboxes and radios
+//
+// Base class takes care of all the key behavioral aspects.
+
+.custom-control {
+ position: relative;
+ display: inline;
+ padding-left: $custom-control-gutter;
+ cursor: pointer;
+
+ + .custom-control {
+ margin-left: $custom-control-spacer-x;
+ }
+}
+
+.custom-control-input {
+ position: absolute;
+ z-index: -1; // Put the input behind the label so it doesn't overlay text
+ opacity: 0;
+
+ &:checked ~ .custom-control-indicator {
+ color: $custom-control-checked-indicator-color;
+ background-color: $custom-control-checked-indicator-bg;
+ @include box-shadow($custom-control-checked-indicator-box-shadow);
+ }
+
+ &:focus ~ .custom-control-indicator {
+ // the mixin is not used here to make sure there is feedback
+ box-shadow: $custom-control-focus-indicator-box-shadow;
+ }
+
+ &:active ~ .custom-control-indicator {
+ color: $custom-control-active-indicator-color;
+ background-color: $custom-control-active-indicator-bg;
+ @include box-shadow($custom-control-active-indicator-box-shadow);
+ }
+
+ &:disabled {
+ ~ .custom-control-indicator {
+ cursor: $custom-control-disabled-cursor;
+ background-color: $custom-control-disabled-indicator-bg;
+ }
+
+ ~ .custom-control-description {
+ color: $custom-control-disabled-description-color;
+ cursor: $custom-control-disabled-cursor;
+ }
+ }
+}
+
+// Custom indicator
+//
+// Generates a shadow element to create our makeshift checkbox/radio background.
+
+.custom-control-indicator {
+ position: absolute;
+ top: .0625rem;
+ left: 0;
+ display: block;
+ width: $custom-control-indicator-size;
+ height: $custom-control-indicator-size;
+ pointer-events: none;
+ user-select: none;
+ background-color: $custom-control-indicator-bg;
+ background-repeat: no-repeat;
+ background-position: center center;
+ background-size: $custom-control-indicator-bg-size;
+ @include box-shadow($custom-control-indicator-box-shadow);
+}
+
+// Checkboxes
+//
+// Tweak just a few things for checkboxes.
+
+.custom-checkbox {
+ .custom-control-indicator {
+ @include border-radius($custom-checkbox-radius);
+ }
+
+ .custom-control-input:checked ~ .custom-control-indicator {
+ background-image: $custom-checkbox-checked-icon;
+ }
+
+ .custom-control-input:indeterminate ~ .custom-control-indicator {
+ background-color: $custom-checkbox-indeterminate-bg;
+ background-image: $custom-checkbox-indeterminate-icon;
+ @include box-shadow($custom-checkbox-indeterminate-box-shadow);
+ }
+}
+
+// Radios
+//
+// Tweak just a few things for radios.
+
+.custom-radio {
+ .custom-control-indicator {
+ border-radius: $custom-radio-radius;
+ }
+
+ .custom-control-input:checked ~ .custom-control-indicator {
+ background-image: $custom-radio-checked-icon;
+ }
+}
+
+
+// Layout options
+//
+// By default radios and checkboxes are `inline-block` with no additional spacing
+// set. Use these optional classes to tweak the layout.
+
+.custom-controls-stacked {
+ .custom-control {
+ display: inline;
+
+ &::after {
+ display: block;
+ margin-bottom: $custom-control-spacer-y;
+ content: "";
+ }
+
+ + .custom-control {
+ margin-left: 0;
+ }
+ }
+}
+
+
+// Select
+//
+// Replaces the browser default select with a custom one, mostly pulled from
+// http://primercss.io.
+//
+// Includes IE9-specific hacks (noted by ` \9`).
+
+.custom-select {
+ display: inline-block;
+ max-width: 100%;
+ padding: $custom-select-padding-y ($custom-select-padding-x + $custom-select-indicator-padding) $custom-select-padding-y $custom-select-padding-x;
+ padding-right: $custom-select-padding-x \9;
+ color: $custom-select-color;
+ vertical-align: middle;
+ background: $custom-select-bg $custom-select-indicator no-repeat right $custom-select-padding-x center;
+ background-image: none \9;
+ background-size: $custom-select-bg-size;
+ border: $custom-select-border-width solid $custom-select-border-color;
+ @include border-radius($custom-select-border-radius);
+ // Use vendor prefixes as `appearance` isn't part of the CSS spec.
+ -moz-appearance: none;
+ -webkit-appearance: none;
+
+ &:focus {
+ border-color: $custom-select-focus-border-color;
+ outline: none;
+ @include box-shadow($custom-select-focus-box-shadow);
+
+ &::-ms-value {
+ // For visual consistency with other platforms/browsers,
+ // supress the default white text on blue background highlight given to
+ // the selected option text when the (still closed) <select> receives focus
+ // in IE and (under certain conditions) Edge.
+ // See https://github.com/twbs/bootstrap/issues/19398.
+ color: $input-color;
+ background-color: $input-bg;
+ }
+ }
+
+ &:disabled {
+ color: $custom-select-disabled-color;
+ cursor: $cursor-disabled;
+ background-color: $custom-select-disabled-bg;
+ }
+
+ // Hides the default caret in IE11
+ &::-ms-expand {
+ opacity: 0;
+ }
+}
+
+.custom-select-sm {
+ padding-top: $custom-select-padding-y;
+ padding-bottom: $custom-select-padding-y;
+ font-size: $custom-select-sm-font-size;
+
+ // &:not([multiple]) {
+ // height: 26px;
+ // min-height: 26px;
+ // }
+}
+
+
+// File
+//
+// Custom file input.
+
+.custom-file {
+ position: relative;
+ display: inline-block;
+ max-width: 100%;
+ height: $custom-file-height;
+ cursor: pointer;
+}
+
+.custom-file-input {
+ min-width: $custom-file-width;
+ max-width: 100%;
+ margin: 0;
+ filter: alpha(opacity = 0);
+ opacity: 0;
+
+ &:focus ~ .custom-file-control {
+ @include box-shadow($custom-file-focus-box-shadow);
+ }
+}
+
+.custom-file-control {
+ position: absolute;
+ top: 0;
+ right: 0;
+ left: 0;
+ z-index: 5;
+ height: $custom-file-height;
+ padding: $custom-file-padding-x $custom-file-padding-y;
+ line-height: $custom-file-line-height;
+ color: $custom-file-color;
+ user-select: none;
+ background-color: $custom-file-bg;
+ border: $custom-file-border-width solid $custom-file-border-color;
+ @include border-radius($custom-file-border-radius);
+ @include box-shadow($custom-file-box-shadow);
+
+ @each $lang, $text in map-get($custom-file-text, placeholder) {
+ &:lang(#{$lang})::after {
+ content: $text;
+ }
+ }
+
+ &::before {
+ position: absolute;
+ top: -$custom-file-border-width;
+ right: -$custom-file-border-width;
+ bottom: -$custom-file-border-width;
+ z-index: 6;
+ display: block;
+ height: $custom-file-height;
+ padding: $custom-file-padding-x $custom-file-padding-y;
+ line-height: $custom-file-line-height;
+ color: $custom-file-button-color;
+ background-color: $custom-file-button-bg;
+ border: $custom-file-border-width solid $custom-file-border-color;
+ @include border-radius(0 $custom-file-border-radius $custom-file-border-radius 0);
+ }
+
+ @each $lang, $text in map-get($custom-file-text, button-label) {
+ &:lang(#{$lang})::before {
+ content: $text;
+ }
+ }
+}
--- /dev/null
+// Bootstrap overrides
+//
+// Copy variables from `_variables.scss` to this file to override default values
+// without modifying source files.
--- /dev/null
+// The dropdown wrapper (`<div>`)
+.dropup,
+.dropdown {
+ position: relative;
+}
+
+.dropdown-toggle {
+ // Generate the caret automatically
+ &::after {
+ display: inline-block;
+ width: 0;
+ height: 0;
+ margin-left: $caret-width;
+ vertical-align: middle;
+ content: "";
+ border-top: $caret-width solid;
+ border-right: $caret-width solid transparent;
+ border-left: $caret-width solid transparent;
+ }
+
+ // Prevent the focus on the dropdown toggle when closing dropdowns
+ &:focus {
+ outline: 0;
+ }
+}
+
+.dropup {
+ .dropdown-toggle {
+ &::after {
+ border-top: 0;
+ border-bottom: $caret-width solid;
+ }
+ }
+}
+
+// The dropdown menu
+.dropdown-menu {
+ position: absolute;
+ top: 100%;
+ left: 0;
+ z-index: $zindex-dropdown;
+ display: none; // none by default, but block on "open" of the menu
+ float: left;
+ min-width: $dropdown-min-width;
+ padding: $dropdown-padding-y 0;
+ margin: $dropdown-margin-top 0 0; // override default ul
+ font-size: $font-size-base;
+ color: $body-color;
+ text-align: left; // Ensures proper alignment if parent has it changed (e.g., modal footer)
+ list-style: none;
+ background-color: $dropdown-bg;
+ background-clip: padding-box;
+ border: $dropdown-border-width solid $dropdown-border-color;
+ @include border-radius($border-radius);
+ @include box-shadow($dropdown-box-shadow);
+}
+
+// Dividers (basically an `<hr>`) within the dropdown
+.dropdown-divider {
+ @include nav-divider($dropdown-divider-bg);
+}
+
+// Links, buttons, and more within the dropdown menu
+//
+// `<button>`-specific styles are denoted with `// For <button>s`
+.dropdown-item {
+ display: block;
+ width: 100%; // For `<button>`s
+ padding: 3px $dropdown-item-padding-x;
+ clear: both;
+ font-weight: normal;
+ color: $dropdown-link-color;
+ text-align: inherit; // For `<button>`s
+ white-space: nowrap; // prevent links from randomly breaking onto new lines
+ background: none; // For `<button>`s
+ border: 0; // For `<button>`s
+
+ @include hover-focus {
+ color: $dropdown-link-hover-color;
+ text-decoration: none;
+ background-color: $dropdown-link-hover-bg;
+ }
+
+ // Active state
+ &.active {
+ @include plain-hover-focus {
+ color: $dropdown-link-active-color;
+ text-decoration: none;
+ background-color: $dropdown-link-active-bg;
+ outline: 0;
+ }
+ }
+
+ // Disabled state
+ //
+ // Gray out text and ensure the hover/focus state remains gray
+ &.disabled {
+ @include plain-hover-focus {
+ color: $dropdown-link-disabled-color;
+ }
+
+ // Nuke hover/focus effects
+ @include hover-focus {
+ text-decoration: none;
+ cursor: $cursor-disabled;
+ background-color: transparent;
+ background-image: none; // Remove CSS gradient
+ @include reset-filter();
+ }
+ }
+}
+
+// Open state for the dropdown
+.open {
+ // Show the menu
+ > .dropdown-menu {
+ display: block;
+ }
+
+ // Remove the outline when :focus is triggered
+ > a {
+ outline: 0;
+ }
+}
+
+// Menu positioning
+//
+// Add extra class to `.dropdown-menu` to flip the alignment of the dropdown
+// menu with the parent.
+.dropdown-menu-right {
+ right: 0;
+ left: auto; // Reset the default from `.dropdown-menu`
+}
+
+.dropdown-menu-left {
+ right: auto;
+ left: 0;
+}
+
+// Dropdown section headers
+.dropdown-header {
+ display: block;
+ padding: $dropdown-padding-y $dropdown-item-padding-x;
+ font-size: $font-size-sm;
+ color: $dropdown-header-color;
+ white-space: nowrap; // as with > li > a
+}
+
+// Backdrop to catch body clicks on mobile, etc.
+.dropdown-backdrop {
+ position: fixed;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ z-index: $zindex-dropdown-backdrop;
+}
+
+// Allow for dropdowns to go bottom up (aka, dropup-menu)
+//
+// Just add .dropup after the standard .dropdown class and you're set.
+// TODO: abstract this so that the navbar fixed styles are not placed here?
+
+.dropup,
+.navbar-fixed-bottom .dropdown {
+ // Reverse the caret
+ .caret {
+ content: "";
+ border-top: 0;
+ border-bottom: $caret-width solid;
+ }
+
+ // Different positioning for bottom up menu
+ .dropdown-menu {
+ top: auto;
+ bottom: 100%;
+ margin-bottom: $dropdown-margin-top;
+ }
+}
--- /dev/null
+// scss-lint:disable QualifyingElement
+
+//
+// Textual form controls
+//
+
+.form-control {
+ display: block;
+ width: 100%;
+ // // Make inputs at least the height of their button counterpart (base line-height + padding + border)
+ // height: $input-height;
+ padding: $input-padding-y $input-padding-x;
+ font-size: $font-size-base;
+ line-height: $input-line-height;
+ color: $input-color;
+ background-color: $input-bg;
+ // Reset unusual Firefox-on-Android default style; see https://github.com/necolas/normalize.css/issues/214.
+ background-image: none;
+ background-clip: padding-box;
+ border: $input-btn-border-width solid $input-border-color;
+ // Note: This has no effect on <select>s in some browsers, due to the limited stylability of `<select>`s in CSS.
+ @include border-radius($input-border-radius);
+ @include box-shadow($input-box-shadow);
+ @include transition(border-color ease-in-out .15s, box-shadow ease-in-out .15s);
+
+ // Unstyle the caret on `<select>`s in IE10+.
+ &::-ms-expand {
+ background-color: transparent;
+ border: 0;
+ }
+
+ // Customize the `:focus` state to imitate native WebKit styles.
+ @include form-control-focus();
+
+ // Placeholder
+ &::placeholder {
+ color: $input-color-placeholder;
+ // Override Firefox's unusual default opacity; see https://github.com/twbs/bootstrap/pull/11526.
+ opacity: 1;
+ }
+
+ // Disabled and read-only inputs
+ //
+ // HTML5 says that controls under a fieldset > legend:first-child won't be
+ // disabled if the fieldset is disabled. Due to implementation difficulty, we
+ // don't honor that edge case; we style them as disabled anyway.
+ &:disabled,
+ &[readonly] {
+ background-color: $input-bg-disabled;
+ // iOS fix for unreadable disabled content; see https://github.com/twbs/bootstrap/issues/11655.
+ opacity: 1;
+ }
+
+ &:disabled {
+ cursor: $cursor-disabled;
+ }
+}
+
+select.form-control {
+ &:not([size]):not([multiple]) {
+ height: $input-height;
+ }
+
+ &:focus::-ms-value {
+ // Suppress the nested default white text on blue background highlight given to
+ // the selected option text when the (still closed) <select> receives focus
+ // in IE and (under certain conditions) Edge, as it looks bad and cannot be made to
+ // match the appearance of the native widget.
+ // See https://github.com/twbs/bootstrap/issues/19398.
+ color: $input-color;
+ background-color: $input-bg;
+ }
+}
+
+// Make file inputs better match text inputs by forcing them to new lines.
+.form-control-file,
+.form-control-range {
+ display: block;
+}
+
+
+//
+// Labels
+//
+
+// For use with horizontal and inline forms, when you need the label text to
+// align with the form controls.
+.col-form-label {
+ padding-top: $input-padding-y;
+ padding-bottom: $input-padding-y;
+ margin-bottom: 0; // Override the `<label>` default
+}
+
+.col-form-label-lg {
+ padding-top: $input-padding-y-lg;
+ padding-bottom: $input-padding-y-lg;
+ font-size: $font-size-lg;
+}
+
+.col-form-label-sm {
+ padding-top: $input-padding-y-sm;
+ padding-bottom: $input-padding-y-sm;
+ font-size: $font-size-sm;
+}
+
+
+//
+// Legends
+//
+
+// For use with horizontal and inline forms, when you need the legend text to
+// be the same size as regular labels, and to align with the form controls.
+.col-form-legend {
+ padding-top: $input-padding-y;
+ padding-bottom: $input-padding-y;
+ margin-bottom: 0;
+ font-size: $font-size-base;
+}
+
+
+// Static form control text
+//
+// Apply class to an element to make any string of text align with labels in a
+// horizontal form layout.
+
+.form-control-static {
+ min-height: $input-height;
+ // Size it appropriately next to real form controls
+ padding-top: $input-padding-y;
+ padding-bottom: $input-padding-y;
+ // Remove default margin from `p`
+ margin-bottom: 0;
+
+ &.form-control-sm,
+ &.form-control-lg {
+ padding-right: 0;
+ padding-left: 0;
+ }
+}
+
+
+// Form control sizing
+//
+// Build on `.form-control` with modifier classes to decrease or increase the
+// height and font-size of form controls.
+//
+// The `.form-group-* form-control` variations are sadly duplicated to avoid the
+// issue documented in https://github.com/twbs/bootstrap/issues/15074.
+
+.form-control-sm {
+ padding: $input-padding-y-sm $input-padding-x-sm;
+ font-size: $font-size-sm;
+ @include border-radius($input-border-radius-sm);
+}
+
+select.form-control-sm {
+ &:not([size]):not([multiple]) {
+ height: $input-height-sm;
+ }
+}
+
+.form-control-lg {
+ padding: $input-padding-y-lg $input-padding-x-lg;
+ font-size: $font-size-lg;
+ @include border-radius($input-border-radius-lg);
+}
+
+select.form-control-lg {
+ &:not([size]):not([multiple]) {
+ height: $input-height-lg;
+ }
+}
+
+
+// Form groups
+//
+// Designed to help with the organization and spacing of vertical forms. For
+// horizontal forms, use the predefined grid classes.
+
+.form-group {
+ margin-bottom: $form-group-margin-bottom;
+}
+
+.form-text {
+ display: block;
+ margin-top: ($spacer * .25);
+}
+
+
+// Checkboxes and radios
+//
+// Indent the labels to position radios/checkboxes as hanging controls.
+
+.form-check {
+ position: relative;
+ display: block;
+ margin-bottom: ($spacer * .75);
+
+ // Move up sibling radios or checkboxes for tighter spacing
+ + .form-check {
+ margin-top: -.25rem;
+ }
+
+ &.disabled {
+ .form-check-label {
+ color: $text-muted;
+ cursor: $cursor-disabled;
+ }
+ }
+}
+
+.form-check-label {
+ padding-left: 1.25rem;
+ margin-bottom: 0; // Override default `<label>` bottom margin
+ cursor: pointer;
+}
+
+.form-check-input {
+ position: absolute;
+ margin-top: .25rem;
+ margin-left: -1.25rem;
+
+ &:only-child {
+ position: static;
+ }
+}
+
+// Radios and checkboxes on same line
+.form-check-inline {
+ position: relative;
+ display: inline-block;
+ padding-left: 1.25rem;
+ margin-bottom: 0; // Override default `<label>` bottom margin
+ vertical-align: middle;
+ cursor: pointer;
+
+ + .form-check-inline {
+ margin-left: .75rem;
+ }
+
+ &.disabled {
+ cursor: $cursor-disabled;
+ }
+}
+
+
+// Form control feedback states
+//
+// Apply contextual and semantic states to individual form controls.
+
+.form-control-feedback {
+ margin-top: ($spacer * .25);
+}
+
+.form-control-success,
+.form-control-warning,
+.form-control-danger {
+ padding-right: ($input-padding-x * 3);
+ background-repeat: no-repeat;
+ background-position: center right ($input-height / 4);
+ background-size: ($input-height / 2) ($input-height / 2);
+}
+
+// Form validation states
+.has-success {
+ @include form-control-validation($brand-success);
+
+ .form-control-success {
+ background-image: $form-icon-success;
+ }
+}
+
+.has-warning {
+ @include form-control-validation($brand-warning);
+
+ .form-control-warning {
+ background-image: $form-icon-warning;
+ }
+}
+
+.has-danger {
+ @include form-control-validation($brand-danger);
+
+ .form-control-danger {
+ background-image: $form-icon-danger;
+ }
+}
+
+
+// Inline forms
+//
+// Make forms appear inline(-block) by adding the `.form-inline` class. Inline
+// forms begin stacked on extra small (mobile) devices and then go inline when
+// viewports reach <768px.
+//
+// Requires wrapping inputs and labels with `.form-group` for proper display of
+// default HTML form controls and our custom form controls (e.g., input groups).
+
+.form-inline {
+
+ // Kick in the inline
+ @include media-breakpoint-up(sm) {
+ // Inline-block all the things for "inline"
+ .form-group {
+ display: inline-block;
+ margin-bottom: 0;
+ vertical-align: middle;
+ }
+
+ // Allow folks to *not* use `.form-group`
+ .form-control {
+ display: inline-block;
+ width: auto; // Prevent labels from stacking above inputs in `.form-group`
+ vertical-align: middle;
+ }
+
+ // Make static controls behave like regular ones
+ .form-control-static {
+ display: inline-block;
+ }
+
+ .input-group {
+ display: inline-table;
+ vertical-align: middle;
+
+ .input-group-addon,
+ .input-group-btn,
+ .form-control {
+ width: auto;
+ }
+ }
+
+ // Input groups need that 100% width though
+ .input-group > .form-control {
+ width: 100%;
+ }
+
+ .form-control-label {
+ margin-bottom: 0;
+ vertical-align: middle;
+ }
+
+ // Remove default margin on radios/checkboxes that were used for stacking, and
+ // then undo the floating of radios and checkboxes to match.
+ .form-check {
+ display: inline-block;
+ margin-top: 0;
+ margin-bottom: 0;
+ vertical-align: middle;
+ }
+ .form-check-label {
+ padding-left: 0;
+ }
+ .form-check-input {
+ position: relative;
+ margin-left: 0;
+ }
+
+ // Re-override the feedback icon.
+ .has-feedback .form-control-feedback {
+ top: 0;
+ }
+ }
+}
--- /dev/null
+// Container widths
+//
+// Set the container width, and override it for fixed navbars in media queries.
+
+@if $enable-grid-classes {
+ .container {
+ @include make-container();
+ @include make-container-max-widths();
+ }
+}
+
+// Fluid container
+//
+// Utilizes the mixin meant for fixed width containers, but without any defined
+// width for fluid, full width layouts.
+
+@if $enable-grid-classes {
+ .container-fluid {
+ @include make-container();
+ }
+}
+
+// Row
+//
+// Rows contain and clear the floats of your columns.
+
+@if $enable-grid-classes {
+ .row {
+ @include make-row();
+ }
+}
+
+// Columns
+//
+// Common styles for small and large grid columns
+
+@if $enable-grid-classes {
+ @include make-grid-columns();
+}
--- /dev/null
+// Responsive images (ensure images don't scale beyond their parents)
+//
+// This is purposefully opt-in via an explicit class rather than being the default for all `<img>`s.
+// We previously tried the "images are responsive by default" approach in Bootstrap v2,
+// and abandoned it in Bootstrap v3 because it breaks lots of third-party widgets (including Google Maps)
+// which weren't expecting the images within themselves to be involuntarily resized.
+// See also https://github.com/twbs/bootstrap/issues/18178
+.img-fluid {
+ @include img-fluid();
+}
+
+// Rounded corners
+.img-rounded {
+ @include border-radius($border-radius-lg);
+}
+
+// Image thumbnails
+.img-thumbnail {
+ padding: $thumbnail-padding;
+ background-color: $thumbnail-bg;
+ border: $thumbnail-border-width solid $thumbnail-border-color;
+ @include border-radius($thumbnail-border-radius);
+ transition: all .2s ease-in-out;
+ @include box-shadow($thumbnail-box-shadow);
+
+ // Keep them at most 100% wide
+ @include img-fluid(inline-block);
+}
+
+// Perfect circle
+.img-circle {
+ border-radius: 50%;
+}
+
+//
+// Figures
+//
+
+.figure {
+ // Ensures the caption's text aligns with the image.
+ display: inline-block;
+}
+
+.figure-img {
+ margin-bottom: ($spacer-y / 2);
+ line-height: 1;
+}
+
+.figure-caption {
+ font-size: $figure-caption-font-size;
+ color: $gray-light;
+}
--- /dev/null
+//
+// Base styles
+//
+
+.input-group {
+ position: relative;
+ width: 100%;
+
+ @if $enable-flex {
+ display: flex;
+ } @else {
+ display: table;
+ // Prevent input groups from inheriting border styles from table cells when
+ // placed within a table.
+ border-collapse: separate;
+ }
+
+ .form-control {
+ // Ensure that the input is always above the *appended* addon button for
+ // proper border colors.
+ position: relative;
+ z-index: 2;
+ // Bring the "active" form control to the front
+ @include hover-focus-active {
+ z-index: 3;
+ }
+ @if $enable-flex {
+ flex: 1;
+ } @else {
+ // IE9 fubars the placeholder attribute in text inputs and the arrows on
+ // select elements in input groups. To fix it, we float the input. Details:
+ // https://github.com/twbs/bootstrap/issues/11561#issuecomment-28936855
+ float: left;
+ width: 100%;
+ }
+ margin-bottom: 0;
+ }
+}
+
+.input-group-addon,
+.input-group-btn,
+.input-group .form-control {
+ @if not $enable-flex {
+ display: table-cell;
+ }
+
+ &:not(:first-child):not(:last-child) {
+ @include border-radius(0);
+ }
+}
+
+.input-group-addon,
+.input-group-btn {
+ @if not $enable-flex {
+ width: 1%;
+ }
+ white-space: nowrap;
+ vertical-align: middle; // Match the inputs
+}
+
+
+// Sizing options
+//
+// Remix the default form control sizing classes into new ones for easier
+// manipulation.
+
+.input-group-lg > .form-control,
+.input-group-lg > .input-group-addon,
+.input-group-lg > .input-group-btn > .btn {
+ @extend .form-control-lg;
+}
+.input-group-sm > .form-control,
+.input-group-sm > .input-group-addon,
+.input-group-sm > .input-group-btn > .btn {
+ @extend .form-control-sm;
+}
+
+
+//
+// Text input groups
+//
+
+.input-group-addon {
+ padding: $input-padding-y $input-padding-x;
+ margin-bottom: 0; // Allow use of <label> elements by overriding our default margin-bottom
+ font-size: $font-size-base;
+ font-weight: normal;
+ line-height: $input-line-height;
+ color: $input-color;
+ text-align: center;
+ background-color: $input-group-addon-bg;
+ border: $input-btn-border-width solid $input-group-addon-border-color;
+ @include border-radius($border-radius);
+
+ // Sizing
+ &.form-control-sm {
+ padding: $input-padding-y-sm $input-padding-x-sm;
+ font-size: $font-size-sm;
+ @include border-radius($border-radius-sm);
+ }
+ &.form-control-lg {
+ padding: $input-padding-y-lg $input-padding-x-lg;
+ font-size: $font-size-lg;
+ @include border-radius($border-radius-lg);
+ }
+
+ // scss-lint:disable QualifyingElement
+ // Nuke default margins from checkboxes and radios to vertically center within.
+ input[type="radio"],
+ input[type="checkbox"] {
+ margin-top: 0;
+ }
+ // scss-lint:enable QualifyingElement
+}
+
+
+//
+// Reset rounded corners
+//
+
+.input-group .form-control:not(:last-child),
+.input-group-addon:not(:last-child),
+.input-group-btn:not(:last-child) > .btn,
+.input-group-btn:not(:last-child) > .btn-group > .btn,
+.input-group-btn:not(:last-child) > .dropdown-toggle,
+.input-group-btn:not(:first-child) > .btn:not(:last-child):not(.dropdown-toggle),
+.input-group-btn:not(:first-child) > .btn-group:not(:last-child) > .btn {
+ @include border-right-radius(0);
+}
+.input-group-addon:not(:last-child) {
+ border-right: 0;
+}
+.input-group .form-control:not(:first-child),
+.input-group-addon:not(:first-child),
+.input-group-btn:not(:first-child) > .btn,
+.input-group-btn:not(:first-child) > .btn-group > .btn,
+.input-group-btn:not(:first-child) > .dropdown-toggle,
+.input-group-btn:not(:last-child) > .btn:not(:first-child),
+.input-group-btn:not(:last-child) > .btn-group:not(:first-child) > .btn {
+ @include border-left-radius(0);
+}
+.form-control + .input-group-addon:not(:first-child) {
+ border-left: 0;
+}
+
+//
+// Button input groups
+//
+
+.input-group-btn {
+ position: relative;
+ // Jankily prevent input button groups from wrapping with `white-space` and
+ // `font-size` in combination with `inline-block` on buttons.
+ font-size: 0;
+ white-space: nowrap;
+
+ // Negative margin for spacing, position for bringing hovered/focused/actived
+ // element above the siblings.
+ > .btn {
+ position: relative;
+ + .btn {
+ margin-left: (-$input-btn-border-width);
+ }
+ // Bring the "active" button to the front
+ @include hover-focus-active {
+ z-index: 3;
+ }
+ }
+
+ // Negative margin to only have a single, shared border between the two
+ &:not(:last-child) {
+ > .btn,
+ > .btn-group {
+ margin-right: (-$input-btn-border-width);
+ }
+ }
+ &:not(:first-child) {
+ > .btn,
+ > .btn-group {
+ z-index: 2;
+ margin-left: (-$input-btn-border-width);
+ // Because specificity
+ @include hover-focus-active {
+ z-index: 3;
+ }
+ }
+ }
+}
--- /dev/null
+.jumbotron {
+ padding: $jumbotron-padding ($jumbotron-padding / 2);
+ margin-bottom: $jumbotron-padding;
+ background-color: $jumbotron-bg;
+ @include border-radius($border-radius-lg);
+
+ @include media-breakpoint-up(sm) {
+ padding: ($jumbotron-padding * 2) $jumbotron-padding;
+ }
+}
+
+.jumbotron-hr {
+ border-top-color: darken($jumbotron-bg, 10%);
+}
+
+.jumbotron-fluid {
+ padding-right: 0;
+ padding-left: 0;
+ @include border-radius(0);
+}
--- /dev/null
+// Base class
+//
+// Easily usable on <ul>, <ol>, or <div>.
+
+.list-group {
+ // No need to set list-style: none; since .list-group-item is block level
+ padding-left: 0; // reset padding because ul and ol
+ margin-bottom: 0;
+}
+
+
+// Individual list items
+//
+// Use on `li`s or `div`s within the `.list-group` parent.
+
+.list-group-item {
+ position: relative;
+ display: block;
+ padding: $list-group-item-padding-y $list-group-item-padding-x;
+ // Place the border on the list items and negative margin up for better styling
+ margin-bottom: -$list-group-border-width;
+ background-color: $list-group-bg;
+ border: $list-group-border-width solid $list-group-border-color;
+
+ &:first-child {
+ @include border-top-radius($list-group-border-radius);
+ }
+
+ &:last-child {
+ margin-bottom: 0;
+ @include border-bottom-radius($list-group-border-radius);
+ }
+
+ &.disabled {
+ @include plain-hover-focus {
+ color: $list-group-disabled-color;
+ cursor: $cursor-disabled;
+ background-color: $list-group-disabled-bg;
+
+ // Force color to inherit for custom content
+ .list-group-item-heading {
+ color: inherit;
+ }
+ .list-group-item-text {
+ color: $list-group-disabled-text-color;
+ }
+ }
+ }
+
+ &.active {
+ @include plain-hover-focus {
+ z-index: 2; // Place active items above their siblings for proper border styling
+ color: $list-group-active-color;
+ text-decoration: none; // Repeat here because it inherits global a:hover otherwise
+ background-color: $list-group-active-bg;
+ border-color: $list-group-active-border;
+
+ // Force color to inherit for custom content
+ .list-group-item-heading,
+ .list-group-item-heading > small,
+ .list-group-item-heading > .small {
+ color: inherit;
+ }
+ .list-group-item-text {
+ color: $list-group-active-text-color;
+ }
+ }
+ }
+}
+
+.list-group-flush {
+ .list-group-item {
+ border-radius: 0;
+ }
+}
+
+
+// Interactive list items
+//
+// Use anchor or button elements instead of `li`s or `div`s to create interactive
+// list items. Includes an extra `.active` modifier class for selected items.
+
+.list-group-item-action {
+ width: 100%; // For `<button>`s (anchors become 100% by default though)
+ color: $list-group-link-color;
+ text-align: inherit; // For `<button>`s (anchors inherit)
+
+ .list-group-item-heading {
+ color: $list-group-link-heading-color;
+ }
+
+ // Hover state
+ @include hover-focus {
+ color: $list-group-link-hover-color;
+ text-decoration: none;
+ background-color: $list-group-hover-bg;
+ }
+}
+
+
+// Contextual variants
+//
+// Add modifier classes to change text and background color on individual items.
+// Organizationally, this must come after the `:hover` states.
+
+@include list-group-item-variant(success, $state-success-bg, $state-success-text);
+@include list-group-item-variant(info, $state-info-bg, $state-info-text);
+@include list-group-item-variant(warning, $state-warning-bg, $state-warning-text);
+@include list-group-item-variant(danger, $state-danger-bg, $state-danger-text);
+
+
+// Custom content options
+//
+// Extra classes for creating well-formatted content within `.list-group-item`s.
+
+.list-group-item-heading {
+ margin-top: 0;
+ margin-bottom: $list-group-item-heading-margin-bottom;
+}
+.list-group-item-text {
+ margin-bottom: 0;
+ line-height: 1.3;
+}
--- /dev/null
+@if $enable-flex {
+ .media {
+ display: flex;
+ margin-bottom: $spacer;
+ }
+ .media-body {
+ flex: 1;
+ }
+ .media-middle {
+ align-self: center;
+ }
+ .media-bottom {
+ align-self: flex-end;
+ }
+} @else {
+ .media {
+ margin-top: $media-margin-top;
+
+ &:first-child {
+ margin-top: 0;
+ }
+ }
+ .media,
+ .media-body {
+ overflow: hidden;
+ }
+ .media-body {
+ width: 10000px;
+ }
+ .media-left,
+ .media-right,
+ .media-body {
+ display: table-cell;
+ vertical-align: top;
+ }
+ .media-middle {
+ vertical-align: middle;
+ }
+ .media-bottom {
+ vertical-align: bottom;
+ }
+}
+
+
+//
+// Images/elements as the media anchor
+//
+
+.media-object {
+ display: block;
+
+ // Fix collapse in webkit from max-width: 100% and display: table-cell.
+ &.img-thumbnail {
+ max-width: none;
+ }
+}
+
+
+//
+// Alignment
+//
+
+.media-right {
+ padding-left: $media-alignment-padding-x;
+}
+
+.media-left {
+ padding-right: $media-alignment-padding-x;
+}
+
+
+//
+// Headings
+//
+
+.media-heading {
+ margin-top: 0;
+ margin-bottom: $media-heading-margin-bottom;
+}
+
+
+//
+// Media list variation
+//
+
+.media-list {
+ padding-left: 0;
+ list-style: none;
+}
--- /dev/null
+// Toggles
+//
+// Used in conjunction with global variables to enable certain theme features.
+
+@mixin box-shadow($shadow...) {
+ @if $enable-shadows {
+ box-shadow: $shadow;
+ }
+}
+
+@mixin transition($transition...) {
+ @if $enable-transitions {
+ transition: $transition;
+ }
+}
+
+// Utilities
+@import "mixins/breakpoints";
+@import "mixins/hover";
+@import "mixins/image";
+@import "mixins/tag";
+@import "mixins/reset-filter";
+@import "mixins/resize";
+@import "mixins/screen-reader";
+@import "mixins/size";
+@import "mixins/tab-focus";
+@import "mixins/reset-text";
+@import "mixins/text-emphasis";
+@import "mixins/text-hide";
+@import "mixins/text-truncate";
+
+// // Components
+@import "mixins/alert";
+@import "mixins/buttons";
+@import "mixins/cards";
+@import "mixins/pagination";
+@import "mixins/lists";
+@import "mixins/list-group";
+@import "mixins/nav-divider";
+@import "mixins/forms";
+@import "mixins/progress";
+@import "mixins/table-row";
+
+// // Skins
+@import "mixins/background-variant";
+@import "mixins/border-radius";
+@import "mixins/gradients";
+
+// // Layout
+@import "mixins/clearfix";
+// @import "mixins/navbar-align";
+@import "mixins/grid-framework";
+@import "mixins/grid";
+@import "mixins/pulls";
--- /dev/null
+// .modal-open - body class for killing the scroll
+// .modal - container to scroll within
+// .modal-dialog - positioning shell for the actual modal
+// .modal-content - actual modal w/ bg and corners and shit
+
+
+// Kill the scroll on the body
+.modal-open {
+ overflow: hidden;
+}
+
+// Container that the modal scrolls within
+.modal {
+ position: fixed;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ z-index: $zindex-modal;
+ display: none;
+ overflow: hidden;
+ // Prevent Chrome on Windows from adding a focus outline. For details, see
+ // https://github.com/twbs/bootstrap/pull/10951.
+ outline: 0;
+ -webkit-overflow-scrolling: touch;
+
+ // When fading in the modal, animate it to slide down
+ &.fade .modal-dialog {
+ transition: transform .3s ease-out;
+ transform: translate(0, -25%);
+ }
+ &.in .modal-dialog { transform: translate(0, 0); }
+}
+.modal-open .modal {
+ overflow-x: hidden;
+ overflow-y: auto;
+}
+
+// Shell div to position the modal with bottom padding
+.modal-dialog {
+ position: relative;
+ width: auto;
+ margin: $modal-dialog-margin;
+}
+
+// Actual modal
+.modal-content {
+ position: relative;
+ background-color: $modal-content-bg;
+ background-clip: padding-box;
+ border: $modal-content-border-width solid $modal-content-border-color;
+ @include border-radius($border-radius-lg);
+ @include box-shadow($modal-content-xs-box-shadow);
+ // Remove focus outline from opened modal
+ outline: 0;
+}
+
+// Modal background
+.modal-backdrop {
+ position: fixed;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ z-index: $zindex-modal-bg;
+ background-color: $modal-backdrop-bg;
+
+ // Fade for backdrop
+ &.fade { opacity: 0; }
+ &.in { opacity: $modal-backdrop-opacity; }
+}
+
+// Modal header
+// Top section of the modal w/ title and dismiss
+.modal-header {
+ padding: $modal-title-padding;
+ border-bottom: $modal-header-border-width solid $modal-header-border-color;
+ @include clearfix;
+}
+// Close icon
+.modal-header .close {
+ margin-top: -2px;
+}
+
+// Title text within header
+.modal-title {
+ margin: 0;
+ line-height: $modal-title-line-height;
+}
+
+// Modal body
+// Where all modal content resides (sibling of .modal-header and .modal-footer)
+.modal-body {
+ position: relative;
+ padding: $modal-inner-padding;
+}
+
+// Footer (for actions)
+.modal-footer {
+ padding: $modal-inner-padding;
+ text-align: right; // right align buttons
+ border-top: $modal-footer-border-width solid $modal-footer-border-color;
+ @include clearfix(); // clear it in case folks use .pull-* classes on buttons
+}
+
+// Measure scrollbar width for padding body during modal show/hide
+.modal-scrollbar-measure {
+ position: absolute;
+ top: -9999px;
+ width: 50px;
+ height: 50px;
+ overflow: scroll;
+}
+
+// Scale up the modal
+@include media-breakpoint-up(sm) {
+ // Automatically set modal's width for larger viewports
+ .modal-dialog {
+ max-width: $modal-md;
+ margin: $modal-dialog-sm-up-margin-y auto;
+ }
+
+ .modal-content {
+ @include box-shadow($modal-content-sm-up-box-shadow);
+ }
+
+ .modal-sm { max-width: $modal-sm; }
+}
+
+@include media-breakpoint-up(lg) {
+ .modal-lg { max-width: $modal-lg; }
+}
--- /dev/null
+// Base class
+//
+// Kickstart any navigation component with a set of style resets. Works with
+// `<nav>`s or `<ul>`s.
+
+.nav {
+ padding-left: 0;
+ margin-bottom: 0;
+ list-style: none;
+}
+
+.nav-link {
+ display: inline-block;
+
+ @include hover-focus {
+ text-decoration: none;
+ }
+
+ // Disabled state lightens text and removes hover/tab effects
+ &.disabled {
+ color: $nav-disabled-link-color;
+
+ @include plain-hover-focus {
+ color: $nav-disabled-link-hover-color;
+ cursor: $cursor-disabled;
+ background-color: $nav-disabled-link-hover-bg;
+ }
+ }
+}
+
+
+// Nav inline
+
+.nav-inline {
+ .nav-item {
+ display: inline-block;
+ }
+
+ .nav-item + .nav-item,
+ .nav-link + .nav-link {
+ margin-left: $nav-item-inline-spacer;
+ }
+}
+
+
+//
+// Tabs
+//
+
+.nav-tabs {
+ border-bottom: $nav-tabs-border-width solid $nav-tabs-border-color;
+ @include clearfix();
+
+ .nav-item {
+ float: left;
+ // Make the list-items overlay the bottom border
+ margin-bottom: -$nav-tabs-border-width;
+
+ + .nav-item {
+ margin-left: $nav-item-margin;
+ }
+ }
+
+ .nav-link {
+ display: block;
+ padding: $nav-link-padding;
+ border: $nav-tabs-border-width solid transparent;
+ @include border-top-radius($nav-tabs-border-radius);
+
+ @include hover-focus {
+ border-color: $nav-tabs-link-hover-border-color $nav-tabs-link-hover-border-color $nav-tabs-border-color;
+ }
+
+ &.disabled {
+ @include plain-hover-focus {
+ color: $nav-disabled-link-color;
+ background-color: transparent;
+ border-color: transparent;
+ }
+ }
+ }
+
+ .nav-link.active,
+ .nav-item.open .nav-link {
+ @include plain-hover-focus {
+ color: $nav-tabs-active-link-hover-color;
+ background-color: $nav-tabs-active-link-hover-bg;
+ border-color: $nav-tabs-active-link-hover-border-color $nav-tabs-active-link-hover-border-color transparent;
+ }
+ }
+
+ .dropdown-menu {
+ // Make dropdown border overlap tab border
+ margin-top: -$nav-tabs-border-width;
+ // Remove the top rounded corners here since there is a hard edge above the menu
+ @include border-top-radius(0);
+ }
+}
+
+
+//
+// Pills
+//
+
+.nav-pills {
+ @include clearfix();
+
+ .nav-item {
+ float: left;
+
+ + .nav-item {
+ margin-left: $nav-item-margin;
+ }
+ }
+
+ .nav-link {
+ display: block;
+ padding: $nav-link-padding;
+ @include border-radius($nav-pills-border-radius);
+ }
+
+ .nav-link.active,
+ .nav-item.open .nav-link {
+ @include plain-hover-focus {
+ color: $nav-pills-active-link-color;
+ cursor: default;
+ background-color: $nav-pills-active-link-bg;
+ }
+ }
+}
+
+.nav-stacked {
+ .nav-item {
+ display: block;
+ float: none;
+
+ + .nav-item {
+ margin-top: $nav-item-margin;
+ margin-left: 0;
+ }
+ }
+}
+
+
+//
+// Tabbable tabs
+//
+
+// Hide tabbable panes to start, show them when `.active`
+.tab-content {
+ > .tab-pane {
+ display: none;
+ }
+ > .active {
+ display: block;
+ }
+}
--- /dev/null
+// Wrapper and base class
+//
+// Provide a static navbar from which we expand to create full-width, fixed, and
+// other navbar variations.
+
+.navbar {
+ position: relative;
+ padding: $navbar-padding-y $navbar-padding-x;
+ @include clearfix;
+
+ @include media-breakpoint-up(sm) {
+ @include border-radius($navbar-border-radius);
+ }
+}
+
+
+// Navbar alignment options
+//
+// Display the navbar across the entirety of the page or fixed it to the top or
+// bottom of the page.
+
+// A static, full width modifier with no rounded corners.
+.navbar-full {
+ z-index: $zindex-navbar;
+
+ @include media-breakpoint-up(sm) {
+ @include border-radius(0);
+ }
+}
+
+// Fix the top/bottom navbars when screen real estate supports it
+.navbar-fixed-top,
+.navbar-fixed-bottom {
+ position: fixed;
+ right: 0;
+ left: 0;
+ z-index: $zindex-navbar-fixed;
+
+ // Undo the rounded corners
+ @include media-breakpoint-up(sm) {
+ @include border-radius(0);
+ }
+}
+
+.navbar-fixed-top {
+ top: 0;
+}
+
+.navbar-fixed-bottom {
+ bottom: 0;
+}
+
+.navbar-sticky-top {
+ position: sticky;
+ top: 0;
+ z-index: $zindex-navbar-sticky;
+ width: 100%;
+
+ // Undo the rounded corners
+ @include media-breakpoint-up(sm) {
+ @include border-radius(0);
+ }
+}
+
+
+//
+// Brand/project name
+//
+
+.navbar-brand {
+ float: left;
+ padding-top: $navbar-brand-padding-y;
+ padding-bottom: $navbar-brand-padding-y;
+ margin-right: 1rem;
+ font-size: $font-size-lg;
+
+ @include hover-focus {
+ text-decoration: none;
+ }
+
+ > img {
+ display: block;
+ }
+}
+
+
+.navbar-divider {
+ float: left;
+ width: $border-width;
+ padding-top: .425rem;
+ padding-bottom: .425rem;
+ margin-right: $navbar-padding-x;
+ margin-left: $navbar-padding-x;
+ overflow: hidden;
+
+ &::before {
+ content: "\00a0";
+ }
+}
+
+
+// Navbar toggle
+//
+// Custom button for toggling the `.navbar-collapse`, powered by the collapse
+// Bootstrap JavaScript plugin.
+
+.navbar-toggler {
+ padding: .5rem .75rem;
+ font-size: $font-size-lg;
+ line-height: 1;
+ background: none;
+ border: $border-width solid transparent;
+ @include border-radius($btn-border-radius);
+
+ @include hover-focus {
+ text-decoration: none;
+ }
+}
+
+// Navigation
+//
+// Custom navbar navigation built on the base `.nav` styles.
+
+.navbar-nav {
+ .nav-item {
+ float: left;
+ }
+
+ .nav-link {
+ display: block;
+ padding-top: .425rem;
+ padding-bottom: .425rem;
+
+ + .nav-link {
+ margin-left: 1rem;
+ }
+ }
+
+ .nav-item + .nav-item {
+ margin-left: 1rem;
+ }
+}
+
+// Dark links against a light background
+.navbar-light {
+ .navbar-brand {
+ color: $navbar-light-active-color;
+
+ @include hover-focus {
+ color: $navbar-light-active-color;
+ }
+ }
+
+ .navbar-nav {
+ .nav-link {
+ color: $navbar-light-color;
+
+ @include hover-focus {
+ color: $navbar-light-hover-color;
+ }
+ }
+
+ .open > .nav-link,
+ .active > .nav-link,
+ .nav-link.open,
+ .nav-link.active {
+ @include plain-hover-focus {
+ color: $navbar-light-active-color;
+ }
+ }
+ }
+
+ .navbar-divider {
+ background-color: rgba(0,0,0,.075);
+ }
+}
+
+// White links against a dark background
+.navbar-dark {
+ .navbar-brand {
+ color: $navbar-dark-active-color;
+
+ @include hover-focus {
+ color: $navbar-dark-active-color;
+ }
+ }
+
+ .navbar-nav {
+ .nav-link {
+ color: $navbar-dark-color;
+
+ @include hover-focus {
+ color: $navbar-dark-hover-color;
+ }
+ }
+
+ .open > .nav-link,
+ .active > .nav-link,
+ .nav-link.open,
+ .nav-link.active {
+ @include plain-hover-focus {
+ color: $navbar-dark-active-color;
+ }
+ }
+ }
+
+ .navbar-divider {
+ background-color: rgba(255,255,255,.075);
+ }
+}
+
+
+// Navbar toggleable
+//
+// Custom override for collapse plugin in navbar.
+
+// scss-lint:disable ImportantRule
+.navbar-toggleable {
+ &-xs {
+ @include clearfix;
+ @include media-breakpoint-down(xs) {
+ .navbar-nav .nav-item {
+ float: none;
+ margin-left: 0;
+ }
+ }
+ @include media-breakpoint-up(sm) {
+ display: block !important;
+ }
+ }
+
+ &-sm {
+ @include clearfix;
+ @include media-breakpoint-down(sm) {
+ .navbar-nav .nav-item {
+ float: none;
+ margin-left: 0;
+ }
+ }
+ @include media-breakpoint-up(md) {
+ display: block !important;
+ }
+ }
+
+ &-md {
+ @include clearfix;
+ @include media-breakpoint-down(md) {
+ .navbar-nav .nav-item {
+ float: none;
+ margin-left: 0;
+ }
+ }
+ @include media-breakpoint-up(lg) {
+ display: block !important;
+ }
+ }
+}
+// scss-lint:enable ImportantRule
--- /dev/null
+/*! normalize.css v4.0.0 | MIT License | github.com/necolas/normalize.css */
+
+//
+// 1. Change the default font family in all browsers (opinionated).
+// 2. Prevent adjustments of font size after orientation changes in IE and iOS.
+//
+
+html {
+ font-family: sans-serif; // 1
+ -ms-text-size-adjust: 100%; // 2
+ -webkit-text-size-adjust: 100%; // 2
+}
+
+//
+// Remove the margin in all browsers (opinionated).
+//
+
+body {
+ margin: 0;
+}
+
+// HTML5 display definitions
+// ==========================================================================
+
+//
+// Add the correct display in IE 9-.
+// 1. Add the correct display in Edge, IE, and Firefox.
+// 2. Add the correct display in IE.
+//
+
+article,
+aside,
+details, // 1
+figcaption,
+figure,
+footer,
+header,
+main, // 2
+menu,
+nav,
+section,
+summary { // 1
+ display: block;
+}
+
+//
+// Add the correct display in IE 9-.
+//
+
+audio,
+canvas,
+progress,
+video {
+ display: inline-block;
+}
+
+//
+// Add the correct display in iOS 4-7.
+//
+
+audio:not([controls]) {
+ display: none;
+ height: 0;
+}
+
+//
+// Add the correct vertical alignment in Chrome, Firefox, and Opera.
+//
+
+progress {
+ vertical-align: baseline;
+}
+
+//
+// Add the correct display in IE 10-.
+// 1. Add the correct display in IE.
+//
+
+template, // 2
+[hidden] {
+ display: none;
+}
+
+// Links
+// ==========================================================================
+
+//
+// Remove the gray background on active links in IE 10.
+//
+
+a {
+ background-color: transparent;
+}
+
+//
+// Remove the outline on focused links when they are also active or hovered
+// in all browsers (opinionated).
+//
+
+a:active,
+a:hover {
+ outline-width: 0;
+}
+
+// Text-level semantics
+// ==========================================================================
+
+//
+// 1. Remove the bottom border in Firefox 39-.
+// 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
+//
+
+abbr[title] {
+ border-bottom: none; // 1
+ text-decoration: underline; // 2
+ text-decoration: underline dotted; // 2
+}
+
+//
+// Prevent the duplicate application of `bolder` by the next rule in Safari 6.
+//
+
+b,
+strong {
+ font-weight: inherit;
+}
+
+//
+// Add the correct font weight in Chrome, Edge, and Safari.
+//
+
+b,
+strong {
+ font-weight: bolder;
+}
+
+//
+// Add the correct font style in Android 4.3-.
+//
+
+dfn {
+ font-style: italic;
+}
+
+//
+// Correct the font size and margin on `h1` elements within `section` and
+// `article` contexts in Chrome, Firefox, and Safari.
+//
+
+h1 {
+ font-size: 2em;
+ margin: 0.67em 0;
+}
+
+//
+// Add the correct background and color in IE 9-.
+//
+
+mark {
+ background-color: #ff0;
+ color: #000;
+}
+
+//
+// Add the correct font size in all browsers.
+//
+
+small {
+ font-size: 80%;
+}
+
+//
+// Prevent `sub` and `sup` elements from affecting the line height in
+// all browsers.
+//
+
+sub,
+sup {
+ font-size: 75%;
+ line-height: 0;
+ position: relative;
+ vertical-align: baseline;
+}
+
+sub {
+ bottom: -0.25em;
+}
+
+sup {
+ top: -0.5em;
+}
+
+// Embedded content
+// ==========================================================================
+
+//
+// Remove the border on images inside links in IE 10-.
+//
+
+img {
+ border-style: none;
+}
+
+//
+// Hide the overflow in IE.
+//
+
+svg:not(:root) {
+ overflow: hidden;
+}
+
+// Grouping content
+// ==========================================================================
+
+//
+// 1. Correct the inheritance and scaling of font size in all browsers.
+// 2. Correct the odd `em` font sizing in all browsers.
+//
+
+code,
+kbd,
+pre,
+samp {
+ font-family: monospace, monospace; // 1
+ font-size: 1em; // 2
+}
+
+//
+// Add the correct margin in IE 8.
+//
+
+figure {
+ margin: 1em 40px;
+}
+
+//
+// 1. Add the correct box sizing in Firefox.
+// 2. Show the overflow in Edge and IE.
+//
+
+hr {
+ box-sizing: content-box; // 1
+ height: 0; // 1
+ overflow: visible; // 2
+}
+
+// Forms
+// ==========================================================================
+
+//
+// Change font properties to `inherit` in all browsers (opinionated).
+//
+
+button,
+input,
+select,
+textarea {
+ font: inherit;
+}
+
+//
+// Restore the font weight unset by the previous rule.
+//
+
+optgroup {
+ font-weight: bold;
+}
+
+//
+// Show the overflow in IE.
+// 1. Show the overflow in Edge.
+// 2. Show the overflow in Edge, Firefox, and IE.
+//
+
+button,
+input, // 1
+select { // 2
+ overflow: visible;
+}
+
+//
+// Remove the margin in Safari.
+// 1. Remove the margin in Firefox and Safari.
+//
+
+button,
+input,
+select,
+textarea { // 1
+ margin: 0;
+}
+
+//
+// Remove the inheritence of text transform in Edge, Firefox, and IE.
+// 1. Remove the inheritence of text transform in Firefox.
+//
+
+button,
+select { // 1
+ text-transform: none;
+}
+
+//
+// Change the cursor in all browsers (opinionated).
+//
+
+button,
+[type="button"],
+[type="reset"],
+[type="submit"] {
+ cursor: pointer;
+}
+
+//
+// Restore the default cursor to disabled elements unset by the previous rule.
+//
+
+[disabled] {
+ cursor: default;
+}
+
+//
+// 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
+// controls in Android 4.
+// 2. Correct the inability to style clickable types in iOS.
+//
+
+button,
+html [type="button"], // 1
+[type="reset"],
+[type="submit"] {
+ -webkit-appearance: button; // 2
+}
+
+//
+// Remove the inner border and padding in Firefox.
+//
+
+button::-moz-focus-inner,
+input::-moz-focus-inner {
+ border: 0;
+ padding: 0;
+}
+
+//
+// Restore the focus styles unset by the previous rule.
+//
+
+button:-moz-focusring,
+input:-moz-focusring {
+ outline: 1px dotted ButtonText;
+}
+
+//
+// Change the border, margin, and padding in all browsers (opinionated).
+//
+
+fieldset {
+ border: 1px solid #c0c0c0;
+ margin: 0 2px;
+ padding: 0.35em 0.625em 0.75em;
+}
+
+//
+// 1. Correct the text wrapping in Edge and IE.
+// 2. Correct the color inheritance from `fieldset` elements in IE.
+// 3. Remove the padding so developers are not caught out when they zero out
+// `fieldset` elements in all browsers.
+//
+
+legend {
+ box-sizing: border-box; // 1
+ color: inherit; // 2
+ display: table; // 1
+ max-width: 100%; // 1
+ padding: 0; // 3
+ white-space: normal; // 1
+}
+
+//
+// Remove the default vertical scrollbar in IE.
+//
+
+textarea {
+ overflow: auto;
+}
+
+//
+// 1. Add the correct box sizing in IE 10-.
+// 2. Remove the padding in IE 10-.
+//
+
+[type="checkbox"],
+[type="radio"] {
+ box-sizing: border-box; // 1
+ padding: 0; // 2
+}
+
+//
+// Correct the cursor style of increment and decrement buttons in Chrome.
+//
+
+[type="number"]::-webkit-inner-spin-button,
+[type="number"]::-webkit-outer-spin-button {
+ height: auto;
+}
+
+//
+// Correct the odd appearance of search inputs in Chrome and Safari.
+//
+
+[type="search"] {
+ -webkit-appearance: textfield;
+}
+
+//
+// Remove the inner padding and cancel buttons in Chrome on OS X and
+// Safari on OS X.
+//
+
+[type="search"]::-webkit-search-cancel-button,
+[type="search"]::-webkit-search-decoration {
+ -webkit-appearance: none;
+}
--- /dev/null
+.pagination {
+ display: inline-block;
+ padding-left: 0;
+ margin-top: $spacer-y;
+ margin-bottom: $spacer-y;
+ @include border-radius();
+}
+
+.page-item {
+ display: inline; // Remove list-style and block-level defaults
+
+ &:first-child {
+ .page-link {
+ margin-left: 0;
+ @include border-left-radius($border-radius);
+ }
+ }
+ &:last-child {
+ .page-link {
+ @include border-right-radius($border-radius);
+ }
+ }
+
+ &.active .page-link {
+ @include plain-hover-focus {
+ z-index: 2;
+ color: $pagination-active-color;
+ cursor: default;
+ background-color: $pagination-active-bg;
+ border-color: $pagination-active-border;
+ }
+ }
+
+ &.disabled .page-link {
+ @include plain-hover-focus {
+ color: $pagination-disabled-color;
+ pointer-events: none;
+ cursor: $cursor-disabled;
+ background-color: $pagination-disabled-bg;
+ border-color: $pagination-disabled-border;
+ }
+ }
+}
+
+.page-link {
+ position: relative;
+ float: left; // Collapse white-space
+ padding: $pagination-padding-y $pagination-padding-x;
+ margin-left: -1px;
+ color: $pagination-color;
+ text-decoration: none;
+ background-color: $pagination-bg;
+ border: $pagination-border-width solid $pagination-border-color;
+
+ @include hover-focus {
+ color: $pagination-hover-color;
+ background-color: $pagination-hover-bg;
+ border-color: $pagination-hover-border;
+ }
+}
+
+
+//
+// Sizing
+//
+
+.pagination-lg {
+ @include pagination-size($pagination-padding-y-lg, $pagination-padding-x-lg, $font-size-lg, $line-height-lg, $border-radius-lg);
+}
+
+.pagination-sm {
+ @include pagination-size($pagination-padding-y-sm, $pagination-padding-x-sm, $font-size-sm, $line-height-sm, $border-radius-sm);
+}
--- /dev/null
+.popover {
+ position: absolute;
+ top: 0;
+ left: 0;
+ z-index: $zindex-popover;
+ display: block;
+ max-width: $popover-max-width;
+ padding: $popover-inner-padding;
+ // Our parent element can be arbitrary since tooltips are by default inserted as a sibling of their target element.
+ // So reset our font and text properties to avoid inheriting weird values.
+ @include reset-text();
+ font-size: $font-size-sm;
+ // Allow breaking very long words so they don't overflow the popover's bounds
+ word-wrap: break-word;
+ background-color: $popover-bg;
+ background-clip: padding-box;
+ border: $popover-border-width solid $popover-border-color;
+ @include border-radius($border-radius-lg);
+ @include box-shadow($popover-box-shadow);
+
+
+ // Popover directions
+
+ &.popover-top,
+ &.bs-tether-element-attached-bottom {
+ margin-top: -$popover-arrow-width;
+
+ .popover-arrow {
+ bottom: -$popover-arrow-outer-width;
+ left: 50%;
+ margin-left: -$popover-arrow-outer-width;
+ border-top-color: $popover-arrow-outer-color;
+ border-bottom-width: 0;
+ &::after {
+ bottom: 1px;
+ margin-left: -$popover-arrow-width;
+ content: "";
+ border-top-color: $popover-arrow-color;
+ border-bottom-width: 0;
+ }
+ }
+ }
+
+ &.popover-right,
+ &.bs-tether-element-attached-left {
+ margin-left: $popover-arrow-width;
+
+ .popover-arrow {
+ top: 50%;
+ left: -$popover-arrow-outer-width;
+ margin-top: -$popover-arrow-outer-width;
+ border-right-color: $popover-arrow-outer-color;
+ border-left-width: 0;
+ &::after {
+ bottom: -$popover-arrow-width;
+ left: 1px;
+ content: "";
+ border-right-color: $popover-arrow-color;
+ border-left-width: 0;
+ }
+ }
+ }
+
+ &.popover-bottom,
+ &.bs-tether-element-attached-top {
+ margin-top: $popover-arrow-width;
+
+ .popover-arrow {
+ top: -$popover-arrow-outer-width;
+ left: 50%;
+ margin-left: -$popover-arrow-outer-width;
+ border-top-width: 0;
+ border-bottom-color: $popover-arrow-outer-color;
+ &::after {
+ top: 1px;
+ margin-left: -$popover-arrow-width;
+ content: "";
+ border-top-width: 0;
+ border-bottom-color: $popover-arrow-color;
+ }
+ }
+ }
+
+ &.popover-left,
+ &.bs-tether-element-attached-right {
+ margin-left: -$popover-arrow-width;
+
+ .popover-arrow {
+ top: 50%;
+ right: -$popover-arrow-outer-width;
+ margin-top: -$popover-arrow-outer-width;
+ border-right-width: 0;
+ border-left-color: $popover-arrow-outer-color;
+ &::after {
+ right: 1px;
+ bottom: -$popover-arrow-width;
+ content: "";
+ border-right-width: 0;
+ border-left-color: $popover-arrow-color;
+ }
+ }
+ }
+}
+
+
+// Offset the popover to account for the popover arrow
+.popover-title {
+ padding: $popover-title-padding-y $popover-title-padding-x;
+ margin: 0; // reset heading margin
+ font-size: $font-size-base;
+ background-color: $popover-title-bg;
+ border-bottom: $popover-border-width solid darken($popover-title-bg, 5%);
+ $offset-border-width: ($border-width / $font-size-root);
+ @include border-radius(($border-radius-lg - $offset-border-width) ($border-radius-lg - $offset-border-width) 0 0);
+
+ &:empty {
+ display: none;
+ }
+}
+
+.popover-content {
+ padding: $popover-content-padding-y $popover-content-padding-x;
+}
+
+
+// Arrows
+//
+// .popover-arrow is outer, .popover-arrow::after is inner
+
+.popover-arrow {
+ &,
+ &::after {
+ position: absolute;
+ display: block;
+ width: 0;
+ height: 0;
+ border-color: transparent;
+ border-style: solid;
+ }
+}
+.popover-arrow {
+ border-width: $popover-arrow-outer-width;
+}
+.popover-arrow::after {
+ content: "";
+ border-width: $popover-arrow-width;
+}
--- /dev/null
+// scss-lint:disable ImportantRule, QualifyingElement
+
+// Source: https://github.com/h5bp/html5-boilerplate/blob/master/src/css/main.css
+
+// ==========================================================================
+// Print styles.
+// Inlined to avoid the additional HTTP request:
+// http://www.phpied.com/delay-loading-your-print-css/
+// ==========================================================================
+
+@if $enable-print-styles {
+ @media print {
+ *,
+ *::before,
+ *::after,
+ *::first-letter,
+ *::first-line {
+ // Bootstrap specific; comment out `color` and `background`
+ //color: #000 !important; // Black prints faster:
+ // http://www.sanbeiji.com/archives/953
+ text-shadow: none !important;
+ //background: transparent !important;
+ box-shadow: none !important;
+ }
+
+ a,
+ a:visited {
+ text-decoration: underline;
+ }
+
+ // Bootstrap specific; comment the following selector out
+ //a[href]::after {
+ // content: " (" attr(href) ")";
+ //}
+
+ abbr[title]::after {
+ content: " (" attr(title) ")";
+ }
+
+ // Bootstrap specific; comment the following selector out
+ //
+ // Don't show links that are fragment identifiers,
+ // or use the `javascript:` pseudo protocol
+ //
+
+ //a[href^="#"]::after,
+ //a[href^="javascript:"]::after {
+ // content: "";
+ //}
+
+ pre,
+ blockquote {
+ border: $border-width solid #999; // Bootstrap custom code; using `$border-width` instead of 1px
+ page-break-inside: avoid;
+ }
+
+ //
+ // Printing Tables:
+ // http://css-discuss.incutio.com/wiki/Printing_Tables
+ //
+
+ thead {
+ display: table-header-group;
+ }
+
+ tr,
+ img {
+ page-break-inside: avoid;
+ }
+
+ p,
+ h2,
+ h3 {
+ orphans: 3;
+ widows: 3;
+ }
+
+ h2,
+ h3 {
+ page-break-after: avoid;
+ }
+
+ // Bootstrap specific changes start
+
+ // Bootstrap components
+ .navbar {
+ display: none;
+ }
+ .btn,
+ .dropup > .btn {
+ > .caret {
+ border-top-color: #000 !important;
+ }
+ }
+ .tag {
+ border: $border-width solid #000;
+ }
+
+ .table {
+ border-collapse: collapse !important;
+
+ td,
+ th {
+ background-color: #fff !important;
+ }
+ }
+ .table-bordered {
+ th,
+ td {
+ border: 1px solid #ddd !important;
+ }
+ }
+
+ // Bootstrap specific changes end
+ }
+}
--- /dev/null
+//
+// Progress animations
+//
+
+@keyframes progress-bar-stripes {
+ from { background-position: $spacer-y 0; }
+ to { background-position: 0 0; }
+}
+
+
+//
+// Basic progress bar
+//
+
+.progress {
+ display: block;
+ width: 100%;
+ height: $spacer-y; // todo: make a new var for this
+ margin-bottom: $spacer-y;
+}
+.progress[value] {
+ // Set overall background
+ background-color: $progress-bg;
+ // Remove Firefox and Opera border
+ border: 0;
+ // Reset the default appearance
+ appearance: none;
+ // Set overall border radius
+ @include border-radius($border-radius);
+}
+
+// Filled-in portion of the bar
+.progress[value]::-ms-fill {
+ background-color: $progress-bar-color;
+ // Remove right-hand border of value bar from IE10+/Edge
+ border: 0;
+}
+.progress[value]::-moz-progress-bar {
+ background-color: $progress-bar-color;
+ @include border-left-radius($border-radius);
+}
+.progress[value]::-webkit-progress-value {
+ background-color: $progress-bar-color;
+ @include border-left-radius($border-radius);
+}
+// Tweaks for full progress bar
+.progress[value="100"]::-moz-progress-bar {
+ @include border-right-radius($border-radius);
+}
+.progress[value="100"]::-webkit-progress-value {
+ @include border-right-radius($border-radius);
+}
+
+// Unfilled portion of the bar
+.progress[value]::-webkit-progress-bar {
+ background-color: $progress-bg;
+ @include border-radius($border-radius);
+ @include box-shadow($progress-box-shadow);
+}
+base::-moz-progress-bar, // Absurd-but-syntactically-valid selector to make these styles Firefox-only
+.progress[value] {
+ background-color: $progress-bg;
+ @include border-radius($border-radius);
+ @include box-shadow($progress-box-shadow);
+}
+
+// IE9 hacks to accompany custom markup. We don't need to scope this via media queries, but I feel better doing it anyway.
+@media screen and (min-width:0\0) {
+ .progress {
+ background-color: $progress-bg;
+ @include border-radius($border-radius);
+ @include box-shadow($progress-box-shadow);
+ }
+ .progress-bar {
+ display: inline-block;
+ height: $spacer-y;
+ text-indent: -999rem; // Simulate hiding of value as in native `<progress>`
+ background-color: $progress-bar-color;
+ @include border-left-radius($border-radius);
+ }
+ .progress[width="100%"] {
+ @include border-right-radius($border-radius);
+ }
+}
+
+
+//
+// Striped
+//
+
+.progress-striped[value]::-webkit-progress-value {
+ @include gradient-striped();
+ background-size: $spacer-y $spacer-y;
+}
+.progress-striped[value]::-moz-progress-bar {
+ @include gradient-striped();
+ background-size: $spacer-y $spacer-y;
+}
+.progress-striped[value]::-ms-fill {
+ @include gradient-striped();
+ background-size: $spacer-y $spacer-y;
+}
+// IE9
+@media screen and (min-width:0\0) {
+ .progress-bar-striped {
+ @include gradient-striped();
+ background-size: $spacer-y $spacer-y;
+ }
+}
+
+
+//
+// Animated
+//
+
+.progress-animated[value]::-webkit-progress-value {
+ animation: progress-bar-stripes 2s linear infinite;
+}
+.progress-animated[value]::-moz-progress-bar {
+ animation: progress-bar-stripes 2s linear infinite;
+}
+// IE9
+@media screen and (min-width:0\0) {
+ .progress-animated .progress-bar-striped {
+ animation: progress-bar-stripes 2s linear infinite;
+ }
+}
+
+
+//
+// Variations
+//
+
+.progress-success {
+ @include progress-variant($progress-bar-success-bg);
+}
+.progress-info {
+ @include progress-variant($progress-bar-info-bg);
+}
+.progress-warning {
+ @include progress-variant($progress-bar-warning-bg);
+}
+.progress-danger {
+ @include progress-variant($progress-bar-danger-bg);
+}
--- /dev/null
+// scss-lint:disable ImportantRule, QualifyingElement, DuplicateProperty
+
+// Reboot
+//
+// Global resets to common HTML elements and more for easier usage by Bootstrap.
+// Adds additional rules on top of Normalize.css, including several overrides.
+
+
+// Reset the box-sizing
+//
+// Change from `box-sizing: content-box` to `border-box` so that when you add
+// `padding` or `border`s to an element, the overall declared `width` does not
+// change. For example, `width: 100px;` will always be `100px` despite the
+// `border: 10px solid red;` and `padding: 20px;`.
+//
+// Heads up! This reset may cause conflicts with some third-party widgets. For
+// recommendations on resolving such conflicts, see
+// http://getbootstrap.com/getting-started/#third-box-sizing.
+//
+// Credit: https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/
+
+html {
+ box-sizing: border-box;
+}
+
+*,
+*::before,
+*::after {
+ box-sizing: inherit;
+}
+
+
+// Make viewport responsive
+//
+// @viewport is needed because IE 10+ doesn't honor <meta name="viewport"> in
+// some cases. See http://timkadlec.com/2012/10/ie10-snap-mode-and-responsive-design/.
+// Eventually @viewport will replace <meta name="viewport">.
+//
+// However, `device-width` is broken on IE 10 on Windows (Phone) 8,
+// (see http://timkadlec.com/2013/01/windows-phone-8-and-device-width/ and https://github.com/twbs/bootstrap/issues/10497)
+// and the fix for that involves a snippet of JavaScript to sniff the user agent
+// and apply some conditional CSS.
+//
+// See http://getbootstrap.com/getting-started/#support-ie10-width for the relevant hack.
+//
+// Wrap `@viewport` with `@at-root` for when folks do a nested import (e.g.,
+// `.class-name { @import "bootstrap"; }`).
+@at-root {
+ @-ms-viewport { width: device-width; }
+}
+
+
+//
+// Reset HTML, body, and more
+//
+
+html {
+ // Sets a specific default `font-size` for user with `rem` type scales.
+ font-size: $font-size-root;
+ // As a side-effect of setting the @viewport above,
+ // IE11 & Edge make the scrollbar overlap the content and automatically hide itself when not in use.
+ // Unfortunately, the auto-showing of the scrollbar is sometimes too sensitive,
+ // thus making it hard to click on stuff near the right edge of the page.
+ // So we add this style to force IE11 & Edge to use a "normal", non-overlapping, non-auto-hiding scrollbar.
+ // See https://github.com/twbs/bootstrap/issues/18543
+ -ms-overflow-style: scrollbar;
+ // Changes the default tap highlight to be completely transparent in iOS.
+ -webkit-tap-highlight-color: rgba(0,0,0,0);
+}
+
+body {
+ // Make the `body` use the `font-size-root`
+ font-family: $font-family-base;
+ font-size: $font-size-base;
+ line-height: $line-height-base;
+ // Go easy on the eyes and use something other than `#000` for text
+ color: $body-color;
+ // By default, `<body>` has no `background-color` so we set one as a best practice.
+ background-color: $body-bg;
+}
+
+// Suppress the focus outline on elements that cannot be accessed via keyboard.
+// This prevents an unwanted focus outline from appearing around elements that
+// might still respond to pointer events.
+//
+// Credit: https://github.com/suitcss/base
+[tabindex="-1"]:focus {
+ outline: none !important;
+}
+
+
+//
+// Typography
+//
+
+// Remove top margins from headings
+//
+// By default, `<h1>`-`<h6>` all receive top and bottom margins. We nuke the top
+// margin for easier control within type scales as it avoids margin collapsing.
+h1, h2, h3, h4, h5, h6 {
+ margin-top: 0;
+ margin-bottom: .5rem;
+}
+
+// Reset margins on paragraphs
+//
+// Similarly, the top margin on `<p>`s get reset. However, we also reset the
+// bottom margin to use `rem` units instead of `em`.
+p {
+ margin-top: 0;
+ margin-bottom: 1rem;
+}
+
+// Abbreviations and acronyms
+abbr[title],
+// Add data-* attribute to help out our tooltip plugin, per https://github.com/twbs/bootstrap/issues/5257
+abbr[data-original-title] {
+ cursor: help;
+ border-bottom: 1px dotted $abbr-border-color;
+}
+
+address {
+ margin-bottom: 1rem;
+ font-style: normal;
+ line-height: inherit;
+}
+
+ol,
+ul,
+dl {
+ margin-top: 0;
+ margin-bottom: 1rem;
+}
+
+ol ol,
+ul ul,
+ol ul,
+ul ol {
+ margin-bottom: 0;
+}
+
+dt {
+ font-weight: $dt-font-weight;
+}
+
+dd {
+ margin-bottom: .5rem;
+ margin-left: 0; // Undo browser default
+}
+
+blockquote {
+ margin: 0 0 1rem;
+}
+
+
+//
+// Links
+//
+
+a {
+ color: $link-color;
+ text-decoration: $link-decoration;
+
+ @include hover-focus {
+ color: $link-hover-color;
+ text-decoration: $link-hover-decoration;
+ }
+
+ &:focus {
+ @include tab-focus();
+ }
+}
+
+// And undo these styles for placeholder links/named anchors (without href)
+// which have not been made explicitly keyboard-focusable (without tabindex).
+// It would be more straightforward to just use a[href] in previous block, but that
+// causes specificity issues in many other styles that are too complex to fix.
+// See https://github.com/twbs/bootstrap/issues/19402
+
+a:not([href]):not([tabindex]) {
+ color: inherit;
+ text-decoration: none;
+
+ @include hover-focus {
+ color: inherit;
+ text-decoration: none;
+ }
+
+ &:focus {
+ outline: none;
+ }
+}
+
+
+//
+// Code
+//
+
+pre {
+ // Remove browser default top margin
+ margin-top: 0;
+ // Reset browser default of `1em` to use `rem`s
+ margin-bottom: 1rem;
+ // Normalize v4 removed this property, causing `<pre>` content to break out of wrapping code snippets
+ overflow: auto;
+}
+
+
+//
+// Figures
+//
+
+figure {
+ // Normalize adds `margin` to `figure`s as browsers apply it inconsistently.
+ // We reset that to create a better flow in-page.
+ margin: 0 0 1rem;
+}
+
+
+//
+// Images
+//
+
+img {
+ // By default, `<img>`s are `inline-block`. This assumes that, and vertically
+ // centers them. This won't apply should you reset them to `block` level.
+ vertical-align: middle;
+ // Note: `<img>`s are deliberately not made responsive by default.
+ // For the rationale behind this, see the comments on the `.img-fluid` class.
+}
+
+
+// iOS "clickable elements" fix for role="button"
+//
+// Fixes "clickability" issue (and more generally, the firing of events such as focus as well)
+// for traditionally non-focusable elements with role="button"
+// see https://developer.mozilla.org/en-US/docs/Web/Events/click#Safari_Mobile
+
+[role="button"] {
+ cursor: pointer;
+}
+
+
+// Avoid 300ms click delay on touch devices that support the `touch-action` CSS property.
+//
+// In particular, unlike most other browsers, IE11+Edge on Windows 10 on touch devices and IE Mobile 10-11
+// DON'T remove the click delay when `<meta name="viewport" content="width=device-width">` is present.
+// However, they DO support removing the click delay via `touch-action: manipulation`.
+// See:
+// * http://v4-alpha.getbootstrap.com/content/reboot/#click-delay-optimization-for-touch
+// * http://caniuse.com/#feat=css-touch-action
+// * http://patrickhlauke.github.io/touch/tests/results/#suppressing-300ms-delay
+
+a,
+area,
+button,
+[role="button"],
+input,
+label,
+select,
+summary,
+textarea {
+ touch-action: manipulation;
+}
+
+
+//
+// Tables
+//
+
+table {
+ // No longer part of Normalize since v4
+ border-collapse: collapse;
+ // Reset for nesting within parents with `background-color`.
+ background-color: $table-bg;
+}
+
+caption {
+ padding-top: $table-cell-padding;
+ padding-bottom: $table-cell-padding;
+ color: $text-muted;
+ text-align: left;
+ caption-side: bottom;
+}
+
+th {
+ // Centered by default, but left-align-ed to match the `td`s below.
+ text-align: left;
+}
+
+
+//
+// Forms
+//
+
+label {
+ // Allow labels to use `margin` for spacing.
+ display: inline-block;
+ margin-bottom: .5rem;
+}
+
+// Work around a Firefox/IE bug where the transparent `button` background
+// results in a loss of the default `button` focus styles.
+//
+// Credit: https://github.com/suitcss/base/
+button:focus {
+ outline: 1px dotted;
+ outline: 5px auto -webkit-focus-ring-color;
+}
+
+input,
+button,
+select,
+textarea {
+ // Remove all `margin`s so our classes don't have to do it themselves.
+ margin: 0;
+ // Normalize includes `font: inherit;`, so `font-family`. `font-size`, etc are
+ // properly inherited. However, `line-height` isn't addressed there. Using this
+ // ensures we don't need to unnecessarily redeclare the global font stack.
+ line-height: inherit;
+ // iOS adds rounded borders by default
+ border-radius: 0;
+}
+
+input[type="radio"],
+input[type="checkbox"] {
+ // Apply a disabled cursor for radios and checkboxes.
+ //
+ // Note: Neither radios nor checkboxes can be readonly.
+ &:disabled {
+ cursor: $cursor-disabled;
+ }
+}
+
+
+input[type="date"],
+input[type="time"],
+input[type="datetime-local"],
+input[type="month"] {
+ // Remove the default appearance of temporal inputs to avoid a Mobile Safari
+ // bug where setting a custom line-height prevents text from being vertically
+ // centered within the input.
+ //
+ // Bug report: https://github.com/twbs/bootstrap/issues/11266
+ -webkit-appearance: listbox;
+}
+
+textarea {
+ // Textareas should really only resize vertically so they don't break their (horizontal) containers.
+ resize: vertical;
+}
+
+fieldset {
+ // Chrome and Firefox set a `min-width: min-content;` on fieldsets,
+ // so we reset that to ensure it behaves more like a standard block element.
+ // See https://github.com/twbs/bootstrap/issues/12359.
+ min-width: 0;
+ // Reset the default outline behavior of fieldsets so they don't affect page layout.
+ padding: 0;
+ margin: 0;
+ border: 0;
+}
+
+legend {
+ // Reset the entire legend element to match the `fieldset`
+ display: block;
+ width: 100%;
+ padding: 0;
+ margin-bottom: .5rem;
+ font-size: 1.5rem;
+ line-height: inherit;
+}
+
+input[type="search"] {
+ // This overrides the extra rounded corners on search inputs in iOS so that our
+ // `.form-control` class can properly style them. Note that this cannot simply
+ // be added to `.form-control` as it's not specific enough. For details, see
+ // https://github.com/twbs/bootstrap/issues/11586.
+ -webkit-appearance: none;
+}
+
+// todo: needed?
+output {
+ display: inline-block;
+// font-size: $font-size-base;
+// line-height: $line-height;
+// color: $input-color;
+}
+
+// Always hide an element with the `hidden` HTML attribute (from PureCSS).
+[hidden] {
+ display: none !important;
+}
--- /dev/null
+// Credit: Nicolas Gallagher and SUIT CSS.
+
+.embed-responsive {
+ position: relative;
+ display: block;
+ height: 0;
+ padding: 0;
+ overflow: hidden;
+
+ .embed-responsive-item,
+ iframe,
+ embed,
+ object,
+ video {
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ border: 0;
+ }
+}
+
+.embed-responsive-21by9 {
+ padding-bottom: percentage(9 / 21);
+}
+
+.embed-responsive-16by9 {
+ padding-bottom: percentage(9 / 16);
+}
+
+.embed-responsive-4by3 {
+ padding-bottom: percentage(3 / 4);
+}
+
+.embed-responsive-1by1 {
+ padding-bottom: percentage(1 / 1);
+}
--- /dev/null
+//
+// Basic Bootstrap table
+//
+
+.table {
+ width: 100%;
+ max-width: 100%;
+ margin-bottom: $spacer;
+
+ th,
+ td {
+ padding: $table-cell-padding;
+ vertical-align: top;
+ border-top: $table-border-width solid $table-border-color;
+ }
+
+ thead th {
+ vertical-align: bottom;
+ border-bottom: (2 * $table-border-width) solid $table-border-color;
+ }
+
+ tbody + tbody {
+ border-top: (2 * $table-border-width) solid $table-border-color;
+ }
+
+ .table {
+ background-color: $body-bg;
+ }
+}
+
+
+//
+// Condensed table w/ half padding
+//
+
+.table-sm {
+ th,
+ td {
+ padding: $table-sm-cell-padding;
+ }
+}
+
+
+// Bordered version
+//
+// Add borders all around the table and between all the columns.
+
+.table-bordered {
+ border: $table-border-width solid $table-border-color;
+
+ th,
+ td {
+ border: $table-border-width solid $table-border-color;
+ }
+
+ thead {
+ th,
+ td {
+ border-bottom-width: (2 * $table-border-width);
+ }
+ }
+}
+
+
+// Zebra-striping
+//
+// Default zebra-stripe styles (alternating gray and transparent backgrounds)
+
+.table-striped {
+ tbody tr:nth-of-type(odd) {
+ background-color: $table-bg-accent;
+ }
+}
+
+
+// Hover effect
+//
+// Placed here since it has to come after the potential zebra striping
+
+.table-hover {
+ tbody tr {
+ @include hover {
+ background-color: $table-bg-hover;
+ }
+ }
+}
+
+
+// Table backgrounds
+//
+// Exact selectors below required to override `.table-striped` and prevent
+// inheritance to nested tables.
+
+// Generate the contextual variants
+@include table-row-variant(active, $table-bg-active);
+@include table-row-variant(success, $state-success-bg);
+@include table-row-variant(info, $state-info-bg);
+@include table-row-variant(warning, $state-warning-bg);
+@include table-row-variant(danger, $state-danger-bg);
+
+
+// Inverse styles
+//
+// Same table markup, but inverted color scheme—dark background and light text.
+
+.thead-inverse {
+ th {
+ color: #fff;
+ background-color: $gray-dark;
+ }
+}
+
+.thead-default {
+ th {
+ color: $gray;
+ background-color: $gray-lighter;
+ }
+}
+
+.table-inverse {
+ color: $gray-lighter;
+ background-color: $gray-dark;
+
+ th,
+ td,
+ thead th {
+ border-color: $gray;
+ }
+
+ &.table-bordered {
+ border: 0;
+ }
+}
+
+
+
+// Responsive tables
+//
+// Wrap your tables in `.table-responsive` and we'll make them mobile friendly
+// by enabling horizontal scrolling. Only applies <768px. Everything above that
+// will display normally.
+
+.table-responsive {
+ display: block;
+ width: 100%;
+ min-height: .01%; // Workaround for IE9 bug (see https://github.com/twbs/bootstrap/issues/14837)
+ overflow-x: auto;
+
+ // TODO: find out if we need this still.
+ //
+ // border: $table-border-width solid $table-border-color;
+ // -ms-overflow-style: -ms-autohiding-scrollbar; // See https://github.com/twbs/bootstrap/pull/10057
+}
+
+
+.table-reflow {
+ thead {
+ float: left;
+ }
+
+ tbody {
+ display: block;
+ white-space: nowrap;
+ }
+
+ th,
+ td {
+ border-top: $table-border-width solid $table-border-color;
+ border-left: $table-border-width solid $table-border-color;
+
+ &:last-child {
+ border-right: $table-border-width solid $table-border-color;
+ }
+ }
+
+ thead,
+ tbody,
+ tfoot {
+ &:last-child {
+ tr:last-child th,
+ tr:last-child td {
+ border-bottom: $table-border-width solid $table-border-color;
+ }
+ }
+ }
+
+ // scss-lint:disable ImportantRule
+ tr {
+ float: left;
+
+ th,
+ td {
+ display: block !important;
+ border: $table-border-width solid $table-border-color;
+ }
+ }
+ // scss-lint:enable ImportantRule
+}
--- /dev/null
+// Base class
+//
+// Requires one of the contextual, color modifier classes for `color` and
+// `background-color`.
+
+.tag {
+ display: inline-block;
+ padding: $tag-padding-y $tag-padding-x;
+ font-size: $tag-font-size;
+ font-weight: $tag-font-weight;
+ line-height: 1;
+ color: $tag-color;
+ text-align: center;
+ white-space: nowrap;
+ vertical-align: baseline;
+ @include border-radius();
+
+ // Empty tags collapse automatically
+ &:empty {
+ display: none;
+ }
+}
+
+// Quick fix for tags in buttons
+.btn .tag {
+ position: relative;
+ top: -1px;
+}
+
+// scss-lint:disable QualifyingElement
+// Add hover effects, but only for links
+a.tag {
+ @include hover-focus {
+ color: $tag-link-hover-color;
+ text-decoration: none;
+ cursor: pointer;
+ }
+}
+// scss-lint:enable QualifyingElement
+
+// Pill tags
+//
+// Make them extra rounded with a modifier to replace v3's badges.
+
+.tag-pill {
+ padding-right: $tag-pill-padding-x;
+ padding-left: $tag-pill-padding-x;
+ @include border-radius($tag-pill-border-radius);
+}
+
+// Colors
+//
+// Contextual variations (linked tags get darker on :hover).
+
+.tag-default {
+ @include tag-variant($tag-default-bg);
+}
+
+.tag-primary {
+ @include tag-variant($tag-primary-bg);
+}
+
+.tag-success {
+ @include tag-variant($tag-success-bg);
+}
+
+.tag-info {
+ @include tag-variant($tag-info-bg);
+}
+
+.tag-warning {
+ @include tag-variant($tag-warning-bg);
+}
+
+.tag-danger {
+ @include tag-variant($tag-danger-bg);
+}
--- /dev/null
+// Base class
+.tooltip {
+ position: absolute;
+ z-index: $zindex-tooltip;
+ display: block;
+ // Our parent element can be arbitrary since tooltips are by default inserted as a sibling of their target element.
+ // So reset our font and text properties to avoid inheriting weird values.
+ @include reset-text();
+ font-size: $font-size-sm;
+ // Allow breaking very long words so they don't overflow the tooltip's bounds
+ word-wrap: break-word;
+ opacity: 0;
+
+ &.in { opacity: $tooltip-opacity; }
+
+ &.tooltip-top,
+ &.bs-tether-element-attached-bottom {
+ padding: $tooltip-arrow-width 0;
+ margin-top: -$tooltip-margin;
+
+ .tooltip-arrow {
+ bottom: 0;
+ left: 50%;
+ margin-left: -$tooltip-arrow-width;
+ border-width: $tooltip-arrow-width $tooltip-arrow-width 0;
+ border-top-color: $tooltip-arrow-color;
+ }
+ }
+ &.tooltip-right,
+ &.bs-tether-element-attached-left {
+ padding: 0 $tooltip-arrow-width;
+ margin-left: $tooltip-margin;
+
+ .tooltip-arrow {
+ top: 50%;
+ left: 0;
+ margin-top: -$tooltip-arrow-width;
+ border-width: $tooltip-arrow-width $tooltip-arrow-width $tooltip-arrow-width 0;
+ border-right-color: $tooltip-arrow-color;
+ }
+ }
+ &.tooltip-bottom,
+ &.bs-tether-element-attached-top {
+ padding: $tooltip-arrow-width 0;
+ margin-top: $tooltip-margin;
+
+ .tooltip-arrow {
+ top: 0;
+ left: 50%;
+ margin-left: -$tooltip-arrow-width;
+ border-width: 0 $tooltip-arrow-width $tooltip-arrow-width;
+ border-bottom-color: $tooltip-arrow-color;
+ }
+ }
+ &.tooltip-left,
+ &.bs-tether-element-attached-right {
+ padding: 0 $tooltip-arrow-width;
+ margin-left: -$tooltip-margin;
+
+ .tooltip-arrow {
+ top: 50%;
+ right: 0;
+ margin-top: -$tooltip-arrow-width;
+ border-width: $tooltip-arrow-width 0 $tooltip-arrow-width $tooltip-arrow-width;
+ border-left-color: $tooltip-arrow-color;
+ }
+ }
+}
+
+// Wrapper for the tooltip content
+.tooltip-inner {
+ max-width: $tooltip-max-width;
+ padding: $tooltip-padding-y $tooltip-padding-x;
+ color: $tooltip-color;
+ text-align: center;
+ background-color: $tooltip-bg;
+ @include border-radius($border-radius);
+}
+
+// Arrows
+.tooltip-arrow {
+ position: absolute;
+ width: 0;
+ height: 0;
+ border-color: transparent;
+ border-style: solid;
+}
--- /dev/null
+//
+// Headings
+//
+
+h1, h2, h3, h4, h5, h6,
+.h1, .h2, .h3, .h4, .h5, .h6 {
+ margin-bottom: $headings-margin-bottom;
+ font-family: $headings-font-family;
+ font-weight: $headings-font-weight;
+ line-height: $headings-line-height;
+ color: $headings-color;
+}
+
+h1, .h1 { font-size: $font-size-h1; }
+h2, .h2 { font-size: $font-size-h2; }
+h3, .h3 { font-size: $font-size-h3; }
+h4, .h4 { font-size: $font-size-h4; }
+h5, .h5 { font-size: $font-size-h5; }
+h6, .h6 { font-size: $font-size-h6; }
+
+.lead {
+ font-size: $lead-font-size;
+ font-weight: $lead-font-weight;
+}
+
+// Type display classes
+.display-1 {
+ font-size: $display1-size;
+ font-weight: $display1-weight;
+}
+.display-2 {
+ font-size: $display2-size;
+ font-weight: $display2-weight;
+}
+.display-3 {
+ font-size: $display3-size;
+ font-weight: $display3-weight;
+}
+.display-4 {
+ font-size: $display4-size;
+ font-weight: $display4-weight;
+}
+
+
+//
+// Horizontal rules
+//
+
+hr {
+ margin-top: $spacer-y;
+ margin-bottom: $spacer-y;
+ border: 0;
+ border-top: $hr-border-width solid $hr-border-color;
+}
+
+
+//
+// Emphasis
+//
+
+small,
+.small {
+ font-size: $small-font-size;
+ font-weight: normal;
+}
+
+mark,
+.mark {
+ padding: $mark-padding;
+ background-color: $mark-bg;
+}
+
+
+//
+// Lists
+//
+
+.list-unstyled {
+ @include list-unstyled;
+}
+
+// Inline turns list items into inline-block
+.list-inline {
+ @include list-unstyled;
+}
+.list-inline-item {
+ display: inline-block;
+
+ &:not(:last-child) {
+ margin-right: $list-inline-padding;
+ }
+}
+
+
+//
+// Misc
+//
+
+// Builds on `abbr`
+.initialism {
+ font-size: 90%;
+ text-transform: uppercase;
+}
+
+// Blockquotes
+.blockquote {
+ padding: ($spacer / 2) $spacer;
+ margin-bottom: $spacer;
+ font-size: $blockquote-font-size;
+ border-left: $blockquote-border-width solid $blockquote-border-color;
+}
+
+.blockquote-footer {
+ display: block;
+ font-size: 80%; // back to default font-size
+ color: $blockquote-small-color;
+
+ &::before {
+ content: "\2014 \00A0"; // em dash, nbsp
+ }
+}
+
+// Opposite alignment of blockquote
+.blockquote-reverse {
+ padding-right: $spacer;
+ padding-left: 0;
+ text-align: right;
+ border-right: $blockquote-border-width solid $blockquote-border-color;
+ border-left: 0;
+}
+
+.blockquote-reverse .blockquote-footer {
+ &::before {
+ content: "";
+ }
+ &::after {
+ content: "\00A0 \2014"; // nbsp, em dash
+ }
+}
+
+@if not $enable-flex {
+ // Clean up some horizontal `<dl>`s built with grids
+ // scss-lint:disable QualifyingElement
+ dl.row {
+ > dd + dt {
+ clear: left;
+ }
+ }
+ // scss-lint:enable QualifyingElement
+}
--- /dev/null
+@import "utilities/background";
+@import "utilities/clearfix";
+@import "utilities/display";
+@import "utilities/flex";
+@import "utilities/pulls";
+@import "utilities/screenreaders";
+@import "utilities/spacing";
+@import "utilities/text";
+@import "utilities/visibility";
--- /dev/null
+// Variables
+//
+// Copy settings from this file into the provided `_custom.scss` to override
+// the Bootstrap defaults without modifying key, versioned files.
+
+
+// Table of Contents
+//
+// Colors
+// Options
+// Spacing
+// Body
+// Links
+// Grid breakpoints
+// Grid containers
+// Grid columns
+// Fonts
+// Components
+
+@mixin _assert-ascending($map, $map-name) {
+ $prev-key: null;
+ $prev-num: null;
+ @each $key, $num in $map {
+ @if $prev-num == null {
+ // Do nothing
+ } @else if not comparable($prev-num, $num) {
+ @warn "Potentially invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} whose unit makes it incomparable to #{$prev-num}, the value of the previous key '#{$prev-key}' !";
+ } @else if $prev-num >= $num {
+ @warn "Invalid value for #{$map-name}: This map must be in ascending order, but key '#{$key}' has value #{$num} which isn't greater than #{$prev-num}, the value of the previous key '#{$prev-key}' !";
+ }
+ $prev-key: $key;
+ $prev-num: $num;
+ }
+}
+
+// General variable structure
+//
+// Variable format should follow the `$component-modifier-state-property` order.
+
+
+// Colors
+//
+// Grayscale and brand colors for use across Bootstrap.
+
+$gray-dark: #373a3c !default;
+$gray: #55595c !default;
+$gray-light: #818a91 !default;
+$gray-lighter: #eceeef !default;
+$gray-lightest: #f7f7f9 !default;
+
+$brand-primary: #0275d8 !default;
+$brand-success: #5cb85c !default;
+$brand-info: #5bc0de !default;
+$brand-warning: #f0ad4e !default;
+$brand-danger: #d9534f !default;
+$brand-inverse: $gray-dark !default;
+
+
+// Options
+//
+// Quickly modify global styling by enabling or disabling optional features.
+
+$enable-flex: false !default;
+$enable-rounded: true !default;
+$enable-shadows: false !default;
+$enable-gradients: false !default;
+$enable-transitions: false !default;
+$enable-hover-media-query: false !default;
+$enable-grid-classes: true !default;
+$enable-print-styles: true !default;
+
+
+// Spacing
+//
+// Control the default styling of most Bootstrap elements by modifying these
+// variables. Mostly focused on spacing.
+// You can add more entries to the $spacers map, should you need more variation.
+
+$spacer: 1rem !default;
+$spacer-x: $spacer !default;
+$spacer-y: $spacer !default;
+$spacers: (
+ 0: (
+ x: 0,
+ y: 0
+ ),
+ 1: (
+ x: $spacer-x,
+ y: $spacer-y
+ ),
+ 2: (
+ x: ($spacer-x * 1.5),
+ y: ($spacer-y * 1.5)
+ ),
+ 3: (
+ x: ($spacer-x * 3),
+ y: ($spacer-y * 3)
+ )
+) !default;
+$border-width: 1px !default;
+
+
+// Body
+//
+// Settings for the `<body>` element.
+
+$body-bg: #fff !default;
+$body-color: $gray-dark !default;
+
+
+// Links
+//
+// Style anchor elements.
+
+$link-color: $brand-primary !default;
+$link-decoration: none !default;
+$link-hover-color: darken($link-color, 15%) !default;
+$link-hover-decoration: underline !default;
+
+
+// Grid breakpoints
+//
+// Define the minimum dimensions at which your layout will change,
+// adapting to different screen sizes, for use in media queries.
+
+$grid-breakpoints: (
+ xs: 0,
+ sm: 544px,
+ md: 768px,
+ lg: 992px,
+ xl: 1200px
+) !default;
+@include _assert-ascending($grid-breakpoints, "$grid-breakpoints");
+
+
+// Grid containers
+//
+// Define the maximum width of `.container` for different screen sizes.
+
+$container-max-widths: (
+ sm: 576px,
+ md: 720px,
+ lg: 940px,
+ xl: 1140px
+) !default;
+@include _assert-ascending($container-max-widths, "$container-max-widths");
+
+
+// Grid columns
+//
+// Set the number of columns and specify the width of the gutters.
+
+$grid-columns: 12 !default;
+$grid-gutter-width: 30px !default;
+
+
+// Typography
+//
+// Font, line-height, and color for body text, headings, and more.
+
+$font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !default;
+$font-family-serif: Georgia, "Times New Roman", Times, serif !default;
+$font-family-monospace: Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace !default;
+$font-family-base: $font-family-sans-serif !default;
+
+// Pixel value used to responsively scale all typography. Applied to the `<html>` element.
+$font-size-root: 16px !default;
+
+$font-size-base: 1rem !default;
+$font-size-lg: 1.25rem !default;
+$font-size-sm: .875rem !default;
+$font-size-xs: .75rem !default;
+
+$line-height-base: 1.5 !default;
+
+$font-size-h1: 2.5rem !default;
+$font-size-h2: 2rem !default;
+$font-size-h3: 1.75rem !default;
+$font-size-h4: 1.5rem !default;
+$font-size-h5: 1.25rem !default;
+$font-size-h6: 1rem !default;
+
+$display1-size: 6rem !default;
+$display2-size: 5.5rem !default;
+$display3-size: 4.5rem !default;
+$display4-size: 3.5rem !default;
+
+$display1-weight: 300 !default;
+$display2-weight: 300 !default;
+$display3-weight: 300 !default;
+$display4-weight: 300 !default;
+
+$headings-margin-bottom: ($spacer / 2) !default;
+$headings-font-family: inherit !default;
+$headings-font-weight: 500 !default;
+$headings-line-height: 1.1 !default;
+$headings-color: inherit !default;
+
+$lead-font-size: 1.25rem !default;
+$lead-font-weight: 300 !default;
+
+$small-font-size: 80% !default;
+
+$text-muted: $gray-light !default;
+
+$abbr-border-color: $gray-light !default;
+
+$blockquote-small-color: $gray-light !default;
+$blockquote-font-size: ($font-size-base * 1.25) !default;
+$blockquote-border-color: $gray-lighter !default;
+$blockquote-border-width: .25rem !default;
+
+$hr-border-color: rgba(0,0,0,.1) !default;
+$hr-border-width: $border-width !default;
+
+$mark-padding: .2em !default;
+
+$dt-font-weight: bold !default;
+
+$kbd-box-shadow: inset 0 -.1rem 0 rgba(0,0,0,.25) !default;
+$nested-kbd-font-weight: bold !default;
+
+$list-inline-padding: 5px !default;
+
+
+// Components
+//
+// Define common padding and border radius sizes and more.
+
+$line-height-lg: (4 / 3) !default;
+$line-height-sm: 1.5 !default;
+
+$border-radius: .25rem !default;
+$border-radius-lg: .3rem !default;
+$border-radius-sm: .2rem !default;
+
+$component-active-color: #fff !default;
+$component-active-bg: $brand-primary !default;
+
+$caret-width: .3em !default;
+$caret-width-lg: $caret-width !default;
+
+
+// Tables
+//
+// Customizes the `.table` component with basic values, each used across all table variations.
+
+$table-cell-padding: .75rem !default;
+$table-sm-cell-padding: .3rem !default;
+
+$table-bg: transparent !default;
+$table-bg-accent: rgba(0,0,0,.05) !default;
+$table-bg-hover: rgba(0,0,0,.075) !default;
+$table-bg-active: $table-bg-hover !default;
+
+$table-border-width: $border-width !default;
+$table-border-color: $gray-lighter !default;
+
+
+// Buttons
+//
+// For each of Bootstrap's buttons, define text, background and border color.
+
+$btn-padding-x: 1rem !default;
+$btn-padding-y: .5rem !default;
+$btn-line-height: 1.25 !default;
+$btn-font-weight: normal !default;
+$btn-box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 1px 1px rgba(0,0,0,.075) !default;
+$btn-active-box-shadow: inset 0 3px 5px rgba(0,0,0,.125) !default;
+
+$btn-primary-color: #fff !default;
+$btn-primary-bg: $brand-primary !default;
+$btn-primary-border: $btn-primary-bg !default;
+
+$btn-secondary-color: $gray-dark !default;
+$btn-secondary-bg: #fff !default;
+$btn-secondary-border: #ccc !default;
+
+$btn-info-color: #fff !default;
+$btn-info-bg: $brand-info !default;
+$btn-info-border: $btn-info-bg !default;
+
+$btn-success-color: #fff !default;
+$btn-success-bg: $brand-success !default;
+$btn-success-border: $btn-success-bg !default;
+
+$btn-warning-color: #fff !default;
+$btn-warning-bg: $brand-warning !default;
+$btn-warning-border: $btn-warning-bg !default;
+
+$btn-danger-color: #fff !default;
+$btn-danger-bg: $brand-danger !default;
+$btn-danger-border: $btn-danger-bg !default;
+
+$btn-link-disabled-color: $gray-light !default;
+
+$btn-padding-x-sm: .5rem !default;
+$btn-padding-y-sm: .25rem !default;
+
+$btn-padding-x-lg: 1.5rem !default;
+$btn-padding-y-lg: .75rem !default;
+
+$btn-block-spacing-y: .5rem !default;
+$btn-toolbar-margin: .5rem !default;
+
+// Allows for customizing button radius independently from global border radius
+$btn-border-radius: $border-radius !default;
+$btn-border-radius-lg: $border-radius-lg !default;
+$btn-border-radius-sm: $border-radius-sm !default;
+
+
+// Forms
+
+$input-padding-x: .75rem !default;
+$input-padding-y: .5rem !default;
+$input-line-height: 1.25 !default;
+
+$input-bg: #fff !default;
+$input-bg-disabled: $gray-lighter !default;
+
+$input-color: $gray !default;
+$input-border-color: rgba(0,0,0,.15) !default;
+$input-btn-border-width: $border-width !default; // For form controls and buttons
+$input-box-shadow: inset 0 1px 1px rgba(0,0,0,.075) !default;
+
+$input-border-radius: $border-radius !default;
+$input-border-radius-lg: $border-radius-lg !default;
+$input-border-radius-sm: $border-radius-sm !default;
+
+$input-bg-focus: $input-bg;
+$input-border-focus: #66afe9 !default;
+$input-box-shadow-focus: rgba(102,175,233,.6) !default;
+$input-color-focus: $input-color;
+
+$input-color-placeholder: #999 !default;
+
+$input-padding-x-sm: .5rem !default;
+$input-padding-y-sm: .25rem !default;
+
+$input-padding-x-lg: 1.5rem !default;
+$input-padding-y-lg: .75rem !default;
+
+$input-height: (($font-size-base * $line-height-base) + ($input-padding-y * 2)) !default;
+$input-height-lg: (($font-size-lg * $line-height-lg) + ($input-padding-y-lg * 2)) !default;
+$input-height-sm: (($font-size-sm * $line-height-sm) + ($input-padding-y-sm * 2)) !default;
+
+$form-group-margin-bottom: $spacer-y !default;
+
+$input-group-addon-bg: $gray-lighter !default;
+$input-group-addon-border-color: $input-border-color !default;
+
+$cursor-disabled: not-allowed !default;
+
+$custom-control-gutter: 1.5rem !default;
+$custom-control-spacer-x: 1rem !default;
+$custom-control-spacer-y: .25rem !default;
+
+$custom-control-indicator-size: 1rem !default;
+$custom-control-indicator-bg: #ddd !default;
+$custom-control-indicator-bg-size: 50% 50% !default;
+$custom-control-indicator-box-shadow: inset 0 .25rem .25rem rgba(0,0,0,.1) !default;
+
+$custom-control-disabled-cursor: $cursor-disabled !default;
+$custom-control-disabled-indicator-bg: #eee !default;
+$custom-control-disabled-description-color: #767676 !default;
+
+$custom-control-checked-indicator-color: #fff !default;
+$custom-control-checked-indicator-bg: #0074d9 !default;
+$custom-control-checked-indicator-box-shadow: none !default;
+
+$custom-control-focus-indicator-box-shadow: 0 0 0 .075rem #fff, 0 0 0 .2rem #0074d9 !default;
+
+$custom-control-active-indicator-color: #fff !default;
+$custom-control-active-indicator-bg: #84c6ff !default;
+$custom-control-active-indicator-box-shadow: none !default;
+
+$custom-checkbox-radius: $border-radius !default;
+$custom-checkbox-checked-icon: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26 2.974 7.25 8 2.193z'/%3E%3C/svg%3E") !default;
+$custom-checkbox-indeterminate-bg: #0074d9 !default;
+$custom-checkbox-indeterminate-icon: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 4'%3E%3Cpath stroke='%23fff' d='M0 2h4'/%3E%3C/svg%3E") !default;
+$custom-checkbox-indeterminate-box-shadow: none !default;
+
+$custom-radio-radius: 50% !default;
+$custom-radio-checked-icon: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3E%3Ccircle r='3' fill='%23fff'/%3E%3C/svg%3E") !default;
+
+$custom-select-padding-x: .75rem !default;
+$custom-select-padding-y: .375rem !default;
+$custom-select-indicator-padding: 1rem !default; // Extra padding to account for the presence of the background-image based indicator
+$custom-select-color: $input-color !default;
+$custom-select-disabled-color: $gray-light !default;
+$custom-select-bg: #fff !default;
+$custom-select-disabled-bg: $gray-lighter !default;
+$custom-select-bg-size: 8px 10px !default; // In pixels because image dimensions
+$custom-select-indicator: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'%3E%3Cpath fill='%23333' d='M2 0L0 2h4zm0 5L0 3h4z'/%3E%3C/svg%3E") !default;
+$custom-select-border-width: $input-btn-border-width !default;
+$custom-select-border-color: $input-border-color !default;
+$custom-select-border-radius: $border-radius !default;
+
+$custom-select-focus-border-color: #51a7e8 !default;
+$custom-select-focus-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .075), 0 0 5px rgba(81, 167, 232, .5) !default;
+
+$custom-select-sm-padding-y: .2rem !default;
+$custom-select-sm-font-size: 75% !default;
+
+$custom-file-height: 2.5rem !default;
+$custom-file-width: 14rem !default;
+$custom-file-focus-box-shadow: 0 0 0 .075rem #fff, 0 0 0 .2rem #0074d9 !default;
+
+$custom-file-padding-x: .5rem !default;
+$custom-file-padding-y: 1rem !default;
+$custom-file-line-height: 1.5 !default;
+$custom-file-color: #555 !default;
+$custom-file-bg: #fff !default;
+$custom-file-border-width: $border-width !default;
+$custom-file-border-color: #ddd !default;
+$custom-file-border-radius: $border-radius !default;
+$custom-file-box-shadow: inset 0 .2rem .4rem rgba(0,0,0,.05) !default;
+$custom-file-button-color: $custom-file-color !default;
+$custom-file-button-bg: #eee !default;
+$custom-file-text: (
+ placeholder: (
+ en: "Choose file..."
+ ),
+ button-label: (
+ en: "Browse"
+ )
+) !default;
+
+
+// Form validation icons
+$form-icon-success: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%235cb85c' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3E%3C/svg%3E") !default;
+$form-icon-warning: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%23f0ad4e' d='M4.4 5.324h-.8v-2.46h.8zm0 1.42h-.8V5.89h.8zM3.76.63L.04 7.075c-.115.2.016.425.26.426h7.397c.242 0 .372-.226.258-.426C6.726 4.924 5.47 2.79 4.253.63c-.113-.174-.39-.174-.494 0z'/%3E%3C/svg%3E") !default;
+$form-icon-danger: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23d9534f' viewBox='-2 -2 7 7'%3E%3Cpath stroke='%23d9534f' d='M0 0l3 3m0-3L0 3'/%3E%3Ccircle r='.5'/%3E%3Ccircle cx='3' r='.5'/%3E%3Ccircle cy='3' r='.5'/%3E%3Ccircle cx='3' cy='3' r='.5'/%3E%3C/svg%3E") !default;
+
+
+// Dropdowns
+//
+// Dropdown menu container and contents.
+
+$dropdown-min-width: 160px !default;
+$dropdown-padding-y: 5px !default;
+$dropdown-margin-top: 2px !default;
+$dropdown-bg: #fff !default;
+$dropdown-border-color: rgba(0,0,0,.15) !default;
+$dropdown-border-width: $border-width !default;
+$dropdown-divider-bg: #e5e5e5 !default;
+$dropdown-box-shadow: 0 6px 12px rgba(0,0,0,.175) !default;
+
+$dropdown-link-color: $gray-dark !default;
+$dropdown-link-hover-color: darken($gray-dark, 5%) !default;
+$dropdown-link-hover-bg: #f5f5f5 !default;
+
+$dropdown-link-active-color: $component-active-color !default;
+$dropdown-link-active-bg: $component-active-bg !default;
+
+$dropdown-link-disabled-color: $gray-light !default;
+
+$dropdown-item-padding-x: 20px !default;
+
+$dropdown-header-color: $gray-light !default;
+
+
+// Z-index master list
+//
+// Warning: Avoid customizing these values. They're used for a bird's eye view
+// of components dependent on the z-axis and are designed to all work together.
+
+$zindex-dropdown-backdrop: 990 !default;
+$zindex-navbar: 1000 !default;
+$zindex-dropdown: 1000 !default;
+$zindex-popover: 1060 !default;
+$zindex-tooltip: 1070 !default;
+$zindex-navbar-fixed: 1030 !default;
+$zindex-navbar-sticky: 1030 !default;
+$zindex-modal-bg: 1040 !default;
+$zindex-modal: 1050 !default;
+
+
+// Navbar
+
+$navbar-border-radius: $border-radius !default;
+$navbar-padding-x: $spacer !default;
+$navbar-padding-y: ($spacer / 2) !default;
+$navbar-brand-padding-y: .25rem !default;
+
+$navbar-dark-color: rgba(255,255,255,.5) !default;
+$navbar-dark-hover-color: rgba(255,255,255,.75) !default;
+$navbar-dark-active-color: rgba(255,255,255,1) !default;
+$navbar-dark-disabled-color: rgba(255,255,255,.25) !default;
+
+$navbar-light-color: rgba(0,0,0,.3) !default;
+$navbar-light-hover-color: rgba(0,0,0,.6) !default;
+$navbar-light-active-color: rgba(0,0,0,.8) !default;
+$navbar-light-disabled-color: rgba(0,0,0,.15) !default;
+
+
+// Navs
+
+$nav-item-margin: .2rem !default;
+$nav-item-inline-spacer: 1rem !default;
+$nav-link-padding: .5em 1em !default;
+$nav-link-hover-bg: $gray-lighter !default;
+$nav-disabled-link-color: $gray-light !default;
+$nav-disabled-link-hover-color: $gray-light !default;
+$nav-disabled-link-hover-bg: transparent !default;
+
+$nav-tabs-border-color: #ddd !default;
+$nav-tabs-border-width: $border-width !default;
+$nav-tabs-border-radius: $border-radius !default;
+$nav-tabs-link-hover-border-color: $gray-lighter !default;
+$nav-tabs-active-link-hover-color: $gray !default;
+$nav-tabs-active-link-hover-bg: $body-bg !default;
+$nav-tabs-active-link-hover-border-color: #ddd !default;
+$nav-tabs-justified-link-border-color: #ddd !default;
+$nav-tabs-justified-active-link-border-color: $body-bg !default;
+
+$nav-pills-border-radius: $border-radius !default;
+$nav-pills-active-link-color: $component-active-color !default;
+$nav-pills-active-link-bg: $component-active-bg !default;
+
+
+// Pagination
+
+$pagination-padding-x: .75rem !default;
+$pagination-padding-y: .5rem !default;
+$pagination-padding-x-sm: .75rem !default;
+$pagination-padding-y-sm: .275rem !default;
+$pagination-padding-x-lg: 1.5rem !default;
+$pagination-padding-y-lg: .75rem !default;
+
+
+$pagination-color: $link-color !default;
+$pagination-bg: #fff !default;
+$pagination-border-width: $border-width !default;
+$pagination-border-color: #ddd !default;
+
+$pagination-hover-color: $link-hover-color !default;
+$pagination-hover-bg: $gray-lighter !default;
+$pagination-hover-border: #ddd !default;
+
+$pagination-active-color: #fff !default;
+$pagination-active-bg: $brand-primary !default;
+$pagination-active-border: $brand-primary !default;
+
+$pagination-disabled-color: $gray-light !default;
+$pagination-disabled-bg: #fff !default;
+$pagination-disabled-border: #ddd !default;
+
+
+// Jumbotron
+
+$jumbotron-padding: 2rem !default;
+$jumbotron-bg: $gray-lighter !default;
+
+
+// Form states and alerts
+//
+// Define colors for form feedback states and, by default, alerts.
+
+$state-success-text: #3c763d !default;
+$state-success-bg: #dff0d8 !default;
+$state-success-border: darken($state-success-bg, 5%) !default;
+
+$state-info-text: #31708f !default;
+$state-info-bg: #d9edf7 !default;
+$state-info-border: darken($state-info-bg, 7%) !default;
+
+$state-warning-text: #8a6d3b !default;
+$state-warning-bg: #fcf8e3 !default;
+$mark-bg: $state-warning-bg !default;
+$state-warning-border: darken($state-warning-bg, 5%) !default;
+
+$state-danger-text: #a94442 !default;
+$state-danger-bg: #f2dede !default;
+$state-danger-border: darken($state-danger-bg, 5%) !default;
+
+
+// Cards
+$card-spacer-x: 1.25rem !default;
+$card-spacer-y: .75rem !default;
+$card-border-width: 1px !default;
+$card-border-radius: $border-radius !default;
+$card-border-color: rgba(0,0,0,.125) !default;
+$card-border-radius-inner: $card-border-radius !default;
+$card-cap-bg: #f5f5f5 !default;
+$card-bg: #fff !default;
+
+$card-link-hover-color: #fff !default;
+
+$card-img-overlay-padding: 1.25rem !default;
+
+$card-deck-margin: .625rem !default;
+
+$card-columns-sm-up-column-gap: 1.25rem !default;
+
+
+// Tooltips
+
+$tooltip-max-width: 200px !default;
+$tooltip-color: #fff !default;
+$tooltip-bg: #000 !default;
+$tooltip-opacity: .9 !default;
+$tooltip-padding-y: 3px !default;
+$tooltip-padding-x: 8px !default;
+$tooltip-margin: 3px !default;
+
+$tooltip-arrow-width: 5px !default;
+$tooltip-arrow-color: $tooltip-bg !default;
+
+
+// Popovers
+
+$popover-inner-padding: 1px !default;
+$popover-bg: #fff !default;
+$popover-max-width: 276px !default;
+$popover-border-width: $border-width !default;
+$popover-border-color: rgba(0,0,0,.2) !default;
+$popover-box-shadow: 0 5px 10px rgba(0,0,0,.2) !default;
+
+$popover-title-bg: darken($popover-bg, 3%) !default;
+$popover-title-padding-x: 14px !default;
+$popover-title-padding-y: 8px !default;
+
+$popover-content-padding-x: 14px !default;
+$popover-content-padding-y: 9px !default;
+
+$popover-arrow-width: 10px !default;
+$popover-arrow-color: $popover-bg !default;
+
+$popover-arrow-outer-width: ($popover-arrow-width + 1px) !default;
+$popover-arrow-outer-color: fade-in($popover-border-color, .05) !default;
+
+
+// Tags
+
+$tag-default-bg: $gray-light !default;
+$tag-primary-bg: $brand-primary !default;
+$tag-success-bg: $brand-success !default;
+$tag-info-bg: $brand-info !default;
+$tag-warning-bg: $brand-warning !default;
+$tag-danger-bg: $brand-danger !default;
+
+$tag-color: #fff !default;
+$tag-link-hover-color: #fff !default;
+$tag-font-size: 75% !default;
+$tag-font-weight: bold !default;
+$tag-padding-x: .4em !default;
+$tag-padding-y: .25em !default;
+
+$tag-pill-padding-x: .6em !default;
+// Use a higher than normal value to ensure completely rounded edges when
+// customizing padding or font-size on labels.
+$tag-pill-border-radius: 10rem !default;
+
+// Modals
+
+// Padding applied to the modal body
+$modal-inner-padding: 15px !default;
+
+$modal-dialog-margin: 10px !default;
+$modal-dialog-sm-up-margin-y: 30px !default;
+
+$modal-title-padding: 15px !default;
+$modal-title-line-height: $line-height-base !default;
+
+$modal-content-bg: #fff !default;
+$modal-content-border-color: rgba(0,0,0,.2) !default;
+$modal-content-border-width: $border-width !default;
+$modal-content-xs-box-shadow: 0 3px 9px rgba(0,0,0,.5) !default;
+$modal-content-sm-up-box-shadow: 0 5px 15px rgba(0,0,0,.5) !default;
+
+$modal-backdrop-bg: #000 !default;
+$modal-backdrop-opacity: .5 !default;
+$modal-header-border-color: #e5e5e5 !default;
+$modal-footer-border-color: $modal-header-border-color !default;
+$modal-header-border-width: $modal-content-border-width !default;
+$modal-footer-border-width: $modal-header-border-width !default;
+
+$modal-lg: 900px !default;
+$modal-md: 600px !default;
+$modal-sm: 300px !default;
+
+
+// Alerts
+//
+// Define alert colors, border radius, and padding.
+
+$alert-padding: 15px !default;
+$alert-border-radius: $border-radius !default;
+$alert-link-font-weight: bold !default;
+$alert-border-width: $border-width !default;
+
+$alert-success-bg: $state-success-bg !default;
+$alert-success-text: $state-success-text !default;
+$alert-success-border: $state-success-border !default;
+
+$alert-info-bg: $state-info-bg !default;
+$alert-info-text: $state-info-text !default;
+$alert-info-border: $state-info-border !default;
+
+$alert-warning-bg: $state-warning-bg !default;
+$alert-warning-text: $state-warning-text !default;
+$alert-warning-border: $state-warning-border !default;
+
+$alert-danger-bg: $state-danger-bg !default;
+$alert-danger-text: $state-danger-text !default;
+$alert-danger-border: $state-danger-border !default;
+
+
+// Progress bars
+
+$progress-bg: #eee !default;
+$progress-bar-color: #0074d9 !default;
+$progress-border-radius: $border-radius !default;
+$progress-box-shadow: inset 0 .1rem .1rem rgba(0,0,0,.1) !default;
+
+$progress-bar-bg: $brand-primary !default;
+$progress-bar-success-bg: $brand-success !default;
+$progress-bar-warning-bg: $brand-warning !default;
+$progress-bar-danger-bg: $brand-danger !default;
+$progress-bar-info-bg: $brand-info !default;
+
+
+// List group
+
+$list-group-bg: #fff !default;
+$list-group-border-color: #ddd !default;
+$list-group-border-width: $border-width !default;
+$list-group-border-radius: $border-radius !default;
+
+$list-group-hover-bg: #f5f5f5 !default;
+$list-group-active-color: $component-active-color !default;
+$list-group-active-bg: $component-active-bg !default;
+$list-group-active-border: $list-group-active-bg !default;
+$list-group-active-text-color: lighten($list-group-active-bg, 40%) !default;
+
+$list-group-disabled-color: $gray-light !default;
+$list-group-disabled-bg: $gray-lighter !default;
+$list-group-disabled-text-color: $list-group-disabled-color !default;
+
+$list-group-link-color: #555 !default;
+$list-group-link-hover-color: $list-group-link-color !default;
+$list-group-link-heading-color: #333 !default;
+
+$list-group-item-padding-x: 1.25rem !default;
+$list-group-item-padding-y: .75rem !default;
+$list-group-item-heading-margin-bottom: 5px !default;
+
+
+// Image thumbnails
+
+$thumbnail-padding: .25rem !default;
+$thumbnail-bg: $body-bg !default;
+$thumbnail-border-width: $border-width !default;
+$thumbnail-border-color: #ddd !default;
+$thumbnail-border-radius: $border-radius !default;
+$thumbnail-box-shadow: 0 1px 2px rgba(0,0,0,.075) !default;
+
+
+// Figures
+
+$figure-caption-font-size: 90% !default;
+
+
+// Breadcrumbs
+
+$breadcrumb-padding-y: .75rem !default;
+$breadcrumb-padding-x: 1rem !default;
+$breadcrumb-item-padding: .5rem !default;
+
+$breadcrumb-bg: $gray-lighter !default;
+$breadcrumb-divider-color: $gray-light !default;
+$breadcrumb-active-color: $gray-light !default;
+$breadcrumb-divider: "/" !default;
+
+
+// Media objects
+
+$media-margin-top: 15px !default;
+$media-heading-margin-bottom: 5px !default;
+$media-alignment-padding-x: 10px !default;
+
+
+// Carousel
+
+$carousel-text-shadow: 0 1px 2px rgba(0,0,0,.6) !default;
+
+$carousel-control-color: #fff !default;
+$carousel-control-width: 15% !default;
+$carousel-control-sm-up-size: 30px !default;
+$carousel-control-opacity: .5 !default;
+$carousel-control-font-size: 20px !default;
+
+$carousel-indicators-width: 60% !default;
+
+$carousel-indicator-size: 10px !default;
+$carousel-indicator-active-size: 12px !default;
+$carousel-indicator-active-bg: #fff !default;
+$carousel-indicator-border-color: #fff !default;
+
+$carousel-caption-width: 70% !default;
+$carousel-caption-sm-up-width: 60% !default;
+$carousel-caption-color: #fff !default;
+
+$carousel-icon-width: 20px !default;
+
+
+// Close
+
+$close-font-weight: bold !default;
+$close-color: #000 !default;
+$close-text-shadow: 0 1px 0 #fff !default;
+
+
+// Code
+
+$code-font-size: 90% !default;
+$code-padding-x: .4rem !default;
+$code-padding-y: .2rem !default;
+$code-color: #bd4147 !default;
+$code-bg: #f7f7f9 !default;
+
+$kbd-color: #fff !default;
+$kbd-bg: #333 !default;
+
+$pre-bg: #f7f7f9 !default;
+$pre-color: $gray-dark !default;
+$pre-border-color: #ccc !default;
+$pre-scrollable-max-height: 340px !default;
--- /dev/null
+// Bootstrap with Flexbox enabled
+//
+// Includes all the imports from the standard Bootstrap project, but enables
+// the flexbox variable.
+
+$enable-flex: true;
+
+@import "bootstrap";
--- /dev/null
+// Bootstrap Grid only
+//
+// Includes relevant variables and mixins for the regular (non-flexbox) grid
+// system, as well as the generated predefined classes (e.g., `.col-4-sm`).
+
+
+//
+// Variables
+//
+
+@import "custom";
+@import "variables";
+
+//
+// Grid mixins
+//
+
+@import "mixins/clearfix";
+@import "mixins/breakpoints";
+@import "mixins/grid-framework";
+@import "mixins/grid";
+
+@import "grid";
--- /dev/null
+// Bootstrap Reboot only
+//
+// Includes only Normalize and our custom Reboot reset.
+
+@import "custom";
+@import "variables";
+@import "mixins/hover";
+@import "mixins/tab-focus";
+
+@import "normalize";
+@import "reboot";
--- /dev/null
+/*!
+ * Bootstrap v4.0.0-alpha.3 (http://getbootstrap.com)
+ * Copyright 2011-2016 The Bootstrap Authors
+ * Copyright 2011-2016 Twitter, Inc.
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
+ */
+
+// Core variables and mixins
+@import "custom";
+@import "variables";
+@import "mixins";
+
+// Reset and dependencies
+@import "normalize";
+@import "print";
+
+// Core CSS
+@import "reboot";
+@import "type";
+@import "images";
+@import "code";
+@import "grid";
+@import "tables";
+@import "forms";
+@import "buttons";
+
+// Components
+@import "animation";
+@import "dropdown";
+@import "button-group";
+@import "input-group";
+@import "custom-forms";
+@import "nav";
+@import "navbar";
+@import "card";
+@import "breadcrumb";
+@import "pagination";
+@import "tags";
+@import "jumbotron";
+@import "alert";
+@import "progress";
+@import "media";
+@import "list-group";
+@import "responsive-embed";
+@import "close";
+
+// Components w/ JavaScript
+@import "modal";
+@import "tooltip";
+@import "popover";
+@import "carousel";
+
+// Utility classes
+@import "utilities";
--- /dev/null
+// Alerts
+
+@mixin alert-variant($background, $border, $body-color) {
+ background-color: $background;
+ border-color: $border;
+ color: $body-color;
+
+ hr {
+ border-top-color: darken($border, 5%);
+ }
+ .alert-link {
+ color: darken($body-color, 10%);
+ }
+}
--- /dev/null
+// Contextual backgrounds
+
+@mixin bg-variant($parent, $color) {
+ #{$parent} {
+ color: #fff !important;
+ background-color: $color !important;
+ }
+ a#{$parent} {
+ @include hover-focus {
+ background-color: darken($color, 10%) !important;
+ }
+ }
+}
--- /dev/null
+// Single side border-radius
+
+@mixin border-radius($radius: $border-radius) {
+ @if $enable-rounded {
+ border-radius: $radius;
+ }
+}
+
+@mixin border-top-radius($radius) {
+ @if $enable-rounded {
+ border-top-right-radius: $radius;
+ border-top-left-radius: $radius;
+ }
+}
+
+@mixin border-right-radius($radius) {
+ @if $enable-rounded {
+ border-bottom-right-radius: $radius;
+ border-top-right-radius: $radius;
+ }
+}
+
+@mixin border-bottom-radius($radius) {
+ @if $enable-rounded {
+ border-bottom-right-radius: $radius;
+ border-bottom-left-radius: $radius;
+ }
+}
+
+@mixin border-left-radius($radius) {
+ @if $enable-rounded {
+ border-bottom-left-radius: $radius;
+ border-top-left-radius: $radius;
+ }
+}
--- /dev/null
+// Breakpoint viewport sizes and media queries.
+//
+// Breakpoints are defined as a map of (name: minimum width), order from small to large:
+//
+// (xs: 0, sm: 544px, md: 768px)
+//
+// The map defined in the `$grid-breakpoints` global variable is used as the `$breakpoints` argument by default.
+
+// Name of the next breakpoint, or null for the last breakpoint.
+//
+// >> breakpoint-next(sm)
+// md
+// >> breakpoint-next(sm, (xs: 0, sm: 544px, md: 768px))
+// md
+// >> breakpoint-next(sm, $breakpoint-names: (xs sm md))
+// md
+@function breakpoint-next($name, $breakpoints: $grid-breakpoints, $breakpoint-names: map-keys($breakpoints)) {
+ $n: index($breakpoint-names, $name);
+ @return if($n < length($breakpoint-names), nth($breakpoint-names, $n + 1), null);
+}
+
+// Minimum breakpoint width. Null for the smallest (first) breakpoint.
+//
+// >> breakpoint-min(sm, (xs: 0, sm: 544px, md: 768px))
+// 544px
+@function breakpoint-min($name, $breakpoints: $grid-breakpoints) {
+ $min: map-get($breakpoints, $name);
+ @return if($min != 0, $min, null);
+}
+
+// Maximum breakpoint width. Null for the largest (last) breakpoint.
+// The maximum value is calculated as the minimum of the next one less 0.1.
+//
+// >> breakpoint-max(sm, (xs: 0, sm: 544px, md: 768px))
+// 767px
+@function breakpoint-max($name, $breakpoints: $grid-breakpoints) {
+ $next: breakpoint-next($name, $breakpoints);
+ @return if($next, breakpoint-min($next, $breakpoints) - 1px, null);
+}
+
+// Media of at least the minimum breakpoint width. No query for the smallest breakpoint.
+// Makes the @content apply to the given breakpoint and wider.
+@mixin media-breakpoint-up($name, $breakpoints: $grid-breakpoints) {
+ $min: breakpoint-min($name, $breakpoints);
+ @if $min {
+ @media (min-width: $min) {
+ @content;
+ }
+ } @else {
+ @content;
+ }
+}
+
+// Media of at most the maximum breakpoint width. No query for the largest breakpoint.
+// Makes the @content apply to the given breakpoint and narrower.
+@mixin media-breakpoint-down($name, $breakpoints: $grid-breakpoints) {
+ $max: breakpoint-max($name, $breakpoints);
+ @if $max {
+ @media (max-width: $max) {
+ @content;
+ }
+ } @else {
+ @content;
+ }
+}
+
+// Media between the breakpoint's minimum and maximum widths.
+// No minimum for the smallest breakpoint, and no maximum for the largest one.
+// Makes the @content apply only to the given breakpoint, not viewports any wider or narrower.
+@mixin media-breakpoint-only($name, $breakpoints: $grid-breakpoints) {
+ @include media-breakpoint-up($name, $breakpoints) {
+ @include media-breakpoint-down($name, $breakpoints) {
+ @content;
+ }
+ }
+}
+
+// Media that spans multiple breakpoint widths.
+// Makes the @content apply between the min and max breakpoints
+@mixin media-breakpoint-between($lower, $upper, $breakpoints: $grid-breakpoints) {
+ @include media-breakpoint-up($lower, $breakpoints) {
+ @include media-breakpoint-down($upper, $breakpoints) {
+ @content;
+ }
+ }
+}
--- /dev/null
+// Button variants
+//
+// Easily pump out default styles, as well as :hover, :focus, :active,
+// and disabled options for all buttons
+
+@mixin button-variant($color, $background, $border) {
+ $active-background: darken($background, 10%);
+ $active-border: darken($border, 12%);
+
+ color: $color;
+ background-color: $background;
+ border-color: $border;
+ @include box-shadow($btn-box-shadow);
+
+ @include hover {
+ color: $color;
+ background-color: $active-background;
+ border-color: $active-border;
+ }
+
+ &:focus,
+ &.focus {
+ color: $color;
+ background-color: $active-background;
+ border-color: $active-border;
+ }
+
+ &:active,
+ &.active,
+ .open > &.dropdown-toggle {
+ color: $color;
+ background-color: $active-background;
+ border-color: $active-border;
+ // Remove the gradient for the pressed/active state
+ background-image: none;
+ @include box-shadow($btn-active-box-shadow);
+
+ &:hover,
+ &:focus,
+ &.focus {
+ color: $color;
+ background-color: darken($background, 17%);
+ border-color: darken($border, 25%);
+ }
+ }
+
+ &.disabled,
+ &:disabled {
+ &:focus,
+ &.focus {
+ background-color: $background;
+ border-color: $border;
+ }
+ @include hover {
+ background-color: $background;
+ border-color: $border;
+ }
+ }
+}
+
+@mixin button-outline-variant($color) {
+ color: $color;
+ background-image: none;
+ background-color: transparent;
+ border-color: $color;
+
+ @include hover {
+ color: #fff;
+ background-color: $color;
+ border-color: $color;
+ }
+
+ &:focus,
+ &.focus {
+ color: #fff;
+ background-color: $color;
+ border-color: $color;
+ }
+
+ &:active,
+ &.active,
+ .open > &.dropdown-toggle {
+ color: #fff;
+ background-color: $color;
+ border-color: $color;
+
+ &:hover,
+ &:focus,
+ &.focus {
+ color: #fff;
+ background-color: darken($color, 17%);
+ border-color: darken($color, 25%);
+ }
+ }
+
+ &.disabled,
+ &:disabled {
+ &:focus,
+ &.focus {
+ border-color: lighten($color, 20%);
+ }
+ @include hover {
+ border-color: lighten($color, 20%);
+ }
+ }
+}
+
+// Button sizes
+@mixin button-size($padding-y, $padding-x, $font-size, $border-radius) {
+ padding: $padding-y $padding-x;
+ font-size: $font-size;
+ @include border-radius($border-radius);
+}
--- /dev/null
+// Card variants
+
+@mixin card-variant($background, $border) {
+ background-color: $background;
+ border-color: $border;
+
+ .card-header,
+ .card-footer {
+ background-color: transparent;
+ }
+}
+
+@mixin card-outline-variant($color) {
+ background-color: transparent;
+ border-color: $color;
+}
+
+//
+// Inverse text within a card for use with dark backgrounds
+//
+
+@mixin card-inverse {
+ .card-header,
+ .card-footer {
+ border-color: rgba(255,255,255,.2);
+ }
+ .card-header,
+ .card-footer,
+ .card-title,
+ .card-blockquote {
+ color: #fff;
+ }
+ .card-link,
+ .card-text,
+ .card-subtitle,
+ .card-blockquote .blockquote-footer {
+ color: rgba(255,255,255,.65);
+ }
+ .card-link {
+ @include hover-focus {
+ color: $card-link-hover-color;
+ }
+ }
+}
--- /dev/null
+@mixin clearfix() {
+ &::after {
+ content: "";
+ display: table;
+ clear: both;
+ }
+}
--- /dev/null
+// Form validation states
+//
+// Used in _forms.scss to generate the form validation CSS for warnings, errors,
+// and successes.
+
+@mixin form-control-validation($color) {
+ // Color the label and help text
+ .form-control-feedback,
+ .form-control-label,
+ .radio,
+ .checkbox,
+ .radio-inline,
+ .checkbox-inline,
+ &.radio label,
+ &.checkbox label,
+ &.radio-inline label,
+ &.checkbox-inline label,
+ .custom-control {
+ color: $color;
+ }
+ // Set the border and box shadow on specific inputs to match
+ .form-control {
+ border-color: $color;
+ // @include box-shadow(inset 0 1px 1px rgba(0,0,0,.075)); // Redeclare so transitions work
+
+ &:focus {
+ // border-color: darken($border-color, 10%);
+ // $shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 6px lighten($border-color, 20%);
+ // @include box-shadow($shadow);
+ }
+ }
+
+ // Set validation states also for addons
+ .input-group-addon {
+ color: $color;
+ border-color: $color;
+ background-color: lighten($color, 40%);
+ }
+ // Optional feedback icon
+ .form-control-feedback {
+ color: $color;
+ }
+}
+
+// Form control focus state
+//
+// Generate a customized focus state and for any input with the specified color,
+// which defaults to the `@input-border-focus` variable.
+//
+// We highly encourage you to not customize the default value, but instead use
+// this to tweak colors on an as-needed basis. This aesthetic change is based on
+// WebKit's default styles, but applicable to a wider range of browsers. Its
+// usability and accessibility should be taken into account with any change.
+//
+// Example usage: change the default blue border and shadow to white for better
+// contrast against a dark gray background.
+@mixin form-control-focus() {
+ &:focus {
+ color: $input-color-focus;
+ background-color: $input-bg-focus;
+ border-color: $input-border-focus;
+ outline: none;
+ $shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px $input-box-shadow-focus;
+ @include box-shadow($shadow);
+ }
+}
+
+// Form control sizing
+//
+// Relative text size, padding, and border-radii changes for form controls. For
+// horizontal sizing, wrap controls in the predefined grid classes. `<select>`
+// element gets special love because it's special, and that's a fact!
+
+@mixin input-size($parent, $input-height, $padding-y, $padding-x, $font-size, $line-height, $border-radius) {
+ #{$parent} {
+ height: $input-height;
+ padding: $padding-y $padding-x;
+ font-size: $font-size;
+ line-height: $line-height;
+ @include border-radius($border-radius);
+ }
+
+ select#{$parent} {
+ height: $input-height;
+ line-height: $input-height;
+ }
+
+ textarea#{$parent},
+ select[multiple]#{$parent} {
+ height: auto;
+ }
+}
--- /dev/null
+// Gradients
+
+// Horizontal gradient, from left to right
+//
+// Creates two color stops, start and end, by specifying a color and position for each color stop.
+// Color stops are not available in IE9.
+@mixin gradient-x($start-color: #555, $end-color: #333, $start-percent: 0%, $end-percent: 100%) {
+ background-image: linear-gradient(to right, $start-color $start-percent, $end-color $end-percent);
+ background-repeat: repeat-x;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=1); // IE9
+}
+
+// Vertical gradient, from top to bottom
+//
+// Creates two color stops, start and end, by specifying a color and position for each color stop.
+// Color stops are not available in IE9.
+@mixin gradient-y($start-color: #555, $end-color: #333, $start-percent: 0%, $end-percent: 100%) {
+ background-image: linear-gradient(to bottom, $start-color $start-percent, $end-color $end-percent);
+ background-repeat: repeat-x;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=0); // IE9
+}
+
+@mixin gradient-directional($start-color: #555, $end-color: #333, $deg: 45deg) {
+ background-repeat: repeat-x;
+ background-image: linear-gradient($deg, $start-color, $end-color);
+}
+@mixin gradient-x-three-colors($start-color: #00b3ee, $mid-color: #7a43b6, $color-stop: 50%, $end-color: #c3325f) {
+ background-image: linear-gradient(to right, $start-color, $mid-color $color-stop, $end-color);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=1); // IE9 gets no color-stop at all for proper fallback
+}
+@mixin gradient-y-three-colors($start-color: #00b3ee, $mid-color: #7a43b6, $color-stop: 50%, $end-color: #c3325f) {
+ background-image: linear-gradient($start-color, $mid-color $color-stop, $end-color);
+ background-repeat: no-repeat;
+ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#{ie-hex-str($start-color)}', endColorstr='#{ie-hex-str($end-color)}', GradientType=0); // IE9 gets no color-stop at all for proper fallback
+}
+@mixin gradient-radial($inner-color: #555, $outer-color: #333) {
+ background-image: radial-gradient(circle, $inner-color, $outer-color);
+ background-repeat: no-repeat;
+}
+@mixin gradient-striped($color: rgba(255,255,255,.15), $angle: 45deg) {
+ background-image: linear-gradient($angle, $color 25%, transparent 25%, transparent 50%, $color 50%, $color 75%, transparent 75%, transparent);
+}
\ No newline at end of file
--- /dev/null
+// Framework grid generation
+//
+// Used only by Bootstrap to generate the correct number of grid classes given
+// any value of `$grid-columns`.
+
+@mixin make-grid-columns($columns: $grid-columns, $gutter: $grid-gutter-width, $breakpoints: $grid-breakpoints) {
+
+ // Common properties for all breakpoints
+ %grid-column {
+ position: relative;
+ // Prevent columns from collapsing when empty
+ min-height: 1px;
+ // Inner gutter via padding
+ padding-right: ($gutter / 2);
+ padding-left: ($gutter / 2);
+
+ @if $enable-flex {
+ width: 100%;
+ }
+ }
+
+ $breakpoint-counter: 0;
+ @each $breakpoint in map-keys($breakpoints) {
+ $breakpoint-counter: ($breakpoint-counter + 1);
+
+ @for $i from 1 through $columns {
+ .col-#{$breakpoint}-#{$i} {
+ @extend %grid-column;
+ }
+ }
+
+ @include media-breakpoint-up($breakpoint, $breakpoints) {
+ // Provide basic `.col-{bp}` classes for equal-width flexbox columns
+ @if $enable-flex {
+ .col-#{$breakpoint} {
+ position: relative;
+ flex-basis: 0;
+ flex-grow: 1;
+ max-width: 100%;
+ min-height: 1px;
+ padding-right: ($grid-gutter-width / 2);
+ padding-left: ($grid-gutter-width / 2);
+ }
+ }
+
+ @for $i from 1 through $columns {
+ .col-#{$breakpoint}-#{$i} {
+ @include make-col($i, $columns, $gutter);
+ }
+ }
+
+ @each $modifier in (pull, push) {
+ @for $i from 0 through $columns {
+ .#{$modifier}-#{$breakpoint}-#{$i} {
+ @include make-col-modifier($modifier, $i, $columns)
+ }
+ }
+ }
+
+ // `$columns - 1` because offsetting by the width of an entire row isn't possible
+ @for $i from 0 through ($columns - 1) {
+ @if $breakpoint-counter != 1 or $i != 0 { // Avoid emitting useless .offset-xs-0
+ .offset-#{$breakpoint}-#{$i} {
+ @include make-col-modifier(offset, $i, $columns)
+ }
+ }
+ }
+ }
+ }
+}
--- /dev/null
+/// Grid system
+//
+// Generate semantic grid columns with these mixins.
+
+@mixin make-container($gutter: $grid-gutter-width) {
+ margin-left: auto;
+ margin-right: auto;
+ padding-left: ($gutter / 2);
+ padding-right: ($gutter / 2);
+ @if not $enable-flex {
+ @include clearfix();
+ }
+}
+
+
+// For each breakpoint, define the maximum width of the container in a media query
+@mixin make-container-max-widths($max-widths: $container-max-widths, $breakpoints: $grid-breakpoints) {
+ @each $breakpoint, $container-max-width in $max-widths {
+ @include media-breakpoint-up($breakpoint, $breakpoints) {
+ max-width: $container-max-width;
+ }
+ }
+}
+
+@mixin make-row($gutter: $grid-gutter-width) {
+ @if $enable-flex {
+ display: flex;
+ flex-wrap: wrap;
+ } @else {
+ @include clearfix();
+ }
+ margin-left: ($gutter / -2);
+ margin-right: ($gutter / -2);
+}
+
+@mixin make-col-ready($size, $columns: $grid-columns, $gutter: $grid-gutter-width) {
+ position: relative;
+ min-height: 1px; // Prevent collapsing
+ padding-right: ($gutter / 2);
+ padding-left: ($gutter / 2);
+
+ // Prevent columns from becoming too narrow when at smaller grid tiers by
+ // always setting `width: 100%;`. This works because we use `flex` values
+ // later on to override this initial width.
+ @if $enable-flex {
+ width: 100%;
+ }
+}
+
+@mixin make-col($size, $columns: $grid-columns, $gutter: $grid-gutter-width) {
+ @if $enable-flex {
+ flex: 0 0 percentage($size / $columns);
+ // Add a `max-width` to ensure content within each column does not blow out
+ // the width of the column. Applies to IE10+ and Firefox. Chrome and Safari
+ // do not appear to require this.
+ max-width: percentage($size / $columns);
+ } @else {
+ float: left;
+ width: percentage($size / $columns);
+ }
+}
+
+@mixin make-col-offset($size, $columns: $grid-columns) {
+ margin-left: percentage($size / $columns);
+}
+
+@mixin make-col-push($size, $columns: $grid-columns) {
+ left: if($size > 0, percentage($size / $columns), auto);
+}
+
+@mixin make-col-pull($size, $columns: $grid-columns) {
+ right: if($size > 0, percentage($size / $columns), auto);
+}
+
+@mixin make-col-modifier($type, $size, $columns) {
+ // Work around the lack of dynamic mixin @include support (https://github.com/sass/sass/issues/626)
+ @if $type == push {
+ @include make-col-push($size, $columns);
+ } @else if $type == pull {
+ @include make-col-pull($size, $columns);
+ } @else if $type == offset {
+ @include make-col-offset($size, $columns);
+ }
+}
--- /dev/null
+@mixin hover {
+ // TODO: re-enable along with mq4-hover-shim
+// @if $enable-hover-media-query {
+// // See Media Queries Level 4: http://drafts.csswg.org/mediaqueries/#hover
+// // Currently shimmed by https://github.com/twbs/mq4-hover-shim
+// @media (hover: hover) {
+// &:hover { @content }
+// }
+// }
+// @else {
+ &:hover { @content }
+// }
+}
+
+@mixin hover-focus {
+ @if $enable-hover-media-query {
+ &:focus { @content }
+ @include hover { @content }
+ }
+ @else {
+ &:focus,
+ &:hover {
+ @content
+ }
+ }
+}
+
+@mixin plain-hover-focus {
+ @if $enable-hover-media-query {
+ &,
+ &:focus {
+ @content
+ }
+ @include hover { @content }
+ }
+ @else {
+ &,
+ &:focus,
+ &:hover {
+ @content
+ }
+ }
+}
+
+@mixin hover-focus-active {
+ @if $enable-hover-media-query {
+ &:focus,
+ &:active {
+ @content
+ }
+ @include hover { @content }
+ }
+ @else {
+ &:focus,
+ &:active,
+ &:hover {
+ @content
+ }
+ }
+}
--- /dev/null
+// Image Mixins
+// - Responsive image
+// - Retina image
+
+
+// Responsive image
+//
+// Keep images from scaling beyond the width of their parents.
+
+@mixin img-fluid($display: block) {
+ display: $display;
+ max-width: 100%; // Part 1: Set a maximum relative to the parent
+ height: auto; // Part 2: Scale the height according to the width, otherwise you get stretching
+}
+
+
+// Retina image
+//
+// Short retina mixin for setting background-image and -size.
+
+@mixin img-retina($file-1x, $file-2x, $width-1x, $height-1x) {
+ background-image: url($file-1x);
+
+ // Autoprefixer takes care of adding -webkit-min-device-pixel-ratio and -o-min-device-pixel-ratio,
+ // but doesn't convert dppx=>dpi.
+ // There's no such thing as unprefixed min-device-pixel-ratio since it's nonstandard.
+ // Compatibility info: http://caniuse.com/#feat=css-media-resolution
+ @media
+ only screen and (min-resolution: 192dpi), // IE9-11 don't support dppx
+ only screen and (min-resolution: 2dppx) { // Standardized
+ background-image: url($file-2x);
+ background-size: $width-1x $height-1x;
+ }
+}
--- /dev/null
+// List Groups
+
+@mixin list-group-item-variant($state, $background, $color) {
+ .list-group-item-#{$state} {
+ color: $color;
+ background-color: $background;
+ }
+
+ a.list-group-item-#{$state},
+ button.list-group-item-#{$state} {
+ color: $color;
+
+ .list-group-item-heading {
+ color: inherit;
+ }
+
+ @include hover-focus {
+ color: $color;
+ background-color: darken($background, 5%);
+ }
+
+ &.active {
+ @include plain-hover-focus {
+ color: #fff;
+ background-color: $color;
+ border-color: $color;
+ }
+ }
+ }
+}
--- /dev/null
+// Lists
+
+// Unstyled keeps list items block level, just removes default browser padding and list-style
+@mixin list-unstyled {
+ padding-left: 0;
+ list-style: none;
+}
--- /dev/null
+// Horizontal dividers
+//
+// Dividers (basically an hr) within dropdowns and nav lists
+
+@mixin nav-divider($color: #e5e5e5) {
+ height: 1px;
+ margin: ($spacer-y / 2) 0;
+ overflow: hidden;
+ background-color: $color;
+}
--- /dev/null
+// Navbar vertical align
+//
+// Vertically center elements in the navbar.
+// Example: an element has a height of 30px, so write out `.navbar-vertical-align(30px);` to calculate the appropriate top margin.
+
+// @mixin navbar-vertical-align($element-height) {
+// margin-top: (($navbar-height - $element-height) / 2);
+// margin-bottom: (($navbar-height - $element-height) / 2);
+// }
--- /dev/null
+// Pagination
+
+@mixin pagination-size($padding-y, $padding-x, $font-size, $line-height, $border-radius) {
+ .page-link {
+ padding: $padding-y $padding-x;
+ font-size: $font-size;
+ }
+
+ .page-item {
+ &:first-child {
+ .page-link {
+ @include border-left-radius($border-radius);
+ }
+ }
+ &:last-child {
+ .page-link {
+ @include border-right-radius($border-radius);
+ }
+ }
+ }
+}
--- /dev/null
+// Progress bars
+
+@mixin progress-variant($color) {
+ &[value]::-webkit-progress-value {
+ background-color: $color;
+ }
+
+ &[value]::-moz-progress-bar {
+ background-color: $color;
+ }
+
+ // IE10+, Microsoft Edge
+ &[value]::-ms-fill {
+ background-color: $color;
+ }
+
+ // IE9
+ @media screen and (min-width:0\0) {
+ .progress-bar {
+ background-color: $color;
+ }
+ }
+}
--- /dev/null
+@mixin pull-left {
+ float: left !important;
+}
+@mixin pull-right {
+ float: right !important;
+}
--- /dev/null
+// Reset filters for IE
+//
+// When you need to remove a gradient background, do not forget to use this to reset
+// the IE filter for IE9.
+
+@mixin reset-filter() {
+ filter: "progid:DXImageTransform.Microsoft.gradient(enabled = false)";
+}
--- /dev/null
+@mixin reset-text {
+ font-family: $font-family-base;
+ // We deliberately do NOT reset font-size or word-wrap.
+ font-style: normal;
+ font-weight: normal;
+ letter-spacing: normal;
+ line-break: auto;
+ line-height: $line-height-base;
+ text-align: left; // Fallback for where `start` is not supported
+ text-align: start;
+ text-decoration: none;
+ text-shadow: none;
+ text-transform: none;
+ white-space: normal;
+ word-break: normal;
+ word-spacing: normal;
+}
--- /dev/null
+// Resize anything
+
+@mixin resizable($direction) {
+ resize: $direction; // Options: horizontal, vertical, both
+ overflow: auto; // Per CSS3 UI, `resize` only applies when `overflow` isn't `visible`
+}
--- /dev/null
+// Only display content to screen readers
+//
+// See: http://a11yproject.com/posts/how-to-hide-content
+
+@mixin sr-only {
+ position: absolute;
+ width: 1px;
+ height: 1px;
+ padding: 0;
+ margin: -1px;
+ overflow: hidden;
+ clip: rect(0,0,0,0);
+ border: 0;
+}
+
+// Use in conjunction with .sr-only to only display content when it's focused.
+//
+// Useful for "Skip to main content" links; see http://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/G1
+//
+// Credit: HTML5 Boilerplate
+
+@mixin sr-only-focusable {
+ &:active,
+ &:focus {
+ position: static;
+ width: auto;
+ height: auto;
+ margin: 0;
+ overflow: visible;
+ clip: auto;
+ }
+}
--- /dev/null
+// Sizing shortcuts
+
+@mixin size($width, $height: $width) {
+ width: $width;
+ height: $height;
+}
--- /dev/null
+// WebKit-style focus
+
+@mixin tab-focus() {
+ // WebKit-specific. Other browsers will keep their default outline style.
+ // (Initially tried to also force default via `outline: initial`,
+ // but that seems to erroneously remove the outline in Firefox altogether.)
+ outline: 5px auto -webkit-focus-ring-color;
+ outline-offset: -2px;
+}
--- /dev/null
+// Tables
+
+@mixin table-row-variant($state, $background) {
+ // Exact selectors below required to override `.table-striped` and prevent
+ // inheritance to nested tables.
+ .table-#{$state} {
+ &,
+ > th,
+ > td {
+ background-color: $background;
+ }
+ }
+
+ // Hover states for `.table-hover`
+ // Note: this is not available for cells or rows within `thead` or `tfoot`.
+ .table-hover {
+ $hover-background: darken($background, 5%);
+
+ .table-#{$state} {
+ @include hover {
+ background-color: $hover-background;
+
+ > td,
+ > th {
+ background-color: $hover-background;
+ }
+ }
+ }
+ }
+}
--- /dev/null
+// Tags
+
+@mixin tag-variant($color) {
+ background-color: $color;
+
+ &[href] {
+ @include hover-focus {
+ background-color: darken($color, 10%);
+ }
+ }
+}
--- /dev/null
+// Typography
+
+@mixin text-emphasis-variant($parent, $color) {
+ #{$parent} {
+ color: $color !important;
+ }
+ a#{$parent} {
+ @include hover-focus {
+ color: darken($color, 10%);
+ }
+ }
+}
--- /dev/null
+// CSS image replacement
+@mixin text-hide() {
+ font: 0/0 a;
+ color: transparent;
+ text-shadow: none;
+ background-color: transparent;
+ border: 0;
+}
--- /dev/null
+// Text truncate
+// Requires inline-block or block for proper styling
+
+@mixin text-truncate() {
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+}
\ No newline at end of file
--- /dev/null
+//
+// Contextual backgrounds
+//
+
+.bg-inverse {
+ background-color: $brand-inverse;
+}
+
+.bg-faded {
+ background-color: $gray-lightest;
+}
+
+@include bg-variant('.bg-primary', $brand-primary);
+
+@include bg-variant('.bg-success', $brand-success);
+
+@include bg-variant('.bg-info', $brand-info);
+
+@include bg-variant('.bg-warning', $brand-warning);
+
+@include bg-variant('.bg-danger', $brand-danger);
--- /dev/null
+.clearfix {
+ @include clearfix();
+}
--- /dev/null
+//
+// Display utilities
+//
+
+.d-block {
+ display: block !important;
+}
+.d-inline-block {
+ display: inline-block !important;
+}
+.d-inline {
+ display: inline !important;
+}
--- /dev/null
+// Flex variation
+//
+// Custom styles for additional flex alignment options.
+
+@if $enable-flex {
+ @each $breakpoint in map-keys($grid-breakpoints) {
+ // Flex column reordering
+ @include media-breakpoint-up($breakpoint) {
+ .flex-#{$breakpoint}-first { order: -1; }
+ .flex-#{$breakpoint}-last { order: 1; }
+ .flex-#{$breakpoint}-unordered { order: 0; }
+ }
+
+ // Alignment for every item
+ @include media-breakpoint-up($breakpoint) {
+ .flex-items-#{$breakpoint}-top { align-items: flex-start; }
+ .flex-items-#{$breakpoint}-middle { align-items: center; }
+ .flex-items-#{$breakpoint}-bottom { align-items: flex-end; }
+ }
+
+ // Alignment per item
+ @include media-breakpoint-up($breakpoint) {
+ .flex-#{$breakpoint}-top { align-self: flex-start; }
+ .flex-#{$breakpoint}-middle { align-self: center; }
+ .flex-#{$breakpoint}-bottom { align-self: flex-end; }
+ }
+
+ // Horizontal alignment of item
+ @include media-breakpoint-up($breakpoint) {
+ .flex-items-#{$breakpoint}-left { justify-content: flex-start; }
+ .flex-items-#{$breakpoint}-center { justify-content: center; }
+ .flex-items-#{$breakpoint}-right { justify-content: flex-end; }
+ .flex-items-#{$breakpoint}-around { justify-content: space-around; }
+ .flex-items-#{$breakpoint}-between { justify-content: space-between; }
+ }
+ }
+}
--- /dev/null
+@each $breakpoint in map-keys($grid-breakpoints) {
+ @include media-breakpoint-up($breakpoint) {
+ .pull-#{$breakpoint}-left {
+ @include pull-left();
+ }
+ .pull-#{$breakpoint}-right {
+ @include pull-right();
+ }
+ .pull-#{$breakpoint}-none {
+ float: none !important;
+ }
+ }
+}
--- /dev/null
+//
+// Screenreaders
+//
+
+.sr-only {
+ @include sr-only();
+}
+
+.sr-only-focusable {
+ @include sr-only-focusable();
+}
--- /dev/null
+// Width
+
+.w-100 { width: 100% !important; }
+
+// Margin and Padding
+
+.m-x-auto {
+ margin-right: auto !important;
+ margin-left: auto !important;
+}
+
+@each $prop, $abbrev in (margin: m, padding: p) {
+ @each $size, $lengths in $spacers {
+ $length-x: map-get($lengths, x);
+ $length-y: map-get($lengths, y);
+
+ .#{$abbrev}-a-#{$size} { #{$prop}: $length-y $length-x !important; } // a = All sides
+ .#{$abbrev}-t-#{$size} { #{$prop}-top: $length-y !important; }
+ .#{$abbrev}-r-#{$size} { #{$prop}-right: $length-x !important; }
+ .#{$abbrev}-b-#{$size} { #{$prop}-bottom: $length-y !important; }
+ .#{$abbrev}-l-#{$size} { #{$prop}-left: $length-x !important; }
+
+ // Axes
+ .#{$abbrev}-x-#{$size} {
+ #{$prop}-right: $length-x !important;
+ #{$prop}-left: $length-x !important;
+ }
+ .#{$abbrev}-y-#{$size} {
+ #{$prop}-top: $length-y !important;
+ #{$prop}-bottom: $length-y !important;
+ }
+ }
+}
+
+// Positioning
+
+.pos-f-t {
+ position: fixed;
+ top: 0;
+ right: 0;
+ left: 0;
+ z-index: $zindex-navbar-fixed;
+}
--- /dev/null
+//
+// Text
+//
+
+// Alignment
+
+.text-justify { text-align: justify !important; }
+.text-nowrap { white-space: nowrap !important; }
+.text-truncate { @include text-truncate; }
+
+// Responsive alignment
+
+@each $breakpoint in map-keys($grid-breakpoints) {
+ @include media-breakpoint-up($breakpoint) {
+ .text-#{$breakpoint}-left { text-align: left !important; }
+ .text-#{$breakpoint}-right { text-align: right !important; }
+ .text-#{$breakpoint}-center { text-align: center !important; }
+ }
+}
+
+// Transformation
+
+.text-lowercase { text-transform: lowercase !important; }
+.text-uppercase { text-transform: uppercase !important; }
+.text-capitalize { text-transform: capitalize !important; }
+
+// Weight and italics
+
+.font-weight-normal { font-weight: normal; }
+.font-weight-bold { font-weight: bold; }
+.font-italic { font-style: italic; }
+
+// Contextual colors
+
+@include text-emphasis-variant('.text-muted', $text-muted);
+
+@include text-emphasis-variant('.text-primary', $brand-primary);
+
+@include text-emphasis-variant('.text-success', $brand-success);
+
+@include text-emphasis-variant('.text-info', $brand-info);
+
+@include text-emphasis-variant('.text-warning', $brand-warning);
+
+@include text-emphasis-variant('.text-danger', $brand-danger);
+
+// Misc
+
+.text-hide {
+ @include text-hide();
+}
--- /dev/null
+// scss-lint:disable ImportantRule
+
+//
+// Visibility utilities
+//
+
+.invisible {
+ visibility: hidden !important;
+}
+
+// Responsive visibility utilities
+
+@each $bp in map-keys($grid-breakpoints) {
+ .hidden-#{$bp}-up {
+ @include media-breakpoint-up($bp) {
+ display: none !important;
+ }
+ }
+ .hidden-#{$bp}-down {
+ @include media-breakpoint-down($bp) {
+ display: none !important;
+ }
+ }
+}
+
+
+// Print utilities
+//
+// Media queries are placed on the inside to be mixin-friendly.
+
+.visible-print-block {
+ display: none !important;
+
+ @media print {
+ display: block !important;
+ }
+}
+.visible-print-inline {
+ display: none !important;
+
+ @media print {
+ display: inline !important;
+ }
+}
+.visible-print-inline-block {
+ display: none !important;
+
+ @media print {
+ display: inline-block !important;
+ }
+}
+
+.hidden-print {
+ @media print {
+ display: none !important;
+ }
+}
--- /dev/null
+// Set image location.
+$iconSpritePath: "[[pix:theme|glyphicons-halflings]]";
+$iconWhiteSpritePath: "[[pix:theme|glyphicons-halflings-white]]";
+
+$breadcrumb-divider: "▶";
+
+// Import the bootstrap variables.
+@import "bootstrap/bootstrap";
+
+// Old Moodle stuff from base theme.
+// Massive, needs broken up.
+@import "moodle/core";
+@import "moodle/admin";
+@import "moodle/calendar";
+@import "moodle/course";
+@import "moodle/filemanager";
+@import "moodle/message";
+@import "moodle/question";
+@import "moodle/user";
+@import "moodle/search";
+@import "moodle/blocks";
+@import "moodle/forms";
+@import "moodle/modules";
+@import "moodle/chat";
+@import "moodle/reports";
+@import "moodle/backup-restore";
+@import "moodle/tables";
+@import "moodle/buttons";
+@import "moodle/dock";
+@import "moodle/grade";
+@import "moodle/templates";
+@import "moodle/undo";
+@import "moodle/debug";
+@import "moodle/expendable";
--- /dev/null
+/* admin.less */
+.formtable tbody th {
+ font-weight: normal;
+ text-align: right;
+}
+
+.path-admin #assignrole {
+ width: 60%;
+ margin-left: auto;
+ margin-right: auto;
+}
+
+.path-admin .admintable .leftalign {
+ text-align: left;
+}
+
+.environmenttable {
+ .warn {
+ @extend .table-warning;
+ }
+ .error {
+ @extend .table-danger;
+ }
+ .ok {
+ @extend .table-success;
+ }
+}
+
+.path-admin .admintable.environmenttable .name,
+.path-admin .admintable.environmenttable .info,
+.path-admin #assignrole .admintable .role,
+.path-admin #assignrole .admintable .userrole,
+.path-admin #assignrole .admintable .roleholder {
+ white-space: nowrap;
+}
+
+.path-admin .incompatibleblockstable td.c0 {
+ font-weight: bold;
+}
+
+#page-admin-course-category .addcategory {
+ padding: 10px;
+}
+
+#page-admin-course-index .editcourse {
+ margin: 20px auto;
+}
+
+#page-admin-course-index .editcourse th,
+#page-admin-course-index .editcourse td {
+ padding-left: 10px;
+ padding-right: 10px;
+}
+
+.timewarninghidden {
+ display: none;
+}
+.statusok {
+ @extend .label-success;
+}
+.statuswarning {
+ @extend .label-warning;
+}
+.statusserious,
+.statuscritical {
+ @extend .label-danger;
+}
+
+#page-admin-report-capability-index #capabilitysearch {
+ width: 30em;
+}
+
+#page-admin-report-backups-index .backup-error,
+#page-admin-report-backups-index .backup-unfinished {
+ @extend .label-danger;
+}
+
+#page-admin-report-backups-index .backup-skipped,
+#page-admin-report-backups-index .backup-ok,
+#page-admin-report-backups-index .backup-notyetrun {
+ @extend .label-success;
+}
+
+#page-admin-report-backups-index .backup-warning {
+ @extend .label-warning;
+}
+
+#page-admin-qtypes .disabled,
+#page-admin-qbehaviours .disabled {
+ @extend .text-muted;
+}
+
+#page-admin-qtypes #qtypes div,
+#page-admin-qtypes #qtypes form,
+#page-admin-qbehaviours #qbehaviours div,
+#page-admin-qbehaviours #qbehaviours form {
+ display: inline;
+}
+
+#page-admin-qtypes #qtypes img.spacer,
+#page-admin-qbehaviours #qbehaviours img.spacer {
+ width: 16px;
+}
+
+// Make them more finger friendly.
+img.iconsmall {
+ margin: 0;
+ padding: 0.3em;
+}
+
+
+#page-admin-qbehaviours .cell.c3,
+#page-admin-qtypes .cell.c3 {
+ font-size: $font-size-sm;
+}
+
+#page-admin-lang .generalbox,
+#page-admin-course-index .singlebutton,
+#page-admin-course-index .addcategory,
+#page-course-index .buttons,
+#page-course-index-category .buttons,
+#page-admin-course-category .addcategory,
+#page-admin-stickyblocks .generalbox,
+#page-admin-maintenance .buttons,
+#page-admin-course-index .buttons,
+#page-admin-course-category .buttons,
+#page-admin-index .copyright,
+#page-admin-index .copyrightnotice,
+#page-admin-index .adminerror .singlebutton,
+#page-admin-index .adminwarning .singlebutton,
+#page-admin-index #layout-table .singlebutton {
+ text-align: center;
+ margin-bottom: 1em;
+}
+
+.path-admin-roles .capabilitysearchui {
+ text-align: left;
+ margin-left: auto;
+ margin-right: auto;
+}
+
+#page-admin-roles-define .topfields {
+ margin: 1em 0 2em;
+}
+
+#page-admin-roles-define .capdefault {
+ @extend .table-hover;
+}
+
+#page-filter-manage .backlink,
+.path-admin-roles .backlink {
+ margin-top: 1em;
+}
+
+#page-admin-roles-explain #chooseuser h3,
+#page-admin-roles-usersroles .contextname {
+ margin-top: 0;
+}
+
+#page-admin-roles-explain #chooseusersubmit {
+ margin-top: 0;
+ text-align: center;
+}
+
+#page-admin-roles-usersroles p {
+ margin: 0;
+}
+
+#page-admin-roles-override .cell.c1,
+#page-admin-roles-assign .cell.c3,
+#page-admin-roles-assign .cell.c1 {
+ padding-top: 0.75em;
+}
+
+#page-admin-roles-override .overridenotice,
+#page-admin-roles-define .definenotice {
+ margin: 1em 10% 2em 10%;
+ text-align: left;
+}
+
+#notice {
+ // Would like the use the alert stuff below for this,
+ // but the way buttons are used makes it tricky.
+ width: 60%;
+ min-width: 220px;
+ margin: auto;
+}
+
+#page-admin-index .releasenoteslink,
+#page-admin-index .adminwarning,
+#page-admin-index .adminerror {
+ margin: auto;
+ @extend .alert;
+ @extend .alert-warning;
+ width: 60%;
+ min-width: 220px;
+}
+#page-admin-index .adminerror {
+ @extend .alert-danger;
+}
+
+#page-admin-index .releasenoteslink {
+ @extend .alert-info;
+}
+
+#page-admin-index .adminwarning.availableupdatesinfo .moodleupdateinfo span {
+ display: block;
+}
+
+#page-admin-index .updateplugin div {
+ margin-bottom: 0.5em;
+}
+
+#page-admin-index .updateplugin .updatepluginconfirmexternal {
+ @extend .label-warning;
+}
+
+#page-admin-user-user_bulk #users .fgroup {
+ white-space: nowrap;
+}
+
+#page-admin-report-stats-index .graph {
+ text-align: center;
+ margin-bottom: 1em;
+}
+
+#page-admin-report-courseoverview-index .graph {
+ text-align: center;
+ margin-bottom: 1em;
+}
+
+#page-admin-lang .translator {
+ border-width: 1px;
+ border-style: solid;
+}
+
+// This is the CSS for the role assignment control.
+.path-admin .roleassigntable {
+ width: 100%;
+}
+
+.path-admin .roleassigntable td {
+ vertical-align: top;
+ padding: 0.2em 0.3em
+}
+
+.path-admin .roleassigntable p {
+ text-align: left;
+ margin: 0.2em 0;
+}
+
+.path-admin .roleassigntable #existingcell,
+.path-admin .roleassigntable #potentialcell {
+ width: 42%;
+}
+
+// Targetting the label at the top.
+.path-admin .roleassigntable #existingcell p > label:first-child,
+.path-admin .roleassigntable #potentialcell p > label:first-child {
+ font-weight: bold;
+}
+
+.path-admin .roleassigntable #buttonscell {
+ width: 16%;
+}
+
+.path-admin .roleassigntable #buttonscell #assignoptions {
+ font-size: $font-size-sm;
+}
+
+.path-admin .roleassigntable #removeselect_wrapper,
+.path-admin .roleassigntable #addselect_wrapper {
+ width: 100%;
+}
+
+.path-admin table.rolecap tr.rolecap th {
+ text-align: left;
+ font-weight: normal;
+}
+
+.path-admin .rolecap .hiddenrow {
+ display: none;
+}
+
+.path-admin #defineroletable {
+ .rolecap {
+ .inherit,
+ .allow,
+ .prevent,
+ .prohibit {
+ text-align: center;
+ padding: 0;
+ min-width: 3.5em;
+ }
+ }
+}
+
+.path-admin .rolecap .cap-name,
+.path-admin .rolecap .note {
+ display: block;
+ font-size: $font-size-sm;
+ white-space: nowrap;
+ font-weight: normal;
+}
+
+.path-admin .rolecap label {
+ display: block;
+ text-align: center;
+ padding: 0.5em;
+ margin: 0;
+}
+
+.plugincheckwrapper {
+ width: 100%;
+}
+
+.environmentbox {
+ margin-top: 1em;
+}
+
+#mnetconfig table {
+ margin-left: auto;
+ margin-right: auto;
+}
+
+.environmenttable .cell {
+ padding: .15em .5em;
+}
+
+.environmenttable img.iconhelp {
+ padding-right: .3em;
+}
+
+#trustedhosts .generaltable {
+ margin-left: auto;
+ margin-right: auto;
+ width: 500px;
+}
+
+#trustedhosts .standard {
+ width: auto;
+}
+
+// This usage of legend is a bit weird,
+// seems to be using them as error text
+// that's only sometimes visible. Should
+// look into sorting it.
+#adminsettings legend {
+ display: none;
+}
+
+#adminsettings fieldset.error {
+ margin: .2em 0 .5em 0;
+}
+
+#adminsettings fieldset.error legend {
+ display: block;
+}
+
+#admin-spelllanguagelist textarea,
+#page-admin-setting-editorsettingstinymce .form-textarea textarea {
+ /* rtl:ignore */
+ text-align: left;
+ /* rtl:ignore */
+ direction: ltr;
+}
+
+/* Styles for flags on admin settings */
+.adminsettingsflags {
+ float: right;
+}
+
+.adminsettingsflags label {
+ margin-right: 7px;
+}
+
+.form-description {
+ clear: right;
+}
+
+.form-item .form-setting .form-htmlarea {
+ display: inline;
+}
+
+.form-item .form-setting .form-htmlarea .htmlarea {
+ width: 640px;
+ display: block;
+}
+
+.form-item .form-setting .form-multicheckbox ul {
+ list-style: none;
+ padding: 0;
+ margin: 7px 0 0 0;
+}
+
+.form-item .form-setting .defaultsnext {
+ margin-right: 0.5em;
+ display: inline;
+}
+
+.form-item .form-setting .locked-checkbox {
+ margin-right: 0.2em;
+ margin-left: 0.5em;
+ display: inline;
+}
+
+.form-item .form-setting .form-password .unmask,
+.form-item .form-setting .form-defaultinfo {
+ display: inline-block;
+}
+
+.form-item .pathok,
+.form-item .patherror {
+ margin-left: 0.5em;
+}
+
+#admin-emoticons td input {
+ width: 8em;
+}
+
+#admin-emoticons td.c0 input {
+ width: 4em;
+}
+
+#adminthemeselector .selectedtheme td.c0 {
+ border: 1px solid $state-info-border;
+ border-right-width: 0;
+}
+
+#adminthemeselector .selectedtheme td.c1 {
+ border: 1px solid $state-info-border;
+ border-left-width: 0;
+}
+
+.admin_colourpicker,
+.admin_colourpicker_preview {
+ display: none;
+}
+
+.jsenabled .admin_colourpicker_preview {
+ display: inline;
+}
+
+.jsenabled .admin_colourpicker {
+ display: block;
+ height: 102px;
+ width: 410px;
+ margin-bottom: 10px;
+}
+
+.admin_colourpicker .loadingicon {
+ vertical-align: middle;
+ margin-left: auto;
+}
+
+.admin_colourpicker .colourdialogue {
+ float: left;
+ border: 1px solid $state-info-border;
+}
+
+.admin_colourpicker .previewcolour {
+ border: 1px solid $state-info-border;
+ margin-left: 301px;
+}
+
+.admin_colourpicker .currentcolour {
+ border: 1px solid $state-info-border;
+ margin-left: 301px;
+ border-top-width: 0;
+}
+
+#page-admin-index #notice .checkforupdates {
+ text-align: center;
+}
+
+#page-admin-index .adminwarning.availableupdatesinfo .moodleupdateinfo.maturity200 .info.release {
+ @extend .label-info;
+}
+
+#page-admin-index .adminwarning.availableupdatesinfo .moodleupdateinfo.maturity100 .info.release,
+#page-admin-index .adminwarning.availableupdatesinfo .moodleupdateinfo.maturity150 .info.release {
+ @extend .label-warning;
+}
+
+#page-admin-index .adminwarning.availableupdatesinfo .moodleupdateinfo.maturity50 .info.release {
+ @extend .label-danger;
+}
+
+// Plugins overview page at admin/plugins.php
+#page-admin-plugins {
+
+ #plugins-overview-panel {
+ .info {
+ display: inline-block;
+ margin-right: 1em;
+ }
+ }
+
+ .checkforupdates {
+ margin: 10px 0;
+ .singlebutton {
+ margin: 5px 0;
+ padding: 0;
+ div, input {
+ margin: 0 3px 0 0;
+ }
+ }
+ }
+
+ .updateavailableinstallall {
+ margin: 5px 0;
+ padding: 0;
+ div, input {
+ margin: 0 3px 5px 0;
+ }
+ }
+
+ #plugins-control-panel {
+ .status-missing td {
+ @extend .table-warning;
+ }
+ .pluginname {
+ .displayname img.icon {
+ padding-top: 0;
+ padding-bottom: 0;
+ }
+ .componentname {
+ font-size: $font-size-sm;
+ @extend .text-muted;
+ margin-left: 22px;
+ }
+ }
+ .version {
+ .versionnumber {
+ font-size: $font-size-sm;
+ @extend .text-muted;
+ }
+ .release {
+ }
+ }
+ .availability {
+ }
+ .settings {
+ }
+ .uninstall {
+ a {
+ @extend .label-warning;
+ }
+ }
+ .notes {
+ .label {
+ margin-right: 3px;
+ }
+ .requiredby {
+ font-size: $font-size-sm;
+ @extend .text-muted;
+ }
+ }
+ }
+}
+
+
+// Plugins check page displayed during upgrade.
+#plugins-check-page {
+
+ .page-description {
+ @extend .text-muted;
+ }
+
+ // Check for updates.
+ .checkforupdates {
+ .singlebutton {
+ margin: 5px 0;
+ padding: 0;
+ div, input {
+ margin: 0 3px 0 0;
+ }
+ }
+ }
+
+ // Section before the plugins check table.
+ #plugins-check-info {
+ .actions {
+ > div {
+ display: inline-block;
+ margin-right: 1em;
+ }
+ .singlebutton {
+ margin: 5px 0;
+ padding: 0;
+ div, input {
+ margin: 0 3px 0 0;
+ }
+ }
+ }
+ }
+
+ // Plugins check table.
+ #plugins-check {
+ .requires-ok {
+ @extend .text-muted;
+ }
+
+ .status-missing, .status-downgrade {
+ td {
+ @extend .table-danger;
+ }
+ }
+
+ .displayname {
+ .pluginicon {
+ margin-right: 5px;
+ width: 16px;
+ }
+ .plugindir {
+ @extend .text-muted;
+ font-size: $font-size-sm;
+ }
+ }
+
+ .requires ul {
+ margin-left: 13px; // To undo the default 25px, does not look that great inside a table cell;
+ }
+
+ .status {
+ .actionbutton {
+ margin: 5px 0px;
+ padding: 0;
+ input {
+ margin: 0;
+ }
+ }
+ }
+ }
+
+ .plugins-check-dependencies-actions {
+ > div {
+ display: inline-block;
+ margin-right: 1em;
+ }
+ .singlebutton {
+ margin: 5px 0;
+ padding: 0;
+ div, input {
+ margin: 0 3px 0 0;
+ }
+ }
+ }
+
+ // List of available dependencies on the plugins check page.
+ #plugins-check-available-dependencies {
+ .displayname .component {
+ font-size: $font-size-sm;
+ @extend .text-muted;
+ }
+ .info .actions {
+ > div {
+ display: inline-block;
+ margin-right: 1em;
+ }
+ .dependencyinstall {
+ display: block;
+ margin: 5px 0;
+ padding: 0;
+ input {
+ margin: 0;
+ }
+ }
+ }
+ }
+}
+
+// Available plugin update notification.
+
+#plugins-check-page, #plugins-control-panel {
+ .pluginupdateinfo {
+ @extend .table-info;
+ &.maturity50 {
+ @extend .table-danger;
+ }
+ &.maturity100, &.maturity150 {
+ @extend .table-warning;
+ }
+ padding: 5px;
+ margin: 10px 0;
+ @include border-radius(5px);
+ .info {
+ display: inline-block;
+ }
+ .separator:after {
+ content: " | ";
+ }
+ .singlebutton {
+ margin: 5px 0;
+ padding: 0;
+ div, input {
+ margin: 0 3px 0 0;
+ }
+ }
+ }
+}
+
+.plugins-management-confirm-buttons {
+ > div {
+ display: inline-block;
+ margin: 1em 1em 1em 0;
+ }
+ .continue {
+ padding: 0;
+ div, input {
+ margin: 0;
+ }
+ }
+}
+
+.uninstalldeleteconfirmexternal {
+ @extend .alert-warning;
+ padding: 0.5em 1em;
+ margin: 5px 0 10px 0;
+}
+
+#page-admin-index .upgradepluginsinfo {
+ text-align: center;
+}
+
+#page-admin-index .adminwarning.availableupdatesinfo .moodleupdateinfo .separator:after {
+ content: " | ";
+}
+
+/** MNet networking */
+#page-admin-mnet-peers .box.deletedhosts {
+ margin-bottom: 1em;
+ font-size: $font-size-sm;
+}
+
+#page-admin-mnet-peers .mform .deletedhostinfo {
+ @extend .form-control-danger;
+ padding: 4px;
+ margin-bottom: 5px;
+}
+
+#core-cache-plugin-summaries table,
+#core-cache-store-summaries table {
+ width: 100%;
+}
+
+#core-cache-lock-summary table,
+#core-cache-definition-summaries table,
+#core-cache-mode-mappings table {
+ margin: 0 auto;
+}
+
+#core-cache-store-summaries .default-store td {
+ font-style: italic;
+}
+
+#core-cache-rescan-definitions,
+#core-cache-mode-mappings .edit-link,
+#core-cache-lock-summary .new-instance {
+ margin-top: 0.5em;
+ text-align: center;
+}
+
+.tinymcesubplugins img.icon {
+ padding-top: 0;
+ padding-bottom: 0;
+}
+
+.maintenancewarning {
+ padding: 3px 1em;
+ text-align: center;
+ position: fixed;
+ bottom: 0;
+ right: 0;
+ overflow: hidden;
+ z-index: 1;
+ &.error {
+ @extend .form-control-danger;
+ }
+ &.warning {
+ @extend .form-control-warning;
+ }
+}
+
+#adminsettings .form-overridden {
+ @extend .form-control-feedback;
+}
--- /dev/null
+.path-backup .mform .grouped_settings.section_level {
+ @extend .card;
+ padding: 10px 0 0 0;
+ clear: both;
+}
+.path-backup .mform .grouped_settings {
+ clear: both;
+ overflow: hidden;
+}
+.path-backup .include_setting,
+.path-backup .grouped_settings .normal_setting {
+ display: inline-block;
+}
+
+.path-backup .include_setting.section_level label {
+ font-weight: bold;
+}
+.path-backup .mform .fitem .fitemtitle {
+ width: 260px;
+}
+.path-backup .mform .fitem .felement {
+ margin-left: 280px;
+}
+.path-backup .notification.dependencies_enforced {
+ text-align: center;
+ color: $state-danger-text;
+ font-weight: bold;
+}
+.path-backup .backup_progress {
+ text-align: center;
+}
+.path-backup .backup_progress .backup_stage {
+ @extend .text-muted;
+}
+.path-backup .backup_progress .backup_stage.backup_stage_current {
+ font-weight: bold;
+ color: inherit;
+}
+.path-backup .backup_progress .backup_stage.backup_stage_next {
+}
+.path-backup .backup_progress span.backup_stage.backup_stage_complete {
+ color: inherit;
+}
+#page-backup-restore .filealiasesfailures {
+ background-color: $state-danger-bg;
+}
+#page-backup-restore .filealiasesfailures .aliaseslist {
+ width: 90%;
+ margin: 0.8em auto;
+ background-color: $body-bg;
+ border: 1px dotted #666;
+}
+.path-backup .fitem .smallicon {
+ vertical-align: text-bottom;
+}
+
+.backup-restore .backup-section > h2.header,
+.backup-restore .backup-section .backup-sub-section h3 {
+ // Copied from bootstrap/forms.less tag legend
+ display: block;
+ width: 100%;
+ padding: 0;
+ margin-bottom: $line-height;
+ font-size: $font-size-base * 1.5;
+ line-height: $line-height * 2;
+ color: $gray-dark;
+ border: 0;
+ border-bottom: 1px solid #e5e5e5;
+}
+.backup-restore .backup-section .noticebox {
+ margin: 1em auto;
+ width: 60%;
+ text-align: center;
+}
+.backup-restore .backup-section.settings-section .detail-pair {
+ width: 50%;
+ display: inline-block;
+}
+.backup-restore .backup-section.settings-section .detail-pair-label {
+ width: 65%;
+}
+.backup-restore .backup-section.settings-section .detail-pair-value {
+ width: 25%;
+}
+.backup-restore .activitytable {
+ min-width: 500px;
+}
+.backup-restore .activitytable .modulename {
+ width: 100px;
+}
+.backup-restore .activitytable .moduleincluded {
+ width: 50px;
+}
+.backup-restore .activitytable .userinfoincluded {
+ width: 50px;
+}
+.backup-restore .detail-pair-label {
+ display: inline-block;
+ width: 25%;
+ padding: 8px;
+ margin: 0;
+ text-align: right;
+ font-weight: bold;
+ vertical-align: top;
+}
+.backup-restore .detail-pair-value {
+ display: inline-block;
+ width: 65%;
+ padding: 8px;
+ margin: 0;
+}
+.backup-restore .detail-pair-value > .sub-detail {
+ display: block;
+ font-size: $font-size-sm;
+ @extend .text-muted;
+}
+.backup-restore > .singlebutton {
+ text-align: right;
+}
+.path-backup .mform .fgroup {
+ .proceedbutton {
+ float: right;
+ margin-right: 5%;
+ }
+ .oneclickbackup {
+ float: right;
+ }
+}
+.restore-course-search .rcs-results {
+ width: 70%;
+ min-width: 400px;
+}
+.restore-course-search .rcs-results table {
+ width: 100%;
+ margin: 0;
+ border-width: 0;
+}
+.restore-course-search .rcs-results table .no-overflow {
+ max-width: 600px;
+}
+.restore-course-search .rcs-results .paging {
+ text-align: left;
+ margin: 0;
+ background-color: #eee;
+ padding: 3px;
+}
+.restore-course-category .rcs-results {
+ width: 70%;
+ min-width: 400px;
+ border: 1px solid #ddd;
+ margin: 5px 0;
+}
+.restore-course-category .rcs-results table {
+ width: 100%;
+ margin: 0;
+ border-width: 0;
+}
+.restore-course-category .rcs-results table .no-overflow {
+ max-width: 600px;
+}
+.restore-course-category .rcs-results .paging {
+ text-align: left;
+ margin: 0;
+ background-color: #eee;
+ padding: 3px;
+}
+.path-backup .wibbler {
+ width: 500px;
+ margin: 0 auto 10px;
+ border-bottom: 1px solid black;
+ border-right: 1px solid black;
+ border-left: 1px solid black;
+ position: relative;
+ min-height: 4px;
+}
+.path-backup .wibbler .wibble {
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 0;
+ height: 4px;
+}
+.path-backup .wibbler .state0 {
+ background: #eee;
+}
+.path-backup .wibbler .state1 {
+ background: #ddd;
+}
+.path-backup .wibbler .state2 {
+ background: #ccc;
+}
+.path-backup .wibbler .state3 {
+ background: #bbb;
+}
+.path-backup .wibbler .state4 {
+ background: #aaa;
+}
+.path-backup .wibbler .state5 {
+ background: #999;
+}
+.path-backup .wibbler .state6 {
+ background: #888;
+}
+.path-backup .wibbler .state7 {
+ background: #777;
+}
+.path-backup .wibbler .state8 {
+ background: #666;
+}
+.path-backup .wibbler .state9 {
+ background: #555;
+}
+.path-backup .wibbler .state10 {
+ background: #444;
+}
+.path-backup .wibbler .state11 {
+ background: #333;
+}
+.path-backup .wibbler .state12 {
+ background: #222;
+}
+.path-backup .backup_log {
+ margin-top: 2em;
+}
+.path-backup .backup_log h2 {
+ font-size: 1em;
+}
+.path-backup .backup_log_contents {
+ border: 1px solid #ddd;
+ padding: 10px;
+ height: 300px;
+ overflow-y: scroll;
+}
\ No newline at end of file
--- /dev/null
+// General block styles.
+.block {
+ @extend .card;
+ padding: 8px 0;
+
+ .header {
+ h2 {
+ font-size: $font-size-sm;
+ @extend .p-x-1;
+ @extend .p-t-1;
+ @extend .font-weight-bold;
+ word-wrap: break-word;
+ margin: 0;
+ }
+ .block_action {
+ padding: 3px 15px;
+ float: right;
+ > * {
+ margin-left:3px;
+ }
+ .block-hider-show,
+ .block-hider-hide {
+ cursor: pointer;
+ }
+ .block-hider-show {
+ display: none;
+ }
+ }
+ }
+ .content {
+ padding: 4px 14px;
+ word-wrap: break-word;
+
+ h3 {
+ font-size: 1.1em;
+ }
+ hr {
+ margin: 5px 0;
+ }
+ .userpicture {
+ width: 16px;
+ height: 16px;
+ margin-right: 6px;
+ }
+ .list {
+ li.listentry {
+ clear: both;
+ }
+ .c0 {
+ display: inline;
+ }
+ .c1 {
+ margin-left: 5px;
+ display: inline;
+ }
+ }
+ }
+ .footer {
+ margin-bottom: 4px;
+ display: block;
+ padding: 3px 5px;
+ }
+ &.beingmoved {
+ border-width: 2px;
+ border-style: dashed;
+ }
+ &.invisible {
+ .header h2 {
+ opacity: 0.5;
+ }
+ }
+
+ &.hidden .header .block_action {
+ .block-hider-hide {
+ display: none;
+ }
+ .block-hider-show {
+ display: inline;
+ }
+ }
+ &.list_block .unlist > li > .column {
+ display: inline-block;
+ }
+}
+.editing {
+ .block {
+ .header {
+ .commands {
+ clear: both;
+ text-align: right;
+ display: block;
+ padding: 3px 15px;
+
+ > a {
+ margin: 0 3px;
+ }
+ .icon img {
+ width: 12px;
+ height: 12px;
+ }
+ img.actionmenu {
+ width: auto;
+ }
+ }
+ }
+ }
+}
+
+// Hide the block content when the block has been minimised.
+.jsenabled .block.hidden .content {
+ display: none;
+}
+
+// Style the div used as a move target for non-drag+drop block moves.
+.blockmovetarget {
+ border-width: 2px;
+ border-style: dashed;
+ display: block;
+ height: 1em;
+ margin-bottom: 20px;
+}
+
+// Style the div that contains the cancel link for moving a block with JS disabled.
+.blockannotation {
+ // Blocks have a bottom margin of 20px, to associate this link with the block being moved
+ // we move it up 10px, and then give it a bottom margin of 10px giving it a better visual association
+ position: relative;
+ top: -10px;
+ margin-bottom: 10px;
+}
+
+// Styles for the blog menu block.
+.block_blog_menu #blogsearchquery {
+ max-width: 92%;
+}
+
+// Styles for the admin block.
+.block_settings {
+ #adminsearchquery {
+ max-width: 92%;
+ }
+}
+
+// Styles for the search forums block.
+.block_search_forums {
+ #searchform_search {
+ width: auto;
+ max-width: 92%;
+ }
+}
+
+// Styles for the Calendar Upcoming block.
+.block_calendar_upcoming {
+ .content {
+ .date {
+ padding-left: 22px;
+ }
+ .footer {
+ margin-top: .5em;
+ padding-top: 10px;
+ padding-left: 0px;
+ }
+ }
+}
+
+// Styles for the RSS client block.
+.block_rss_client {
+ .content li {
+ margin-bottom: 10px;
+ padding: 5px;
+ border: 1px solid $table-border-color;
+ @include border-radius($border-radius);
+ .link {
+ font-weight: inherit;
+ }
+ }
+ .list li:first-child {
+ border-top-width: 1px; // undo the style provided by the block's styles.css
+ }
+}
+
+// Styles for the news items block.
+.block_news_items .content {
+ .newlink {
+ padding-bottom: 10px;
+ }
+ ul li {
+ border-top: 1px rgba(0,0,0,0.05) solid;
+ padding: 2px;
+ display: table;
+ width: 100%;
+ .info {
+ display: table-header-group;
+ }
+ .date {
+ font-size: $font-size-sm;
+ display: inline;
+ }
+ .name {
+ font-size: $font-size-sm;
+ padding-left: 1ex;
+ display: inline;
+ }
+ }
+ .footer {
+ padding-top: 10px;
+ padding-left: 0px;
+ }
+}
+
+.block_navigation .block_tree ul {
+ margin: 0px;
+}
+
+// Overide for login block.
+.block_login {
+ input#login_username,
+ input#login_password {
+ width: 95%;
+ }
+ .content {
+ margin-left: auto;
+ margin-right: auto;
+ max-width: 280px;
+ }
+ input[type="submit"] {
+ margin: 10px 0;
+ }
+}
+
+// Styles for the special "Add block" block shown while editing.
+.block_adminblock {
+ .content {
+ display: block;
+ padding: 3px 5px;
+ }
+ select {
+ max-width: 92%;
+ }
+}
--- /dev/null
+.singlebutton {
+ div {
+ display: inline-block;
+ margin-right: 5px;
+ margin-bottom: 5px;
+ margin-left: 5px;
+ }
+}
+
+// Two singlebuttons side by side for ok/cancel.
+#notice {
+ .buttons {
+ .singlebutton {
+ display: inline-block;
+ }
+ }
+}
+
+.continuebutton {
+ text-align: center;
+}
+
+p.arrow_button {
+ margin-top: 5em;
+ text-align: center;
+ #remove {
+ margin: 3em auto 5em;
+ }
+ input {
+ @extend .btn-block;
+ }
+}
+
+#addcontrols {
+ // The margin top is equal the combination of the line-height and margin of a <p>,
+ // because the visual parent is a <p>.
+ margin-top: $line-height + ($line-height / 2);
+ text-align: center;
+ margin-bottom: 3em;
+ label {
+ display: inline;
+ }
+}
+
+#addcontrols,
+#removecontrols {
+ input {
+ @extend .btn-block;
+ margin: auto;
+ }
+}
+
+.btn-lineup {
+ margin: 0 0 10px 5px;
+}
+
+input[name="searchwikicontent"] + input[type="submit"],
+select + input[type="submit"],
+input[type="text"] + input[type="button"],
+input[type="password"] + input[type="submit"],
+input[type="text"] + button,
+input[type="text"] + input[type="submit"] {
+ @extend .btn-lineup;
+}
+
+button,
+input.form-submit,
+input[type="button"],
+input[type="submit"],
+input[type="reset"] {
+ @extend .btn;
+}
+button,
+input.form-submit,
+input[type="button"],
+input[type="submit"],
+input[type="reset"] {
+ @extend .btn-lineup;
+}
+
+button {
+ &.yui3-button {
+ &.closebutton {
+ background-position: 0 0;
+ &:hover {
+ background-position: 0 0;
+ // Because we assign the button look to every button tag
+ // above, we need to remove some styles from non-standard
+ // looking buttons. Correct fix, assign .btn class to every
+ // actual button in Moodle so we don't need to carpet bomb the
+ // bare button tag.
+ }
+ }
+ }
+}
+
+input {
+ &.fp-btn-choose {
+ @extend .btn-sm;
+ }
+}
+
+.user-enroller-panel {
+ .uep-search-results {
+ .user,
+ .cohort {
+ .options {
+ .enrol {
+ @extend .btn-sm;
+ }
+ }
+ }
+ }
+}
--- /dev/null
+/* calendar.less */
+
+// Calendar colour variables defined.
+$calendarEventCourseColor: #ffd3bd; // Pale red.
+$calendarEventGlobalColor: #d6f8cd; // Pale green.
+$calendarEventGroupColor: #fee7ae; // Pale yellow.
+$calendarEventUserColor: #dce7ec; // Pale blue.
+
+// Calendar event background colours defined.
+.calendar_event_course {
+ background-color: $calendarEventCourseColor;
+}
+.calendar_event_global {
+ background-color: $calendarEventGlobalColor;
+}
+.calendar_event_group {
+ background-color: $calendarEventGroupColor;
+}
+.calendar_event_user {
+ background-color: $calendarEventUserColor;
+}
+
+// Calendar restyling.
+.path-calendar {
+ .calendartable {
+ width: 100%;
+ th, td {
+ width: 14%;
+ vertical-align: top;
+ text-align: center;
+ border: 0;
+ }
+ }
+ .calendar-controls {
+ .previous,
+ .next,
+ .current {
+ display: block;
+ float: left;
+ width: 12%;
+ }
+ .previous {
+ text-align: left;
+ }
+ .current {
+ text-align: center;
+ width: 76%;
+ }
+ .next {
+ text-align: right;
+ }
+ }
+ .filters {
+ table {
+ border-collapse: separate;
+ border-spacing: 2px;
+ width: 100%;
+ }
+ }
+ .cal_courses_flt {
+ float: left;
+
+ label {
+ margin-right: .45em;
+ }
+ }
+ .maincalendar {
+ vertical-align: top;
+ padding: 0;
+ .bottom {
+ text-align: center;
+ padding: 5px 0 0 0;
+ }
+ .heightcontainer {
+ height: 100%;
+ position: relative;
+ }
+ .calendarmonth {
+ width: 98%;
+ margin: 10px auto;
+ }
+ .calendarmonth {
+ ul {
+ margin: 0;
+ li {
+ list-style-type: none;
+ margin-top: 4px;
+ }
+ }
+ td {
+ height: 5em;
+ }
+ }
+ .calendar-controls {
+ .previous,
+ .next {
+ width: 30%;
+ }
+ .current {
+ width: 39.95%;
+ }
+ }
+ .controls {
+ width: 98%;
+ margin: 10px auto;
+ }
+ .calendar_event_course,
+ .calendar_event_global,
+ .calendar_event_group,
+ .calendar_event_user {
+ border-width: 1px 1px 1px 12px;
+ border-style: solid;
+ }
+ .calendar_event_course {
+ border-color: $calendarEventCourseColor;
+ }
+ .calendar_event_global {
+ border-color: $calendarEventGlobalColor;
+ }
+ .calendar_event_group {
+ border-color: $calendarEventGroupColor;
+ }
+ .calendar_event_user {
+ border-color: $calendarEventUserColor;
+ }
+ //.calendar-event-panel {
+ // background-color: $grayLighter;
+ // border: 2px solid $grayLighter;
+ // .yui3-overlay-content {
+ // padding: 19px;
+ // background-color: lighten($wellBackground, 3%);
+ // border: 1px solid darken($wellBackground, 7%);
+ // @include border-radius($baseBorderRadius);
+ // @include box-shadow(inset 0 1px 1px rgba(0, 0, 0, .05));
+ // }
+ //}
+ .calendar-event-panel {
+ @extend .card;
+ }
+ .calendar-controls {
+ .current {
+ @extend .h2;
+ }
+ }
+ .calendartable {
+ td, li {
+ padding: 5px;
+ }
+ li {
+ padding-left: 10px;
+ text-align: left;
+ }
+ }
+ .header {
+ overflow: hidden;
+ .buttons {
+ float: right;
+ }
+ }
+ .eventlist {
+ margin: 0;
+
+ .event {
+ //width: 92%;
+ //border-spacing: 0;
+ //border-collapse: separate;
+ //position: relative;
+ //padding: 20px 4%;
+ //margin-bottom: 20px;
+ //background-color: lighten($wellBackground, 3%);
+ //border: 1px solid darken($wellBackground, 7%);
+ //@include border-radius($baseBorderRadius);
+ //@include box-shadow(inset 0 1px 1px rgba(0,0,0,.05));
+ @extend .card;
+ list-style-type: none;
+
+ > img {
+ padding-top: 3px;
+ float: left;
+ }
+ .name {
+ //font-size: $fontSizeLarge;
+ //font-weight: 200;
+ //line-height: 24px;
+ @extend .h2;
+ float: left;
+ //margin: 0;
+ }
+ .name,
+ .course {
+ margin-bottom: 5px;
+ }
+ .date {
+ float: right;
+ }
+ .course,
+ .subscription {
+ float: left;
+ clear: left;
+ }
+ .side {
+ width: 22px;
+ }
+ .description {
+ background-color: $body-bg;
+ padding: 5px;
+ clear: both;
+ .commands {
+ position: absolute;
+ right: 0;
+ top: 0;
+ margin: 3px;
+ }
+ }
+ .commands {
+ position: absolute;
+ top: 2px;
+ right: 2px;
+ a {
+ margin: 0 3px;
+ }
+ }
+ }
+ }
+ }
+}
+
+// Calendar export.
+#page-calendar-export {
+ .indent {
+ padding-left: 20px;
+ }
+}
+
+// Block minicalendar.
+.block {
+ .minicalendar {
+ max-width: 280px;
+ margin: 0 auto;
+ width: 100%;
+ th, td {
+ padding: 2px;
+ font-size: 0.8em;
+ text-align: center;
+ }
+ td {
+ &.weekend {
+ @extend .text-muted;
+ }
+ a {
+ width: 100%;
+ height: 100%;
+ display: block;
+ }
+ &.duration_global {
+ border-top: 1px solid $calendarEventGlobalColor;
+ border-bottom: 1px solid $calendarEventGlobalColor;
+ &.duration_finish {
+ background-color: $calendarEventGlobalColor;
+ }
+ }
+ &.duration_course {
+ border-top: 1px solid $calendarEventCourseColor;
+ border-bottom: 1px solid $calendarEventCourseColor;
+ &.duration_finish {
+ background-color: $calendarEventCourseColor;
+ }
+ }
+ &.duration_group {
+ border-top: 1px solid $calendarEventGroupColor;
+ border-bottom: 1px solid $calendarEventGroupColor;
+ &.duration_finish {
+ background-color: $calendarEventGroupColor;
+ }
+ }
+ &.duration_user {
+ border-top: 1px solid $calendarEventUserColor;
+ border-bottom: 1px solid $calendarEventUserColor;
+ &.duration_finish {
+ background-color: $calendarEventUserColor;
+ }
+ }
+ }
+ caption {
+ font-size: inherit;
+ font-weight: inherit;
+ line-height: inherit;
+ text-align: center;
+ }
+ }
+ .calendar-event-panel {
+ //background-color: $grayLighter;
+ //border: 1px solid $grayLighter;
+ .yui3-overlay-content {
+ @extend .card;
+ // padding: 19px;
+ // background-color: lighten($wellBackground, 3%);
+ // border: 1px solid darken($wellBackground, 7%);
+ // @include border-radius($baseBorderRadius);
+ // @include box-shadow(inset 0 1px 1px rgba(0 ,0 ,0 , .05));
+ h2 {
+ &.eventtitle {
+ line-height: 1.2;
+ font-size: 18px;
+ }
+ }
+ .eventcontent {
+ img {
+ padding-right: 5px;
+ }
+ }
+ }
+ }
+ .calendar-controls {
+ .previous,
+ .current,
+ .next {
+ display: block;
+ float: left;
+ }
+ .previous {
+ text-align: left;
+ width: 12%;
+ }
+ .current {
+ text-align: center;
+ width: 76%;
+ }
+ .next {
+ text-align: right;
+ width: 12%;
+ }
+ }
+ .calendar_filters {
+ ul {
+ list-style: none;
+ margin: 0;
+ }
+ li {
+ margin-bottom: 0.2em;
+ span {
+ img {
+ padding: 0 0.2em;
+ }
+ }
+ }
+ .eventname {
+ padding-left: 0.2em;
+ }
+ }
+ .content {
+ h3 {
+ &.eventskey {
+ margin-top: 0.5em;
+ }
+ }
+ }
+}
+
+.ical-link {
+ font-size: 10px;
+ font-weight: bold;
+ background-color: #f60;
+ padding: 0px 5px;
+ color: #fff;
+ border-top: 1px solid #f93;
+ border-left: 1px solid #f93;
+ border-bottom: 1px solid #013;
+ border-right: 1px solid #013;
+}
+.ical-link:hover,
+.ical-link:active,
+.ical-link:focus,
+.ical-link:visited {
+ color: #fff;
+ text-decoration: none;
+}
+
+@media (min-width: 768px) {
+ #page-calender-view {
+ .container-fluid {
+ min-width: 1024px;
+ }
+ }
+}
--- /dev/null
+// Chat (more!)
+// -------------------------
+.yui-skin-sam .yui-layout.path-mod-chat-gui_ajax {
+ background-color: $body-bg;
+ .yui-layout-unit div.yui-layout-bd-nohd,
+ .yui-layout-unit div.yui-layout-bd-noft,
+ .yui-layout-unit div.yui-layout-bd,
+ .yui-layout-unit-right,
+ .yui-layout-unit-bottom {
+ border: 0;
+ }
+ .yui-layout-unit-right,
+ .yui-layout-unit-bottom {
+ @extend .card;
+ border-radius: 0;
+ }
+ .yui-layout-unit div.yui-layout-bd {
+ background-color: transparent;
+ }
+ #chat-input-area table.generaltable,
+ #chat-input-area table.generaltable td.cell {
+ border: 0;
+ padding: 3px 15px;
+ white-space: nowrap;
+ input {
+ margin: 0 10px;
+ &#input-message {
+ width: 45%;
+ margin: auto;
+ }
+ }
+ a {
+ margin: 0 5px;
+ }
+ }
+ #chat-userlist {
+ padding: 10px 5px;
+ #users-list {
+ border-top: 1px solid #ddd;
+ border-bottom: 1px solid $body-bg;
+ li {
+ border-top: 1px solid $body-bg;
+ border-bottom: 1px solid #ddd;
+ padding: 5px 10px;
+ }
+ img {
+ margin-right: 8px;
+ border: 1px solid #ccc;
+ border-radius: 4px;
+ max-width: none;
+ }
+ }
+ }
+ #chat-messages {
+ margin: 20px 25px;
+ .chat-event.course-theme {
+ text-align: center;
+ margin: 10px 0;
+ font-size: $font-size-sm;
+ color: #777;
+ }
+ .chat-message.course-theme {
+ background-color: $body-bg;
+ border: 1px dotted #ddd;
+ @include border-radius(4px);
+ padding: 4px 10px;
+ margin: 10px 0;
+ .time {
+ float: right;
+ font-size: 11px;
+ color: #777;
+ }
+ }
+ .mdl-chat-my-entry .chat-message.course-theme {
+ background-color:#f6f6f6;
+ .user {
+ font-weight: bold;
+ }
+ }
+ }
+}
+
+
--- /dev/null
+/* core.less */
+
+/** Page layout CSS starts **/
+.layout-option-noheader #page-header,
+.layout-option-nonavbar #page-navbar,
+.layout-option-nofooter #page-footer,
+.layout-option-nocourseheader .course-content-header,
+.layout-option-nocoursefooter .course-content-footer {
+ display:none;
+}
+
+.empty-region-side-pre #block-region-side-pre, // Pre region is empty.
+.empty-region-side-post #block-region-side-post, // Post region is empty.
+.jsenabled.docked-region-side-post #block-region-side-post, // All post blocks are docked.
+.jsenabled.docked-region-side-pre #block-region-side-pre { // All pre blocks are docked.
+ display:none;
+}
+
+/** Start Legacy styles. Deprecated since Moodle 2.9. See MDL-48160 for further information. **/
+.content-only #region-main.span9, // Two column layout with no block or all blocks docked.
+.empty-region-side-post #region-bs-main-and-pre.span9, // LTR with no post area.
+.empty-region-side-pre #region-bs-main-and-post.span9, // RTL with no pre area.
+.empty-region-side-post #region-bs-main-and-post.span9 #region-main.span8, // RTL with no post area.
+.jsenabled.docked-region-side-post #region-bs-main-and-pre.span9, // LTR with all post blocks docked.
+.jsenabled.docked-region-side-post #region-bs-main-and-post.span9 #region-main.span8,
+.jsenabled.docked-region-side-pre #region-bs-main-and-post.span9 { // RTL with all pre blocks docked.
+ width: 100%;
+}
+
+.empty-region-side-pre #region-bs-main-and-pre.span9 #region-main, // LTR with no pre area.
+.jsenabled.docked-region-side-pre #region-bs-main-and-pre.span9 #region-main { // LTR with all pre blocks docked.
+ float: none;
+ width: 100%;
+}
+
+.empty-region-side-pre #region-bs-main-and-post.span9 #region-main.span8, // RTL with no pre area.
+.jsenabled.docked-region-side-pre #region-bs-main-and-post.span9 #region-main.span8 { // RTL with all pre blocks docked.
+ float: right;
+}
+/** End Legacy styles **/
+
+
+/* Default Three Columns - All
+------------------------------*/
+
+.content-only {
+ #region-main-box,
+ #region-main {
+ width: 100%;
+ }
+}
+.empty-region-side-pre {
+ &.used-region-side-post {
+ #region-main {
+ width: 100%;
+ }
+ }
+}
+.empty-region-side-post {
+ &.used-region-side-pre {
+ #region-main-box {
+ width: 100%;
+ }
+ }
+}
+.jsenabled {
+ &.docked-region-side-pre {
+ &.empty-region-side-pre {
+ &.used-region-side-post {
+ #region-main {
+ width: 100%;
+ }
+ }
+ }
+ }
+ &.docked-region-side-post {
+ &.empty-region-side-post {
+ &.used-region-side-pre {
+ #region-main-box {
+ width: 100%;
+ }
+ }
+ }
+ }
+}
+
+/** Page layout CSS ends **/
+
+.dir-ltr,
+.mdl-left {
+ text-align: left;
+}
+.dir-rtl,
+.mdl-right {
+ text-align: right;
+}
+#add,
+#remove,
+.centerpara,
+.mdl-align {
+ text-align: center;
+}
+a.dimmed,
+a.dimmed:link,
+a.dimmed:visited,
+a.dimmed_text,
+a.dimmed_text:link,
+a.dimmed_text:visited,
+.dimmed_text,
+.dimmed_text a,
+.dimmed_text a:link,
+.dimmed_text a:visited,
+.usersuspended,
+.usersuspended a,
+.usersuspended a:link,
+.usersuspended a:visited,
+.dimmed_category,
+.dimmed_category a {
+ @extend .text-muted
+}
+.activity.label .dimmed_text {
+ opacity: 0.5;
+}
+.unlist,
+.unlist li,
+.inline-list,
+.inline-list li,
+.block .list,
+.block .list li,
+.section li.activity,
+.section li.movehere,
+.tabtree li {
+ list-style: none;
+ margin: 0;
+ padding: 0;
+}
+.inline,
+.inline-list li {
+ display: inline;
+}
+.notifytiny {
+ font-size: $font-size-xs;
+}
+.notifytiny li,
+.notifytiny td {
+ font-size: 100%;
+}
+.red,
+.notifyproblem {
+ @extend .text-warning;
+}
+.green,
+.notifysuccess {
+ @extend .text-success;
+}
+.highlight {
+ @extend .text-info;
+}
+.reportlink {
+ text-align: right;
+}
+a.autolink.glossary:hover {
+ cursor: help;
+}
+/* Block which is hidden if javascript enabled, prevents fickering visible when JS from footer used! */
+.collapsibleregioncaption {
+ white-space: nowrap;
+}
+.pagelayout-mydashboard.jsenabled .collapsibleregioncaption {
+ cursor: pointer;
+}
+.collapsibleregioncaption img {
+ vertical-align: middle;
+}
+
+.jsenabled .hiddenifjs {
+ display: none;
+}
+.visibleifjs {
+ display: none;
+}
+.jsenabled .visibleifjs {
+ display: inline;
+}
+.jsenabled .collapsibleregion {
+ overflow: hidden;
+}
+.jsenabled .collapsed .collapsibleregioninner {
+ visibility: hidden;
+}
+.collapsible-actions {
+ display: none;
+ text-align: right;
+}
+.jsenabled .collapsible-actions {
+ display: block;
+}
+.collapsible-actions .collapseexpand {
+ padding-left: 20px;
+ background: url([[pix:t/collapsed]]) 2px center no-repeat;
+}
+/* rtl:ignore */
+.dir-rtl .collapsible-actions .collapseexpand {
+ background: url([[pix:t/collapsed_rtl]]) right center no-repeat;
+}
+.collapsible-actions .collapse-all {
+ background-image: url([[pix:t/expanded]]);
+}
+.yui-overlay .yui-widget-bd {
+ background-color: #FFEE69;
+ border: 1px solid #A6982B;
+ border-top-color: #D4C237;
+ color: #000000;
+ left: 0;
+ padding: 2px 5px;
+ position: relative;
+ top: 0;
+ z-index: 1;
+}
+.clearer {
+ background: transparent;
+ border-width: 0;
+ clear: both;
+ display: block;
+ height: 1px;
+ margin: 0;
+ padding: 0;
+}
+.bold,
+.warning,
+.errorbox .title,
+.pagingbar .title,
+.pagingbar .thispage {
+ font-weight: bold;
+}
+img.resize {
+ height: 1em;
+ width: 1em;
+}
+.block img.resize,
+.breadcrumb img.resize {
+ height: 0.9em;
+ width: 0.8em;
+}
+/* Icon styles */
+img.icon {
+ height: 16px;
+ vertical-align: text-bottom;
+ width: 16px;
+ padding-right: 6px;
+}
+img.iconsmall {
+ height: 12px;
+ margin-right: 3px;
+ vertical-align: middle;
+ width: 12px;
+ box-sizing: content-box;
+}
+img.iconhelp, .helplink img {
+ height: 16px;
+ padding-left: 3px;
+ vertical-align: text-bottom;
+ width: 16px;
+}
+h1 img.iconhelp, h1 img.icon,
+h2 img.iconhelp, h2 img.icon,
+h3 img.iconhelp, h3 img.icon,
+h4 img.iconhelp, h4 img.icon,
+h5 img.iconhelp, h5 img.icon,
+h6 img.iconhelp, h6 img.icon {
+ vertical-align: middle;
+ padding: 4px;
+}
+img.iconlarge {
+ height: 24px;
+ width: 24px;
+ vertical-align: middle;
+}
+img.iconsort {
+ vertical-align: text-bottom;
+ padding-left: .3em;
+ margin-bottom: .15em;
+}
+img.icontoggle {
+ height: 17px;
+ vertical-align: middle;
+ width: 50px;
+}
+img.iconkbhelp {
+ height: 17px;
+ width: 49px;
+}
+.boxaligncenter {
+ margin-left: auto;
+ margin-right: auto;
+}
+.boxalignright {
+ margin-left: auto;
+ margin-right: 0;
+}
+.boxalignleft {
+ margin-left: 0;
+ margin-right: auto;
+}
+.boxwidthnarrow {
+ width: 30%;
+}
+.boxwidthnormal {
+ width: 50%;
+}
+.boxwidthwide {
+ width: 80%;
+}
+.headermain {
+ font-weight: bold;
+}
+#maincontent {
+ display: block;
+ height: 1px;
+ overflow: hidden;
+}
+img.uihint {
+ cursor: help;
+}
+#addmembersform table {
+ margin-left: auto;
+ margin-right: auto;
+}
+table.flexible .emptyrow {
+ display: none;
+}
+img.emoticon {
+ vertical-align: middle;
+ width: 15px;
+ height: 15px;
+}
+form.popupform,
+form.popupform div {
+ display: inline;
+}
+.arrow_button input {
+ overflow: hidden;
+}
+.action-icon img.smallicon {
+ vertical-align: text-bottom;
+ margin: 0 0.3em;
+}
+
+/** The 1-pixel padding is there to avoid phantom scroll bars on OS X (FF, Safari and Chrome)**/
+.no-overflow {
+ overflow: auto;
+ padding-bottom: 1px;
+}
+.pagelayout-report .no-overflow {
+ overflow: visible;
+}
+.no-overflow > .generaltable {
+ margin-bottom: 0;
+}
+// Accessibility features
+
+// Accessibility: text 'seen' by screen readers but not visual users.
+.accesshide {
+ position: absolute;
+ left: -10000px;
+ font-weight: normal;
+ font-size: 1em;
+}
+span.hide,
+div.hide {
+ display: none;
+}
+// Accessibility: Skip block link, for keyboard-only users.
+a.skip-block,
+a.skip {
+ position: absolute;
+ top: -1000em;
+ font-size: 0.85em;
+ text-decoration: none;
+}
+a.skip-block:focus,
+a.skip-block:active,
+a.skip:focus,
+a.skip:active {
+ position: static;
+ display: block;
+}
+.skip-block-to {
+ display: block;
+ height: 1px;
+ overflow: hidden;
+}
+// Blogs
+.addbloglink {
+ text-align: center;
+}
+.blog_entry .audience {
+ text-align: right;
+ padding-right: 4px;
+}
+.blog_entry .tags {
+ margin-top: 15px;
+}
+.blog_entry .tags .action-icon img.smallicon {
+ height: 16px;
+ width: 16px;
+}
+.blog_entry .content {
+ margin-left: 43px;
+}
+// Group
+#page-group-index #groupeditform {
+ text-align: center;
+}
+#doc-contents h1 {
+ margin: 1em 0 0 0;
+}
+#doc-contents ul {
+ margin: 0;
+ padding: 0;
+ width: 90%;
+}
+#doc-contents ul li {
+ list-style-type: none;
+}
+.groupmanagementtable td {
+ vertical-align: top;
+}
+.groupmanagementtable #existingcell,
+.groupmanagementtable #potentialcell {
+ width: 42%;
+}
+.groupmanagementtable #buttonscell {
+ width: 16%;
+}
+.groupmanagementtable #buttonscell p.arrow_button input {
+ width: auto;
+ min-width: 80%;
+ margin: 0 auto;
+}
+.groupmanagementtable #removeselect_wrapper,
+.groupmanagementtable #addselect_wrapper {
+ width: 100%;
+}
+.groupmanagementtable #removeselect_wrapper label,
+.groupmanagementtable #addselect_wrapper label {
+ font-weight: normal;
+}
+#group-usersummary {
+ width: 14em;
+}
+.groupselector {
+ margin-top: 3px;
+ margin-bottom: 3px;
+ display: inline-block;
+}
+.groupselector label {
+ display: inline-block;
+}
+// Data format selector
+.dataformatselector {
+ margin: 1em 0;
+}
+.dataformatselector label {
+ display: inline-block;
+ margin: 0 5px 10px 0;
+ line-height: 30px;
+ vertical-align: top;
+}
+
+// Login
+.loginbox {
+ margin: 15px;
+ overflow: visible;
+}
+.loginbox.twocolumns {
+ margin: 15px;
+}
+.loginbox h2,
+.loginbox .subcontent {
+ margin: 5px;
+ padding: 10px;
+ text-align: center;
+}
+.loginbox .loginpanel .desc {
+ margin: 0;
+ padding: 0;
+ margin-bottom: 5px;
+ margin-top:15px;
+}
+.loginbox .signuppanel .subcontent {
+ text-align: left;
+}
+.loginbox .loginsub {
+ margin-left: 0;
+ margin-right: 0;
+}
+.loginbox .guestsub,
+.loginbox .forgotsub,
+.loginbox .potentialidps {
+ margin: 5px 12%;
+}
+.loginbox .potentialidps .potentialidplist {
+ margin-left: 40%;
+}
+.loginbox .potentialidps .potentialidplist div {
+ text-align: left;
+}
+.loginbox .loginform {
+ margin-top: 1em;
+ text-align: left;
+}
+.loginbox .loginform .form-label {
+ float: left;
+ text-align: right;
+ width: 49%;
+ white-space: nowrap;
+}
+.loginbox .loginform .form-input {
+ float: right;
+ width: 50%;
+}
+.loginbox .loginform .form-input input {
+ width: 6em;
+}
+.loginbox .signupform {
+ margin-top: 1em;
+ text-align: center;
+}
+.loginbox.twocolumns .loginpanel,
+.loginbox.twocolumns .signuppanel {
+ width: 48%;
+ border: 0;
+ margin: 0;
+ padding: 0;
+ display: block;
+ float: left;
+ margin-left: 2.76243%;
+ min-height: 30px;
+ margin-bottom: -2000px;
+ padding-bottom: 2000px;
+// @include box-sizing(border-box);
+}
+
+.loginbox .potentialidp .smallicon {
+ vertical-align: text-bottom;
+ margin: 0 .3em;
+}
+
+// Notes
+.notepost {
+ margin-bottom: 1em;
+}
+.notepost .userpicture {
+ float: left;
+ margin-right: 5px;
+}
+.notepost .content,
+.notepost .footer {
+ clear: both;
+}
+.notesgroup {
+ margin-left: 20px;
+}
+
+// My Moodle
+.path-my .coursebox .overview {
+ margin: 15px 30px 10px 30px;
+}
+.path-my .coursebox .info {
+ float: none;
+ margin: 0;
+}
+
+// Modules
+.mod_introbox {
+ padding: 10px;
+}
+table.mod_index {
+ width: 100%;
+}
+
+// Comments
+.comment-ctrl {
+ font-size: 12px;
+ display: none;
+ margin: 0;
+ padding: 0;
+}
+.comment-ctrl h5 {
+ margin: 0;
+ padding: 5px;
+}
+.comment-area {
+ max-width: 400px;
+ padding: 5px;
+}
+.comment-area textarea {
+ width: 100%;
+ overflow: auto;
+ &.fullwidth {
+ -webkit-box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ box-sizing: border-box;
+ }
+}
+.comment-area .fd {
+ text-align: right;
+}
+.comment-meta span {
+ color: gray;
+}
+.comment-link img {
+ vertical-align: text-bottom;
+}
+.comment-list {
+ font-size: 11px;
+ overflow: auto;
+ list-style: none;
+ padding: 0;
+ margin: 0;
+}
+.comment-list li {
+ margin: 2px;
+ list-style: none;
+ margin-bottom: 5px;
+ clear: both;
+ padding: .3em;
+ position: relative;
+}
+.comment-list li.first {
+ display: none
+}
+.comment-paging{
+ text-align: center;
+}
+.comment-paging .pageno{
+ padding: 2px;
+}
+.comment-paging .curpage{
+ border: 1px solid #CCC;
+}
+.comment-message .picture {
+ width: 20px;
+ float: left;
+}
+.comment-message .text {
+ margin: 0;
+ padding: 0;
+}
+.comment-message .text p {
+ padding: 0;
+ margin: 0 18px 0 0;
+}
+.comment-delete {
+ position: absolute;
+ top: 0;
+ right: 0;
+ margin: .3em;
+}
+.comment-report-selectall{
+ display: none
+}
+.comment-link {
+ display: none
+}
+.jsenabled .comment-link {
+ display: block
+}
+.jsenabled .showcommentsnonjs{
+ display: none
+}
+.jsenabled .comment-report-selectall{
+ display: inline
+}
+/**
+* Completion progress report
+*/
+.completion-expired {
+ @extend .text-warning;
+}
+.completion-expected {
+ font-size: $font-size-xs;
+}
+.completion-sortchoice,
+.completion-identifyfield {
+ font-size: $font-size-xs;
+ vertical-align: bottom;
+}
+.completion-progresscell {
+ text-align: right;
+}
+.completion-expired .completion-expected {
+ font-weight: bold;
+}
+/**
+* Tags
+*/
+img.user-image {
+ height: 100px;
+ width: 100px;
+}
+#tag-search-box {
+ text-align: center;
+ margin: 10px auto;
+}
+
+.path-tag .tag-index-items .tagarea {
+ border: 1px solid #E3E3E3;
+ border-radius: 4px;
+ padding: 10px;
+ margin-top: 10px;
+}
+
+.path-tag .tag-index-items .tagarea h3 {
+ display: block;
+ padding: 3px 0 10px 0;
+ margin: 0px;
+ font-size: 1.1em;
+ font-weight: bold;
+ line-height: 20px;
+ color: #999;
+ text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.5);
+ text-transform: uppercase;
+ word-wrap: break-word;
+ border-bottom: solid 1px #E3E3E3;
+ margin-bottom: 10px;
+}
+
+.path-tag .tagarea .controls,
+.path-tag .tagarea .taggeditems {
+ @include clearfix();
+}
+.path-tag .tagarea .controls,
+.path-tag .tag-backtoallitems {
+ text-align: center;
+}
+.path-tag .tagarea .controls .gotopage.nextpage {
+ float: right;
+}
+.path-tag .tagarea .controls .gotopage.prevpage {
+ float: left;
+}
+.path-tag .tagarea .controls .exclusivemode {
+ display: inline-block;
+}
+.path-tag .tagarea .controls.controls-bottom {
+ margin-top: 5px;
+}
+.path-tag .tagarea .controls .gotopage.nextpage::after {
+ padding-right: 5px;
+ padding-left: 5px;
+ content: "»";
+}
+.path-tag .tagarea .controls .gotopage.prevpage::before {
+ padding-right: 5px;
+ padding-left: 5px;
+ content: "«";
+}
+
+span.flagged-tag,
+tr.flagged-tag,
+span.flagged-tag a,
+tr.flagged-tag a {
+ @extend .text-warning;
+}
+.tag-management-table td,
+.tag-management-table th {
+ vertical-align: middle;
+ padding: 4px;
+}
+.tag-management-table .inplaceeditable.inplaceeditingon input {
+ width: 150px;
+}
+.path-admin-tag .addstandardtags {
+ float: right;
+ img {
+ margin: 0 5px;
+ }
+}
+.path-tag .tag-relatedtags {
+ padding-top: 10px;
+}
+.path-tag .tag-management-box {
+ text-align: right;
+}
+.path-tag .tag-index-toc {
+ padding: 10px;
+ text-align: center;
+}
+.path-tag .tag-index-toc li,
+.path-tag .tag-management-box li {
+ margin-left: 5px;
+ margin-right: 5px;
+}
+.path-tag .tag-management-box li a.edittag {
+ background-image: url([[pix:moodle|i/settings]]);
+}
+.path-tag .tag-management-box li a.flagasinappropriate {
+ background-image: url([[pix:moodle|i/flagged]]);
+}
+.path-tag .tag-management-box li a.removefrommyinterests {
+ background-image: url([[pix:moodle|t/delete]]);
+}
+.path-tag .tag-management-box li a.addtomyinterests {
+ background-image: url([[pix:moodle|t/add]]);
+}
+.path-tag .tag-management-box li a {
+ background-repeat: no-repeat;
+ background-position: left;
+ padding-left: 17px;
+}
+.tag_feed.media-list .media .itemimage {
+ float: left;
+}
+.tag_feed.media-list .media .itemimage img {
+ height: 35px;
+ width: 35px;
+}
+.tag_feed.media-list .media .media-body {
+ padding-right: 10px;
+ padding-left: 10px;
+}
+.tag_feed .media .muted a {
+ @extend .text-muted;
+}
+.tag_cloud {
+ text-align: center;
+}
+.tag_cloud .inline-list li {
+ padding: 0px 0.2em;
+}
+.tag_cloud .tag_overflow {
+ margin-top: 1em;
+ font-style: italic;
+}
+.tag_cloud .s20 {
+ font-size: 2.7em;
+}
+.tag_cloud .s19 {
+ font-size: 2.6em;
+}
+.tag_cloud .s18 {
+ font-size: 2.5em;
+}
+.tag_cloud .s17 {
+ font-size: 2.4em;
+}
+.tag_cloud .s16 {
+ font-size: 2.3em;
+}
+.tag_cloud .s15 {
+ font-size: 2.2em;
+}
+.tag_cloud .s14 {
+ font-size: 2.1em;
+}
+.tag_cloud .s13 {
+ font-size: 2em;
+}
+.tag_cloud .s12 {
+ font-size: 1.9em;
+}
+.tag_cloud .s11 {
+ font-size: 1.8em;
+}
+.tag_cloud .s10 {
+ font-size: 1.7em;
+}
+.tag_cloud .s9 {
+ font-size: 1.6em;
+}
+.tag_cloud .s8 {
+ font-size: 1.5em;
+}
+.tag_cloud .s7 {
+ font-size: 1.4em;
+}
+.tag_cloud .s6 {
+ font-size: 1.3em;
+}
+.tag_cloud .s5 {
+ font-size: 1.2em;
+}
+.tag_cloud .s4 {
+ font-size: 1.1em;
+}
+.tag_cloud .s3 {
+ font-size: 1em;
+}
+.tag_cloud .s2 {
+ font-size: 0.9em;
+}
+.tag_cloud .s1 {
+ font-size: 0.8em;
+}
+.tag_cloud .s0 {
+ font-size: 0.7em;
+}
+.tag_list ul {
+ display: inline;
+}
+.tag_list.hideoverlimit .overlimit {
+ display:none;
+}
+.tag_list .tagmorelink {
+ display:none;
+}
+.tag_list.hideoverlimit .tagmorelink {
+ display:inline;
+}
+.tag_list.hideoverlimit .taglesslink {
+ display:none;
+}
+
+/**
+* Web Service
+*/
+#webservice-doc-generator td {
+ text-align: left;
+ border: 0 solid black;
+}
+/**
+* Smart Select Element
+*/
+.smartselect {
+ position: absolute;
+}
+.smartselect .smartselect_mask {
+ background-color: #fff;
+}
+.smartselect ul {
+ padding: 0;
+ margin: 0;
+}
+.smartselect ul li {
+ list-style: none;
+}
+.smartselect .smartselect_menu {
+ margin-right: 5px;
+}
+.safari .smartselect .smartselect_menu {
+ margin-left: 2px;
+}
+.smartselect .smartselect_menu,
+.smartselect .smartselect_submenu {
+ border: 1px solid #000;
+ background-color: #FFF;
+ display: none;
+}
+.smartselect .smartselect_menu.visible,
+.smartselect .smartselect_submenu.visible {
+ display: block;
+}
+.smartselect .smartselect_menu_content ul li {
+ position: relative;
+ padding: 2px 5px;
+}
+.smartselect .smartselect_menu_content ul li a {
+ color: #333;
+ text-decoration: none;
+}
+.smartselect .smartselect_menu_content ul li a.selectable {
+ color: inherit;
+}
+.smartselect .smartselect_submenuitem {
+ background-image: url([[pix:moodle|t/collapsed]]);
+ background-repeat: no-repeat;
+ background-position: 100%;
+}
+/** Spanning mode */
+.smartselect.spanningmenu .smartselect_submenu {
+ position: absolute;
+ top: -1px;
+ left: 100%;
+}
+.smartselect.spanningmenu .smartselect_submenu a {
+ white-space: nowrap;
+ padding-right: 16px;
+}
+.smartselect.spanningmenu .smartselect_menu_content ul li a.selectable:hover {
+ text-decoration: underline;
+}
+/** Compact mode */
+.smartselect.compactmenu .smartselect_submenu {
+ position: relative;
+ margin: 2px -3px;
+ margin-left: 10px;
+ display: none;
+ border-width: 0;
+ z-index: 1010;
+}
+.smartselect.compactmenu .smartselect_submenu.visible {
+ display: block;
+}
+.smartselect.compactmenu .smartselect_menu {
+ z-index: 1000;
+ overflow: hidden;
+}
+.smartselect.compactmenu .smartselect_submenu .smartselect_submenu {
+ z-index: 1020;
+}
+.smartselect.compactmenu .smartselect_submenuitem:hover > .smartselect_menuitem_label {
+ font-weight: bold;
+}
+/**
+* Registration
+*/
+#page-admin-registration-register .registration_textfield {
+ width: 300px;
+}
+/**
+* Enrol
+*/
+.userenrolment {
+ width: 100%;
+ border-collapse: collapse;
+}
+.userenrolment tr {
+ vertical-align:top;
+}
+.userenrolment td {
+ padding: 0;
+ height: 41px;
+}
+.userenrolment .subfield {
+ margin-right: 5px;
+}
+.userenrolment .col_userdetails .subfield {
+ margin-left: 40px;
+}
+.userenrolment .col_userdetails .subfield_picture {
+ float: left;
+ margin-left: 0;
+}
+.userenrolment .col_lastseen {
+ width: 150px;
+}
+.userenrolment .col_role {
+ width: 262px;
+}
+.userenrolment .col_role .roles,
+.userenrolment .col_group .groups {
+ margin-right: 30px;
+}
+.userenrolment .col_role .role,
+.userenrolment .col_group .group {
+ &nb
