archive-gh-me/jsbin
1
0
Fork 0
mirror of https://github.com/jsbin/jsbin.git synced 2026-02-01 16:46:05 +00:00
Code Issues Projects Releases Wiki Activity

Tweak to layout of popup menus - hopefully cleaner.

Browse Source
This commit is contained in:
Remy Sharp 2012-06-26 23:44:57 +01:00
parent a80e8f599e
commit fd2d9bb787
3 changed files with 70 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

58
public/css/style.css
View File

@ -1145,7 +1145,9 @@ input {
background: #f3b8b6;
background: rgba(255, 0, 0, 0.2);
border: 1px solid red;
margin: 10px 0;
margin: 0;
white-space: normal;
line-height: 18px;
}
/*#loginFeedback:empty {
@ -1509,10 +1511,10 @@ div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #f22;}
}
.icon { font-family: sans-serif; }
/*.button-dropdown:after,*/
/*.fake-dropdown:after { content: "▾"; padding-left: 5px; padding-right: 3px; }*/
/*.button-dropdown:empty:after,*/
/*.fake-dropdown:empty:after { padding-left: 0; }*/
.button-dropdown-arrow:after,
.fake-dropdown:after { content: "▾"; padding-left: 5px; padding-right: 3px; }
.button-dropdown-arrow:empty:after,
.fake-dropdown:empty:after { padding-left: 0; }
.editbox {
@ -2080,4 +2082,50 @@ pre .highlight:last-of-type {
transition-property: opacity, margin-right;
transition-timing-function: ease-out, ease-out;
transition-duration: 100ms, 100ms;
}
.dropdown {
margin-top: 8px;
}
.dropdown > div:after, .dropdown > div:before {
bottom: 100%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
z-index: 1;
left: 17%;
}
.dropdown > div:after {
border-bottom-color: #fff;
border-width: 10px;
margin-left: -10px;
top: -16px;
}
.dd-right.dropdown > div:after {
left: 83%;
}
.dropdown > div:before {
border-bottom-color: #ccc;
border-width: 11px;
margin-left: -11px;
top: -18px;
}
.dd-right.dropdown > div:before {
left: 83%;
}
.avatar {
margin-right: 7px;
vertical-align: top;
display: inline-block;
border-radius: 1px;
margin-top: -2px;
}

10
public/js/chrome/login.js
View File

@ -24,13 +24,13 @@ var $loginForm = $('form.login').submit(function (event) {
var data = $.parseJSON(jqXHR.responseText) || {};
// cookie is required to share with the server so we can do a redirect on new bin
if (data.ok) {
$loginFeedback.text('Successfully tied this browser to "' + name + '".');
setTimeout(function () {
window.location = window.location.pathname + window.location.search;
}, 500);
// $loginFeedback.text('Successfully tied this browser to "' + name + '".');
// setTimeout(function () {
window.location = window.location.pathname + window.location.search;
// }, 500);
} else {
analytics.login(false);
$loginFeedback.text('"' + name + '" has already been taken. Please either double check the password, or choose another username.');
$loginFeedback.text(data.message || ('"' + name + '" has already been taken. Please either double check the password, or choose another username.'));
}
}
});

16
public/js/chrome/navigation.js
View File

@ -72,22 +72,25 @@ var dropdownOpen = false,
menuDown = false;
function opendropdown(el) {
var menu;
if (!dropdownOpen) {
$(el).closest('.menu').addClass('open');
dropdownOpen = true;
menu = $(el).closest('.menu').addClass('open').trigger('open');
menu.find('input:first').focus();
dropdownOpen = el;
}
}
function closedropdown() {
menuDown = false;
if (dropdownOpen) {
dropdownButtons.closest('.menu').removeClass('open');
dropdownButtons.closest('.menu').removeClass('open').trigger('close');
dropdownOpen = false;
onhover = false;
}
}
$('.button-open').mousedown(function (e) {
if (dropdownOpen && dropdownOpen !== this) closedropdown();
if (!dropdownOpen) {
menuDown = true;
opendropdown(this);
@ -98,7 +101,7 @@ $('.button-open').mousedown(function (e) {
var dropdownButtons = $('.button-dropdown, .button-open').mousedown(function (e) {
$dropdownLinks.removeClass('hover');
if (dropdownOpen && dropdownOpen !== this) closedropdown();
if (!dropdownOpen) {
menuDown = true;
opendropdown(this);
@ -204,6 +207,11 @@ $('#createnew').click(function () {
}, 0);
});
$('form.login').closest('.menu').bind('close', function () {
$(this).find('.loginFeedback').empty().hide();
});
jsbin.settings.includejs = jsbin.settings.includejs || false;
$('#enablejs').change(function () {
jsbin.settings.includejs = this.checked;