/* ---------------------------------------------------
// Anki Programming Flashcards (CSS Programming Themes)
// MIT License | https://github.com/badlydrawnrob/anki
// ===================================================
// Inherits and extends `print-first-css` and sets up
// styles for our Anki programming flashcards! This can be
// used as-is, or perhaps you'd like to use it as a base
// for another set of Anki cards. Or, you might like to
// use `print-first-css` for a project. We're not worrying
// about `.gl-BaselineGrid` here.
//
//    @ https://bit.ly/2TpdSaL
//
//
// GPS, ECSS, and Thema Styles: The Basic Idea
// -------------------------------------------
// I haven't found a silver bullet yet, so this is a
// work in progress!
//
//    @ link: https://github.com/badlydrawnrob/anki/issues/146 #!
//
// Use GPS where appropriate, and reduce verbosity
// (number of nested levels), which is where I feel the
// method falls down. Use Thema Styles in these cases.
// I'm looking for methods to increase speed when
// checking classnames against their purpose. Be careful
// of naming clashes in bigger sites; it's unlikely to
// happen in a tool as small as this.
//
// If you are interested in these concepts and have a
// big team of developers working together, make sure
// they're well trained on a well-documented and strict
// style. You can always scope everything under it's
// `#page` or `#section`, or use a `.pg-` or `.section-`
// scope like we used to do with ECSS to avoid clashes
// and inheritance issues.
//
// Always try and make use of your plain old HTML
// styles, and have a specimen file and some form of
// design-system for your globals. Go as far as you can
// with raw HTML and very basic styling, before reaching
// for something more complex.
//
//
// Finding what's right for you
// ----------------------------
// GPS theory has been well tested, but Thema Styles
// (although simple) hasn't. There's bound to be stuff I
// might want to change, or rules to get rid of
// completely. GPS doesn't automatically solve every
// problem (one of the reasons I dreamed up Thema styles),
// so some trial and error is needed to arrive at a
// working style you prefer to use!
*/

@import (less) "../../node_modules/print-first-css/build/style/print-first.css";
// @import (less) "../../../print-first-css/build/style/print-first.css";  // #! Only used for local development!


// -----------------------------------------------------------------------------
// Base files (setting the defaults)
// -----------------------------------------------------------------------------
// Print First CSS gives us some variables, but we'll want to add our own!
// Here you'll find our syntax highlighting color variables (and themes).

@import "base/html/_root";


// -----------------------------------------------------------------------------
// Base files (our raw HTML styles)
// -----------------------------------------------------------------------------
// Ideally we'd style as much as possible here.

@import "base/html/blockquote.less";
@import "base/html/code";
@import "base/html/figure";
@import "base/html/headings";
@import "base/html/tables";
@import "base/html/text-elements";
@import "base/html/utilities";


// -----------------------------------------------------------------------------
// Now for the good stuff, our Anki Cards
// -----------------------------------------------------------------------------
// We're using GPS style css, with some naming conventions from ECSS.

@import "globals/card";
@import "globals/code-block";
@import "globals/breezedark";
@import "globals/image-block";
@import "globals/monochrome.less";

@import "pages/front";
@import "pages/reverse";
@import "pages/demo";


/* ---------------------------------------------------
// Your Custom Theme can go here
// ------------------------------------------------- */
// You can preview your changes with different programming
// language `code block` in `build/custom/custom-theme.html`
// (without a `custom-theme.less` file it'll default to our
// main highlighting theme).
//
// `--css-variables` must go inside a selector, like `:root`,
// `body`, `.class` etc.

// :root {
//   @import "base/variables/custom-theme.less";
// }
//
// @import "globals/custom-theme.less";
