Use crafty to build css, convert less to scss

This commit is contained in:
Stéphane Goetz 2018-02-25 20:12:18 +01:00
parent d0b2850434
commit 3346dec1d6
41 changed files with 4135 additions and 1481 deletions

30
crafty.config.js Normal file
View File

@ -0,0 +1,30 @@
module.exports = {
presets: [
"@swissquote/crafty-preset-postcss",
"@swissquote/crafty-runner-gulp"
],
destination_css: "themes",
css: {
"theme_blue": {
source: "themes/daux/scss/theme-blue.scss",
destination: "daux/css/theme-blue.min.css"
},
"theme_green": {
source: "themes/daux/scss/theme-green.scss",
destination: "daux/css/theme-green.min.css"
},
"theme_navy": {
source: "themes/daux/scss/theme-navy.scss",
destination: "daux/css/theme-navy.min.css"
},
"theme_red": {
source: "themes/daux/scss/theme-red.scss",
destination: "daux/css/theme-red.min.css"
},
"daux_singlepage": {
source: "themes/daux_singlepage/scss/main.scss",
destination: "daux_singlepage/css/main.min.css"
}
}
};

View File

@ -1,86 +0,0 @@
var cssnano = require('cssnano'),
gulp = require('gulp'),
less = require('gulp-less'),
rename = require('gulp-rename'),
plumber = require('gulp-plumber'),
postcss = require('gulp-postcss'),
stylelint = require('gulp-stylelint');
var resources = {
daux_blue:{source: "themes/daux/less/theme-blue.less", dest: "themes/daux/css/"},
daux_green:{source: "themes/daux/less/theme-green.less", dest: "themes/daux/css/"},
daux_navy:{source: "themes/daux/less/theme-navy.less", dest: "themes/daux/css/"},
daux_red:{source: "themes/daux/less/theme-red.less", dest: "themes/daux/css/"},
daux_singlepage:{source: "themes/daux_singlepage/less/main.less", dest: "themes/daux_singlepage/css/"}
};
var stylelintRules = {
"indentation": 4,
"selector-list-comma-newline-after": "always-multi-line",
"selector-max-id": 0,
// Autoprefixer
"at-rule-no-vendor-prefix": true,
"media-feature-name-no-vendor-prefix": true,
"property-no-vendor-prefix": true,
"selector-no-vendor-prefix": true,
"value-no-vendor-prefix": true
};
var cssnanoOptions = {
safe: true, // Disable dangerous optimisations
filterPlugins: false, // This does very weird stuff
autoprefixer: {
add: true, // Add needed prefixes
remove: true // Remove unnecessary prefixes
}
};
function createCSSTask(source, dest) {
return function () {
return gulp.src(source)
.pipe(plumber())
.pipe(less())
.pipe(postcss([cssnano(cssnanoOptions)]))
.pipe(rename({suffix: '.min'}))
.pipe(gulp.dest(dest));
}
}
gulp.task('lint-css', function () {
return gulp
.src(['themes/**/less/**/*.less', '!themes/**/vendor/**/*.less'])
.pipe(stylelint({
failAfterError: true,
config: {
extends: 'stylelint-config-standard',
rules: stylelintRules
},
syntax: 'less',
reporters: [{
formatter: 'string',
console: true
}],
debug: true
}));
});
var style_tasks = [];
for (var style in resources) {
if (resources.hasOwnProperty(style)) {
gulp.task('style_' + style, createCSSTask(resources[style].source, resources[style].dest));
style_tasks.push('style_' + style);
}
}
style_tasks.push('lint-css');
gulp.task("styles", style_tasks);
gulp.task('watch', ['default'], function () {
// Watch .less files
gulp.watch('themes/**/less/**/*.less', ['styles']);
});
gulp.task('default', ['styles']);

View File

@ -3,17 +3,12 @@
"version": "0.3.0", "version": "0.3.0",
"private": true, "private": true,
"devDependencies": { "devDependencies": {
"cssnano": "^3.7.3", "@swissquote/crafty": "^1.0.1",
"gulp": "^3.9.1", "@swissquote/crafty-preset-postcss": "^1.0.1",
"gulp-less": "^3.1.0", "@swissquote/crafty-runner-gulp": "^1.0.1"
"gulp-plumber": "^1.1.0",
"gulp-postcss": "^7.0.0",
"gulp-rename": "^1.2.2",
"gulp-stylelint": "^5.0.0",
"stylelint-config-standard": "^17.0.0"
}, },
"scripts": { "scripts": {
"build": "gulp", "build": "crafty run",
"watch": "gulp watch" "watch": "crafty watch"
} }
} }

