honeymoose
/
sp-dev-fx-webparts
mirror of https://github.com/pnp/sp-dev-fx-webparts.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Update 

Update year view to look nicer and highlight today in year view like the other calendar views.
This commit is contained in:
mohammadamer 2021-10-03 00:48:50 +03:00 committed by GitHub
parent 39ea25afc2
commit 91a2da907d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 41 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
samples/react-calendar/src/webparts/calendar/components/Year.module.scss
View File

@ -4,14 +4,12 @@
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
overflow-y: auto; overflow-y: auto;
}
.month { .month {
margin: 5px 10px 15px 10px; margin: 5px 10px 15px 10px;
}
.monthName { .monthName {
color: $ms-color-themeDark; color: $ms-color-themePrimary;
font-weight: bold; font-weight: bold;
margin-bottom: 10px; margin-bottom: 10px;
} }
@ -30,24 +28,28 @@
.date { .date {
width: 30px; width: 30px;
height: 30px; height: 30px;
background: white;
border-radius: 50px; border-radius: 50px;
border: none; border: none;
outline: none; outline: none;
}
.date.inMonth:hover { &.inMonth {
&:hover {
cursor: pointer; cursor: pointer;
background: $ms-color-themeDark; background: $ms-color-themePrimary;
color: white; color: white;
font-weight: bold; font-weight: bold;
} }
}
.today { &.today {
background: $ms-color-themeDark; background: $ms-color-themePrimary;
color: white;
} }
.date.prevMonth, .date.prevMonth,
.date.nextMonth { .date.nextMonth {
color: grey; color: grey;
} }
}
}
}