calendar widget styling for dark themes

This commit is contained in:
zadam 2019-10-08 20:25:54 +02:00
parent 9ad521822d
commit c9432990b7
2 changed files with 4 additions and 12 deletions

View file

@ -8,21 +8,13 @@ import server from "../services/server.js";
const TPL = ` const TPL = `
<div class="calendar-widget"> <div class="calendar-widget">
<div class="calendar-header"> <div class="calendar-header">
<button class="calendar-btn" data-calendar-toggle="previous"> <button class="calendar-btn jam jam-arrow-left" data-calendar-toggle="previous"></button>
<svg height="24" version="1.1" viewbox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg">
<path d="M20,11V13H8L13.5,18.5L12.08,19.92L4.16,12L12.08,4.08L13.5,5.5L8,11H20Z"></path>
</svg>
</button>
<div class="calendar-header__label" data-calendar-label="month"> <div class="calendar-header__label" data-calendar-label="month">
March 2017 March 2017
</div> </div>
<button class="calendar-btn" data-calendar-toggle="next"> <button class="calendar-btn jam jam-arrow-right" data-calendar-toggle="next"></button>
<svg height="24" version="1.1" viewbox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg">
<path d="M4,11V13H16L10.5,18.5L11.92,19.92L19.84,12L11.92,4.08L10.5,5.5L16,11H4Z"></path>
</svg>
</button>
</div> </div>
<div class="calendar-week"> <div class="calendar-week">

View file

@ -16,7 +16,7 @@
border: 0; border: 0;
color: inherit; color: inherit;
cursor: pointer; cursor: pointer;
font: inherit; font-size: x-large;
line-height: normal; line-height: normal;
min-width: 27px; min-width: 27px;
outline: none; outline: none;
@ -61,7 +61,7 @@
.calendar-widget .calendar-date { .calendar-widget .calendar-date {
align-items: center; align-items: center;
background-color: #fff; background-color: var(--main-background-color);
display: flex; display: flex;
flex-direction: column; flex-direction: column;
flex: 0 0 14.28%; flex: 0 0 14.28%;