планировщик кэндуи меняет цвет заголовка - PullRequest
0 голосов
/ 21 ноября 2018

Мне нужно изменить цвет этой синей кнопки, но я не могу найти правильный селектор (в моем приложении у меня есть файл site.css, который имеет все пользовательские правила CSS)

IВы также искали в онлайн-справке Telerik о планировщике кэндуи, но безуспешно

enter image description here

Кто-нибудь может мне помочь, пожалуйста?Заранее спасибо

1 Ответ

0 голосов
/ 21 ноября 2018

Вы можете использовать следующие селекторы:

Просмотры:

.k-scheduler-views .k-link { // For all the views
    background: blue;
}

.k-view-day .k-link { // For day view only
    background: blue;
}

.k-view-week .k-link { // For week view only
    background: blue;
}

.k-view-month .k-link { // month-view-only
    background: blue;
}

Навигация по дате:

.k-scheduler-navigation .k-link { // For all date navigation controls, including arrows, "Today" and the date picker
    background: blue;
}

.k-nav-today .k-link { // For the "Today" button only
    background: blue;
}

.k-nav-prev .k-link { // For the previous arrow only
    background: blue;
}

.k-nav-next .k-link { // For the next arrow only
    background: blue;
}

.k-nav-current .k-link { // For the date picker only
    background: blue;
}

Обратите внимание, что вы можете найти все эти селекторы вВкладка «Элементы» в Dev Tools любого браузера.

Посмотрите приведенный ниже фрагмент.

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title>Kendo UI Snippet</title>

    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2018.3.1017/styles/kendo.common.min.css"/>
    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2018.3.1017/styles/kendo.rtl.min.css"/>
    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2018.3.1017/styles/kendo.silver.min.css"/>
    <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2018.3.1017/styles/kendo.mobile.all.min.css"/>

    <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
    <script src="https://kendo.cdn.telerik.com/2018.3.1017/js/kendo.all.min.js"></script>
  
    <style>
        .k-scheduler-navigation .k-link {
            background: blue;
        }

        .k-nav-today .k-link {
            background: green;
        }

        .k-nav-prev .k-link {
            background: red;
        }

        .k-nav-next .k-link {
            background: yellow;
        }

        .k-nav-current .k-link {
            background: cyan;
        }
      
        .k-scheduler-views .k-link {
            background: blue;
        }

        .k-view-day .k-link {
            background: green;
        }

        .k-view-week .k-link {
            background: red;
        }

        .k-view-month .k-link {
            background: yellow;
        }
    </style>
</head>
<body>
  
<div id="scheduler"></div>
<script>
$("#scheduler").kendoScheduler({
  date: new Date("2013/6/6"),
  views: ["day", "week", "month", "agenda"],
  dataSource: [
    {
      id: 1,
      start: new Date("2013/6/6 08:00 AM"),
      end: new Date("2013/6/6 09:00 AM"),
      title: "Interview"
    },
    {
      id: 2,
      start: new Date("2013/6/6 08:00 AM"),
      end: new Date("2013/6/6 09:00 AM"),
      title: "Meeting"
    }
  ]
});
</script>
</body>
</html>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...