Настройка темы Jekyll на S CSS и HTML между текстом и изображением - PullRequest
Новая
       29

Настройка темы Jekyll на S CSS и HTML между текстом и изображением

0 голосов
/ 24 марта 2020

Я работаю над настройкой шаблона Justice . Я хотел бы внести изменения в заголовок. Исходный заголовок выглядит следующим образом: The original heading Я проверяю код, который строительное изображение (которое является фоновым изображением) располагается слева, а текст (заголовок и навигация) располагается в правильно. И теперь я хотел бы изменить их следующим образом:

  1. просто разрешить фоновое изображение с фиксированной высотой, а не с позицией слева.
  2. изменить заголовок "СПРАВЕДЛИВОСТЬ" с текста на image.
  3. «Совет» в nav измените его на «Новости».

Для первого _layout.s css в папке «_sass» выглядит следующим образом : 

header {
background-size: cover;
background-repeat: no-repeat;
/*background-position: calc(50% - 40px) 175px;*/
height: 420px;
box-sizing: border-box;

.container {
    text-align: center;
}

@media (min-width: $mobile-break) {
    background-size: contain;
    background-position: calc(50% - 300px) calc(100% + 20px);

    &.main-hero {
        height: 80vh;
        background-position: calc(50% - 350px) calc(100% + 20px);
    }

    .container {
        text-align: right;
    }
}

Я временно создаю положение фона в качестве комментария, так как я думаю, что мне не нужно фиксировать положение фонового изображения, но нужно ли что-нибудь добавить? Например, если тема отображается на мобильном телефоне (что, я думаю, на @media)?

Для изменения заголовка «СПРАВЕДЛИВОСТЬ» на изображение код выглядит как строка 28-40 по умолчанию. html папки «_layout»: 

<header style="background-image: url('{% include relative-src.html src=page.background_image_path %}');" {% if page.large_header %}class="main-hero"{% endif %}>
        <div class="container">
            <h1><a href="{{ site.baseurl }}/">{{ site.data.company.title }}</a></h1>
            <nav>
                <ul>
                    {% assign nav_pages = site.html_pages | where: 'show_in_navigation', true | sort: 'navigation_order' %}
                    {% for nav_page in nav_pages %}
                        <li><a {% if nav_page.url == page.url %}class="active"{% endif %} href="{{ site.baseurl }}{{ nav_page.url }}">{{ nav_page.title }}</a></li>
                    {% endfor %}
                </ul>
            </nav>
        </div>
    </header>

Заголовок этой части: <h1><a href="{{ site.baseurl }}/">{{ site.data.company.title }}</a></h1>. Как я могу изменить эту часть? У меня должно быть что-то вроде <a href="{{ site.baseurl }}/"><img src="what is the link here?"></a>, но какая ссылка в Jekyll в этом случае? Как изменить _layout.s css с фиксированной шириной?

Для изменения «Советы» в nav измените его на «Новости», это то, что мне просто нужно изменить относительное имя папки (например, здесь Совет ) что я хочу (например, здесь "Новости")? Я не мог найти где-нибудь еще, кажется, в том числе. Но мне интересно, где-то еще должны быть ссылки на навигацию, а также ссылка на папку _post (иначе «Совет» не может получить статьи из файла уценки)?

Большое спасибо!

...