opensourcemirror
/
nextcloud-calendar
mirror of https://github.com/nextcloud/calendar.git
1
0
Fork 0
Code Issues Releases Wiki Activity

Fix dark mode arrows 

Replaces custom arrows with core ones, allowing them to be themed. Use
flex to properly align buttons

Closes #1042

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
Thomas Citharel 2019-01-03 10:36:50 +01:00
parent d3021e197c
commit a77227919f
No known key found for this signature in database
GPG Key ID: A061B9DDE0CA0773
4 changed files with 12 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

31
css/app/datepicker.scss
View File

@ -117,6 +117,7 @@
#app-navigation .datepicker-heading,
#app-navigation .togglebuttons {
display: flex;
justify-content: space-around;
margin: 0 5px;
width: calc(100% - 10px);
}
@ -140,10 +141,11 @@
z-index: 50; /* Force show border */
}
#app-navigation .datepicker-heading .button.first,
#app-navigation .togglebuttons .button.first {
#app-navigation .datepicker-heading .icon-view-previous,
#app-navigation .togglebuttons .icon-view-previous {
margin-right: -1px;
border-radius: 3px 0 0 3px;
flex-grow: 1;
}
#app-navigation .datepicker-heading .button.middle,
@ -151,34 +153,21 @@
margin-left: 0;
margin-right: 0;
border-radius: 0;
flex-grow: 2;
}
#app-navigation .datepicker-heading .button.last,
#app-navigation .togglebuttons .button.last {
#app-navigation .datepicker-heading .icon-view-next,
#app-navigation .togglebuttons .icon-view-next {
margin-left: -1px;
border-radius: 0 3px 3px 0;
flex-grow: 1;
}
#app-navigation .datepicker-heading .button.first,
#app-navigation .datepicker-heading .button.last {
#app-navigation .datepicker-heading .icon-view-previous,
#app-navigation .datepicker-heading .icon-view-next {
width: 35px;
}
#app-navigation .datepicker-heading .button.middle {
width: calc(100% - 70px);
}
/* Overrides */
.glyphicon-chevron-left {
background: url("../../img/leftarrow.svg") center center no-repeat;
}
.glyphicon-chevron-right {
background: url("../../img/rightarrow.svg") center center no-repeat;
}
.glyphicon {
display: block;
height: 15px;
}

13
img/leftarrow.svg
View File

@ -1,13 +0,0 @@
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="136.3 -90.4 106.9 197.4" style="enable-background:new 136.3 -90.4 106.9 197.4;" xml:space="preserve">
<style type="text/css">
.st0{fill:#010002;}
</style>
<g>
<g>
<g>
<polygon class="st0" points="237.9,107 136.3,8.3 237.9,-90.4 243.1,-85 147.1,8.3 243.1,101.6 "/>
</g>
</g>
</g>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 448 B

13
img/rightarrow.svg
View File

@ -1,13 +0,0 @@
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
viewBox="136.3 -90.4 106.9 197.4" style="enable-background:new 136.3 -90.4 106.9 197.4;" xml:space="preserve">
<style type="text/css">
.st0{fill:#010002;}
</style>
<g>
<g>
<g>
<polygon class="st0" points="141.5,-90.4 243.1,8.3 141.5,107 136.3,101.6 232.3,8.3 136.3,-85 "/>
</g>
</g>
</g>
</svg>
Side by Side

Before

Width:  |  Height:  |  Size: 448 B

8
templates/part.datepicker.php
View File

@ -23,15 +23,11 @@
*/
?>
<div class="datepicker-heading">
<button type="button" class="button first" ng-click="prev()" aria-label="<?php p($l->t('Go back')) ?>">
<i class="glyphicon glyphicon-chevron-left"></i>
</button>
<a href="#" class="icon-view-previous" ng-click="prev()" aria-label="<?php p($l->t('Go back')) ?>"></a>
<button ng-cloak type="button" class="button middle" ng-click="toggle()">
{{ dt | datepickerFilter:selectedView }}
</button>
<button type="button" class="button last" ng-click="next()" aria-label="<?php p($l->t('Go forward')) ?>">
<i class="glyphicon glyphicon-chevron-right"></i>
</button>
<a href="#" class="icon-view-next" ng-click="next()" aria-label="<?php p($l->t('Go forward')) ?>"></a>
</div>
<div id="datepicker-ng-show-container" class="ng-hide" ng-show="visibility">
<div