Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

added month navigation UI and functionality #77

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open

added month navigation UI and functionality #77

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 3 additions & 1 deletion README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -78,12 +78,13 @@ titleFormat | string | 'MM yyyy' | Date format for calendar title | Date string
eventHeaderFormat | string | 'MM d, yyyy' | Date format for calendar event's title | Date string format
firstDayOfWeek | number | 0 | Displayed first day of the week | 0 (Sunday) - 6 (Saturday)
language | string | 'en' | Calendar's language | en, es, de, pt, fr, nl
todayHighlight | boolean | false | Highlight today's date in calendar | true, false
todayHighlight | boolean | false | Highlight today's date in calendar and displays "Today" text in sidebar | true, false
sidebarDisplayDefault | boolean | true | Set default visibility of sidebar | true, false
sidebarToggler | boolean | true | Display the button for toggling the sidebar | true, false
eventDisplayDefault | boolean | true | Set default visibility of event lists | true, false
eventListToggler | boolean | true | Display the button for toggling the event lists | true, false
calendarEvents | array | null | Defined events for calendar to show | Array of events
monthNav | boolean | true | displays two buttons before and after calendar title to navigate between months | true, false

#### _calendarEvent_ Options Example
```js
Expand Down Expand Up @@ -124,6 +125,7 @@ selectDate | string | Select date programmatically
addCalendarEvent | array/object | Add Calendar event(s)
removeCalendarEvent | array/string | Remove event(s) by their id
destroy | none | Well.. destroy the calendar
setMonthNav | boolean | show/hide month navigation buttons

##### _addCalendarEvent_ Method Example
```js
Expand Down
3 changes: 3 additions & 0 deletions demo/demo.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -301,4 +301,7 @@ $('[data-go*="#"]').on("click", function(a) {
$("html, body").animate({
scrollTop: c
}, 500);
});
$('#check-month-nav').click(function () {
$("#demoEvoCalendar").evoCalendar("setMonthNav", $('#check-month-nav').is(':checked'));
});
37 changes: 36 additions & 1 deletion evo-calendar/css/evo-calendar.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -74,7 +74,7 @@ input:focus, textarea:focus, button:focus {
-ms-transform: translate(100%, 0);
transform: translate(100%, 0);
background-color: #8773c1;
padding: 10px 8px;
padding: 3% 4%;
cursor: pointer;
-webkit-box-shadow: 5px 0 18px -3px #8773c1;
box-shadow: 5px 0 18px -3px #8773c1;
Expand Down Expand Up @@ -137,6 +137,13 @@ input:focus, textarea:focus, button:focus {
.calendar-sidebar > .month-list > .calendar-months > li.active-month {
background-color: #755eb5;
}
.calendar-sidebar > .month-list > .calendar-months > li > p{
margin:0
}
.calendar-sidebar > .month-list > .calendar-months > li:has(p){
margin: 0;
margin-bottom: 4px;
}

.calendar-inner {
position: relative;
Expand Down Expand Up @@ -201,6 +208,31 @@ th[colspan="7"]::after {
transform: translateX(-50%);
background-color: rgba(135, 115, 193, 0.15);
}
th[colspan="7"] div{
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
align-self: center;
}
th[colspan="7"] div p{
flex: none;
width: 40%;
padding: 0;
margin: 0;
}
th[colspan="7"] div .icon-button{
width: fit-content;
}
th[colspan="7"] div .icon-button .chevron-arrow-left,
th[colspan="7"] div .icon-button .chevron-arrow-right
{
border-right: 4px solid #8773c1;
border-bottom: 4px solid #8773c1;
width: 16px;
height: 16px;
}

tr.calendar-header {

}
Expand Down Expand Up @@ -653,6 +685,9 @@ button.icon-button > span.chevron-arrow-right {
width: 275px;
padding: 70px 10px 60px 10px;
}
th[colspan="7"] div p{
width: 60%;
}
}

/* sm */
Expand Down
8 changes: 8 additions & 0 deletions evo-calendar/css/evo-calendar.midnight-blue.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -82,6 +82,14 @@
font-size: 30px;
color: #00adb5;
}
.midnight-blue th[colspan="7"] div .icon-button .chevron-arrow-left,
.midnight-blue th[colspan="7"] div .icon-button .chevron-arrow-right
{
border-right: 6px solid #00adb5;
border-bottom: 6px solid #027e84;
width: 16px;
height: 16px;
}
.midnight-blue th[colspan="7"]::after {
content: '';
display: block;
Expand Down
3 changes: 1 addition & 2 deletions evo-calendar/css/evo-calendar.midnight-blue.min.css
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

3 changes: 1 addition & 2 deletions evo-calendar/css/evo-calendar.min.css
View file
Open in desktop

Large diffs are not rendered by default.

8 changes: 8 additions & 0 deletions evo-calendar/css/evo-calendar.orange-coral.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -57,6 +57,14 @@
margin: 0 auto;
background: #ff9966;
}
.orange-coral th[colspan="7"] div .icon-button .chevron-arrow-left,
.orange-coral th[colspan="7"] div .icon-button .chevron-arrow-right
{
border-right: 6px solid #ff9966;
border-bottom: 6px solid #ff5e62;
width: 16px;
height: 16px;
}
.orange-coral tr.calendar-body .calendar-day .day:hover {
background-color: rgba(255, 153, 102, 0.32);
color: #ff6363;
Expand Down
Loading