0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-01-13 22:41:32 -05:00

Multiple minor visual style fixes

- Lighter dropdown shadow
- Removed display:flex from .btn because safari can't handle it on <button> elements, where it will immediately set all text-alignment to "left" with no way to change. I haven't been able to find any regressions for this change so far. Can't remember why buttons were supposed to be flexbox anyway. Maybe for icon alignment within buttons, but I can't find any such examples within the app.
- Safari thinks that user-select: all; means a single click should SELECT ALL THE THINGS. Removed/replaced with user-select: text; which makes it behave like Chrome; click and drag to select.
- Increased hit area for "?" button
- Removed :active style for post-edit button on content management screen, adjusted position
- Increased contrast on tag description, tag count, and view blog links

See #5652
This commit is contained in:
John O'Nolan 2015-08-12 10:29:40 +02:00
parent 661d27dbb3
commit 97ce6f8a0c
8 changed files with 14 additions and 21 deletions

View file

@ -22,7 +22,7 @@
background-color: #fff; background-color: #fff;
background-clip: padding-box; background-clip: padding-box;
border-radius: 4px; border-radius: 4px;
box-shadow: rgba(0, 0, 0, 0.175) 0 2px 6px; box-shadow: rgba(0, 0, 0, 0.10) 0 2px 6px;
list-style: none; list-style: none;
text-align: left; text-align: left;
text-transform: none; text-transform: none;

View file

@ -128,13 +128,13 @@
font-size: 1.4rem; font-size: 1.4rem;
line-height: 1.3em; line-height: 1.3em;
font-weight: 200; font-weight: 200;
user-select: all; user-select: text;
} }
.gh-alert a { .gh-alert a {
text-decoration: underline; text-decoration: underline;
font-weight: 400; font-weight: 400;
user-select: all; user-select: text;
} }
.gh-alert-close { .gh-alert-close {

View file

@ -216,11 +216,12 @@
.content-preview .post-controls { .content-preview .post-controls {
position: absolute; position: absolute;
top: 25px; top: 5px;
right: 25px; right: 25px;
} }
.content-preview .post-controls .btn { .content-preview .post-controls .post-edit {
padding-top: 0;
padding-right: 0; padding-right: 0;
border: none; border: none;
font-size: 18px; font-size: 18px;

View file

@ -156,7 +156,7 @@
.entry-preview-content *, .entry-preview-content *,
.content-preview-content * { .content-preview-content * {
user-select: all; user-select: text;
} }
.entry-preview-content a, .entry-preview-content a,

View file

@ -192,7 +192,7 @@
.gh-nav-footer-sitelink { .gh-nav-footer-sitelink {
flex-grow: 1; flex-grow: 1;
padding: 12px; padding: 12px;
color: var(--midgrey); color: color(var(--midgrey) lightness(-10%));
text-align: center; text-align: center;
text-transform: uppercase; text-transform: uppercase;
font-size: 1rem; font-size: 1rem;
@ -327,13 +327,12 @@
.gh-help-menu { .gh-help-menu {
display: flex; display: flex;
align-items: center; align-items: center;
padding: 5px 10px;
border-left: #dfe1e3 1px solid; border-left: #dfe1e3 1px solid;
cursor: pointer; cursor: pointer;
} }
.gh-help-button { .gh-help-button {
padding: 0 5px; padding: 5px 15px;
color: var(--midgrey); color: var(--midgrey);
text-align: center; text-align: center;
font-size: 1.4rem; font-size: 1.4rem;

View file

@ -109,7 +109,7 @@
.settings-tag .tag-description { .settings-tag .tag-description {
margin: 0; margin: 0;
color: #dfe1e3; color: color(#dfe1e3 lightness(-10%));
font-size: 13px; font-size: 13px;
} }
@ -117,6 +117,6 @@
position: absolute; position: absolute;
top: 20px; top: 20px;
right: 12px; right: 12px;
color: #dfe1e3; color: color(#dfe1e3 lightness(-10%));
font-size: 16px; font-size: 16px;
} }

View file

@ -3,9 +3,6 @@
/* Base button style */ /* Base button style */
.btn { .btn {
display: flex;
justify-content: center;
align-items: center;
margin-bottom: 0; margin-bottom: 0;
padding: 9px 15px; padding: 9px 15px;
border: #dfe1e3 1px solid; border: #dfe1e3 1px solid;
@ -163,6 +160,7 @@ fieldset[disabled] .btn {
.btn-minor:focus { .btn-minor:focus {
border-color: #c1c1c1; border-color: #c1c1c1;
background: #fff; background: #fff;
box-shadow: none;
color: #808284; color: #808284;
} }

View file

@ -8,13 +8,8 @@
</section> </section>
{{#if confirm}} {{#if confirm}}
<footer class="modal-footer"> <footer class="modal-footer">
<button type="button" class="{{rejectButtonClass}} btn-minor js-button-reject" {{action "confirm" "reject"}}> {{! Buttons must be on one line to prevent white-space errors }}
{{confirm.reject.text}} <button type="button" class="{{rejectButtonClass}} btn-minor js-button-reject" {{action "confirm" "reject"}}>{{confirm.reject.text}}</button><button type="button" class="{{acceptButtonClass}} js-button-accept" {{action "confirm" "accept"}}>{{confirm.accept.text}}</button>
</button><!--
Required to strip the white-space between buttons
--><button type="button" class="{{acceptButtonClass}} js-button-accept" {{action "confirm" "accept"}}>
{{confirm.accept.text}}
</button>
</footer> </footer>
{{/if}} {{/if}}
</section> </section>