search

greyaz / ThemeRevision

A task-first and high-quality theme for Kanboard. It's also aimed at better mobile experiences, common plugin compatibilities, and customization friendly.
MIT License
51 stars 9 forks source link

Gantt chart in dark mode is missing CSS stuff #5

Closed dangerstudios closed 2 years ago

dangerstudios commented 2 years ago

it's a pain to style :( image

dangerstudios commented 2 years ago

updated Css: image CSS:

/ Gantt dark mode styles /

div.ganttview-grid-row-cell.ganttview-weekend { background-color: #131313 !important; }

div.ganttview-grid-row-cell { width: 20px !important; height: 31px !important; border-right: 1px solid #000000 !important; border-top: 1px solid #131313 !important; }

div.ganttview-grid-row-cell.ganttview-today { background-color: #666 !important; }

div.ganttview-hzheader-day { width: 20px !important; height: 20px !important; border-right: 1px solid #131313 !important; border-top: 1px solid #131313 !important; line-height: 20px !important; color: #555 !important; }

div.ganttview-hzheader-month { border-right: 1px solid #131313 !important; line-height: 20px !important; overflow: hidden !important; }

body { font-size: 100% !important; padding-bottom: 10px !important; color: #9d9d9d !important; font-family: "Helvetica Neue",Helvetica,Arial,sans-serif !important; text-rendering: optimizeLegibility !important; }

div.ganttview-vtheader { margin-top: 41px !important; width: 400px !important; overflow: hidden !important; background-color: #131313 !important; }

div.ganttview { border: 1px solid #131313 !important; }

div.ganttview-slide-container { border-left: 1px solid #000000 !important; }

.ganttview-slide-container::-webkit-scrollbar-thumb { background: #2b2b2b !important; border-radius: 2px !important; }

div.ganttview-slide-container::-webkit-scrollbar { background: #0c0c0c !important; height: 20px !important; overflow: auto !important; height: 1em !important; }

div.ganttview-block-container { height: auto !important; padding-top: 5px !important; }

div.ganttview-block { height: 20px !important; border-radius: 2px !important; border: 2px solid #4c4c4c !important; border-left-width: 8px !important; border-left-style: solid !important; border-right-width: 8px !important; border-right-style: solid !important;

}

div.ganttview-vtheader-series-name { width: 400px !important; height: 31px !important; line-height: 31px !important; padding-left: 14px !important; border-top: 1px solid #000 !important; text-overflow: ellipsis !important; overflow: hidden !important; white-space: nowrap !important; background-color: #131313 !important; }

div.ganttview-block-text { font-size: 0.8em !important; color: #9d9d9d !important; padding: 4px 5px !important; }

greyaz commented 2 years ago

@dangerstudios can you tell me your kanboard and ThemeRevision plugin version. The dark mode in my test environment looks fine.

dangerstudios commented 2 years ago

Kanboard: Application version: 1.2.22 (latest I think) ThemeRevision: 1.0.6 (latest I think) Browser: google Chrome latest

the CSS above fixes the issue, I've made a gant.css in the dev folder and updated the themeRevisionConfig function to include it

dangerstudios commented 2 years ago

@dangerstudios can you tell me your kanboard and ThemeRevision plugin version. The dark mode in my test environment looks fine.

nice theme btw!

greyaz commented 2 years ago

@dangerstudios Thank you~ About the issue, have installed the Gantt plugin after ThemeRevision? If so, you can uninstall then reinstall ThemeRevision to avoid the issue temporary. It seems like styles are covered, I will try to fix it in the next release.

greyaz commented 2 years ago

fixed in ver 1.0.7 https://github.com/greyaz/ThemeRevision/releases/tag/1.0.7