gribse/site-tpe
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

added site files

Browse source
This commit is contained in:
gribse 2025-05-16 18:49:08 +02:00
parent a6f70a6c78
commit 329148c253
253 changed files with 30486 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

99
EnlighterJS/Examples/Example1.html Normal file
View file

@ -0,0 +1,99 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!--
EnlighterJS Examples
Author: Andi Dittrich <http://andidittrich.de>
License: MIT X11 License
-->
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!-- Favicon !-->
<link rel="icon" href="../Resources/favicon.png" type="image/png" />
<title>Basic EnlighterJS Example | EnlighterJS</title>
<!-- Bootstrap CSS - just 4 styling - not required for enlighterjs -->
<link rel="stylesheet" href="../Resources/bootstrap/bootstrap.min.css">
<!-- Include EnlighterJS Styles -->
<link rel="stylesheet" type="text/css" href="../Build/EnlighterJS.min.css" />
<!-- Monospace Fonts on Google Webfonts !-->
<link href='http://fonts.googleapis.com/css?family=Cutive+Mono|Roboto+Mono:400,700,400italic,500,500italic,700italic|Ubuntu+Mono:400,700,400italic,700italic|Droid+Sans+Mono|Source+Code+Pro:400,600' rel='stylesheet' type='text/css'>
<!-- Include MooTools Framework -->
<script type="text/javascript" src="../Resources/MooTools.min.js"></script>
<!-- Include EnlighterJS -->
<script type="text/javascript" src="../Build/EnlighterJS.min.js"></script>
<!-- Special Styles -->
<style type="text/css">
/* custom hover effect using specific css class */
.EnlighterJS.myHoverClass li:hover{
background-color: #c0c0c0;
}
</style>
<meta name="EnlighterJS" content="Advanced javascript based syntax highlighting" data-language="javascript" data-indent="2" data-selector-block="pre" data-selector-inline="code" /></head>
<body>
<!-- Begin page content -->
<div class="container">
<div class="page-header">
<h1>
Basic EnlighterJS Example </h1>
</div>
<div id="content">
<!-- ############################################################# -->
<div class="alert alert-success" role="alert">Level: <strong>Beginner</strong></div>
<h3>Some Examples</h3>
<h4>jQuery Code (Javascript) - highlighted by EnlighterJS</h4>
<pre data-enlighter-language="jquery" data-enlighter-highlight="5">
$('#loading-example-btn').click(function () {
var btn = $(this)
btn.button('loading')
$.ajax(...).always(function () {
btn.button('reset')
});
});
</pre>
<h4>Code-Tabs</h4>
<pre data-enlighter-language="jquery" data-enlighter-highlight="5" data-enlighter-group="group1">
$('#loading-example-btn').click(function () {
var btn = $(this)
btn.button('loading')
$.ajax(...).always(function () {
btn.button('reset')
});
});
</pre>
<pre data-enlighter-language="mootools" data-enlighter-highlight="1" data-enlighter-group="group1">
// initialize enlighterjs for block elements
EnlighterJS.Util.Helper(document.getElements('pre'), {
// replace tabs with 2 spaces
indent: 2,
// special hover class
hover: 'myHoverClass',
// block element renderer
renderer: 'Block'
});
</pre>
<h4>Inline Code</h4>
<p>EnlighterJS also supports <code class="special" data-enlighter-language="js">alert('Inline Sourcecode highlighting');</code> (since version 2.0).</p>
<!-- ############################################################# -->
</div>
<!-- // content -->
</div>
<!-- // container -->
</body>
</html>