1
0
Fork 0
mirror of https://github.com/TryGhost/Ghost-Admin.git synced 2023-12-14 02:33:04 +01:00
Ghost-Admin/app/styles/app-dark.css
Kevin Ansfield 34cb65df5c new publish menu and date/time picker (#588)
closes https://github.com/TryGhost/Ghost/issues/8249

- replaces the old split-button publish/schedule/update button with a less confusing menu system
- adds a `{{gh-date-time-picker}}` component that contains a datepicker with separate time input
- replaces the date text input in the post settings menu with `{{gh-date-time-picker}}`
  - disabled when post is scheduled, only way to update a scheduled time is via the publish menu
  - validates date is in the past when draft/published so there's no confusion with scheduling
- displays saving status in top-left of editor screen
- refactor editor (auto)saving processes to use ember-concurrency

Other minor changes:
- adds `post.publishedAtBlog{TZ,Date,Time}` properties to Post model to allow working with `publishedAt` datetime in the selected blog timezone rather than UTC
- adds a `beforeSave` hook to `validation-engine` that is called after successful validation and before the Ember Data save call is made
- adds validation of `publishedAtBlog{Date,Time}` to post validator
- prevent gh-task-button showing last task state on first render
- fixes bug where clicking into and out of the published date input in the PSM without making any changes saves a published date for draft posts
2017-04-11 14:39:45 +01:00

130 lines
3.1 KiB
CSS

/* Stop: Normalize.
/* ---------------------------------------------------------- */
@import "../../bower_components/normalize.css/normalize.css";
/* Patterns: Groups of Styles
/* ---------------------------------------------------------- */
@import "patterns/global.css";
@import "patterns/_shame.css";
@import "patterns/icons.css";
@import "patterns/forms.css";
@import "patterns/buttons.css";
@import "patterns/labels.css";
@import "patterns/tables.css";
@import "patterns/navlist.css";
@import "patterns/boxes.css";
/* Components: Groups of Patterns
/* ---------------------------------------------------------- */
@import "components/loading-indicator.css";
@import "components/modals.css";
@import "components/notifications.css";
@import "components/uploader.css";
@import "components/splitbuttons.css";
@import "components/dropdowns.css";
@import "components/pagination.css";
@import "components/badges.css";
@import "components/settings-menu.css";
@import "components/selectize.css";
@import "components/power-select.css";
@import "components/power-calendar.css";
@import "components/publishmenu.css";
/* Layouts: Groups of Components
/* ---------------------------------------------------------- */
@import "layouts/main.css";
@import "layouts/flow.css";
@import "layouts/auth.css";
@import "layouts/content.css";
@import "layouts/editor.css";
@import "layouts/settings.css";
@import "layouts/users.css";
@import "layouts/user.css";
@import "layouts/about.css";
@import "layouts/tags.css";
@import "layouts/error.css";
@import "layouts/apps.css";
@import "layouts/packages.css";
@import "layouts/subscribers.css";
/* Addons: gh-koenig
/* ---------------------------------------------------------- */
@import "addons/gh-koenig/gh-koenig.css";
:root {
--darkgrey: #e5eff5;
--midgrey: #738a94;
--lightgrey: #333F44;
}
body {
color: #e5eff5;
}
input,
.gh-input,
.gh-select {
color: var(--darkgrey);
border-color: color(var(--lightgrey));
background: color(var(--lightgrey));
}
.gh-nav,
.settings-menu-container {
background: #212A2E;
}
.gh-menu-toggle {
border-color: #212A2E;
}
.gh-nav-search .ember-power-select-trigger {
border-color: color(var(--lightgrey));
background: color(var(--lightgrey));
}
.ember-power-select-options:not([role="group"]),
.ember-power-select-dropdown.ember-basic-dropdown-content--in-place {
border-color: color(var(--lightgrey));
background: color(var(--lightgrey));
}
.gh-nav-list svg {
fill: var(--darkgrey);
}
.gh-nav-list svg g {
stroke: var(--darkgrey);
}
.gh-main {
background: #263238;
}
.gh-btn {
border: color(var(--darkgrey) l(-27%) blackness(+15%)) 1px solid ;
color: color(var(--darkgrey) l(-27%) blackness(+15%));
text-shadow: none;
}
.gh-btn-blue,
.gh-btn-green,
.gh-btn-red {
color: #fff;
border: 0;
}
.dropdown-menu > li > a,
.dropdown-menu > li > button {
color: color(var(--lightgrey) lightness(+20%));
}
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus, .dropdown-menu > li > button:hover, .dropdown-menu > li > button:focus {
color: var(--lightgrey);
}
.gh-cardmenu {
background: var(--lightgrey);
}