Calendar Arrows Fixed

master
Pedram Keshavarzi 3 years ago
parent e103d5341a
commit dbb338b0c9
  1. 21
      src/components/Calendar/index.css
  2. 2
      src/redux/data.js

@ -86,7 +86,7 @@
width: 40em; width: 40em;
z-index: 10; z-index: 10;
max-width: 90vw; max-width: 90vw;
min-height: 36.7em; min-height: 38.7em;
} }
.DatePicker .Calendar, .DatePicker .Calendar,
@ -130,7 +130,7 @@
z-index: 1; z-index: 1;
opacity: 1; opacity: 1;
transition: 0.2s; transition: 0.2s;
background-color: royalblue; background-color: #06BACE;
} }
.Calendar__monthArrowWrapper:focus { .Calendar__monthArrowWrapper:focus {
@ -145,18 +145,18 @@
} }
.Calendar__monthArrowWrapper.-left { .Calendar__monthArrowWrapper.-left {
transform: rotate(90deg); transform: rotate(180deg);
} }
.Calendar.-rtl .Calendar__monthArrowWrapper.-left { .Calendar.-rtl .Calendar__monthArrowWrapper.-left {
transform: rotate(-90deg); transform: rotate(-180deg);
} }
.Calendar__monthArrowWrapper.-right { .Calendar__monthArrowWrapper.-right {
transform: rotate(-90deg); transform: rotate(-0deg);
} }
.Calendar.-rtl .Calendar__monthArrowWrapper.-right { .Calendar.-rtl .Calendar__monthArrowWrapper.-right {
transform: rotate(90deg); transform: rotate(0deg);
} }
.Calendar__monthArrowWrapper:active .Calendar__monthArrow { .Calendar__monthArrowWrapper:active .Calendar__monthArrow {
@ -170,11 +170,12 @@
pointer-events: none; pointer-events: none;
background-repeat: no-repeat; background-repeat: no-repeat;
display: block; display: block;
width: 1.7em; width: 0.7em;
height: 1.7em; height: 0.7em;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cg class='nc-icon-wrapper' fill='%23000000'%3E%3Cdefs stroke='none'%3E%3C/defs%3E%3Cpath class='cls-1' d='M12 23.25V.75' fill='white' stroke='%23000000' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5px'%3E%3C/path%3E%3Cpath class='cls-2' d='M22.5 11.25L12 .75 1.5 11.25' fill='none' stroke='%23000000' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5px' fill-rule='evenodd'%3E%3C/path%3E%3C/g%3E%3C/svg%3E"); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='15' height='15' viewBox='0 0 50 80' xml:space='preserve'%3E%3Cpolyline fill='none' stroke='%23FFFFFF' stroke-width='15' stroke-linecap='round' stroke-linejoin='round' points=' 0.375,0.375 45.63,38.087 0.375,75.8 '/%3E%3C/svg%3E"); background-size: 100% 100%;
background-size: 100% 100%;
background-color: #06BACE; background-color: #06BACE;
background-size: 10px;
background-position: center;
} }
.Calendar__monthYearContainer { .Calendar__monthYearContainer {

@ -444,7 +444,7 @@ const components = [
}, },
}, },
{ {
name : "Calender", name : "SimpleCalendar",
author: "Keshavarzi", author: "Keshavarzi",
props : [ props : [

Loading…
Cancel
Save