dropdown style fixes

This commit is contained in:
haseeb 2018-02-22 19:34:35 +05:30
parent 174ee4e182
commit 3bed273d60
3 changed files with 15 additions and 5 deletions

View file

@ -4,12 +4,16 @@
$('#share-btn').click((event) => { $('#share-btn').click((event) => {
event.preventDefault(); event.preventDefault();
$('#share-btn').addClass('is-active');
$('#embed-btn').removeClass('is-active');
$('#snippet-url-area').val(`${protocol}//${host + pathname}`); $('#snippet-url-area').val(`${protocol}//${host + pathname}`);
$('#embed-action').html('Share'); $('#embed-action').html('Share');
}); });
$('#embed-btn').click((event) => { $('#embed-btn').click((event) => {
event.preventDefault(); event.preventDefault();
$('#embed-btn').addClass('is-active');
$('#share-btn').removeClass('is-active');
const scriptTag = `<script src="${protocol}//${host + pathname}.js"></script>`; const scriptTag = `<script src="${protocol}//${host + pathname}.js"></script>`;
$('#snippet-url-area').val(scriptTag); $('#snippet-url-area').val(scriptTag);
$('#embed-action').html('Embed'); $('#embed-action').html('Embed');

View file

@ -60,7 +60,11 @@
.form-control { .form-control {
cursor: auto; cursor: auto;
width: 101%; width: 101%;
margin-left: -1; margin-left: -1px;
}
.embed-toggle-list li a {
padding: 8px 40px;
} }
.embed-toggle { .embed-toggle {

View file

@ -33,17 +33,19 @@
= edited_time_ago_with_tooltip(@snippet, placement: 'bottom', html_class: 'snippet-edited-ago', exclude_author: true) = edited_time_ago_with_tooltip(@snippet, placement: 'bottom', html_class: 'snippet-edited-ago', exclude_author: true)
- if public_snippet? - if public_snippet?
.embed-snippet.pull-right.col-md-6 .embed-snippet
.input-group .input-group
.input-group-btn .input-group-btn
%a.btn.embed-toggle{ 'data-toggle': 'dropdown' } %a.btn.embed-toggle{ 'data-toggle': 'dropdown' }
%span#embed-action Embed %span#embed-action Embed
= sprite_icon('angle-down', size: 12) = sprite_icon('angle-down', size: 12)
%ul.dropdown-menu.dropdown-menu-selectable.dropdown-menu-right %ul.dropdown-menu.dropdown-menu-selectable.embed-toggle-list
%li %li
%a#embed-btn.btn.btn-transparent{ href: "#" } Embed %a#embed-btn.btn.btn-transparent.is-active{ href: "#" }
%strong.embed-toggle-list-item Embed
%li %li
%a#share-btn.btn.btn-transparent{ href: "#" } Share %a#share-btn.btn.btn-transparent{ href: "#" }
%strong.embed-toggle-list-item Share
%input#snippet-url-area.snippet-embed-input.form-control{ type: "text", autocomplete: 'off', value: snippet_embed } %input#snippet-url-area.snippet-embed-input.form-control{ type: "text", autocomplete: 'off', value: snippet_embed }
.input-group-btn .input-group-btn
%a#clipboard-btn.btn.btn-default{ title: "Copy to clipboard", data: { toggle: "tooltip", placement: "bottom", title: "Copy source to clipboard", container: "body", clipboard_target: '#snippet-url-area' } } %a#clipboard-btn.btn.btn-default{ title: "Copy to clipboard", data: { toggle: "tooltip", placement: "bottom", title: "Copy source to clipboard", container: "body", clipboard_target: '#snippet-url-area' } }