View File

@ -3,15 +3,15 @@
<head> <head>
<title><?= $page['title']; ?> <?= ($page['title'] != $params['title'])? '- ' . $params['title'] : "" ?></title> <title><?= $page['title']; ?> <?= ($page['title'] != $params['title'])? '- ' . $params['title'] : "" ?></title>
<?php //SEO meta tags... <?php //SEO meta tags...
if (array_key_exists('description', $page['attributes'])) { if (array_key_exists('attributes', $page) && array_key_exists('description', $page['attributes'])) {
echo " <meta name=\"description\" content=\"{$page['attributes']['description']}\">\n"; echo " <meta name=\"description\" content=\"{$page['attributes']['description']}\">\n";
} elseif (array_key_exists('tagline', $params)) { } elseif (array_key_exists('tagline', $params)) {
echo " <meta name=\"description\" content=\"{$params['tagline']}\">\n"; echo " <meta name=\"description\" content=\"{$params['tagline']}\">\n";
} }
if (array_key_exists('keywords', $page['attributes'])) { if (array_key_exists('attributes', $page) && array_key_exists('keywords', $page['attributes'])) {
echo " <meta name=\"keywords\" content=\"{$page['attributes']['keywords']}\">\n"; echo " <meta name=\"keywords\" content=\"{$page['attributes']['keywords']}\">\n";
} }
if (array_key_exists('author', $page['attributes'])) { if (array_key_exists('attributes', $page) && array_key_exists('author', $page['attributes'])) {
echo " <meta name=\"author\" content=\"{$page['attributes']['author']}\">\n"; echo " <meta name=\"author\" content=\"{$page['attributes']['author']}\">\n";
} elseif (array_key_exists('author', $params)) { } elseif (array_key_exists('author', $params)) {
echo " <meta name=\"author\" content=\"{$params['author']}\">\n"; echo " <meta name=\"author\" content=\"{$params['author']}\">\n";

View File

@ -1,7 +1,10 @@
@font-family-text: "Helvetica Neue", Helvetica, Arial, sans-serif; :root {
@font-family-monospace: Monaco, Menlo, Consolas, "Courier New", monospace; --font-family-text: "Helvetica Neue", Helvetica, Arial, sans-serif;
@font-family-heading: "Roboto Slab", @font-family-text; --font-family-monospace: Monaco, Menlo, Consolas, "Courier New", monospace;
--font-family-heading: "Roboto Slab", var(--font-family-text);
}
/*! Generated by Font Squirrel (https://www.fontsquirrel.com) on September 13, 2017 */ /*! Generated by Font Squirrel (https://www.fontsquirrel.com) on September 13, 2017 */

View File

@ -157,7 +157,7 @@ img {
} }
code { code {
font-family: @font-family-monospace; font-family: var(--font-family-monospace);
} }
code, tt { code, tt {

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1,11 +0,0 @@
//Daux.io Blue
@sidebar-background: #f7f7f7;
@sidebar-hover: #c5c5cb;
@lines: #e7e7e9;
@dark: #3f4657;
@light: #82becd;
@text: #2d2d2d;
// Daux.io Base
@import "theme.less";

View File

@ -1,11 +0,0 @@
//Daux.io Green
@sidebar-background: #f5f5f6;
@sidebar-hover: #a0d55d;
@lines: #e7e7e9;
@dark: #000;
@light: #8acc37;
@text: #2d2d2d;
// Daux.io Base
@import "theme.less";

View File

@ -1,11 +0,0 @@
//Daux.io Navy
@sidebar-hover: #c5c5cb;
@lines: #e7e7e9;
@sidebar-background: #f5f5f6;
@dark: #13132a;
@light: #7795b4;
@text: #2d2d2d;
// Daux.io Base
@import "theme.less";

View File

@ -1,11 +0,0 @@
// Daux.io Red
@sidebar-hover: #eee;
@lines: #eee;
@sidebar-background: #f7f7f7;
@dark: #c64641; //#df4f49;
@light: #ecb5a1;
@text: #2d2d2d;
// Daux.io Base
@import "theme.less";

View File

@ -1,24 +0,0 @@
/*!
* DAUX.IO
* https://dauxio.github.io/
* MIT License
*/
// Daux Style
@import "../../common/less/vendor/normalize.less";
@import "../../common/less/_fonts.less";
@import "_mixins.less";
@import "_utilities.less";
// Layout
@import "_structure.less";
// Content presentation
@import "_typography.less";
@import "_components.less";
@import "_homepage.less";
@import "../../common/less/vendor/highlight.less";
@media print {
@import "_print.less";
}

View File

@ -4,7 +4,7 @@ Base tags
a { a {
text-decoration: none; text-decoration: none;
color: @light; color: var(--light);
&.external::after { &.external::after {
content: " " url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAVklEQVR4Xn3PgQkAMQhDUXfqTu7kTtkpd5RA8AInfArtQ2iRXFWT2QedAfttj2FsPIOE1eCOlEuoWWjgzYaB/IkeGOrxXhqB+uA9Bfcm0lAZuh+YIeAD+cAqSz4kCMUAAAAASUVORK5CYII=); content: " " url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAVklEQVR4Xn3PgQkAMQhDUXfqTu7kTtkpd5RA8AInfArtQ2iRXFWT2QedAfttj2FsPIOE1eCOlEuoWWjgzYaB/IkeGOrxXhqB+uA9Bfcm0lAZuh+YIeAD+cAqSz4kCMUAAAAASUVORK5CYII=);
@ -27,7 +27,7 @@ hr {
} }
code { code {
color: @dark; color: var(--dark);
} }
/* =========================================================================================== /* ===========================================================================================
@ -97,32 +97,32 @@ Components
margin-left: 0; margin-left: 0;
&:not(:last-child):not(.dropdown-toggle) { &:not(:last-child):not(.dropdown-toggle) {
.border-right-radius(0); @include border-right-radius(0);
} }
} }
// Need .dropdown-toggle since :last-child doesn't apply given a .dropdown-menu immediately after it // Need .dropdown-toggle since :last-child doesn't apply given a .dropdown-menu immediately after it
&:last-child:not(:first-child) { &:last-child:not(:first-child) {
.border-left-radius(0); @include border-left-radius(0);
} }
} }
} }
.Brand { .Brand {
display: block; display: block;
background-color: @dark; background-color: var(--dark);
padding: 15px 20px; padding: 15px 20px;
font-size: 18px; font-size: 18px;
text-shadow: none; text-shadow: none;
font-family: @font-family-heading; font-family: var(--font-family-heading);
font-weight: 700; font-weight: 700;
color: @light; color: var(--light);
} }
.Navbar { .Navbar {
height: 50px; height: 50px;
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25); box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25);
background-color: @dark; background-color: var(--dark);
margin-bottom: 0; margin-bottom: 0;
.Brand { .Brand {
@ -162,8 +162,8 @@ Components
top: 50%; top: 50%;
width: 0.5em; width: 0.5em;
height: 0.5em; height: 0.5em;
border-right: 0.15em solid @dark; border-right: 0.15em solid var(--dark);
border-top: 0.15em solid @dark; border-top: 0.15em solid var(--dark);
transform: rotate(45deg); transform: rotate(45deg);
transition-duration: 0.3s; transition-duration: 0.3s;
} }
@ -176,17 +176,17 @@ Components
display: block; display: block;
margin: 0; margin: 0;
padding: 6px 15px 6px 20px; padding: 6px 15px 6px 20px;
font-family: @font-family-heading; font-family: var(--font-family-heading);
font-weight: 400; font-weight: 400;
color: @dark; color: var(--dark);
font-size: 15px; font-size: 15px;
text-shadow: none; text-shadow: none;
border-color: @lines; border-color: var(--lines);
&:hover { &:hover {
color: @dark; color: var(--dark);
text-shadow: none; text-shadow: none;
background-color: @sidebar-hover; background-color: var(--sidebar-hover);
} }
} }
} }
@ -200,8 +200,8 @@ Components
margin: 0; margin: 0;
margin-left: -15px; margin-left: -15px;
padding: 3px 30px; padding: 3px 30px;
font-family: @font-family-text; font-family: var(--font-family-text);
color: @text; color: var(--text);
opacity: 0.7; opacity: 0.7;
&:hover { &:hover {
@ -210,7 +210,7 @@ Components
} }
&--active a { &--active a {
color: @dark; color: var(--dark);
} }
} }
} }
@ -219,7 +219,7 @@ Components
&--open, &--open,
&--active { &--active {
> a { > a {
background-color: @sidebar-hover; background-color: var(--sidebar-hover);
} }
} }
@ -241,7 +241,7 @@ Components
padding: 0; padding: 0;
border-bottom: 1px solid #eee; border-bottom: 1px solid #eee;
.clearfix(); @include clearfix();
h1 { h1 {
margin: 0; margin: 0;
@ -274,9 +274,9 @@ Components
padding: 0 20px; padding: 0 20px;
a { a {
font-family: @font-family-heading; font-family: var(--font-family-heading);
font-weight: 400; font-weight: 400;
color: @light; color:var(--light);
line-height: 2em; line-height: 2em;
} }
} }
@ -296,7 +296,7 @@ Components
transition: border-color ease-in-out 0.15s; transition: border-color ease-in-out 0.15s;
&:focus { &:focus {
border-color: @light; border-color: var(--light);
outline: 0; outline: 0;
} }
} }
@ -395,7 +395,7 @@ ul.TableOfContents {
text-align: center; text-align: center;
clear: both; clear: both;
.clearfix(); @include clearfix();
li { li {
display: inline; display: inline;
@ -460,7 +460,7 @@ ul.TableOfContents {
/* Checked state */ /* Checked state */
.Checkbox input:checked ~ & { .Checkbox input:checked ~ & {
background: @dark; background: var(--dark);
/* Show check mark */ /* Show check mark */
&::after { &::after {
@ -470,7 +470,7 @@ ul.TableOfContents {
/* Hover state whilst checked */ /* Hover state whilst checked */
.Checkbox:hover input:not([disabled]):checked ~ &, .Checkbox input:checked:focus ~ & { .Checkbox:hover input:not([disabled]):checked ~ &, .Checkbox input:checked:focus ~ & {
background: @light; background: var(--light);
} }
/* Disabled state */ /* Disabled state */

View File

@ -38,15 +38,15 @@ Homepage
.Homepage { .Homepage {
padding-top: 60px !important; padding-top: 60px !important;
background-color: @light; background-color: var(--light);
border-radius: 0; border-radius: 0;
border: none; border: none;
color: @dark; color: var(--dark);
overflow: hidden; overflow: hidden;
padding-bottom: 0; padding-bottom: 0;
margin-bottom: 0; margin-bottom: 0;
.kill-box-shadow; @include kill-box-shadow;
} }
.HomepageTitle { .HomepageTitle {
@ -69,7 +69,7 @@ Homepage
.HomepageButtons { .HomepageButtons {
padding: 20px 0; padding: 20px 0;
background-color: @sidebar-hover; background-color: var(--sidebar-hover);
text-align: center; text-align: center;
.Button--hero { .Button--hero {
@ -79,12 +79,12 @@ Homepage
opacity: 0.8; opacity: 0.8;
margin: 0 10px; margin: 0 10px;
text-transform: uppercase; text-transform: uppercase;
border: 5px solid @dark; border: 5px solid var(--dark);
font-family: @font-family-heading; font-family: var(--font-family-heading);
font-weight: 700; font-weight: 700;
.kill-background-image; @include kill-background-image;
.kill-box-shadow; @include kill-box-shadow;
@media (max-width: 768px) { @media (max-width: 768px) {
display: block; display: block;
@ -96,13 +96,13 @@ Homepage
} }
&.Button--secondary { &.Button--secondary {
background-color: @sidebar-hover; background-color: var(--sidebar-hover);
color: @dark; color: var(--dark);
} }
&.Button--primary { &.Button--primary {
background-color: @dark; background-color: var(--dark);
color: @sidebar-background; color: var(--sidebar-background);
} }
} }
} }
@ -136,7 +136,7 @@ Homepage
width: 0; width: 0;
height: 0; height: 0;
border: 3px solid transparent; border: 3px solid transparent;
border-left: 3px solid @light; border-left: 3px solid var(--light);
float: left; float: left;
display: block; display: block;
margin: 6px 6px 6px -12px; margin: 6px 6px 6px -12px;
@ -145,7 +145,7 @@ Homepage
} }
.lead { .lead {
font-family: @font-family-heading; font-family: var(--font-family-heading);
font-weight: 300; font-weight: 300;
font-size: 16px; font-size: 16px;
margin-bottom: 20px; margin-bottom: 20px;
@ -162,12 +162,12 @@ Homepage
} }
.HomepageFooter { .HomepageFooter {
background-color: @dark; background-color: var(--dark);
border-radius: 0; border-radius: 0;
color: @light; color: var(--light);
border: none; border: none;
.kill-box-shadow; @include kill-box-shadow;
@media (max-width: 768px) { @media (max-width: 768px) {
padding: 0 20px; padding: 0 20px;
@ -196,11 +196,11 @@ Homepage
a { a {
line-height: 32px; line-height: 32px;
font-size: 16px; font-size: 16px;
font-family: @font-family-heading; font-family: var(--font-family-heading);
font-weight: 700; font-weight: 700;
&:hover { &:hover {
color: @light; color: var(--light);
text-decoration: underline; text-decoration: underline;
} }
} }

View File

@ -2,39 +2,42 @@
Mixins Mixins
============================================================================================== */ ============================================================================================== */
.kill-background-image() { @mixin kill-background-image {
background-image: none; background-image: none;
filter: none; filter: none;
} }
.kill-box-shadow() { @mixin kill-box-shadow {
box-shadow: none; box-shadow: none;
} }
.sans-serif(@weight: normal, @size: 14px, @lineheight: 20px) { @mixin sans-serif($weight: normal, $size: 14px, $lineheight: 20px) {
font-weight: @weight; font-weight: $weight;
font-size: @size; font-size: $size;
font-family: @font-family-text; font-family: $font-family-text;
line-height: @lineheight; line-height: $lineheight;
} }
// Single side border-radius // Single side border-radius
.border-top-radius(@radius) { @mixin border-top-radius($radius) {
border-top-right-radius: @radius; border-top-right-radius: $radius;
border-top-left-radius: @radius; border-top-left-radius: $radius;
} }
.border-right-radius(@radius) {
border-bottom-right-radius: @radius; @mixin border-right-radius($radius) {
border-top-right-radius: @radius; border-bottom-right-radius: $radius;
border-top-right-radius: $radius;
} }
.border-bottom-radius(@radius) {
border-bottom-right-radius: @radius; @mixin border-bottom-radius($radius) {
border-bottom-left-radius: @radius; border-bottom-right-radius: $radius;
border-bottom-left-radius: $radius;
} }
.border-left-radius(@radius) {
border-bottom-left-radius: @radius; @mixin border-left-radius($radius) {
border-top-left-radius: @radius; border-bottom-left-radius: $radius;
border-top-left-radius: $radius;
} }
// Clearfix // Clearfix
@ -49,7 +52,7 @@ Mixins
// //
// Source: http://nicolasgallagher.com/micro-clearfix-hack/ // Source: http://nicolasgallagher.com/micro-clearfix-hack/
.clearfix() { @mixin clearfix {
&::before, &::before,
&::after { &::after {
content: " "; // 1 content: " "; // 1

View File

@ -1,4 +1,4 @@
@import "../../common/less/_print.less"; @import "../../common/scss/_print.scss";
.Pager { display: none; } .Pager { display: none; }

View File

@ -15,12 +15,12 @@ Docs Body & Page Structure
html, body { html, body {
height: 100%; height: 100%;
background-color: #fff; background-color: #fff;
color: @text; color: var(--text);
} }
.Columns { .Columns {
&__left { &__left {
background-color: @sidebar-background; background-color: var(--sidebar-background);
} }
&__right { &__right {
@ -44,8 +44,8 @@ html, body {
border: none; border: none;
float: right; float: right;
.kill-background-image; @include kill-background-image;
.kill-box-shadow; @include kill-box-shadow;
&--bar { &--bar {
display: block; display: block;
@ -53,17 +53,17 @@ html, body {
height: 2px; height: 2px;
margin-top: 2px; margin-top: 2px;
margin-bottom: 3px; margin-bottom: 3px;
background-color: @light; background-color: var(--light);
.kill-box-shadow; @include kill-box-shadow;
} }
&:hover { &:hover {
background-color: @sidebar-hover; background-color: var(--sidebar-hover);
.kill-box-shadow; @include kill-box-shadow;
.Collapsible__trigger--bar { .Collapsible__trigger--bar {
background-color: @dark; background-color: var(--dark);
.kill-box-shadow; @include kill-box-shadow;
} }
} }
} }
@ -72,7 +72,7 @@ html, body {
@media screen and (min-width: 768px) { @media screen and (min-width: 768px) {
body { body {
//Needed only for floating code blocks //Needed only for floating code blocks
background-color: @light; background-color: var(--light);
} }
.Navbar { .Navbar {
@ -114,7 +114,7 @@ html, body {
&__left { &__left {
width: 25%; width: 25%;
border-right: 1px solid @lines; border-right: 1px solid var(--lines);
overflow-x: hidden; overflow-x: hidden;
} }

View File

@ -3,7 +3,7 @@ Base CSS
============================================================================================== */ ============================================================================================== */
body { body {
font-family: @font-family-text; font-family: var(--font-family-text);
text-rendering: optimizeLegibility; text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
@ -12,12 +12,12 @@ body {
} }
h1, h2, h3, h4, h5, h6 { h1, h2, h3, h4, h5, h6 {
font-family: @font-family-heading; font-family: var(--font-family-heading);
font-weight: 300; font-weight: 300;
} }
.s-content { .s-content {
@import "../../common/less/_typography.less"; @import "../../common/scss/_typography.scss";
pre { pre {
border: none; border: none;

View File

@ -6,7 +6,7 @@
// ------------------------- // -------------------------
.clearfix { .clearfix {
.clearfix(); @include clearfix();
} }
.pull-right { .pull-right {

View File

@ -0,0 +1,11 @@
@import "theme.scss";
//Daux.io Blue
:root {
--sidebar-background: #f7f7f7;
--sidebar-hover: #c5c5cb;
--lines: #e7e7e9;
--dark: #3f4657;
--light: #82becd;
--text: #2d2d2d;
}

View File

@ -0,0 +1,11 @@
@import "theme.scss";
//Daux.io Green
:root {
--sidebar-background: #f5f5f6;
--sidebar-hover: #a0d55d;
--lines: #e7e7e9;
--dark: #000;
--light: #8acc37;
--text: #2d2d2d;
}

View File

@ -0,0 +1,11 @@
@import "theme.scss";
//Daux.io Navy
:root {
--sidebar-hover: #c5c5cb;
--lines: #e7e7e9;
--sidebar-background: #f5f5f6;
--dark: #13132a;
--light: #7795b4;
--text: #2d2d2d;
}

View File

@ -0,0 +1,11 @@
@import "theme.scss";
// Daux.io Red
:root {
--sidebar-hover: #eee;
--lines: #eee;
--sidebar-background: #f7f7f7;
--dark: #c64641; //#df4f49;
--light: #ecb5a1;
--text: #2d2d2d;
}

View File

@ -0,0 +1,24 @@
/*!
* DAUX.IO
* https://dauxio.github.io/
* MIT License
*/
// Daux Style
@import "../../common/scss/vendor/normalize.scss";
@import "../../common/scss/_fonts.scss";
@import "_mixins.scss";
@import "_utilities.scss";
// Layout
@import "_structure.scss";
// Content presentation
@import "_typography.scss";
@import "_components.scss";
@import "_homepage.scss";
@import "../../common/scss/vendor/highlight.scss";
@media print {
@import "_print.scss";
}

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1,5 +1,5 @@
@import "../../common/less/_print.less"; @import "../../common/scss/_print.scss";
a[href]::after { a[href]::after {
content: " (" attr(href) ")"; content: " (" attr(href) ")";

View File

@ -1,6 +1,6 @@
h1, h2, h3, h4, h5, h6 { h1, h2, h3, h4, h5, h6 {
font-family: @font-family-heading; font-family: var(--font-family-heading);
font-weight: 300; font-weight: 300;
} }
@ -8,5 +8,5 @@ section.content {
padding: 15px 25px 25px; padding: 15px 25px 25px;
background-color: white; background-color: white;
@import "../../common/less/_typography.less"; @import "../../common/scss/_typography.scss";
} }

View File

@ -1,7 +1,7 @@
// Core variables and mixins // Core variables and mixins
@import "../../common/less/_fonts.less"; @import "../../common/scss/_fonts.scss";
@import "vendor/highlight.less"; @import "vendor/highlight.scss";
@import "_typography.less"; @import "_typography.scss";
* { * {
-webkit-overflow-scrolling: touch; -webkit-overflow-scrolling: touch;
@ -17,7 +17,7 @@ body {
text-rendering: optimizeLegibility; text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
font-family: @font-family-text; font-family: var(--font-family-text);
} }
a { a {
@ -54,5 +54,5 @@ img {
} }
@media print { @media print {
@import "_print.less"; @import "_print.scss";
} }

5112
yarn.lock

File diff suppressed because it is too large Load Diff