diff --git a/web/calendar/calendar.css b/web/calendar/calendar.css
index 0b35e51d6..5a9e57fa2 100644
--- a/web/calendar/calendar.css
+++ b/web/calendar/calendar.css
@@ -1,185 +1,185 @@
 a.filtersButton {
   font-weight: 600;
   float: left;
   color: white;
   background-color: rgba(68, 68, 85, 0.67);
   padding: 8px 18px;
   border-radius: 18px;
   margin: 0 15px 5px 15px;
   font-size: 16px;
   cursor: pointer;
   text-transform: uppercase;
   position: absolute;
 }
 a.filtersButton > svg {
   padding-right: 5px;
 }
 div.content {
   min-height: 100%;
   padding-top: 10px;
   position: relative;
 }
 
 nav.nav {
   text-align: center;
   margin: 8px auto 12px auto;
   width: 350px;
   color: #333333;
   display: flex;
   align-items: center;
 }
 nav.nav > a.monthLink {
   color: var(--calendar-chevron);
 }
 nav.nav > .monthName {
   display: inline-block;
   width: 250px;
   color: var(--fg);
 }
 
 table.calendar {
   table-layout: fixed;
   padding: 24px 28px 0 28px;
   width: 100%;
 }
 table.calendar > thead > tr > th {
   padding-bottom: 6px;
   color: #888888;
   font-weight: normal;
   text-transform: uppercase;
   font-size: 14px;
 }
 textarea.entryText {
   box-sizing: border-box;
   font-size: 11px;
   width: 100%;
   background: none;
   border: none;
   outline: none;
   resize: none;
   overflow: auto;
   overflow-y: hidden;
   padding-right: 15px;
 }
 table.calendar td.day {
   border: 1px solid transparent;
   background: var(--calendar-day-bg);
   position: relative;
   vertical-align: top;
   line-height: 0;
   cursor: text;
   height: 120px;
 }
 td.day > div.entryContainer {
   overflow: auto;
   height: 120px;
 }
 td.day > div.focusedEntryContainer {
   height: 100px !important;
 }
 div.entryContainer > div.entryContainerSpacer {
   height: 13px;
 }
 div.entry {
   padding: 5px;
   box-shadow: inset 0px 0px 0px 2px white;
   border-radius: 5px;
   position: relative;
 }
 div.darkEntry {
   color: white;
 }
 div.darkEntry textarea.entryText {
   color: white;
 }
 div.darkEntry div.actionLinks > a {
   color: lightgray;
 }
 div.darkEntry div.actionLinks > a:hover {
   color: white;
 }
 span.entryLoading {
   position: absolute;
   top: 5px;
   right: 5px;
   width: 12px;
 }
 span.entryError {
   position: absolute;
   top: 11px;
   right: 5px;
   font-size: 16px;
   width: 6px;
   color: red !important;
 }
 div.actionLinks {
   line-height: 90%;
   margin-top: 3px;
   font-size: 16px;
 }
 div.dayActionLinks {
   padding-left: 3px;
   margin-bottom: 1px;
   height: 16px;
 }
 div.actionLinks a + a {
   margin-left: 6px;
 }
 span.actionLinksText {
   font-weight: 600;
   font-size: 11px;
   position: relative;
   bottom: 1px;
   padding-left: 5px;
 }
 span.rightActionLinks {
   float: right;
   text-overflow: ellipsis;
   white-space: nowrap;
   max-width: 100%;
   display: inline-block;
   overflow: hidden;
 }
 div.actionLinks svg {
-  fill: gray;
+  fill: var(--fg);
   width: 10px;
   height: 10px;
 }
 div.actionLinks svg.history {
   position: relative;
   top: 1px;
 }
 div.darkEntry div.actionLinks svg {
-  fill: lightgray;
+  fill: var(--fg);
 }
 div.actionLinks a:hover svg {
   fill: black;
 }
 div.darkEntry div.actionLinks a:hover svg {
   fill: white;
 }
 div.focusedEntry {
   z-index: 3 !important;
 }
 div.actionLinks a {
-  color: gray;
+  color: var(--fg);
 }
 div.actionLinks a:hover {
   color: black;
 }
 td.day > h2 {
   position: absolute;
   bottom: 2px;
   right: 3px;
   color: var(--fg);
   font-size: 32px;
   line-height: 32px;
   z-index: 1;
 }
 td.currentDay > h2 {
   color: var(--calendar-day-selected-color);
 }
 
 div.clear {
   clear: both;
 }