mirror of
https://github.com/krios2146/obsidian-theme-github.git
synced 2026-07-22 03:20:23 +00:00
fix: add styles for new version of Kanban plugin
This commit is contained in:
Vladimir Kidyaev
parent
29ede08083
commit
551d399649
1 changed files with 106 additions and 71 deletions
177
theme.css
177
theme.css
|
|
@ -138,24 +138,12 @@ settings:
|
|||
description: All cards will have the same initial height
|
||||
type: class-toggle
|
||||
default: on
|
||||
-
|
||||
id: kanban-center-content
|
||||
title: Сenter content in cards
|
||||
description: For work with min-height cards
|
||||
type: class-toggle
|
||||
default: on
|
||||
-
|
||||
id: kanban-full-height-column
|
||||
title: Full height lists
|
||||
description:
|
||||
type: class-toggle
|
||||
default: on
|
||||
-
|
||||
id: kanban-metatdate-one-line
|
||||
title: One line metadata
|
||||
description: Date and tags on one line in a card. Don't work well with a large number of tags
|
||||
type: class-toggle
|
||||
default: off
|
||||
*/
|
||||
body {
|
||||
/* Animations */
|
||||
|
|
@ -862,13 +850,6 @@ body.kanban-metatdate-one-line .kanban-plugin__item-metadata {
|
|||
justify-content: space-between;
|
||||
}
|
||||
|
||||
/* Kanban-center-content */
|
||||
body.kanban-center-content .kanban-plugin__item-title {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
/* Kanban-full-height-column */
|
||||
body.kanban-full-height-column button.kanban-plugin__new-item-button {
|
||||
align-self: flex-end;
|
||||
|
|
@ -939,16 +920,19 @@ body.kanban-on .kanban-plugin__item-prefix-button-wrapper input[type=checkbox] {
|
|||
}
|
||||
|
||||
/* Kanban-Full */
|
||||
body.kanban-full .kanban-plugin__markdown-preview-view>div>* {
|
||||
overflow-x: unset;
|
||||
}
|
||||
/* Main color */
|
||||
body.kanban-full .kanban-plugin {
|
||||
background-color: var(--kanban-background);
|
||||
}
|
||||
body.kanban-full .kanban-plugin__lane-items>div {
|
||||
margin-bottom: 8px;
|
||||
margin-top: 0;
|
||||
|
||||
/* LANE */
|
||||
/* Colors */
|
||||
body.kanban-full .kanban-plugin__lane {
|
||||
background-color: var(--kanban-lane-background);
|
||||
border: 1px solid var(--kanban-lane-border);
|
||||
}
|
||||
|
||||
/* Grip icon hiding */
|
||||
body.kanban-full .kanban-plugin__lane-grip {
|
||||
position: absolute;
|
||||
opacity: 0;
|
||||
|
|
@ -956,87 +940,138 @@ body.kanban-full .kanban-plugin__lane-grip {
|
|||
height: 3em;
|
||||
z-index: 0;
|
||||
margin: 0;
|
||||
}
|
||||
body.kanban-full .kanban-plugin__lane-grip {
|
||||
cursor: default;
|
||||
}
|
||||
body.kanban-full .kanban-plugin__lane-header-wrapper div {
|
||||
z-index: 1;
|
||||
}
|
||||
body.kanban-full .kanban-plugin__lane-header-wrapper,
|
||||
body.kanban-full .kanban-plugin__item-button-wrapper,
|
||||
body.kanban-full .kanban-plugin__item-form {
|
||||
border: none;
|
||||
|
||||
/* Header */
|
||||
body.kanban-full .kanban-plugin__lane-header-wrapper {
|
||||
padding-left: 14px;
|
||||
}
|
||||
body.kanban-full .kanban-plugin__lane {
|
||||
background-color: var(--kanban-lane-background);
|
||||
border: 1px solid var(--kanban-lane-border);
|
||||
body.kanban-full .kanban-plugin__markdown-preview-view {
|
||||
font-size: inherit;
|
||||
}
|
||||
|
||||
/* Header + Counter */
|
||||
body.kanban-full .kanban-plugin__lane-title {
|
||||
flex-grow: 0;
|
||||
width: fit-content;
|
||||
font-size: 1em;
|
||||
}
|
||||
body.kanban-full .kanban-plugin__markdown-preview-view {
|
||||
font-size: inherit;
|
||||
}
|
||||
body.kanban-full .kanban-plugin__item-content-wrapper,
|
||||
body.kanban-full .kanban-plugin__item-title-wrapper,
|
||||
body.kanban-full .kanban-plugin__item-metadata-wrapper:not(:empty) {
|
||||
background: var(--kanban-item-background);
|
||||
}
|
||||
body.kanban-full .kanban-plugin__item-title-wrapper {
|
||||
padding: 6px 12px 8px;
|
||||
}
|
||||
body.kanban-full .kanban-plugin__icon>svg {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
body.kanban-full .kanban-plugin__lane-settings-button-wrapper {
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
/* Counter */
|
||||
body.kanban-full div.kanban-plugin__lane-title-count {
|
||||
background-color: var(--kanban-lane-count);
|
||||
border-radius: 1em;
|
||||
padding: 2px 5px;
|
||||
}
|
||||
body.kanban-full .kanban-plugin__item button.kanban-plugin__item-prefix-button,
|
||||
body.kanban-full .kanban-plugin__item button.kanban-plugin__item-postfix-button,
|
||||
body.kanban-full .kanban-plugin__lane button.kanban-plugin__lane-settings-button {
|
||||
padding: 0 5px;
|
||||
height: 24px;
|
||||
box-shadow: none;
|
||||
font-size: 21px;
|
||||
|
||||
/* Three dot position */
|
||||
body.kanban-full .kanban-plugin__lane-settings-button-wrapper {
|
||||
margin-left: auto;
|
||||
}
|
||||
body.kanban-full .kanban-plugin__item button.kanban-plugin__item-prefix-button:hover,
|
||||
body.kanban-full .kanban-plugin__item button.kanban-plugin__item-postfix-button:hover,
|
||||
body.kanban-full .kanban-plugin__lane button.kanban-plugin__lane-settings-button:hover {
|
||||
background-color: var(--kanban-options-btn);
|
||||
cursor: pointer;
|
||||
|
||||
/* Cards padding */
|
||||
body.kanban-full .kanban-plugin__lane-items {
|
||||
padding: 2px 6px;
|
||||
}
|
||||
body.kanban-full button.kanban-plugin__new-item-button {
|
||||
|
||||
/* ITEM */
|
||||
/* Colors */
|
||||
body.kanban-full .kanban-plugin__item-content-wrapper,
|
||||
body.kanban-full .kanban-plugin__item-title-wrapper,
|
||||
body.kanban-full .kanban-plugin__item-metadata-wrapper:not(:empty) {
|
||||
background: var(--kanban-item-background);
|
||||
}
|
||||
body.kanban-full .kanban-plugin__item {
|
||||
border-color: var(--kanban-lane-border);
|
||||
}
|
||||
|
||||
/* Between items */
|
||||
body.kanban-full .kanban-plugin__lane-items>div {
|
||||
margin-bottom: 8px;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
/* Borders */
|
||||
body.kanban-full .kanban-plugin__lane-header-wrapper,
|
||||
body.kanban-full .kanban-plugin__item-button-wrapper,
|
||||
body.kanban-full .kanban-plugin__item-form {
|
||||
border: none;
|
||||
}
|
||||
|
||||
/* Content */
|
||||
body.kanban-full .kanban-plugin__item-title-wrapper {
|
||||
padding: 12px 12px 12px 0;
|
||||
}
|
||||
body.kanban-full .kanban-plugin__item-title,
|
||||
body.kanban-full .kanban-plugin__item-input-wrapper {
|
||||
padding-left: 12px;
|
||||
}
|
||||
|
||||
/* Archive/checkbox */
|
||||
body.kanban-full .kanban-plugin__item-prefix-button-wrapper {
|
||||
align-self: center;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
/* Time Date Buttons */
|
||||
body.kanban-full .kanban-plugin__item-metadata .is-button:hover {
|
||||
cursor: var(--cursor-link);
|
||||
color: var(--text-normal);
|
||||
}
|
||||
|
||||
/* THREE DOT BUTTON */
|
||||
/* Rotation */
|
||||
body.kanban-full .kanban-plugin__icon>svg {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
/* Size */
|
||||
body.kanban-full .kanban-plugin__icon {
|
||||
font-size: 1.4em;
|
||||
}
|
||||
|
||||
/* Item */
|
||||
body.kanban-full .kanban-plugin__item-postfix-button.clickable-icon {
|
||||
opacity: 0;
|
||||
}
|
||||
body.kanban-full .kanban-plugin__item:hover .kanban-plugin__item-postfix-button.clickable-icon {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
/* ADD A CARD BUTTON */
|
||||
/* Position */
|
||||
body.kanban-full .kanban-plugin__new-item-button {
|
||||
border: none;
|
||||
justify-content: flex-start;
|
||||
box-shadow: none;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
/* + Size */
|
||||
body.kanban-full .kanban-plugin__item-button-plus {
|
||||
margin-right: 8px;
|
||||
font-size: 1.9em;
|
||||
height: inherit;
|
||||
}
|
||||
|
||||
/* Hover */
|
||||
body.kanban-full .kanban-plugin__new-item-button:hover {
|
||||
background-color: inherit;
|
||||
box-shadow: none;
|
||||
color: var(--text-muted);;
|
||||
}
|
||||
body.kanban-full .kanban-plugin__item {
|
||||
border-color: var(--kanban-lane-border);
|
||||
}
|
||||
body.kanban-full .kanban-plugin__lane-items {
|
||||
padding: 2px 6px;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
/* FIXIES */
|
||||
body.kanban-full .kanban-plugin__item-prefix-button-wrapper input[type=checkbox] {
|
||||
filter: none;
|
||||
margin: 3px;
|
||||
}
|
||||
body.kanban-full .kanban-plugin__markdown-preview-view>div>* {
|
||||
overflow-x: unset;
|
||||
}
|
||||
|
||||
/* fix: input borders */
|
||||
|
|
|
|||
Loading…
Reference in a new issue