Symfony 3 - Навбар отображается правильно на каждой странице, кроме одной?

Привет, ребята, я разрабатываю приложение на Symfony 3 с навигационной панелью. Навигационная панель расширяется на каждой странице и правильно отображается на каждой странице. Навигационная панель использует CSS начальной загрузки для создания навигационной панели.

{% extends 'base.html.twig' %}

{% block stylesheets %}
<link rel = "stylesheet" href = "{{ asset('css/css/bootstrap.css') }}"/>
<link rel = "stylesheet" href = "{{ asset('css/illnessPage.css') }}"/>
{% endblock %}

{% block body %}
<div class = "art">
    <div class = "container">
        <h1>Arthritis Care</h1>
        <p>You have signed up to the app with your specified illness being Arthritis.</p>
        <p>Try exploring our app</p>
    </div>
</div>

<div class = "container">
    <div class = "row">
            <div class = "col-sm">
                <div class = "column1">
                Arthritis Care & Exercises
                </div>
                <img src = "../images/arthritisHands.png" alt = "Hands With Arthritis" height = "300" width = "350">
            </div>
             <div class = "col-sm">
                 <div class = "column2">
                     Arthritis Ireland
                 </div>
                 <img src = "../images/artIreland.png" alt = "Arthritis Ireland Logo" height = "300" width = "350">
             </div>
            <div class = "col-sm">
                <div class = "column3">
                    Useful Numbers & Information
                </div>
                <img src = "../images/redphone.png" alt = "Red Phone" height = "300" width = "350">
            </div>
    </div>
</div>
{% endblock %}

Symfony 3 - Навбар отображается правильно на каждой странице, кроме одной?

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

{# default/scheduler.html.twig #}
{% extends 'base.html.twig' %}

{% block stylesheets %}

<link rel='stylesheet' type='text/css' href='{{ asset("libraries/dhtmlx/codebase/dhtmlxscheduler_flat.css") }}' charset = "utf-8"/>
<link rel = "stylesheet" href = "{{ asset('css/scheduler.css') }}"/>
{% endblock %}

{% block body -%}

<div id = "scheduler_element" class = "dhx_cal_container" style='width:100%; height:600px;'>
    <div class = "dhx_cal_navline">
        <div class = "dhx_cal_prev_button">&nbsp;</div>
        <div class = "dhx_cal_next_button">&nbsp;</div>
        <div class = "dhx_cal_today_button"></div>
        <div class = "dhx_cal_date"></div>
        <div class = "dhx_cal_tab" name = "day_tab" style = "right:204px;"></div>
        <div class = "dhx_cal_tab" name = "week_tab" style = "right:140px;"></div>
        <div class = "dhx_cal_tab" name = "month_tab" style = "right:76px;"></div>
    </div>
    <div class = "dhx_cal_header"></div>
    <div class = "dhx_cal_data"></div>
</div>

{% endblock %}

{% block javascripts %}
<!-- Include the scheduler library -->
<script src='{{ asset("libraries/dhtmlx/codebase/dhtmlxscheduler.js") }}' type='text/javascript' charset = "utf-8"></script>

<!-- Include jQuery to handle AJAX Requests -->
<script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>

<!-- Include Momentjs to play with the dates -->
<script src = "{{ asset("libraries/momentjs/moment.js") }}"></script>

<script>

    window.GLOBAL_APPOINTMENTS = {{ appointments|raw }};


    window.GLOBAL_SCHEDULER_ROUTES = {
        create: '{{ path("scheduler_create") }}',
        update: '{{ path("scheduler_update") }}',
        delete: '{{ path("scheduler_delete") }}'
    };

    window.GLOBAL_CATEGORIES = {{ categories|raw }};
</script>

<!-- Include the schedulerScripts that you will need to write in the next step -->
<script src='{{ asset("libraries/schedulerScripts.js") }}' type='text/javascript' charset = "utf-8"></script>
{% endblock %}

Symfony 3 - Навбар отображается правильно на каждой странице, кроме одной?

Шаблон ветки навигационной панели для справки

<!DOCTYPE html>
<html>
<head>
<meta charset = "UTF-8" />

{% block title %}Health Centre Ireland{% endblock %}
{% block stylesheets %}
<link rel = "stylesheet" href = "{{ asset('css/css/bootstrap.css') }}"/>
<link rel = "stylesheet" href = "{{ asset('css/styles.css') }}"/>
<script src = "https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity = "sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin = "anonymous"></script>
<script src = "https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js" integrity = "sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh" crossorigin = "anonymous"></script>
<script src = "https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js" integrity = "sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" crossorigin = "anonymous"></script>
{% endblock %}
<link rel = "icon" type = "image/x-icon" href = "{{ asset('redcross.ico') }}" />
</head>

<body>
<nav class = "navbar navbar-expand-md navbar-dark bg-dark fixed-top">
<a class = "navbar-brand" a href = "#">Health Centre Ireland</a>
<button class = "navbar-toggler" type = "button" data-toggle = "collapse"
        data-target = "#navbarsExampleDDefault" aria-expanded = "false" aria-label = "Toggle navigation">
    <span class = "navbar-toggler-icon"></span>
</button>

<div class = "collapse navbar-collapse" id = "navbarsExampleDefault">
    <ul class = "navbar-nav mr-auto">
        <li class = "nav-item">
            <a class = "nav-link" href = "{{ path('login') }}">Home <span class = "sr-only"></span> </a>
        </li>

        <li class = "nav-item">
            <a class = "nav-link" href = "{{ path ('scheduler') }}">Calender</a>
        </li>

        <li class = "nav-item">
            <a class = "nav-link" href = "#">Message Board</a>
        </li>

            <li class = "nav-item">
                {% if app.user %}
                <a class = "nav-link" href = "
                    {{ logout_path('main') }}">
                        Log Out</a>
                {% else %}
                <a class = "nav-link" href = "
                {{ path ('login') }}">
                    Log In</a>
                {% endif %}

        <li class = "nav-item">
            {% if app.user %}
                <a class = "nav-link" href = "{{ path('deleteuser') }}"> Delete Account</a>
            {% endif %}
        </li>
    </ul>
    <img class = "redcross"
         src = "../images/redcross.png" height = "40" width = "40">
</div>

{% if app.session.flashBag.has('success') %}
    <div class  = "alert alert-success">
        {% for msg in app.session.flashBag.get('success') %}
            {{ msg }}
        {% endfor %}
    </div>
{% endif %}
</nav>

{% block body %}{% endblock %}
{% block javascripts %}{% endblock %}

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Введение в CSS
Введение в CSS
CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.
Как выровнять Div по центру?
Как выровнять Div по центру?
Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
Toor - Ангулярный шаблон для бронирования путешествий
Toor - Ангулярный шаблон для бронирования путешествий
Toor - Travel Booking Angular Template один из лучших Travel & Tour booking template in the world. 30+ валидированных HTML5 страниц, которые помогут...
0
0
446
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

В вашем шаблоне удалите содержимое блока stylesheets.

Вы должны вызвать функцию веточки {{ parent() }} для наследования от базового шаблона:

{% block stylesheets %}
    {{ parent() }}

    <link rel='stylesheet' type='text/css' href='{{ asset("libraries/dhtmlx/codebase/dhtmlxscheduler_flat.css") }}' charset = "utf-8"/>
    <link rel = "stylesheet" href = "{{ asset('css/scheduler.css') }}"/>
{% endblock %}

https://twig.symfony.com/doc/2.x/tags/extends.html#child-template

Спасибо за помощь человеку :). Такая мелочь, но имеет огромное значение!

Dylan Byrne 12.04.2018 15:20

Другие вопросы по теме