Джекилл и минимумы с двумя шрифтами? - PullRequest
0 голосов
/ 11 января 2019

Я пытаюсь заставить Джекилла использовать два шрифта, один для заголовков и один для основного текста. С этой целью я скопировал всю папку _sass в корень моего сайта, затем изменил \ _sass \ minima \ _base.scss, чтобы включить определения для обоих шрифтов ...

/**
  * Basic styling
 */
body {
  font: $base-font-weight #{$base-font-size}/#{$base-line-height} $base-font-family;
  color: $text-color;
  background-color: $background-color;
  -webkit-text-size-adjust: 100%;
  -webkit-font-feature-settings: "kern" 1;
     -moz-font-feature-settings: "kern" 1;
       -o-font-feature-settings: "kern" 1;
          font-feature-settings: "kern" 1;
  font-kerning: normal;
  display: flex;
  min-height: 100vh;
  flex-direction: column;
}

/**
 * Set `margin-bottom` to maintain vertical rhythm
 */
h1, h2, h3, h4, h5, h6,
p, blockquote, pre,
ul, ol, dl, figure,
%vertical-rhythm {
  font: $heading-font-weight #{$heading-font-size}/#{$heading-line-height} $heading-font-family;
  margin-bottom: $spacing-unit / 2;
}

Затем в \ _sass \ minimua.scss я изменил стиль основного шрифта, затем добавил шрифт заголовка:

$base-font-family: serif, Times, "Times New Roman";
$base-font-size:   16px !default;
$base-font-weight: 400 !default;
$small-font-size:  $base-font-size * 0.875 !default;
$base-line-height: 1.5 !default;

$heading-font-family: sans-serif, Helvetica, Arial;
$heading-font-size:   16px !default;
$heading-font-weight: 400 !default;
$heading-line-height: 1.5 !default;

Я также создал \ _sass \ my_overrides.scss, который выглядит следующим образом: @charset "utf-8";

// Define defaults for each variable.

$base-font-family: serif, Times, "Times New Roman";
$heading-font-family: san-serif, Helvetica, Arial;

Но, насколько я могу судить, шрифты переключаются при их использовании (скриншот ниже). И я, наверное, что-то забыл, потому что весь этот процесс настолько сложен.

Итак, мой вопрос: Как получить два шрифта, работающих с Jekyll, с засечками для текста, с Сан-засечками для заголовков?

Полагаю, я мог бы также спросить, есть ли в Jekyll встроенные средства с двумя шрифтами, и если нет, то почему? Но, может быть, это звучит воинственно? (Это не предназначено.)

Снимок экрана с отображением переключенных шрифтов

1 Ответ

0 голосов
/ 11 января 2019

Вы можете разделить css для каждой цели по отдельности, например:

h1, h2, h3, h4, h5, h6 {
    font: $heading-font-weight #{$heading-font-size}/#{$heading-line-height} $heading-font-family;
    margin-bottom: $spacing-unit / 2;
}

p, blockquote, pre,
ul, ol, dl, figure,
%vertical-rhythm {
    font: $base-font-weight #{$base-font-size}/#{$base-font-height} $$base-font-family;
    margin-bottom: $spacing-unit / 2;
}
...