Browse Source

Adding style tag to frontend/layouts/project.vue

Addressing low contrast of markdown editor in dark mode
Issue #955
pull/960/head
Collin Brown 4 years ago
parent
commit
ac868dd6df
1 changed files with 39 additions and 0 deletions
  1. 39
      frontend/layouts/project.vue

39
frontend/layouts/project.vue

@ -67,3 +67,42 @@ export default {
}
}
</script>
<style>
/* dark mode styles */
.theme--dark .tui-editor-contents h1 {
color: #fff; /* inversion of #000 */
}
.theme--dark .tui-editor-contents h2,
.theme--dark .tui-editor-contents h3,
.theme--dark .tui-editor-contents h4,
.theme--dark .tui-editor-contents h5,
.theme--dark .tui-editor-contents h6,
.theme--dark .tui-editor-contents code span {
color: #ccc; /* inversion of #333 */
}
.theme--dark .tui-editor-contents blockquote {
color: #888; /* inversion of #777777 */
}
.theme--dark .tui-editor-contents ul,
.theme--dark .tui-editor-contents menu,
.theme--dark .tui-editor-contents ol,
.theme--dark .tui-editor-contents dir,
.theme--dark .tui-editor-contents p,
.theme--dark .tui-editor-contents table {
color: #aaa; /* inversion of #555555 */
}
.theme--dark .tui-editor-contents table td {
border: #151515; /* inversion of #eaeaea */
}
.theme--dark .tui-editor-contents table th {
border: #8d8884; /* inversion of #72777b */
background-color: #847e7b; /* inversion of #7b8184 */
}
.theme--dark .tui-editor-contents pre {
background-color: #0a0807; /* inversion of #f5f7f8 */
}
.theme--dark .tui-editor-contents code {
color: #3e8774; /* inversion of #c1788b */
}
</style>
Loading…
Cancel
Save