mirror of
https://github.com/XRPLF/xrpl-dev-portal.git
synced 2025-11-26 06:35:51 +00:00
[FEATURE] expand code buttons on mobile
This commit is contained in:
@@ -90,9 +90,17 @@ body .content-root {
|
|||||||
}
|
}
|
||||||
|
|
||||||
/* code samples scrolling */
|
/* code samples scrolling */
|
||||||
code { max-height: 14em; overflow: auto;}
|
.code_sample code { max-height: 14em; overflow: auto;}
|
||||||
|
.code_sample code.expanded,
|
||||||
|
.code_sample .hljs.expanded {
|
||||||
|
max-height: none;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.code_sample { position: relative; }
|
||||||
|
.code_sample .code_toggler { position: absolute; bottom: 0; right: 0; }
|
||||||
|
|
||||||
.content code { color: #111; }
|
.content code { color: #111; }
|
||||||
.expanded { max-height: none; overflow: none;}
|
|
||||||
|
|
||||||
/* code tabs css */
|
/* code tabs css */
|
||||||
.multicode {
|
.multicode {
|
||||||
|
|||||||
@@ -1,8 +1,26 @@
|
|||||||
|
var toggle_cs = function(eo) {
|
||||||
|
//eo = $("#"+id);
|
||||||
|
var wrapper = $(eo.target).parent();
|
||||||
|
wrapper.find("code").toggleClass('expanded');
|
||||||
|
current_button_text = wrapper.find(".code_toggler").val();
|
||||||
|
$(eo.target).val(current_button_text == 'Expand' ? "Collapse" : "Expand");
|
||||||
|
}
|
||||||
|
|
||||||
function make_code_expandable() {
|
function make_code_expandable() {
|
||||||
$('code').dblclick(function(eo) {
|
var newid = 0;
|
||||||
|
$(".content > pre > code").parent().wrap(function() {
|
||||||
|
newid = newid+1;
|
||||||
|
return "<div class='code_sample' id='code_autoid_"+newid+"'>";
|
||||||
|
});
|
||||||
|
|
||||||
|
var cs = $('.code_sample');
|
||||||
|
cs.find("code").dblclick(function(eo) {
|
||||||
$(eo.target).toggleClass('expanded');
|
$(eo.target).toggleClass('expanded');
|
||||||
});
|
});
|
||||||
$('code').attr('title', 'Double-click to expand/collapse');
|
cs.find("code").attr('title', 'Double-click to expand/collapse');
|
||||||
|
var newbtn = $("<input type='button' class='code_toggler' value='Expand' />");
|
||||||
|
newbtn.appendTo(cs);
|
||||||
|
$(".code_toggler").click(toggle_cs);
|
||||||
}
|
}
|
||||||
|
|
||||||
$(document).on('flatdoc:ready', make_code_expandable);
|
$(document).on('flatdoc:ready', make_code_expandable);
|
||||||
|
|||||||
@@ -16,7 +16,7 @@ jQuery.fn.multicode_tabs = function() {
|
|||||||
// for each code, give it a unique ID and wrap it in a pre
|
// for each code, give it a unique ID and wrap it in a pre
|
||||||
cb_area.children('code').each(function(index2,el2) {
|
cb_area.children('code').each(function(index2,el2) {
|
||||||
var linkid = 'code-'+index+'-'+index2;
|
var linkid = 'code-'+index+'-'+index2;
|
||||||
$(el2).wrap("<div id='"+linkid+"'><pre>");
|
$(el2).wrap("<div id='"+linkid+"' class='code_sample'><pre>");
|
||||||
//also put in a link to this in the tab header ul
|
//also put in a link to this in the tab header ul
|
||||||
$('ul', cb_area).append("<li><a href='#"+linkid+"'></a></li>");
|
$('ul', cb_area).append("<li><a href='#"+linkid+"'></a></li>");
|
||||||
});
|
});
|
||||||
|
|||||||
Reference in New Issue
Block a user