ashatora/openlayers
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Improve layout

Browse Source
This commit is contained in:
ahocevar
2019-01-09 21:47:48 +01:00
parent c4c6f84bca
commit f368fa1a28
3 changed files with 17 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files
examples/resources/common.js
+1 -1
View File
@@ -8,7 +8,7 @@
e.clearSelection(); e.clearSelection();
}); });
var codepenButton = document.getElementById('codepen-button'); var codepenButton = document.getElementsByClassName('codepen-button')[0];
if (codepenButton) { if (codepenButton) {
codepenButton.onclick = function(event) { codepenButton.onclick = function(event) {
event.preventDefault(); event.preventDefault();
examples/resources/layout.css
+8 -3
View File
@@ -91,9 +91,14 @@ pre[class*="language-"] {
background: #FFFFFF; background: #FFFFFF;
} }
pre>legend {
font-size: 100%;
font-weight: bold;
}
.source-controls { .source-controls {
position: absolute; position: absolute;
margin-top: 20px; margin-top: 10px;
right: 40px; right: 40px;
} }
@@ -101,12 +106,12 @@ pre[class*="language-"] {
margin-left: 15px; margin-left: 15px;
} }
#copy-button { .copy-button {
text-decoration: none; text-decoration: none;
cursor: pointer; cursor: pointer;
} }
#codepen-button { .codepen-button {
text-decoration: none; text-decoration: none;
cursor: pointer; cursor: pointer;
} }
examples/templates/example.html
+8 -21
View File
@@ -99,6 +99,7 @@
</div> </div>
<div class="row-fluid"> <div class="row-fluid">
<!-- <a class="codepen-button pull-right"><i class="fa fa-codepen"></i> Edit</a> -->
<div class="span12"> <div class="span12">
<h4 id="title">{{ title }}</h4> <h4 id="title">{{ title }}</h4>
{{{ contents }}} {{{ contents }}}
@@ -114,29 +115,15 @@
<div class="row-fluid"> <div class="row-fluid">
<div class="source-controls"> <div class="source-controls">
<!-- <a id="codepen-button"><i class="fa fa-codepen"></i> Edit</a> --> <a class="copy-button" id="copy-html-button" data-clipboard-target="#example-html-source"><i class="fa fa-clipboard"></i> Copy</a>
</div> </div>
<form method="POST" id="codepen-form" target="_blank" action="https://codepen.io/pen/define/"> <pre><legend>index.html</legend><code id="example-html-source" class="language-markup">&lt;!DOCTYPE html&gt;
<textarea class="hidden" name="title">{{ title }}</textarea>
<textarea class="hidden" name="description">{{ shortdesc }}</textarea>
<textarea class="hidden" name="js">{{ js.source }}</textarea>
<textarea class="hidden" name="css">{{ css.source }}</textarea>
<textarea class="hidden" name="html">{{ contents }}</textarea>
<input type="hidden" name="data">
</form>
<hr>
<pre>index.html</pre>
<div class="source-controls">
<a id="copy-html-button" data-clipboard-target="#example-html-source"><i class="fa fa-clipboard"></i> Copy</a>
</div>
<pre><code id="example-html-source" class="language-markup">&lt;!DOCTYPE html&gt;
&lt;html&gt; &lt;html&gt;
&lt;head&gt; &lt;head&gt;
&lt;title&gt;{{ title }}&lt;/title&gt; &lt;title&gt;{{ title }}&lt;/title&gt;
&lt;link rel="stylesheet" href="https://openlayers.org/en/v{{ olVersion }}/css/ol.css" type="text/css"&gt; &lt;link rel="stylesheet" href="https://openlayers.org/en/v{{ olVersion }}/css/ol.css" type="text/css"&gt;
&lt;!-- The line below is only needed for old environments like Internet Explorer and Android 4.x --&gt; &lt;!-- The line below is only needed for old environments like Internet Explorer and Android 4.x --&gt;
&lt;script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList,URL"&gt;&lt;/script&gt; &lt;script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=requestAnimationFrame,Element.prototype.classList,URL"&gt;&lt;/script&gt;{{#if extraHead.remote}}
{{#if extraHead.remote}}
{{ indent extraHead.remote spaces=4 }}{{/if}}{{#if css.source}} {{ indent extraHead.remote spaces=4 }}{{/if}}{{#if css.source}}
&lt;style&gt; &lt;style&gt;
{{ indent css.source spaces=6 }} &lt;/style&gt;{{/if}} {{ indent css.source spaces=6 }} &lt;/style&gt;{{/if}}
@@ -145,12 +132,12 @@
{{ indent contents spaces=4 }} &lt;script src="index.js"&gt;&lt;/script&gt; {{ indent contents spaces=4 }} &lt;script src="index.js"&gt;&lt;/script&gt;
&lt;/body&gt; &lt;/body&gt;
&lt;/html&gt;</code></pre> &lt;/html&gt;</code></pre>
<br> </div>
<pre>index.js</pre> <div class="row-fluid">
<div class="source-controls"> <div class="source-controls">
<a id="copy-js-button" data-clipboard-target="#example-js-source"><i class="fa fa-clipboard"></i> Copy</a> <a class="copy-button" id="copy-js-button" data-clipboard-target="#example-js-source"><i class="fa fa-clipboard"></i> Copy</a>
</div> </div>
<pre><code id="example-js-source" class="language-js">{{ js.source }}</code></pre> <pre><legend>index.js</legend><code id="example-js-source" class="language-js">{{ js.source }}</code></pre>
</div> </div>
</div> </div>