48c839d927
This is the snapshot the production landing site (nibiru-framework.com) is deployed from. Brings together the recent splash + docs migration to the v4 "Cosmos" design system, the new in-framework AI module, and the framework groundwork that backs the framework-reference extraction. What lands: - docs/: Astro + Starlight site with the v4 dark cosmic palette, GalaxyHero canvas constellation, Mission Control chat (wired to /api/oracle → api.neuronetz.ai via providers.mjs Ollama), 5-panel MMVC stage (Model · AI · Module · Controller · View), translated EN/DE/JA/ES/FR content, PWA + sitemap + llms.txt + Umami analytics. - docs/design-system/: canonical mockup bundle (source/index-v2.html for splash, source/docs-system.html + preview/ for docs, SPEC.md, tokens). - docs/scripts/extraction/framework-reference-v2.md: deep framework reference (~1.6k lines, file:line citations, every public factory and idiom — basis for the LoRA training corpus. - application/module/ai/: AI module with chat / embed / RAG / agent plugins, plus pdoQuery / httpGet / fileRead tools and Modelfile + smoke-test in training/. - application/module/users/: user / ACL / form-factory traits used as the reference plugin pattern for the framework docs. - application/settings/config/database/: schema + seed migrations including the AI module tables (200–203). - Form factory + autogenerator changes the framework-reference-v2 covers. Production secrets stay out: docs/.env, settings.production.ini and ai.production.ini are all gitignored (.example files are in tree). Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
980 lines
31 KiB
HTML
980 lines
31 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<!-- Page title -->
|
|
<title>VSDocs - most advanced documentation template on ThemeForest</title>
|
|
<!-- Page description -->
|
|
<meta name="description" content="">
|
|
<!-- Meta -->
|
|
<meta charset="UTF-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<!-- Favicon -->
|
|
<link rel="icon" type="image/png" href="img/favicons/favicon-16x16.png" sizes="16x16">
|
|
<link rel="icon" type="image/png" href="img/favicons/favicon-32x32.png" sizes="32x32">
|
|
<link rel="icon" type="image/png" href="img/favicons/favicon-96x96.png" sizes="96x96">
|
|
<link rel="apple-touch-icon" sizes="57x57" href="img/favicons/apple-touch-icon-57x57.png">
|
|
<link rel="apple-touch-icon" sizes="60x60" href="img/favicons/apple-touch-icon-60x60.png">
|
|
<link rel="apple-touch-icon" sizes="72x72" href="img/favicons/apple-touch-icon-72x72.png">
|
|
<link rel="apple-touch-icon" sizes="76x76" href="img/favicons/apple-touch-icon-76x76.png">
|
|
<link rel="apple-touch-icon" sizes="114x114" href="img/favicons/apple-touch-icon-114x114.png">
|
|
<link rel="apple-touch-icon" sizes="120x120" href="img/favicons/apple-touch-icon-120x120.png">
|
|
<link rel="apple-touch-icon" sizes="144x144" href="img/favicons/apple-touch-icon-144x144.png">
|
|
<link rel="apple-touch-icon" sizes="152x152" href="img/favicons/apple-touch-icon-152x152.png">
|
|
<link rel="apple-touch-icon" sizes="180x180" href="img/favicons/apple-touch-icon-180x180.png">
|
|
<!-- Include StyleSheets -->
|
|
<link rel="stylesheet" href="css/style.min.css">
|
|
<!-- <link rel="stylesheet" href="css/custom.css"> -->
|
|
<script src="js/modernizr.js"></script>
|
|
</head>
|
|
|
|
<body class="">
|
|
<!--[if lt IE 8]>
|
|
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
|
|
<![endif]-->
|
|
<!-- Preloader: uncomment this if you want to show a smooth preloader while the page is loading. Don't forget to add the 'js-preload-me' class on the <body> tag. -->
|
|
<!-- <div class="preloader js-preloader"><div class="preloader-animation"></div></div>
|
|
-->
|
|
<!-- End of Preloader -->
|
|
<div class="page js-page ">
|
|
<!-- Header -->
|
|
<div class="header header-over large">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-md-3 col-sm-6 col-xs-6">
|
|
<!-- Logo Image -->
|
|
<a href="index.html" class="logo-image logo-animated">
|
|
<img src="img/logos/logo.png" alt="logo">
|
|
</a>
|
|
<!-- End of Logo Image -->
|
|
</div>
|
|
<div class="col-md-9 col-sm-6 col-xs-6">
|
|
<!-- Menu -->
|
|
<nav class="right helper">
|
|
<ul class="menu sf-menu js-menu">
|
|
<li>
|
|
<a href="index.html">Home
|
|
<span class="menu-label">NEW</span>
|
|
</a>
|
|
<ul>
|
|
<li>
|
|
<a href="#">One Page Docs</a>
|
|
<ul>
|
|
<li>
|
|
<a href="home-one-page.html">Static Header</a>
|
|
</li>
|
|
<li>
|
|
<a href="home-one-page-header-fixed.html">Sticky Header</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li>
|
|
<a href="#">Menu</a>
|
|
<ul>
|
|
<li>
|
|
<a href="index-2.html">Left - Off Canvas</a>
|
|
</li>
|
|
<li>
|
|
<a href="index-3.html">Right - Off Canvas</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li>
|
|
<a href="#">Static</a>
|
|
<ul>
|
|
<li>
|
|
<a href="home-subscribe.html">Subscribe</a>
|
|
</li>
|
|
<li>
|
|
<a href="home-web.html">Web App</a>
|
|
</li>
|
|
<li>
|
|
<a href="home-mobile-app.html">Mobile App</a>
|
|
</li>
|
|
<li>
|
|
<a href="home-soft.html">Software</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li>
|
|
<a href="#">Video</a>
|
|
<ul>
|
|
<li>
|
|
<a href="index-5.html">Background</a>
|
|
</li>
|
|
<li>
|
|
<a href="home-video-trigger.html">Trigger Simple</a>
|
|
</li>
|
|
<li>
|
|
<a href="home-web-video-trigger.html">Trigger Web</a>
|
|
</li>
|
|
<li>
|
|
<a href="home-app-video-trigger.html">Trigger App</a>
|
|
</li>
|
|
<li>
|
|
<a href="home-soft-video-trigger.html">Trigger Soft</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li>
|
|
<a href="index-4.html">Text Rotator</a>
|
|
</li>
|
|
<li>
|
|
<a href="home-with-preloader.html">With Preloader</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li>
|
|
<a href="#">Pages</a>
|
|
<ul>
|
|
<li>
|
|
<a href="panels.html">Panels</a>
|
|
</li>
|
|
<li>
|
|
<a href="#">Blog</a>
|
|
<ul>
|
|
<li>
|
|
<a href="blog-grid.html">Blog Grid</a>
|
|
</li>
|
|
<li>
|
|
<a href="blog-list.html">Blog List</a>
|
|
</li>
|
|
<li>
|
|
<a href="article.html">Article</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li>
|
|
<a href="faq.html">Faq</a>
|
|
</li>
|
|
<li>
|
|
<a href="notification.html">Notification</a>
|
|
</li>
|
|
<li>
|
|
<a href="tutorial.html">Tutorial</a>
|
|
</li>
|
|
<li>
|
|
<a href="login.html">Login</a>
|
|
</li>
|
|
<li>
|
|
<a href="register.html">Register</a>
|
|
</li>
|
|
<li>
|
|
<a href="404.html">404 Error</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li>
|
|
<a href="#">Elements</a>
|
|
<ul>
|
|
<li>
|
|
<a href="buttons.html">Buttons</a>
|
|
</li>
|
|
<li>
|
|
<a href="boxes.html">Boxes</a>
|
|
</li>
|
|
<li>
|
|
<a href="code.html">Code</a>
|
|
</li>
|
|
<li>
|
|
<a href="visual-guide.html">Visual guide</a>
|
|
</li>
|
|
<li>
|
|
<a href="notes.html">Notes</a>
|
|
</li>
|
|
<li>
|
|
<a href="files.html">File tree</a>
|
|
</li>
|
|
<li>
|
|
<a href="media.html">Media</a>
|
|
</li>
|
|
<li>
|
|
<a href="book.html">Book</a>
|
|
</li>
|
|
<li>
|
|
<a href="steps.html">Steps & Tabs</a>
|
|
</li>
|
|
<li>
|
|
<a href="misc.html">Misc</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li>
|
|
<a href="#">Layouts</a>
|
|
<ul>
|
|
<li>
|
|
<a href="views.html">Views without sidebar</a>
|
|
</li>
|
|
<li>
|
|
<a href="views-left.html">Views left sidebar</a>
|
|
</li>
|
|
<li>
|
|
<a href="views-right.html">Views right sidebar</a>
|
|
</li>
|
|
<li>
|
|
<a href="#">Full left sidebar</a>
|
|
<ul>
|
|
<li>
|
|
<a href="views-left-full.html">Regular</a>
|
|
</li>
|
|
<li>
|
|
<a href="views-left-full-compact.html">Compact</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li>
|
|
<a href="#">Full right sidebar</a>
|
|
<ul>
|
|
<li>
|
|
<a href="views-right-full.html">Regular</a>
|
|
</li>
|
|
<li>
|
|
<a href="views-right-full-compact.html">Compact</a>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
</ul>
|
|
</li>
|
|
<li>
|
|
<a href="changelog.html">Changelog</a>
|
|
</li>
|
|
<li>
|
|
<a href="contacts.html">Contacts</a>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
<!-- End of Menu -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End of Header -->
|
|
<!-- Header Back -->
|
|
<div class="header-back header-back-simple header-back-small">
|
|
<div class="header-back-container">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<!-- Page Info -->
|
|
<div class="page-info page-info-simple">
|
|
<h1 class="page-title">Code</h1>
|
|
<h2 class="page-description">Make your creation easy and intuitive with the code highlight component.</h2>
|
|
</div>
|
|
<!-- End Page Info -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End of Header Back -->
|
|
<div id="content">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-md-12">
|
|
<!-- Category Info -->
|
|
<div class="category-info helper pt0" id="simple-highlight">
|
|
<h3 class="category-title"> Simple highlight
|
|
<!-- Fragment Identifier -->
|
|
<a class="fragment-identifier js-fragment-identifier fragment-identifier-scroll" href="#simple-highlight">
|
|
<i class="fa fa-link"></i>
|
|
</a>
|
|
<!-- End of Fragment Identifier -->
|
|
</h3>
|
|
<h4 class="category-description">Laudantium magni ea cupiditate vero sunt voluptatum tempora molestiae reiciendis. Facere, deleniti.</h4>
|
|
</div>
|
|
<!-- End of Caregory Info -->
|
|
<!-- Simple Highlight -->
|
|
<div class="code-highlight " data-label="">
|
|
<span class="js-copy-to-clipboard copy-code">copy</span> <pre><code class="language-markup js-code"><!-- Latest compiled and minified CSS -->
|
|
<link rel="stylesheet" href="https://path.com/to/the/compiled/style.css">
|
|
|
|
<!-- Optional theme -->
|
|
<link rel="stylesheet" href="https://path.com/to/the/chosen/theme.css">
|
|
|
|
<!-- Latest compiled and minified JavaScript -->
|
|
<script src="https://path.com/to/the/JavaScript/library.js"></script>
|
|
</code></pre> </div>
|
|
<!-- End of Simple Highlight -->
|
|
<!-- Category Info -->
|
|
<div class="category-info " id="code-highlight-mixed">
|
|
<h3 class="category-title"> Mixed code highlight
|
|
<!-- Fragment Identifier -->
|
|
<a class="fragment-identifier js-fragment-identifier fragment-identifier-scroll" href="#code-highlight-mixed">
|
|
<i class="fa fa-link"></i>
|
|
</a>
|
|
<!-- End of Fragment Identifier -->
|
|
</h3>
|
|
<h4 class="category-description">Illo assumenda delectus tempora consequatur, in, perferendis harum atque animi laboriosam a explicabo.</h4>
|
|
</div>
|
|
<!-- End of Caregory Info -->
|
|
<!-- Mixed Code Highlight -->
|
|
<div class="code-highlight">
|
|
<span class="js-copy-to-clipboard copy-code">copy</span> <pre><code class="language-markup js-code"><script src="jquery.js"></script>
|
|
<script src="dist/jquery.plugin.min.js"></script>
|
|
<script>
|
|
jQuery(function($) {
|
|
// more options are listed below.
|
|
$('#elem').plugin();
|
|
});
|
|
</script>
|
|
</code></pre></div>
|
|
<!-- End of Mixed Code Highlight -->
|
|
<!-- Category Info -->
|
|
<div class="category-info " id="highlight-label">
|
|
<h3 class="category-title"> Highlight with label
|
|
<!-- Fragment Identifier -->
|
|
<a class="fragment-identifier js-fragment-identifier fragment-identifier-scroll" href="#highlight-label">
|
|
<i class="fa fa-link"></i>
|
|
</a>
|
|
<!-- End of Fragment Identifier -->
|
|
</h3>
|
|
<h4 class="category-description">Porro accusantium dolor, sed iste totam officia optio veritatis veniam provident quam!</h4>
|
|
</div>
|
|
<!-- End of Caregory Info -->
|
|
<!-- Code Highlight with label -->
|
|
<div class="code-highlight code-highlight-with-label" data-label="CSS">
|
|
<span class="js-copy-to-clipboard copy-code">copy</span> <pre><code class="language-css js-code">.token.regex,
|
|
.token.important,
|
|
.token.variable {
|
|
color: #e90;
|
|
}
|
|
|
|
.token.important,
|
|
.token.bold {
|
|
font-weight: bold;
|
|
}
|
|
.token.italic {
|
|
font-style: italic;
|
|
}
|
|
</code></pre></div>
|
|
<!-- End of Code Highlight with label -->
|
|
<!-- Category Info -->
|
|
<div class="category-info " id="code-highlight-attached">
|
|
<h3 class="category-title"> Code highlight attached
|
|
<!-- Fragment Identifier -->
|
|
<a class="fragment-identifier js-fragment-identifier fragment-identifier-scroll" href="#code-highlight-attached">
|
|
<i class="fa fa-link"></i>
|
|
</a>
|
|
<!-- End of Fragment Identifier -->
|
|
</h3>
|
|
<h4 class="category-description">Impedit officiis nisi velit id officia molestias cumque, labore architecto? Neque, voluptatum.</h4>
|
|
</div>
|
|
<!-- End of Caregory Info -->
|
|
<!-- Code Highlight Attached -->
|
|
<div class="code-highlight-attached">
|
|
<div class="code-highlight code-highlight-with-label" data-label="HTML">
|
|
<span class="js-copy-to-clipboard copy-code">copy</span> <pre><code class="language-markup js-code"><!-- Latest compiled and minified CSS -->
|
|
<link rel="stylesheet" href="https://path.com/to/the/compiled/style.css">
|
|
|
|
<!-- Optional theme -->
|
|
<link rel="stylesheet" href="https://path.com/to/the/chosen/theme.css">
|
|
|
|
<!-- Latest compiled and minified JavaScript -->
|
|
<script src="https://path.com/to/the/JavaScript/library.js"></script>
|
|
</code></pre> </div>
|
|
<div class="code-highlight code-highlight-with-label" data-label="CSS">
|
|
<span class="js-copy-to-clipboard copy-code">copy</span> <pre><code class="language-css js-code">.token.regex,
|
|
.token.important,
|
|
.token.variable {
|
|
color: #e90;
|
|
}
|
|
|
|
.token.important,
|
|
.token.bold {
|
|
font-weight: bold;
|
|
}
|
|
.token.italic {
|
|
font-style: italic;
|
|
}
|
|
</code></pre></div>
|
|
<div class="code-highlight code-highlight-with-label" data-label="JavaScript">
|
|
<span class="js-copy-to-clipboard copy-code">copy</span> <pre><code class="language-javascript js-code">var InteractiveSteps = (function(){
|
|
var steps = $('.js-steps-interactive');
|
|
|
|
steps.each(function() {
|
|
var step = $(this);
|
|
var config = config = {
|
|
headerTag: "h4",
|
|
transitionEffect: "fade",
|
|
labels: {
|
|
current: ''
|
|
}
|
|
}
|
|
var userConfig = step.data('config');
|
|
|
|
$.extend(true, config, userConfig);
|
|
steps.steps(config);
|
|
});
|
|
})();
|
|
</code></pre></div>
|
|
</div>
|
|
<!-- End of Code Highlight Attached -->
|
|
<!-- Category Info -->
|
|
<div class="category-info " id="code-tabs">
|
|
<h3 class="category-title"> Code tabs
|
|
<!-- Fragment Identifier -->
|
|
<a class="fragment-identifier js-fragment-identifier fragment-identifier-scroll" href="#code-tabs">
|
|
<i class="fa fa-link"></i>
|
|
</a>
|
|
<!-- End of Fragment Identifier -->
|
|
</h3>
|
|
<h4 class="category-description">Vero blanditiis neque quis maiores, qui. Dicta, itaque, similique. Quod, voluptas incidunt.</h4>
|
|
</div>
|
|
<!-- End of Caregory Info -->
|
|
<!-- Code Highlight Tabs -->
|
|
<div class="tabs js-tabs code-highlight-tabs">
|
|
<h4 class="tab-title"> HTML </h4>
|
|
<div class="tab-content">
|
|
<div class="code-highlight " data-label="">
|
|
<span class="js-copy-to-clipboard copy-code">copy</span> <pre><code class="language-markup js-code"><!-- Latest compiled and minified CSS -->
|
|
<link rel="stylesheet" href="https://path.com/to/the/compiled/style.css">
|
|
|
|
<!-- Optional theme -->
|
|
<link rel="stylesheet" href="https://path.com/to/the/chosen/theme.css">
|
|
|
|
<!-- Latest compiled and minified JavaScript -->
|
|
<script src="https://path.com/to/the/JavaScript/library.js"></script>
|
|
</code></pre> </div>
|
|
</div>
|
|
<h4 class="tab-title"> CSS </h4>
|
|
<div class="tab-content">
|
|
<div class="code-highlight " data-label="">
|
|
<span class="js-copy-to-clipboard copy-code">copy</span> <pre><code class="language-css js-code">.token.regex,
|
|
.token.important,
|
|
.token.variable {
|
|
color: #e90;
|
|
}
|
|
|
|
.token.important,
|
|
.token.bold {
|
|
font-weight: bold;
|
|
}
|
|
.token.italic {
|
|
font-style: italic;
|
|
}
|
|
</code></pre></div>
|
|
</div>
|
|
<h4 class="tab-title"> JavaScript </h4>
|
|
<div class="tab-content">
|
|
<div class="code-highlight " data-label="">
|
|
<span class="js-copy-to-clipboard copy-code">copy</span> <pre><code class="language-javascript js-code">var InteractiveSteps = (function(){
|
|
var steps = $('.js-steps-interactive');
|
|
|
|
steps.each(function() {
|
|
var step = $(this);
|
|
var config = config = {
|
|
headerTag: "h4",
|
|
transitionEffect: "fade",
|
|
labels: {
|
|
current: ''
|
|
}
|
|
}
|
|
var userConfig = step.data('config');
|
|
|
|
$.extend(true, config, userConfig);
|
|
steps.steps(config);
|
|
});
|
|
})();
|
|
</code></pre></div>
|
|
</div>
|
|
</div>
|
|
<!-- End of Code Highlight Tabs -->
|
|
<!-- Category Info -->
|
|
<div class="category-info " id="show-code-button">
|
|
<h3 class="category-title"> Show code button
|
|
<!-- Fragment Identifier -->
|
|
<a class="fragment-identifier js-fragment-identifier fragment-identifier-scroll" href="#show-code-button">
|
|
<i class="fa fa-link"></i>
|
|
</a>
|
|
<!-- End of Fragment Identifier -->
|
|
</h3>
|
|
<h4 class="category-description">Exercitationem dolores magnam, amet, veniam eligendi voluptatibus.</h4>
|
|
</div>
|
|
<!-- End of Caregory Info -->
|
|
<!-- Show code button -->
|
|
<div class="tabs js-tabs code-highlight-tabs code-highlight-tabs-center">
|
|
<h4 class="tab-title">
|
|
<i class="fa fa-cube"></i>Example</h4>
|
|
<div class="tab-content">
|
|
<div class="row">
|
|
<div class="col-md-4">
|
|
<!-- Box -->
|
|
<div class="box box-small-icon helper m0">
|
|
<img src="http://placehold.it/32x32" class="box-icon" alt="box icon">
|
|
<h4 class="box-title">Layouts</h4>
|
|
<p class="box-description">This is the first example of boxes with Title, Content and a small image-icon. Icon is aligned left.</p>
|
|
</div>
|
|
<!-- End of Box -->
|
|
</div>
|
|
<div class="col-md-4">
|
|
<!-- Box -->
|
|
<div class="box box-small-icon helper m0">
|
|
<img src="http://placehold.it/32x32" class="box-icon" alt="box icon">
|
|
<h4 class="box-title">Colors</h4>
|
|
<p class="box-description">This is the second example of boxes with Title, Content and a small image-icon. Icon is aligned left.</p>
|
|
</div>
|
|
<!-- End of Box -->
|
|
</div>
|
|
<div class="col-md-4">
|
|
<!-- Box -->
|
|
<div class="box box-small-icon helper m0">
|
|
<img src="http://placehold.it/32x32" class="box-icon" alt="box icon">
|
|
<h4 class="box-title">Components</h4>
|
|
<p class="box-description">This is the third example of boxes with Title, Content and a small image-icon. Icon is aligned left.</p>
|
|
</div>
|
|
<!-- End of Box -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<h4 class="tab-title">
|
|
<i class="fa fa-code"></i>Code</h4>
|
|
<div class="tab-content">
|
|
<div class="code-highlight " data-label="">
|
|
<span class="js-copy-to-clipboard copy-code">copy</span> <pre><code class="language-markup js-code"><div class="row">
|
|
<div class="col-md-4">
|
|
<!-- Box -->
|
|
<div class="box box-small-icon helper m0">
|
|
<img src="img/demos/boxes/1.png" class="box-icon" alt="box icon">
|
|
<h4 class="box-title">Layouts</h4>
|
|
<p class="box-description">This is the first example of boxes with Title, Content and a small image-icon. Icon is aligned left.</p>
|
|
</div>
|
|
<!-- End of Box -->
|
|
</div>
|
|
<div class="col-md-4">
|
|
<!-- Box -->
|
|
<div class="box box-small-icon helper m0">
|
|
<img src="img/demos/boxes/2.png" class="box-icon" alt="box icon">
|
|
<h4 class="box-title">Colors</h4>
|
|
<p class="box-description">This is the second example of boxes with Title, Content and a small image-icon. Icon is aligned left.</p>
|
|
</div>
|
|
<!-- End of Box -->
|
|
</div>
|
|
<div class="col-md-4">
|
|
<!-- Box -->
|
|
<div class="box box-small-icon helper m0">
|
|
<img src="img/demos/boxes/3.png" class="box-icon" alt="box icon">
|
|
<h4 class="box-title">Components</h4>
|
|
<p class="box-description">This is the third example of boxes with Title, Content and a small image-icon. Icon is aligned left.</p>
|
|
</div>
|
|
<!-- End of Box -->
|
|
</div>
|
|
</div></code></pre> </div>
|
|
</div>
|
|
</div>
|
|
<!-- End of Show code button -->
|
|
<!-- Category Info -->
|
|
<div class="category-info " id="list-languages">
|
|
<h3 class="category-title"> List of supported languages
|
|
<!-- Fragment Identifier -->
|
|
<a class="fragment-identifier js-fragment-identifier fragment-identifier-scroll" href="#list-languages">
|
|
<i class="fa fa-link"></i>
|
|
</a>
|
|
<!-- End of Fragment Identifier -->
|
|
</h3>
|
|
<h4 class="category-description">Here's the full list of languages supported by our template.</h4>
|
|
</div>
|
|
<!-- End of Caregory Info -->
|
|
<div class="row">
|
|
<div class="col-md-4">
|
|
<!-- Table -->
|
|
<div class="table-responsive">
|
|
<table class="table table-striped">
|
|
<thead>
|
|
<tr>
|
|
<th>Language</th>
|
|
<th>Included</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr class="">
|
|
<th scope="row">Markup</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">CSS</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">C-like</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">JavaScript</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">ActionScript</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Apache Configuration</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">AppleScript</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">ASP.NET (C#)</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">AutoHotkey</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Bash</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">C</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">C#</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">C++</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">CoffeeScript</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">CSS Extras</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Dart</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Eiffel</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Erlang</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">F#</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Fortran</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Gherkin</th>
|
|
<td>no</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<!-- End of Table -->
|
|
</div>
|
|
<div class="col-md-4">
|
|
<!-- Table -->
|
|
<div class="table-responsive">
|
|
<table class="table table-striped">
|
|
<thead>
|
|
<tr>
|
|
<th>Language</th>
|
|
<th>Included</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr class="">
|
|
<th scope="row">Git</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Go</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Groovy</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Haml</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Handlebars</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Haskell</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">HTTP</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Ini</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Jade</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Java</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Julia</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">LaTeX</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Less</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">LOLCODE</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Markdown</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">MATLAB</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">NASM</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">NSIS</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Objective-C</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Pascal</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Perl</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<!-- End of Table -->
|
|
</div>
|
|
<div class="col-md-4">
|
|
<!-- Table -->
|
|
<div class="table-responsive">
|
|
<table class="table table-striped">
|
|
<thead>
|
|
<tr>
|
|
<th>Language</th>
|
|
<th>Included</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr class="">
|
|
<th scope="row">PHP Extras</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">PowerShell</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Python</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">R</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">React JSX</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">reST (reStructuredText)</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Rip</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Ruby</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Rust</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">SAS</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Sass (Scss)</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Scala</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Scheme</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Smalltalk</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Smarty</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">SQL</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Stylus</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Swift</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Twig</th>
|
|
<td>no</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">TypeScript</th>
|
|
<td>yes</td>
|
|
</tr>
|
|
<tr class="">
|
|
<th scope="row">Wiki markup</th>
|
|
<td>no</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<!-- End of Table -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- Footer -->
|
|
<footer class="js-footer-is-fixed">
|
|
<!-- Footer Default -->
|
|
<div class="footer">
|
|
<div class="container">
|
|
<div class="row">
|
|
<div class="col-md-3 col-sm-3 col-xs-12">
|
|
<div class="footer-logo-wrapper">
|
|
<!-- Logo Image -->
|
|
<a href="index.html" class="logo-image ">
|
|
<img src="img/logos/logo.png" alt="logo">
|
|
</a>
|
|
<!-- End of Logo Image -->
|
|
<!-- Slogan -->
|
|
<p class="slogan"> Learn.
|
|
<br>Create.
|
|
<br>Impress. </p>
|
|
<!-- End of Slogan -->
|
|
</div>
|
|
</div>
|
|
<div class="col-md-9 col-sm-9 col-xs-12">
|
|
<div class="footer-wrapper">
|
|
<!-- Scroll top -->
|
|
<span class="scroll-top js-scroll-top">
|
|
<i class="fa fa-angle-up"></i>
|
|
</span>
|
|
<!-- End of Scroll top -->
|
|
<!-- Version -->
|
|
<div class="docs-version js-docs-version">
|
|
<span class="docs-current-version js-docs-current-version">v3.5</span>
|
|
<ul class="js-docs-version-list">
|
|
<li>
|
|
<a href="#">1.0</a>
|
|
</li>
|
|
<li>
|
|
<a href="#">1.5</a>
|
|
</li>
|
|
<li>
|
|
<a href="#">2.5</a>
|
|
</li>
|
|
<li>
|
|
<a href="#">3.0</a>
|
|
</li>
|
|
<li>
|
|
<a href="#">3.1</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<!-- End of Version -->
|
|
<!-- Footer Menu -->
|
|
<ul class="footer-menu helper right">
|
|
<li>
|
|
<a href="#"> About us </a>
|
|
</li>
|
|
<li>
|
|
<a href="#"> Privacy Policy </a>
|
|
</li>
|
|
<li>
|
|
<a href="#"> Terms & Condotions </a>
|
|
</li>
|
|
<li>
|
|
<a href="#"> My account </a>
|
|
</li>
|
|
<li>
|
|
<a href="#"> Support service </a>
|
|
</li>
|
|
</ul>
|
|
<!-- End of Footer Menu -->
|
|
<!-- Copyright -->
|
|
<p class="copyright helper right">
|
|
<a href="http://vsart.me">VSArt</a>, all rights reserved. 2016 © </p>
|
|
<!-- End of Copyright -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<!-- End of Footer Default -->
|
|
</footer>
|
|
<!-- End of Footer -->
|
|
</div>
|
|
<script src="js/all.js"></script>
|
|
<script src="js/custom.js"></script>
|
|
<!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
|
|
<!--
|
|
<script>
|
|
(function(b,o,i,l,e,r){b.GoogleAnalyticsObject=l;b[l]||(b[l]=
|
|
function(){(b[l].q=b[l].q||[]).push(arguments)});b[l].l=+new Date;
|
|
e=o.createElement(i);r=o.getElementsByTagName(i)[0];
|
|
e.src='//www.google-analytics.com/analytics.js';
|
|
r.parentNode.insertBefore(e,r)}(window,document,'script','ga'));
|
|
ga('create','UA-XXXXX-X','auto');ga('send','pageview');
|
|
</script>
|
|
-->
|
|
</body>
|
|
|
|
</html> |