Ghost/ghost/admin/app/styles/components/koenig-dark.css

115 lines
2.2 KiB
CSS
Raw Normal View History

/* Koenig overrides for dark theme
/* -------------------------------------------------------------------- */
/* Action bar */
.kg-action-bar {
background: var(--whitegrey-l2);
border: 1px solid var(--whitegrey-l2);
}
.kg-action-bar:after {
border-top-color: var(--whitegrey-l2);
}
.kg-action-bar:before {
position: absolute;
top: 36px;
left: calc(50% - 10px);
width: 0;
border-top: 10px solid var(--whitegrey-l2);
border-right: 10px solid transparent;
border-left: 10px solid transparent;
content: "";
font-size: 0;
line-height: 0;
}
.kg-action-bar-divider {
background: var(--lightgrey);
}
.kg-action-bar .fill-white g,
.kg-action-bar .fill-white path {
fill: var(--darkgrey);
}
/* Card menu */
.koenig-cardmenu {
2021-02-17 11:23:31 +03:00
background: var(--main-color-content-greybg);
box-shadow: 0 0 0 1px rgba(99,114,130,.16), 0 8px 16px rgba(27,39,51,.08);
}
.kg-cardmenu-card-hover div {
color: var(--middarkgrey-l1);
}
.kg-cardmenu-card-selected,
.kg-cardmenu-card-hover:hover {
2021-02-17 11:23:31 +03:00
background: var(--whitegrey-l1);
}
.kg-card-type-codepen g,
.kg-card-type-codepen svg,
.kg-card-type-unsplash g,
.kg-card-type-unsplash svg {
fill: var(--darkgrey);
}
.kg-cardmenu-card-hover svg [data-selector="bg"] {
2021-02-17 11:23:31 +03:00
fill: var(--lightgrey);
}
.kg-cardmenu-card-hover svg [data-selector="fold"] {
2021-02-17 11:23:31 +03:00
fill: var(--midlightgrey);
}
.kg-cardmenu-card-hover svg [data-selector="line"] {
fill: var(--darkgrey);
}
.kg-cardmenu-card-hover:hover svg [data-selector="bg"] {
2021-02-17 11:23:31 +03:00
fill: var(--lightgrey-l1);
}
/* Card styles */
.koenig-editor__editor pre {
border: none;
}
.koenig-editor .gh-markdown-editor .editor-toolbar {
background: color-mod(var(--whitegrey) l(-2%) s(+2%));
border-top-color: var(--whitegrey-d2);
}
.kg-card-selected,
.kg-card-selected:hover {
background-color: transparent !important;
border-color: transparent !important;
}
.koenig-card-html--editor .CodeMirror {
background: var(--white);
}
.kg-input-bar:after {
border-top-color: var(--lightgrey);
}
.kg-link-toolbar {
background: var(--lightgrey);
}
.kg-link-toolbar a {
color: var(--middarkgrey);
}
.kg-link-toolbar svg g,
.kg-link-toolbar svg path {
fill: var(--middarkgrey);
}