cartodb4/CartoAssets
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Added a new basic section for styleguide

Browse Source
This commit is contained in:
xavijam 2016-01-18 17:48:11 +01:00
parent 1780e1d550
commit 3e10541168
1 changed files with 49 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

82
styleguide/_template.html
View File

@ -9,48 +9,49 @@
<script> <script>
var j = jQuery.noConflict(true); var j = jQuery.noConflict(true);
j(function() { j(function() {
// Click on link with subheadings
// Show current section j('#styleguide-menu .submenulink').click(function(event) {
var hash = window.location.hash.replace(/#/g, ''); var jqCurSubmenu = j('[data-submenu="' + j(this).data('section') + '"]');
if (hash) { var isCurSubmenuOn = jqCurSubmenu.hasClass('on');
setTimeout(function() { j('#styleguide-menu .on').removeClass('on');
showSection(hash.split('-')[0]); if (!isCurSubmenuOn) {
}, 0); jqCurSubmenu.addClass('on');
j(this).addClass('on');
} }
showSection(j(this).data('section'));
});
// Click on link without subheadings
j('#styleguide-menu .sectionlink').click(function(event) {
j('#styleguide-menu .on').removeClass('on');
j(this).addClass('on');
showSection(j(this).data('section'));
});
// Show/Hide sections
function showSection(section) {
j('#styleguide .section').hide();
var jqCurSections = j('#styleguide .section[data-section="' + section + '"]');
jqCurSections.show();
}
// Show current section
var currentElement = window.location.hash.replace(/#/g, '');
if (currentElement) {
var section = currentElement.split('-')[0];
j('.submenulink[data-section="' + section + '"]').click();
} else {
// Show section in Styleguide // Show section in Styleguide
j('#styleguide .section[data-section="' + j('#styleguide-menu a').first().data('section') + '"]').show(); j('#styleguide .section[data-section="' + j('#styleguide-menu a').first().data('section') + '"]').show();
}
// Click on link with subheadings
j('#styleguide-menu .submenulink').click(function(event) {
var jqCurSubmenu = j('[data-submenu="' + j(this).data('section') + '"]');
var isCurSubmenuOn = jqCurSubmenu.hasClass('on');
j('#styleguide-menu .on').removeClass('on');
if (!isCurSubmenuOn) {
jqCurSubmenu.addClass('on');
j(this).addClass('on');
}
showSection(j(this).data('section'));
});
// Click on link without subheadings
j('#styleguide-menu .sectionlink').click(function(event) {
j('#styleguide-menu .on').removeClass('on');
j(this).addClass('on');
showSection(j(this).data('section'));
});
// Show/Hide sections
function showSection(section) {
j('#styleguide .section').hide();
var jqCurSections = j('#styleguide .section[data-section="' + section + '"]');
jqCurSections.show();
}
}); });
</script> </script>
<div id="styleguide-menu"> <div id="styleguide-menu">
<ul> <ul>
<li>
<a class="submenulink" href="#Basics" data-section="Basics">Basics</a>
</li>
{{#each menu}} {{#each menu}}
<li> <li>
{{#if headings.0.name}} {{#if headings.0.name}}
@ -70,6 +71,21 @@
</div> </div>
<div id="styleguide"> <div id="styleguide">
<div class="section" id="Basics" data-section="Basics" data-heading="Basics">
<div class="comment">
<h1>Basics</h1>
<p>Important notes about this styleguide</p>
</div>
<div class="result">
<ul>
<li>All new elements added in this repository should have included a 'CDB-' namespace.</li>
</ul>
</div>
<div class="markup">
</div>
</div>
{{#each sections}} {{#each sections}}
<div class="section" id="{{id}}" data-section="{{section}}" data-heading="{{heading}}"> <div class="section" id="{{id}}" data-section="{{section}}" data-heading="{{heading}}">