Skip to content

Instantly share code, notes, and snippets.

@popstas
Last active January 2, 2024 11:23
Show Gist options
  • Save popstas/6de4dee93916da01d92d188127c57911 to your computer and use it in GitHub Desktop.
Save popstas/6de4dee93916da01d92d188127c57911 to your computer and use it in GitHub Desktop.
Тёмная тема для Планфикса
/*
стиль используется для личного ПФ
раскрашен нормально только планировщик
https://gist.github.com/popstas/6de4dee93916da01d92d188127c57911
*/
:root {
--bg: #121212;
--bg-hover:#333;
--card-bg: #1E1E1E;
--color: #bfbfbf;
--link: #acacac;
--link-hover: #ccc;
--link-disabled: #333;
--link-secondary: #666;
--unreaded-bg: #2d2d01;
--client-bg: #002B36;
}
body {
color: var(--color);
}
html {
background: var(--bg);
}
.page-layout-container {
background: var(--bg);
}
.planner-container {
color: var(--link);
}
/* planner list header */
.planner-block-h-top.colored .planner-block-name {
color: var(--link-hover);
}
/* общий фон */
.page-layout-block:not(.leftmenu-container).page-layout-block-gray {
background: var(--card-bg);
}
/* фон планировщика */
.page-layout-block:not(.leftmenu-container).page-layout-block-gray.b-planner-block {
background: var(--bg);
}
/* фон задачи */
.page-layout-block:not(.leftmenu-container),
.b-task-description,
.page-layout-block.draw-styles-for-taskCard .taskCard-header-data-blocks {
background: var(--card-bg);
border-color: var(--bg-hover);
}
/* разделитель */
.page-layout-block-resizer, .page-layout-resize-overlay::before {
background: var(--bg-hover);
border-color: var(--bg);
}
.planner-list-quick-add {
background: var(--bg-hover);
border-color: var(--bg-hover);
}
.planner-list-quick-add textarea{
background: var(--bg-hover);
color: var(--color);
}
/* page title */
.b-green-block>div:first-child {
color: var(--link);
}
/* task title */
.tr-taskstatus-color-4573b1, .tr-taskstatus-color-4573b1 a, .tr-taskstatus-color-4573b1 a:hover {
color: var(--color);
}
.dl-task-microcard-container {
background: var(--card-bg);
border-color: var(--card-bg);
box-shadow: none;
}
.b-task-microcard .task-microcard-label {
color: var(--link);
}
/* task status */
.task-microcard-interact[style="color: #4573b1"] {
color: var(--link-disabled) !important;
border-color: var(--link-disabled) !important;
}
.tr-check-list-add .add-newCheck-container {
border-bottom-color: var(--link-disabled);
}
.tr-check-list-add .add-newCheck-container:hover {
border-bottom-color: var(--link-disabled);
}
.checkElement-add-placeholder {
color: var(--link-disabled);
}
a {
color: var(--link);
}
a:hover {
color: var(--link-hover);
}
/* icons */
.favorite-item svg .star-color {
fill: var(--link-disabled);
}
.svg-icon.gray, .svg-icon-32px.gray, .svg-icon-21px.gray, .svg-icon-16px.gray, .svg-icon-8px.gray, .svg-icon-10px.gray {
fill: var(--link-disabled);
}
/* planner header icons */
.planner-block-list-h .planner-block-list-h-tail .b-ddl-menu-selected-arrow.b-ddl-menu-selected-arrow-svg svg,
.planner-block-move .svg-icon-wr svg {
fill: var(--link-hover);
}
/* checklisk check */
.svgChecked-ico.checkmark-unchecked .cls-checkmark-circle {
fill: var(--bg-hover);
stroke: var(--bg-hover);
}
.tr-check-list-add .check-list-item-ico svg .cls-checkmark-circle, .tr-check-list-edit-body .check-list-item-ico svg .cls-checkmark-circle {
fill: var(--bg-hover);
stroke: var(--bg-hover);
}
.svgChecked-ico.checkmark-unchecked .cls-checkmark-circle {
fill: var(--bg-hover);
stroke: var(--bg-hover);
}
.svgChecked-ico.checkmark-unchecked .cls-checkmark-v {
fill: var(--bg-hover);
}
.svgChecked-ico.checkmark-checked .cls-checkmark-circle {
fill: var(--bg-hover);
stroke: var(--bg-hover);
}
.tbl-check-list .tr-check-list-edit>span textarea {
color: var(--color);
}
/* card list shadow, scroll */
.planner-block-items-container.has-bottom-shadow:after {
box-shadow: -1px 0 40px 13px rgba(0,0,0,0.8);
}
.planner-block-cards .planner-block-list-container>.baron_wrapper>.baron_scroller>.baron_scroller__bar {
background-color: var(--bg-hover);
border-color: var(--bg-hover);
}
/* planner bottom scroll */
::-webkit-scrollbar-thumb {
background-color: var(--bg-hover);
border-color: var(--bg-hover);
}
/* прикреплен чек-лист */
.dl-task-microcard-container .svg-icon-stroke.green {
stroke: var(--link-secondary);
}
.dl-task-microcard-container .fakelink-dashed {
color: var(--link-secondary);
border-color: var(--link-secondary);
}
.planner-item-list {
border-color: var(--card-bg);
}
.planner-page-new-block {
background-color: var(--card-bg);
border-color: var(--card-bg);
}
.planner-page-new-block-item:hover {
background-color: var(--bg-hover);
}
.planner-page-new-block-item {
border-color: var(--bg-hover);
}
/* выпадалка на карточке задачи в планировщике */
.planner-item-popup-dialog {
background-color: var(--bg-hover);
border-color: var(--bg-hover);
box-shadow: none;
}
.planner-item-popup-dialog .planner-item-popup-dialog-action:hover {
background-color: var(--card-bg);
}
.planner-item-popup-dialog .planner-item-popup-dialog-action-text {
color: var(--color);
}
/* header: logo, search */
.main-menu-logo .mm-logi-pic-wr svg {
fill: var(--link-secondary)
}
.b-search-query {
background: var(--bg-hover);
}
.b-search-query input {
background: var(--bg-hover);
color: var(--color);
}
/* выпадалка на списке в планировщике (в заголовке) */
.b-ddl-menu-ul ul {
background-color: var(--bg-hover);
border-color: var(--bg-hover);
box-shadow: none;
}
.b-ddl-menu-ul ul li {
color: var(--color);
}
.b-ddl-menu-ul ul li.b-ddl-menu-li-item:hover {
background-color: var(--card-bg);
}
/* выпадалка "сортировка" */
.context-popup-dialog {
background-color: var(--bg-hover);
border-color: var(--bg-hover);
box-shadow: none;
}
.context-popup-dialog-right .context-popup-dialog-triangle {
border-right-color: var(--bg-hover);
}
.common-filter-sort-dialog .context-popup-block-head {
color: var(--color);
}
.common-filter-sort-dialog .context-popup-opt-list .context-popup-opt-option {
color: var(--color);
}
.common-filter-sort-dialog .context-popup-opt-list .context-popup-opt-option:hover {
background-color: var(--card-bg);
}
/* Расширенный список */
.tr-common-add-new .tr-common-add-new-wrapper {
background: var(--bg-hover);
border-color: var(--bg-hover);
}
.tbl-glittered, .tr-item-qe-editable-active {
background: var(--bg-hover);
}
/* заголовки колонок */
.tbl-list .td-head a, .tbl-tool-list .td-head a, .tbl-list-floating-head .td-head a, .tbl-list .td-head-cbx a, .tbl-tool-list .td-head-cbx a, .tbl-list-floating-head .td-head-cbx a {
color: var(--link);
}
.tbl-list .td-head-common-sort .action-link, .tbl-list-floating-head .td-head-common-sort .action-link {
border-bottom-color: var(--link);
}
/* список задач */
.tbl-list .tr-item>td, .tbl-tool-list .tr-item>td, .tbl-list-floating-head .tr-item>td, .tbl-list .tr-common-item>td, .tbl-tool-list .tr-common-item>td, .tbl-list-floating-head .tr-common-item>td {
border-color: var(--bg-hover);
}
.tbl-list .td-head, .tbl-tool-list .td-head, .tbl-list-floating-head .td-head, .tbl-list .td-head-cbx, .tbl-tool-list .td-head-cbx, .tbl-list-floating-head .td-head-cbx {
border-color: var(--bg-hover);
}
input.text-box, select.text-box {
background-color: var(--bg-hover);
color: var(--color);
}
.tbl-list-floating-head {
background-color: var(--bg-hover);
}
/* одна задача */
.taskCard-header-data-blocks .b-green-block .card-header .title-and-active-users {
color: var(--color);
}
.b-task-description .b-task-owner-name a, .b-task-description .b-task-owner-name a:link {
color: var(--link);
}
.task-current-status .status-text, .task-current-status-control .status-text {
color: var(--link);
/* border-color: var(--link); */
}
.table-actions-v2 .actions-date-block-v2 .actions-date-block-v2-text.date-today {
color: var(--color);
}
.table-actions-v2 .actions-date-block-v2 .actions-date-block-v2-line {
background-color: var(--bg-hover);
}
.tr-actions-body .actions-item-v2-normal-bubble, .tr-actions-body .actions-item-v2-system-content {
border-color: var(--bg);
}
.tr-actions-body:hover .actions-item-v2-normal-bubble, .tr-actions-body:hover .actions-item-v2-system-content {
border-color: var(--bg-hover);
}
.task-summary .tr-item .task-detail-compressed-view, .task-card-main-fields:not(.handbook-item-tbl) .tr-item .task-detail-compressed-view {
border-color: var(--bg-hover);
}
.b-task-pull-top-up {
border-color: var(--bg-hover);
}
.baron_scroller__bar {
background-color: var(--bg-hover);
border-color: var(--bg-hover);
}
/* создание действия */
.tr-actions-quick-add>td>div>.actions-quick-add-target {
background-color: var(--bg-hover);
border-color: var(--bg-hover);
color: var(--link);
}
#action-create-div form {
border-color: var(--card-bg);
}
.b-notified-list-v2 .b-notified-list-v2-icos>div {
background: var(--bg-hover);
border-color: var(--bg-hover);
}
#action-create-div.action-create-v2 .action-create-change-status-string {
border-color: var(--bg-hover);
}
/* коммент */
.actions-item-v2-normal-bubble.actions-item-v2-normal-bubble, .actions-item-v2-system-content.actions-item-v2-normal-bubble {
background-color: var(--bg-hover);
color: var(--color);
}
.taskview-actions>.table-actions .svg-arrow-right svg {
stroke: var(--color);
}
/* непрочитанный */
.tr-actions-body-new .actions-item-v2-normal-bubble, .tr-actions-body-new .actions-item-v2-system-content {
background-color: var(--unreaded-bg);
}
.tr-actions-body-new.tr-actions-body:hover .actions-item-v2-normal-bubble, .tr-actions-body-new.tr-actions-body:hover .actions-item-v2-system-content {
border-color: var(--unreaded-bg);
}
/* контакту */
.tr-actions-body:not(.tr-actions-body-new) .actions-item-v2-normal-contact .actions-item-v2-normal-bubble, .tr-actions-body:not(.tr-actions-body-new) .actions-item-v2-normal-contact .actions-item-v2-system-content {
background-color: var(--client-bg);
}
.tr-actions-body:not(.tr-actions-body-new):not(.tr-actions-body-hidden) .actions-item-v2-normal-contact .actions-item-v2-normal-bubble, .tr-actions-body:not(.tr-actions-body-new):not(.tr-actions-body-hidden) .actions-item-v2-normal-contact .actions-item-v2-system-content {
border-color: var(--client-bg);
}
/* детали задачи */
.search-field-block {
background-color: var(--bg-hover);
border-color: var(--bg-hover);
color: var(--link);
}
.task-summary .tr-item .task-detail-compressed-view .td-value, .task-card-main-fields:not(.handbook-item-tbl) .tr-item .task-detail-compressed-view .td-value {
color: var(--color);
}
.task-summary .task-importance-text[style="color:#000000;"] {
color: var(--color);
}
.task-summary .tr-item .task-detail-compressed-view.group, .task-card-main-fields:not(.handbook-item-tbl) .tr-item .task-detail-compressed-view.group {
background-color: var(--bg-hover);
border-color: var(--bg-hover);
}
/* настройки */
.work-space-main-dialog .work-space-main-container .work-space-body .work-space-colorscheme-container .work-space-list-block .work-space-list-table .tr-item .td-item, .work-space-main-dialog .work-space-main-container .work-space-body .work-space-list-container .work-space-list-block .work-space-list-table .tr-item .td-item {
color: var(--link);
}
.work-space-main-dialog .work-space-main-container .work-space-body .work-space-colorscheme-container .work-space-list-block .work-space-list-table.draw-according-inner-rule .tr-item .td-item, .work-space-main-dialog .work-space-main-container .work-space-body .work-space-list-container .work-space-list-block .work-space-list-table.draw-according-inner-rule .tr-item .td-item {
color: var(--color);
}
.work-space-main-dialog .work-space-main-container .work-space-body .work-space-colorscheme-container .work-space-list-block .work-space-list-table .tr-item:hover, .work-space-main-dialog .work-space-main-container .work-space-body .work-space-list-container .work-space-list-block .work-space-list-table .tr-item:hover {
background: var(--bg-hover);
}
.work-space-main-dialog .work-space-main-container .work-space-body .work-space-colorscheme-container .work-space-infoBlock, .work-space-main-dialog .work-space-main-container .work-space-body .work-space-list-container .work-space-infoBlock {
background: #303f0d;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment