Save post button now stays spun up

Fixes #352

- Removed one-off styles and code for the publish button. Publish button
now uses data-toggle attribute wired up in toggle.js and forms.scss.
- Ensured split button common styles are up to date to conform with
vendor prefixing of transform properties.
This commit is contained in:
William Dibbern 2013-08-29 22:16:16 -05:00
parent 6c0434fc8f
commit 9a089ecee3
4 changed files with 23 additions and 24 deletions

View File

@ -418,20 +418,6 @@ body.zen {
height: 30px;
margin-top: 5px;
box-shadow: rgba(255,255,255,0.4) 0 1px 0 inset;
&.up:hover {
@include icon($i-chevron-down) {
margin-top: -5px;
@include transform(rotate(540deg));
/* Transition properties are split out due to a defect in
the vendor prefixing of transform transitions.
See: http://github.com/thoughtbot/bourbon/pull/86
*/
@include transition-property(transform);
@include transition-duration(0.6s);
@include transition-timing-function(ease);
};
}
}
.splitbutton-save{

View File

@ -280,10 +280,26 @@ input[type="reset"] {
right: 50%;
margin-top: -3px;
margin-right: -5px;
@include transition(transform 0.3s ease, margin-top 0.3s ease);
@include transition(margin-top 0.3s ease);
/* Transition of transform properties are split out due to a
defect in the vendor prefixing of transform transitions.
See: http://github.com/thoughtbot/bourbon/pull/86 */
@include transition-property(transform);
@include transition-duration(0.3);
@include transition-timing-function(ease);
};
// Spin the arrow on hover
// Keep the arrow spun when the associated menu is open
&.active:before {
@include transform(rotate(360deg));
}
&.up.active:before {
margin-top:-4px;
@include transform(rotate(540deg));
}
// Spin the arrow on hover and while menu is open
&:hover {
box-shadow: none;
background: #f8f8f8;
@ -297,7 +313,9 @@ input[type="reset"] {
@include icon($i-chevron-down) {
margin-top:-4px;
@include transform(rotate(540deg));
@include transition(transform 0.6s ease);
@include transition-property(transform);
@include transition-duration(0.6);
@include transition-timing-function(ease);
};
}
}
@ -322,7 +340,7 @@ input[type="reset"] {
@extend %splitbutton;
.options {
background: darken($blue, 5%);
&:hover {background: darken($blue, 10%);}
&:hover, &.active {background: darken($blue, 10%);}
}
}

View File

@ -251,11 +251,6 @@
$('body').toggleClass('fullscreen');
});
$('.options.up').on('click', function (e) {
e.stopPropagation();
$(this).next("ul").fadeToggle(200);
});
this.$('.CodeMirror-scroll').on('scroll', this.syncScroll);
// Shadow on Markdown if scrolled

View File

@ -43,7 +43,7 @@
<div class="right">
<section id="entry-actions" class="splitbutton-save">
<button type="button" class="button-save js-post-button"></button>
<a class="options up" href="#"><span class="hidden">Options</span></a>
<a class="options up" data-toggle="ul" href="#"><span class="hidden">Options</span></a>
<ul class="editor-options overlay" style="display:none">
<li data-set-status="published"><a href="#">Publish Now</a></li>
<li data-set-status="queue"><a href="#">Add to Queue</a></li>