WIP
Bálint Szekeres
parent
879a63d315
commit
c6269ccaa0
|
|
@ -18,205 +18,6 @@
|
|||
<link rel="preload" as="font" href="https://fonts.gstatic.com/s/quicksand/v9/6xKodSZaM9iE8KbpRA_pkHEYT8L_FYzokA.woff2" type="font/woff2" crossorigin="anonymous">
|
||||
</head>
|
||||
<body ng-app="NginxConfigIoApp" ng-controller="NginxConfigIoController" ng-csp ng-class="['layout-' + layout]">
|
||||
<header>
|
||||
<div ng-if="toggleLayoutVisible()" class="layout-toggle" ng-cloak>
|
||||
<button class="btn btn-sm btn-secondary" ng-click="toggleLayout()">Layout: {{ layout }}</button>
|
||||
</div>
|
||||
<div ng-if="layout === 'do'" ng-cloak>
|
||||
<nav class="do" ng-include="'partials/nav-do.html'"></nav>
|
||||
<div class="hero container">
|
||||
<h1>NGINX Config</h1>
|
||||
<h2>The easiest way to configure a performant, secure,<br> and stable NGINX server.</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="loader" ng-if="!masonryInit">
|
||||
<div class="spinner">
|
||||
<div class="double-bounce1"></div>
|
||||
<div class="double-bounce2"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<img ng-if="layout === 'default'" src="assets/img/logo-light.svg" class="logo" alt="nginxconfig.io">
|
||||
|
||||
<div ng-if="layout === 'default'" class="sites">
|
||||
<div class="title">Sites:</div>
|
||||
<div class="group" ng-include="'partials/sites.html'"></div>
|
||||
</div>
|
||||
|
||||
<div ng-if="layout === 'default'" class="presets">
|
||||
<div class="title">Presets:</div>
|
||||
<div class="group" ng-include="'partials/presets.html'"></div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<section class="tabs">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-9" ng-class="{ 'col-lg-12': layout === 'do' }">
|
||||
<div class="sites">
|
||||
<h5 ng-if="layout === 'do'">Per-Website Config</h5>
|
||||
<div ng-include="'partials/config-site.html'"></div>
|
||||
</div>
|
||||
<div class="common">
|
||||
<h5 ng-if="layout === 'do'">Global Config</h5>
|
||||
<div ng-include="'partials/config-global.html'"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div ng-if="layout === 'default'" class="col-lg-3" ng-cloak>
|
||||
<aside class="sidebar">
|
||||
<div class="github">
|
||||
<div class="github-cover">
|
||||
<div class="github-link">
|
||||
<a href="https://github.com/digitalocean/nginxconfig.io" target="_blank" class="github-logo-link">
|
||||
<ng-include src="'/assets/img/brands/github.svg'"></ng-include>
|
||||
</a>
|
||||
<br>
|
||||
<a href="https://github.com/digitalocean/nginxconfig.io" target="_blank"><small>digitalocean /</small> <strong>nginxconfig.io</strong></a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="github-buttons">
|
||||
<a class="github-button" href="https://github.com/digitalocean/nginxconfig.io" data-icon="octicon-star" data-size="large" data-show-count="true" aria-label="Star digitalocean/nginxconfig.io on GitHub">Star</a>
|
||||
<a class="github-button" href="https://github.com/digitalocean/nginxconfig.io/issues" data-icon="octicon-issue-opened" data-size="large" data-show-count="true" aria-label="Issue digitalocean/nginxconfig.io on GitHub">Issue</a>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="steps">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-xl-10 offset-xl-1">
|
||||
<div ng-include="'partials/steps.html'"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<main ng-class="{ 'active': masonryInit }">
|
||||
<div class="container">
|
||||
<div class="col-xl-10 offset-xl-1">
|
||||
<div class="commands" ng-cloak>
|
||||
<pre><code class="hljs bash" ng-include="'templates/commands.html?v=COMMIT_HASH'"></code></pre>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row grid">
|
||||
<div class="grid-sizer col-xl-6"></div>
|
||||
<div class="grid-item col-xl-12 mb-3 text-center" ng-cloak>
|
||||
<button class="btn btn-primary btn-sm btn-download" ng-click="downloadZip()"><img src="assets/img/download.svg" alt="Download"> Generated config <small>(.zip)</small></button>
|
||||
<button class="btn btn-success btn-sm btn-download btn-base64" ng-mouseenter="prepareBase64()" ng-click="copyAsBase64()" ngclipboard data-clipboard-target="#base64-zip-line" ngclipboard-success="clipboardSuccess('base64-zip-line')"><img src="assets/img/download.svg" alt="Download"> Copy Base64 <small>(inline)</small></button>
|
||||
</div>
|
||||
<div class="base64-zip-line-container">
|
||||
<div id="base64-zip-line">{{ base64 }}</div>
|
||||
</div>
|
||||
<section class="file grid-item" ng-class="isModularized() || isWordPress() ? 'col-xl-6' : 'col-xl-12'" ng-cloak>
|
||||
<strong>{{ data.directory_nginx }}nginx.conf</strong>
|
||||
<button class="btn btn-light btn-clipboard" ngclipboard data-clipboard-target="#file-nginx" ngclipboard-success="clipboardSuccess('nginx.conf')">
|
||||
<img src="assets/img/clipboard-dark.svg" alt="Copy to clipboard">
|
||||
</button>
|
||||
<div class="code source" data-filename="nginx.conf">
|
||||
<pre><code class="nginx" ng-include="'templates/conf/nginx.conf.html?v=COMMIT_HASH'" onload="refreshHighlighting()"></code></pre>
|
||||
</div><div id="file-nginx" class="code highlighted"></div>
|
||||
</section>
|
||||
<section class="col-xl-6 grid-item file" ng-if="isModularized()" ng-repeat="(_site, _domain) in getDomains() track by $index" ng-cloak>
|
||||
<strong>{{ data.directory_nginx }}sites-{{ isSymlink() ? 'available' : 'enabled' }}/{{ _domain }}.conf</strong>
|
||||
<button class="btn btn-light btn-clipboard" ngclipboard data-clipboard-target="#file-domain-{{ $index }}" ngclipboard-success="clipboardSuccess('example.com')">
|
||||
<img src="assets/img/clipboard-dark.svg" alt="Copy to clipboard">
|
||||
</button>
|
||||
<div class="code source" data-filename="sites-{{ isSymlink() ? 'available' : 'enabled' }}/{{ _domain }}.conf">
|
||||
<pre><code class="nginx" ng-include="'templates/conf/sites-available/example.com.conf.html?v=COMMIT_HASH?v=COMMIT_HASH'" onload="refreshHighlighting()"></code></pre>
|
||||
</div><div id="file-domain-{{ $index }}" class="code highlighted"></div>
|
||||
</section>
|
||||
<section class="col-xl-6 grid-item file" ng-if="isModularized() && hasCertLetsEncrypt()" ng-cloak>
|
||||
<strong>{{ data.directory_nginx }}nginxconfig.io/letsencrypt.conf</strong>
|
||||
<button class="btn btn-light btn-clipboard" ngclipboard data-clipboard-target="#file-letsencrypt" ngclipboard-success="clipboardSuccess('letsencrypt.conf')">
|
||||
<img src="assets/img/clipboard-dark.svg" alt="Copy to clipboard">
|
||||
</button>
|
||||
<div class="code source" data-filename="nginxconfig.io/letsencrypt.conf">
|
||||
<pre><code class="nginx" ng-include="'templates/conf/nginxconfig.io/letsencrypt.conf.html?v=COMMIT_HASH'" onload="refreshHighlighting()"></code></pre>
|
||||
</div><div id="file-letsencrypt" class="code highlighted"></div>
|
||||
</section>
|
||||
<section class="col-xl-6 grid-item file" ng-if="isModularized()" ng-cloak>
|
||||
<strong>{{ data.directory_nginx }}nginxconfig.io/security.conf</strong>
|
||||
<button class="btn btn-light btn-clipboard" ngclipboard data-clipboard-target="#file-security" ngclipboard-success="clipboardSuccess('security.conf')">
|
||||
<img src="assets/img/clipboard-dark.svg" alt="Copy to clipboard">
|
||||
</button>
|
||||
<div class="code source" data-filename="nginxconfig.io/security.conf">
|
||||
<pre><code class="nginx" ng-include="'templates/conf/nginxconfig.io/security.conf.html?v=COMMIT_HASH'" onload="refreshHighlighting()"></code></pre>
|
||||
</div><div id="file-security" class="code highlighted"></div>
|
||||
</section>
|
||||
<section class="col-xl-6 grid-item file" ng-if="isModularized()" ng-cloak>
|
||||
<strong>{{ data.directory_nginx }}nginxconfig.io/general.conf</strong>
|
||||
<button class="btn btn-light btn-clipboard" ngclipboard data-clipboard-target="#file-general" ngclipboard-success="clipboardSuccess('general.conf')">
|
||||
<img src="assets/img/clipboard-dark.svg" alt="Copy to clipboard">
|
||||
</button>
|
||||
<div class="code source" data-filename="nginxconfig.io/general.conf">
|
||||
<pre><code class="nginx" ng-include="'templates/conf/nginxconfig.io/general.conf.html?v=COMMIT_HASH'" onload="refreshHighlighting()"></code></pre>
|
||||
</div><div id="file-general" class="code highlighted"></div>
|
||||
</section>
|
||||
<section class="col-xl-6 grid-item file" ng-if="hasPHP() && (isModularized() || hasWordPress())" ng-cloak>
|
||||
<strong>{{ data.directory_nginx }}nginxconfig.io/php_fastcgi.conf</strong>
|
||||
<button class="btn btn-light btn-clipboard" ngclipboard data-clipboard-target="#file-php_fastcgi" ngclipboard-success="clipboardSuccess('php_fastcgi.conf')">
|
||||
<img src="assets/img/clipboard-dark.svg" alt="Copy to clipboard">
|
||||
</button>
|
||||
<div class="code source" data-filename="nginxconfig.io/php_fastcgi.conf">
|
||||
<pre><code class="nginx" ng-include="'templates/conf/nginxconfig.io/php_fastcgi.conf.html?v=COMMIT_HASH'" onload="refreshHighlighting()"></code></pre>
|
||||
</div><div id="file-php_fastcgi" class="code highlighted"></div>
|
||||
</section>
|
||||
<section class="col-xl-6 grid-item file" ng-if="hasPython() && isModularized()" ng-cloak>
|
||||
<strong>{{ data.directory_nginx }}nginxconfig.io/python_uwsgi.conf</strong>
|
||||
<button class="btn btn-light btn-clipboard" ngclipboard data-clipboard-target="#file-python_uwsgi" ngclipboard-success="clipboardSuccess('python_uwsgi.conf')">
|
||||
<img src="assets/img/clipboard-dark.svg" alt="Copy to clipboard">
|
||||
</button>
|
||||
<div class="code source" data-filename="nginxconfig.io/python_uwsgi.conf">
|
||||
<pre><code class="nginx" ng-include="'templates/conf/nginxconfig.io/python_uwsgi.conf.html?v=COMMIT_HASH'" onload="refreshHighlighting()"></code></pre>
|
||||
</div><div id="file-python_uwsgi" class="code highlighted"></div>
|
||||
</section>
|
||||
<section class="col-xl-6 grid-item file" ng-if="hasProxy() && isModularized()" ng-cloak>
|
||||
<strong>{{ data.directory_nginx }}nginxconfig.io/proxy.conf</strong>
|
||||
<button class="btn btn-light btn-clipboard" ngclipboard data-clipboard-target="#file-proxy" ngclipboard-success="clipboardSuccess('proxy.conf')">
|
||||
<img src="assets/img/clipboard-dark.svg" alt="Copy to clipboard">
|
||||
</button>
|
||||
<div class="code source" data-filename="nginxconfig.io/proxy.conf">
|
||||
<pre><code class="nginx" ng-include="'templates/conf/nginxconfig.io/proxy.conf.html?v=COMMIT_HASH'" onload="refreshHighlighting()"></code></pre>
|
||||
</div><div id="file-proxy" class="code highlighted"></div>
|
||||
</section>
|
||||
<section class="col-xl-6 grid-item file" ng-if="hasWordPress() && isModularized()" ng-cloak>
|
||||
<strong>{{ data.directory_nginx }}nginxconfig.io/wordpress.conf</strong>
|
||||
<button class="btn btn-light btn-clipboard" ngclipboard data-clipboard-target="#file-wordpress" ngclipboard-success="clipboardSuccess('wordpress.conf')">
|
||||
<img src="assets/img/clipboard-dark.svg" alt="Copy to clipboard">
|
||||
</button>
|
||||
<div class="code source" data-filename="nginxconfig.io/wordpress.conf">
|
||||
<pre><code class="nginx" ng-include="'templates/conf/nginxconfig.io/wordpress.conf.html?v=COMMIT_HASH'" onload="refreshHighlighting()"></code></pre>
|
||||
</div><div id="file-wordpress" class="code highlighted"></div>
|
||||
</section>
|
||||
<section class="col-xl-6 grid-item file" ng-if="hasDrupal() && isModularized()" ng-cloak>
|
||||
<strong>{{ data.directory_nginx }}nginxconfig.io/drupal.conf</strong>
|
||||
<button class="btn btn-light btn-clipboard" ngclipboard data-clipboard-target="#file-drupal" ngclipboard-success="clipboardSuccess('drupal.conf')">
|
||||
<img src="assets/img/clipboard-dark.svg" alt="Copy to clipboard">
|
||||
</button>
|
||||
<div class="code source" data-filename="nginxconfig.io/drupal.conf">
|
||||
<pre><code class="nginx" ng-include="'templates/conf/nginxconfig.io/drupal.conf.html?v=COMMIT_HASH'" onload="refreshHighlighting()"></code></pre>
|
||||
</div><div id="file-drupal" class="code highlighted"></div>
|
||||
</section>
|
||||
<section class="col-xl-6 grid-item file" ng-if="hasMagento() && isModularized()" ng-cloak>
|
||||
<strong>{{ data.directory_nginx }}nginxconfig.io/magento.conf</strong>
|
||||
<button class="btn btn-light btn-clipboard" ngclipboard data-clipboard-target="#file-magento" ngclipboard-success="clipboardSuccess('magento.conf')">
|
||||
<img src="assets/img/clipboard-dark.svg" alt="Copy to clipboard">
|
||||
</button>
|
||||
<div class="code source" data-filename="nginxconfig.io/magento.conf">
|
||||
<pre><code class="nginx" ng-include="'templates/conf/nginxconfig.io/magento.conf.html?v=COMMIT_HASH'" onload="refreshHighlighting()"></code></pre>
|
||||
</div><div id="file-magento" class="code highlighted"></div>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
<footer>
|
||||
<div class="container-fluid">
|
||||
Lovingly made by <a href="https://balint.szekeres.me" target="_blank">Bálint Szekeres</a>
|
||||
</div>
|
||||
</footer>
|
||||
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-3084378-31"></script>
|
||||
<script>
|
||||
window.dataLayer = window.dataLayer || [];
|
||||
|
|
@ -224,9 +25,6 @@
|
|||
gtag('js', new Date());
|
||||
gtag('config', 'UA-3084378-31');
|
||||
</script>
|
||||
<script>
|
||||
var LAYOUT = 'do';
|
||||
</script>
|
||||
<script src="assets/js/vendor.min.js?v=COMMIT_HASH"></script>
|
||||
<script src="assets/js/app.min.js?v=COMMIT_HASH"></script>
|
||||
<script async defer src="https://buttons.github.io/buttons.js"></script>
|
||||
|
|
|
|||
|
|
@ -17,19 +17,19 @@
|
|||
<div class="row">
|
||||
<legend class="col-sm-3 col-form-label col-form-label-sm">SSL profile</legend>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.ssl_profile !== defaultData.ssl_profile && data.ssl_profile === 'modern' }">
|
||||
<div class="form-check form-check-radio form-check-inline" ng-class="{ 'input-changed': data.ssl_profile !== defaultData.ssl_profile && data.ssl_profile === 'modern' }">
|
||||
<input class="form-check-input" type="radio" id="ssl-modern" ng-model="data.ssl_profile" value="modern">
|
||||
<label class="form-check-label col-form-label-sm" for="ssl-modern">
|
||||
<span tooltips tooltip-template="Services with clients that support TLS 1.3 and don't need backward compatibility<br><br>Oldest compatible clients:<ul><li>{{ sslProfiles.modern.oldest_clients.join('</li><li>') }}</li></ul>" tooltip-side="top" tooltip-class="ssl">Mozilla Modern</span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.ssl_profile !== defaultData.ssl_profile && data.ssl_profile === 'intermediate' }">
|
||||
<div class="form-check form-check-radio form-check-inline" ng-class="{ 'input-changed': data.ssl_profile !== defaultData.ssl_profile && data.ssl_profile === 'intermediate' }">
|
||||
<input class="form-check-input" type="radio" id="ssl-intermediate" ng-model="data.ssl_profile" value="intermediate">
|
||||
<label class="form-check-label col-form-label-sm" for="ssl-intermediate">
|
||||
<span tooltips tooltip-template="General-purpose servers with a variety of clients, recommended for almost all systems<br><br>Oldest compatible clients: <ul><li>{{ sslProfiles.intermediate.oldest_clients.join('</li><li>') }}</li></ul>" tooltip-side="top" tooltip-class="ssl">Mozilla Intermediate</span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.ssl_profile !== defaultData.ssl_profile && data.ssl_profile === 'old' }">
|
||||
<div class="form-check form-check-radio form-check-inline" ng-class="{ 'input-changed': data.ssl_profile !== defaultData.ssl_profile && data.ssl_profile === 'old' }">
|
||||
<input class="form-check-input" type="radio" id="ssl-old" ng-model="data.ssl_profile" value="old">
|
||||
<label class="form-check-label col-form-label-sm" for="ssl-old">
|
||||
<span tooltips tooltip-template="Compatible with a number of very old clients, and should be used only as a last resort<br><br>Oldest compatible clients: <ul><li>{{ sslProfiles.old.oldest_clients.join('</li><li>') }}</li></ul>" tooltip-side="top" tooltip-class="ssl">Mozilla Old</span>
|
||||
|
|
@ -43,17 +43,23 @@
|
|||
<span tooltips tooltip-template="DNS resolver for stapling">OCSP DNS resolvers</span>
|
||||
</label>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.resolver_cloudflare !== defaultData.resolver_cloudflare }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.resolver_cloudflare !== defaultData.resolver_cloudflare }">
|
||||
<input class="form-check-input" type="checkbox" id="resolver_cloudflare" ng-model="data.resolver_cloudflare">
|
||||
<label class="form-check-label col-form-label-sm" for="resolver_cloudflare" tooltips tooltip-template="<code>1.1.1.1, 1.0.0.1</code>" tooltip-side="top">Cloudflare Resolver</label>
|
||||
<label class="form-check-label col-form-label-sm" for="resolver_cloudflare">
|
||||
<span tooltips tooltip-template="<code>1.1.1.1, 1.0.0.1</code>" tooltip-side="top">Cloudflare Resolver</span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.resolver_google !== defaultData.resolver_google }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.resolver_google !== defaultData.resolver_google }">
|
||||
<input class="form-check-input" type="checkbox" id="resolver_google" ng-model="data.resolver_google">
|
||||
<label class="form-check-label col-form-label-sm" for="resolver_google" tooltips tooltip-template="<code>8.8.8.8, 8.8.4.4</code>" tooltip-side="top">Google Public DNS</label>
|
||||
<label class="form-check-label col-form-label-sm" for="resolver_google">
|
||||
<span tooltips tooltip-template="<code>8.8.8.8, 8.8.4.4</code>" tooltip-side="top">Google Public DNS</span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.resolver_opendns !== defaultData.resolver_opendns }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.resolver_opendns !== defaultData.resolver_opendns }">
|
||||
<input class="form-check-input" type="checkbox" id="resolver_opendns" ng-model="data.resolver_opendns">
|
||||
<label class="form-check-label col-form-label-sm" for="resolver_opendns" tooltips tooltip-template="<code>208.67.222.222, 208.67.220.220</code>" tooltip-side="top">OpenDNS</label>
|
||||
<label class="form-check-label col-form-label-sm" for="resolver_opendns">
|
||||
<span tooltips tooltip-template="<code>208.67.222.222, 208.67.220.220</code>" tooltip-side="top">OpenDNS</span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -103,7 +109,7 @@
|
|||
<code tooltips tooltip-template="Emitting nginx version on error pages and in the “Server” response header field.">server_tokens</code>
|
||||
</label>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.server_tokens !== defaultData.server_tokens }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.server_tokens !== defaultData.server_tokens }">
|
||||
<input class="form-check-input" type="checkbox" id="server_tokens" ng-model="data.server_tokens">
|
||||
<label class="form-check-label col-form-label-sm" for="server_tokens">enabled</label>
|
||||
</div>
|
||||
|
|
@ -114,7 +120,7 @@
|
|||
<code tooltips tooltip-template="Used to limit the request processing rate per a defined key, in particular, the processing rate of requests coming from a single IP address.">limit_req</code>
|
||||
</label>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.limit_req !== defaultData.limit_req }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.limit_req !== defaultData.limit_req }">
|
||||
<input class="form-check-input" type="checkbox" id="limit_req" ng-model="data.limit_req">
|
||||
<label class="form-check-label col-form-label-sm" for="limit_req">enabled</label>
|
||||
</div>
|
||||
|
|
@ -177,7 +183,7 @@
|
|||
gzip compression
|
||||
</label>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.gzip !== defaultData.gzip }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.gzip !== defaultData.gzip }">
|
||||
<input class="form-check-input" type="checkbox" id="gzip" ng-model="data.gzip">
|
||||
<label class="form-check-label col-form-label-sm" for="gzip">enabled</label>
|
||||
</div>
|
||||
|
|
@ -188,7 +194,7 @@
|
|||
<a href="https://github.com/eustas/ngx_brotli" target="_blank">brotli</a> compression
|
||||
</label>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.brotli !== defaultData.brotli }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.brotli !== defaultData.brotli }">
|
||||
<input class="form-check-input" type="checkbox" id="brotli" ng-model="data.brotli">
|
||||
<label class="form-check-label col-form-label-sm" for="brotli">enabled</label>
|
||||
</div>
|
||||
|
|
@ -267,7 +273,7 @@
|
|||
<code tooltips tooltip-template="Logging of errors about not found files into error_log.">log_not_found</code>
|
||||
</label>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.log_not_found !== defaultData.log_not_found }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.log_not_found !== defaultData.log_not_found }">
|
||||
<input class="form-check-input" type="checkbox" id="log_not_found" ng-model="data.log_not_found">
|
||||
<label class="form-check-label col-form-label-sm" for="log_not_found">enabled</label>
|
||||
</div>
|
||||
|
|
@ -359,7 +365,7 @@
|
|||
<span tooltips tooltip-template="Multiple configuration files<br><br><i>(ideal for multi-domain environment)</i>">Modularized structure</span>
|
||||
</label>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.file_structure !== defaultData.file_structure }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.file_structure !== defaultData.file_structure }">
|
||||
<input class="form-check-input" type="checkbox" id="file_structure" ng-model="data.file_structure" ng-true-value="'modularized'" ng-false-value="'unified'">
|
||||
<label class="form-check-label col-form-label-sm" for="file_structure">enabled</label>
|
||||
</div>
|
||||
|
|
@ -370,7 +376,7 @@
|
|||
<span tooltips tooltip-template="Symbolic link from sites-available/{{ getDomain() }}.conf to sites-enabled/{{ getDomain() }}.conf">Symlink vhost</span>
|
||||
</label>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.symlink !== defaultData.symlink }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.symlink !== defaultData.symlink }">
|
||||
<input class="form-check-input" type="checkbox" id="symlink" ng-model="data.symlink">
|
||||
<label class="form-check-label col-form-label-sm" for="symlink">enabled</label>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@
|
|||
</li>
|
||||
</ul>
|
||||
<div class="tab-pane tab-presets" ng-class="{ 'active': tabs_site[tab_site].slug === 'presets' }">
|
||||
<div class="text-center" ng-include="'partials/presets.html'"></div>
|
||||
<div class="text-center" ng-include="'partials/presets-do.html'"></div>
|
||||
</div>
|
||||
<div class="tab-pane tab-server" ng-class="{ 'active': tabs_site[tab_site].slug === 'server' }">
|
||||
<div class="row mb-2">
|
||||
|
|
@ -57,7 +57,7 @@
|
|||
<span tooltips tooltip-template="Serve requests without www subdomain.">www subdomain</span>
|
||||
</label>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.sites[site].non_www !== defaultData.sites[0].non_www }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.sites[site].non_www !== defaultData.sites[0].non_www }">
|
||||
<input class="form-check-input" type="checkbox" id="non_www" ng-model="data.sites[site].non_www" ng-true-value="false" ng-false-value="true">
|
||||
<label class="form-check-label col-form-label-sm" for="non_www">
|
||||
enabled <small>({{ isWWW() ? 'www.' : '' }}{{ getDomain() }})</small>
|
||||
|
|
@ -70,7 +70,7 @@
|
|||
<span tooltips tooltip-template="Cookie-free CDN subdomain.">CDN subdomain</span>
|
||||
</label>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.sites[site].cdn !== defaultData.sites[0].cdn }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.sites[site].cdn !== defaultData.sites[0].cdn }">
|
||||
<input class="form-check-input" type="checkbox" id="cdn" ng-model="data.sites[site].cdn">
|
||||
<label class="form-check-label col-form-label-sm" for="cdn">
|
||||
enabled <small>(cdn.{{ getDomain() }})</small>
|
||||
|
|
@ -83,7 +83,7 @@
|
|||
<span tooltips tooltip-template="Redirect {{ isWWW() ? 'non-www version and ' : '' }}all subdomains to domain.">Redirect {{ isNonWWW() ? 'subdomains' : 'domain, subdomains' }}</span>
|
||||
</label>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.sites[site].redirect !== defaultData.sites[0].redirect }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.sites[site].redirect !== defaultData.sites[0].redirect }">
|
||||
<input class="form-check-input" type="checkbox" id="redirect" ng-model="data.sites[site].redirect">
|
||||
<label class="form-check-label col-form-label-sm" for="redirect">
|
||||
enabled <small>(<code>{{ isNonWWW() ? ('*.' + getDomain() + ' → ' + getDomain()) : (getDomain() + ', *.' + getDomain() + ' → www.' + getDomain()) }}</code>)</small>
|
||||
|
|
@ -125,7 +125,7 @@
|
|||
<span tooltips tooltip-template="Provides support for HTTPS.<br><br><i>using Mozilla SSL config</i>">HTTPS</span>
|
||||
</label>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.sites[site].https !== defaultData.sites[0].https }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.sites[site].https !== defaultData.sites[0].https }">
|
||||
<input class="form-check-input" type="checkbox" id="https" ng-model="data.sites[site].https">
|
||||
<label class="form-check-label col-form-label-sm" for="https">enabled</label>
|
||||
</div>
|
||||
|
|
@ -136,7 +136,7 @@
|
|||
<span tooltips tooltip-template="Provides support for HTTP/2.">HTTP/2</span>
|
||||
</label>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.sites[site].http2 !== defaultData.sites[0].http2 }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.sites[site].http2 !== defaultData.sites[0].http2 }">
|
||||
<input class="form-check-input" type="checkbox" id="http2" ng-model="data.sites[site].http2">
|
||||
<label class="form-check-label col-form-label-sm" for="http2">enabled</label>
|
||||
</div>
|
||||
|
|
@ -147,7 +147,7 @@
|
|||
<span tooltips tooltip-template="Force redirection from HTTP to HTTPS.">Force HTTPS</span>
|
||||
</label>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.sites[site].force_https !== defaultData.sites[0].force_https }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.sites[site].force_https !== defaultData.sites[0].force_https }">
|
||||
<input class="form-check-input" type="checkbox" id="force_https" ng-model="data.sites[site].force_https">
|
||||
<label class="form-check-label col-form-label-sm" for="force_https">
|
||||
enabled <small ng-cloak>(<code >{{ isNonWWW() ? ('http://' + getDomain() + ' → https://' + getDomain()) : ('http://www.' + getDomain() + ' → https://www.' + getDomain()) }}</code>)</small>
|
||||
|
|
@ -160,15 +160,15 @@
|
|||
<span tooltips tooltip-template="HTTP Strict Transport Security is a web security policy mechanism which helps to protect websites against protocol downgrade attacks and cookie hijacking.">HSTS</span>
|
||||
</label>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.sites[site].hsts !== defaultData.sites[0].hsts }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.sites[site].hsts !== defaultData.sites[0].hsts }">
|
||||
<input class="form-check-input" type="checkbox" id="hsts" ng-model="data.sites[site].hsts">
|
||||
<label class="form-check-label col-form-label-sm" for="hsts">enabled</label>
|
||||
</div>
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.sites[site].hsts_subdomains !== defaultData.sites[0].hsts_subdomains, disabled: !isHSTS() }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.sites[site].hsts_subdomains !== defaultData.sites[0].hsts_subdomains, disabled: !isHSTS() }">
|
||||
<input class="form-check-input" type="checkbox" id="hsts_subdomains" ng-model="data.sites[site].hsts_subdomains">
|
||||
<label class="form-check-label col-form-label-sm" for="hsts_subdomains"><code class="small">includeSubDomains</code></label>
|
||||
</div>
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.sites[site].hsts_preload !== defaultData.sites[0].hsts_preload, disabled: !isHSTSSubdomains() }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.sites[site].hsts_preload !== defaultData.sites[0].hsts_preload, disabled: !isHSTSSubdomains() }">
|
||||
<input class="form-check-input" type="checkbox" id="hsts_preload" ng-model="data.sites[site].hsts_preload">
|
||||
<label class="form-check-label col-form-label-sm" for="hsts_preload"><code class="small">preload</code></label>
|
||||
</div>
|
||||
|
|
@ -178,13 +178,13 @@
|
|||
<div class="row">
|
||||
<legend class="col-sm-3 col-form-label col-form-label-sm">Certification type</legend>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check" ng-class="{ 'input-changed': data.sites[site].cert_type !== defaultData.sites[0].cert_type && data.sites[site].cert_type === 'letsencrypt' }">
|
||||
<div class="form-check form-check-radio" ng-class="{ 'input-changed': data.sites[site].cert_type !== defaultData.sites[0].cert_type && data.sites[site].cert_type === 'letsencrypt' }">
|
||||
<input class="form-check-input" type="radio" id="letsencrypt" ng-model="data.sites[site].cert_type" value="letsencrypt">
|
||||
<label class="form-check-label col-form-label-sm" for="letsencrypt">
|
||||
<span tooltips tooltip-template="Let's Encrypt based SSl.<br><br><i>free, automated, and open Certificate Authority</i>" tooltip-side="top">Let's Encrypt</span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="form-check" ng-class="{ 'input-changed': data.sites[site].cert_type !== defaultData.sites[0].cert_type && data.sites[site].cert_type === 'custom' }">
|
||||
<div class="form-check form-check-radio" ng-class="{ 'input-changed': data.sites[site].cert_type !== defaultData.sites[0].cert_type && data.sites[site].cert_type === 'custom' }">
|
||||
<input class="form-check-input" type="radio" id="custom_cert" ng-model="data.sites[site].cert_type" value="custom">
|
||||
<label class="form-check-label col-form-label-sm" for="custom_cert">custom certificate</label>
|
||||
</div>
|
||||
|
|
@ -235,7 +235,7 @@
|
|||
PHP
|
||||
</label>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.sites[site].php !== defaultData.sites[0].php }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.sites[site].php !== defaultData.sites[0].php }">
|
||||
<input class="form-check-input" type="checkbox" id="php" ng-model="data.sites[site].php">
|
||||
<label class="form-check-label col-form-label-sm" for="php">enabled</label>
|
||||
</div>
|
||||
|
|
@ -246,7 +246,7 @@
|
|||
<span tooltips tooltip-template="WordPress security rules and login limiting <i>(if enabled)</i>.">WordPress rules</span>
|
||||
</label>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.sites[site].wordpress !== defaultData.sites[0].wordpress }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.sites[site].wordpress !== defaultData.sites[0].wordpress }">
|
||||
<input class="form-check-input" type="checkbox" id="wordpress" ng-model="data.sites[site].wordpress">
|
||||
<label class="form-check-label col-form-label-sm" for="wordpress">enabled</label>
|
||||
</div>
|
||||
|
|
@ -257,7 +257,7 @@
|
|||
<span tooltips tooltip-template="Drupal security rules and login limiting <i>(if enabled)</i>.">Drupal rules</span>
|
||||
</label>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.sites[site].drupal !== defaultData.sites[0].drupal }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.sites[site].drupal !== defaultData.sites[0].drupal }">
|
||||
<input class="form-check-input" type="checkbox" id="drupal" ng-model="data.sites[site].drupal">
|
||||
<label class="form-check-label col-form-label-sm" for="drupal">enabled</label>
|
||||
</div>
|
||||
|
|
@ -268,7 +268,7 @@
|
|||
<span tooltips tooltip-template="Magento security rules.">Magento rules</span>
|
||||
</label>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.sites[site].magento !== defaultData.sites[0].magento }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.sites[site].magento !== defaultData.sites[0].magento }">
|
||||
<input class="form-check-input" type="checkbox" id="magento" ng-model="data.sites[site].magento">
|
||||
<label class="form-check-label col-form-label-sm" for="magento">enabled</label>
|
||||
</div>
|
||||
|
|
@ -281,7 +281,7 @@
|
|||
Python
|
||||
</label>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.sites[site].python !== defaultData.sites[0].python }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.sites[site].python !== defaultData.sites[0].python }">
|
||||
<input class="form-check-input" type="checkbox" id="python" ng-model="data.sites[site].python">
|
||||
<label class="form-check-label col-form-label-sm" for="python">enabled</label>
|
||||
</div>
|
||||
|
|
@ -292,7 +292,7 @@
|
|||
Django rules
|
||||
</label>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.sites[site].django !== defaultData.sites[0].django }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.sites[site].django !== defaultData.sites[0].django }">
|
||||
<input class="form-check-input" type="checkbox" id="django" ng-model="data.sites[site].django">
|
||||
<label class="form-check-label col-form-label-sm" for="django">enabled</label>
|
||||
</div>
|
||||
|
|
@ -305,7 +305,7 @@
|
|||
Reverse proxy
|
||||
</label>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.sites[site].proxy !== defaultData.sites[0].proxy }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.sites[site].proxy !== defaultData.sites[0].proxy }">
|
||||
<input class="form-check-input" type="checkbox" id="proxy" ng-model="data.sites[site].proxy">
|
||||
<label class="form-check-label col-form-label-sm" for="proxy">enabled</label>
|
||||
</div>
|
||||
|
|
@ -340,7 +340,7 @@
|
|||
<span tooltips tooltip-template="Enable root directive."><code>root</code></span>
|
||||
</label>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.sites[site].root !== defaultData.sites[0].root }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.sites[site].root !== defaultData.sites[0].root }">
|
||||
<input class="form-check-input" type="checkbox" id="root" ng-model="data.sites[site].root">
|
||||
<label class="form-check-label col-form-label-sm" for="root">enabled</label>
|
||||
</div>
|
||||
|
|
@ -352,11 +352,11 @@
|
|||
<code tooltips tooltip-template="Defines the file that will be used as an index.">index</code>
|
||||
</legend>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check" ng-class="{ 'input-changed': data.sites[site].index !== defaultData.sites[0].index && data.sites[site].index === 'index.html' }">
|
||||
<div class="form-check form-check-radio" ng-class="{ 'input-changed': data.sites[site].index !== defaultData.sites[0].index && data.sites[site].index === 'index.html' }">
|
||||
<input class="form-check-input" type="radio" id="index.html" ng-model="data.sites[site].index" value="index.html">
|
||||
<label class="form-check-label col-form-label-sm" for="index.html">index.html</label>
|
||||
</div>
|
||||
<div class="form-check" ng-class="{ 'input-changed': data.sites[site].index !== defaultData.sites[0].index && data.sites[site].index === 'index.php' }">
|
||||
<div class="form-check form-check-radio" ng-class="{ 'input-changed': data.sites[site].index !== defaultData.sites[0].index && data.sites[site].index === 'index.php' }">
|
||||
<input class="form-check-input" type="radio" id="index.php" ng-model="data.sites[site].index" value="index.php">
|
||||
<label class="form-check-label col-form-label-sm" for="index.php">index.php</label>
|
||||
</div>
|
||||
|
|
@ -394,7 +394,7 @@
|
|||
<span tooltips tooltip-template="Handle legacy (non-pretty) (<code>foo.php/bar/baz</code>) routes.">Legacy PHP routing</span>
|
||||
</label>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.sites[site].php_legacy_routing !== defaultData.sites[0].php_legacy_routing }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.sites[site].php_legacy_routing !== defaultData.sites[0].php_legacy_routing }">
|
||||
<input class="form-check-input" type="checkbox" id="php_legacy_routing" ng-model="data.sites[site].php_legacy_routing">
|
||||
<label class="form-check-label col-form-label-sm" for="php_legacy_routing">enabled</label>
|
||||
</div>
|
||||
|
|
@ -407,7 +407,7 @@
|
|||
<span tooltips tooltip-template="Domain specific access_log."><code>access_log</code> by domain</span>
|
||||
</label>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.sites[site].access_log_domain !== defaultData.sites[0].access_log_domain }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.sites[site].access_log_domain !== defaultData.sites[0].access_log_domain }">
|
||||
<input class="form-check-input" type="checkbox" id="access_log_domain" ng-model="data.sites[site].access_log_domain">
|
||||
<label class="form-check-label col-form-label-sm" for="access_log_domain">enabled</label>
|
||||
</div>
|
||||
|
|
@ -418,7 +418,7 @@
|
|||
<span tooltips tooltip-template="Domain specific error_log."><code>error_log</code> by domain</span>
|
||||
</label>
|
||||
<div class="col-sm-9">
|
||||
<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.sites[site].error_log_domain !== defaultData.sites[0].error_log_domain }">
|
||||
<div class="form-check form-check-checkbox form-check-inline" ng-class="{ 'input-changed': data.sites[site].error_log_domain !== defaultData.sites[0].error_log_domain }">
|
||||
<input class="form-check-input" type="checkbox" id="error_log_domain" ng-model="data.sites[site].error_log_domain">
|
||||
<label class="form-check-label col-form-label-sm" for="error_log_domain">enabled</label>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,198 @@
|
|||
<header>
|
||||
<div ng-if="toggleLayoutVisible()" class="layout-toggle" ng-cloak>
|
||||
<button class="btn btn-sm btn-secondary" ng-click="toggleLayout()">Layout: {{ layout }}</button>
|
||||
</div>
|
||||
<div ng-if="layout === 'do'" ng-cloak>
|
||||
<div class="hero container">
|
||||
<h1>NGINX Config</h1>
|
||||
<h2>The easiest way to configure a performant, secure,<br> and stable NGINX server.</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div class="container">
|
||||
<div class="loader" ng-if="!masonryInit">
|
||||
<div class="spinner">
|
||||
<div class="double-bounce1"></div>
|
||||
<div class="double-bounce2"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<img ng-if="layout === 'default'" src="assets/img/logo-light.svg" class="logo" alt="nginxconfig.io">
|
||||
|
||||
<div ng-if="layout === 'default'" class="sites">
|
||||
<div class="title">Sites:</div>
|
||||
<div class="group" ng-include="'partials/sites.html'"></div>
|
||||
</div>
|
||||
|
||||
<div ng-if="layout === 'default'" class="presets">
|
||||
<div class="title">Presets:</div>
|
||||
<div class="group" ng-include="'partials/presets.html'"></div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
<section class="tabs">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-9" ng-class="{ 'col-lg-12': layout === 'do' }">
|
||||
<div class="sites">
|
||||
<h5 ng-if="layout === 'do'">Per-Website Config</h5>
|
||||
<div ng-include="'partials/config-site.html'"></div>
|
||||
</div>
|
||||
<div class="common">
|
||||
<h5 ng-if="layout === 'do'">Global Config</h5>
|
||||
<div ng-include="'partials/config-global.html'"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div ng-if="layout === 'default'" class="col-lg-3" ng-cloak>
|
||||
<aside class="sidebar">
|
||||
<div class="github">
|
||||
<div class="github-cover">
|
||||
<div class="github-link">
|
||||
<a href="https://github.com/digitalocean/nginxconfig.io" target="_blank" class="github-logo-link">
|
||||
<ng-include src="'/assets/img/brands/github.svg'"></ng-include>
|
||||
</a>
|
||||
<br>
|
||||
<a href="https://github.com/digitalocean/nginxconfig.io" target="_blank"><small>digitalocean /</small> <strong>nginxconfig.io</strong></a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="github-buttons">
|
||||
<a class="github-button" href="https://github.com/digitalocean/nginxconfig.io" data-icon="octicon-star" data-size="large" data-show-count="true" aria-label="Star digitalocean/nginxconfig.io on GitHub">Star</a>
|
||||
<a class="github-button" href="https://github.com/digitalocean/nginxconfig.io/issues" data-icon="octicon-issue-opened" data-size="large" data-show-count="true" aria-label="Issue digitalocean/nginxconfig.io on GitHub">Issue</a>
|
||||
</div>
|
||||
</div>
|
||||
</aside>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<section class="steps">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-xl-10 offset-xl-1">
|
||||
<div ng-include="'partials/steps.html'"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
<main ng-class="{ 'active': masonryInit }">
|
||||
<div class="container">
|
||||
<div class="col-xl-10 offset-xl-1">
|
||||
<div class="commands" ng-cloak>
|
||||
<pre><code class="hljs bash" ng-include="'templates/commands.html?v=COMMIT_HASH'"></code></pre>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row grid">
|
||||
<div class="grid-sizer col-xl-6"></div>
|
||||
<div class="grid-item col-xl-12 mb-3 text-center" ng-cloak>
|
||||
<button class="btn btn-primary btn-sm btn-download" ng-click="downloadZip()"><img src="assets/img/download.svg" alt="Download"> Generated config <small>(.zip)</small></button>
|
||||
<button class="btn btn-success btn-sm btn-download btn-base64" ng-mouseenter="prepareBase64()" ng-click="copyAsBase64()" ngclipboard data-clipboard-target="#base64-zip-line" ngclipboard-success="clipboardSuccess('base64-zip-line')"><img src="assets/img/download.svg" alt="Download"> Copy Base64 <small>(inline)</small></button>
|
||||
</div>
|
||||
<div class="base64-zip-line-container">
|
||||
<div id="base64-zip-line">{{ base64 }}</div>
|
||||
</div>
|
||||
<section class="file grid-item" ng-class="isModularized() || isWordPress() ? 'col-xl-6' : 'col-xl-12'" ng-cloak>
|
||||
<strong>{{ data.directory_nginx }}nginx.conf</strong>
|
||||
<button class="btn btn-light btn-clipboard" ngclipboard data-clipboard-target="#file-nginx" ngclipboard-success="clipboardSuccess('nginx.conf')">
|
||||
<img src="assets/img/clipboard-dark.svg" alt="Copy to clipboard">
|
||||
</button>
|
||||
<div class="code source" data-filename="nginx.conf">
|
||||
<pre><code class="nginx" ng-include="'templates/conf/nginx.conf.html?v=COMMIT_HASH'" onload="refreshHighlighting()"></code></pre>
|
||||
</div><div id="file-nginx" class="code highlighted"></div>
|
||||
</section>
|
||||
<section class="col-xl-6 grid-item file" ng-if="isModularized()" ng-repeat="(_site, _domain) in getDomains() track by $index" ng-cloak>
|
||||
<strong>{{ data.directory_nginx }}sites-{{ isSymlink() ? 'available' : 'enabled' }}/{{ _domain }}.conf</strong>
|
||||
<button class="btn btn-light btn-clipboard" ngclipboard data-clipboard-target="#file-domain-{{ $index }}" ngclipboard-success="clipboardSuccess('example.com')">
|
||||
<img src="assets/img/clipboard-dark.svg" alt="Copy to clipboard">
|
||||
</button>
|
||||
<div class="code source" data-filename="sites-{{ isSymlink() ? 'available' : 'enabled' }}/{{ _domain }}.conf">
|
||||
<pre><code class="nginx" ng-include="'templates/conf/sites-available/example.com.conf.html?v=COMMIT_HASH?v=COMMIT_HASH'" onload="refreshHighlighting()"></code></pre>
|
||||
</div><div id="file-domain-{{ $index }}" class="code highlighted"></div>
|
||||
</section>
|
||||
<section class="col-xl-6 grid-item file" ng-if="isModularized() && hasCertLetsEncrypt()" ng-cloak>
|
||||
<strong>{{ data.directory_nginx }}nginxconfig.io/letsencrypt.conf</strong>
|
||||
<button class="btn btn-light btn-clipboard" ngclipboard data-clipboard-target="#file-letsencrypt" ngclipboard-success="clipboardSuccess('letsencrypt.conf')">
|
||||
<img src="assets/img/clipboard-dark.svg" alt="Copy to clipboard">
|
||||
</button>
|
||||
<div class="code source" data-filename="nginxconfig.io/letsencrypt.conf">
|
||||
<pre><code class="nginx" ng-include="'templates/conf/nginxconfig.io/letsencrypt.conf.html?v=COMMIT_HASH'" onload="refreshHighlighting()"></code></pre>
|
||||
</div><div id="file-letsencrypt" class="code highlighted"></div>
|
||||
</section>
|
||||
<section class="col-xl-6 grid-item file" ng-if="isModularized()" ng-cloak>
|
||||
<strong>{{ data.directory_nginx }}nginxconfig.io/security.conf</strong>
|
||||
<button class="btn btn-light btn-clipboard" ngclipboard data-clipboard-target="#file-security" ngclipboard-success="clipboardSuccess('security.conf')">
|
||||
<img src="assets/img/clipboard-dark.svg" alt="Copy to clipboard">
|
||||
</button>
|
||||
<div class="code source" data-filename="nginxconfig.io/security.conf">
|
||||
<pre><code class="nginx" ng-include="'templates/conf/nginxconfig.io/security.conf.html?v=COMMIT_HASH'" onload="refreshHighlighting()"></code></pre>
|
||||
</div><div id="file-security" class="code highlighted"></div>
|
||||
</section>
|
||||
<section class="col-xl-6 grid-item file" ng-if="isModularized()" ng-cloak>
|
||||
<strong>{{ data.directory_nginx }}nginxconfig.io/general.conf</strong>
|
||||
<button class="btn btn-light btn-clipboard" ngclipboard data-clipboard-target="#file-general" ngclipboard-success="clipboardSuccess('general.conf')">
|
||||
<img src="assets/img/clipboard-dark.svg" alt="Copy to clipboard">
|
||||
</button>
|
||||
<div class="code source" data-filename="nginxconfig.io/general.conf">
|
||||
<pre><code class="nginx" ng-include="'templates/conf/nginxconfig.io/general.conf.html?v=COMMIT_HASH'" onload="refreshHighlighting()"></code></pre>
|
||||
</div><div id="file-general" class="code highlighted"></div>
|
||||
</section>
|
||||
<section class="col-xl-6 grid-item file" ng-if="hasPHP() && (isModularized() || hasWordPress())" ng-cloak>
|
||||
<strong>{{ data.directory_nginx }}nginxconfig.io/php_fastcgi.conf</strong>
|
||||
<button class="btn btn-light btn-clipboard" ngclipboard data-clipboard-target="#file-php_fastcgi" ngclipboard-success="clipboardSuccess('php_fastcgi.conf')">
|
||||
<img src="assets/img/clipboard-dark.svg" alt="Copy to clipboard">
|
||||
</button>
|
||||
<div class="code source" data-filename="nginxconfig.io/php_fastcgi.conf">
|
||||
<pre><code class="nginx" ng-include="'templates/conf/nginxconfig.io/php_fastcgi.conf.html?v=COMMIT_HASH'" onload="refreshHighlighting()"></code></pre>
|
||||
</div><div id="file-php_fastcgi" class="code highlighted"></div>
|
||||
</section>
|
||||
<section class="col-xl-6 grid-item file" ng-if="hasPython() && isModularized()" ng-cloak>
|
||||
<strong>{{ data.directory_nginx }}nginxconfig.io/python_uwsgi.conf</strong>
|
||||
<button class="btn btn-light btn-clipboard" ngclipboard data-clipboard-target="#file-python_uwsgi" ngclipboard-success="clipboardSuccess('python_uwsgi.conf')">
|
||||
<img src="assets/img/clipboard-dark.svg" alt="Copy to clipboard">
|
||||
</button>
|
||||
<div class="code source" data-filename="nginxconfig.io/python_uwsgi.conf">
|
||||
<pre><code class="nginx" ng-include="'templates/conf/nginxconfig.io/python_uwsgi.conf.html?v=COMMIT_HASH'" onload="refreshHighlighting()"></code></pre>
|
||||
</div><div id="file-python_uwsgi" class="code highlighted"></div>
|
||||
</section>
|
||||
<section class="col-xl-6 grid-item file" ng-if="hasProxy() && isModularized()" ng-cloak>
|
||||
<strong>{{ data.directory_nginx }}nginxconfig.io/proxy.conf</strong>
|
||||
<button class="btn btn-light btn-clipboard" ngclipboard data-clipboard-target="#file-proxy" ngclipboard-success="clipboardSuccess('proxy.conf')">
|
||||
<img src="assets/img/clipboard-dark.svg" alt="Copy to clipboard">
|
||||
</button>
|
||||
<div class="code source" data-filename="nginxconfig.io/proxy.conf">
|
||||
<pre><code class="nginx" ng-include="'templates/conf/nginxconfig.io/proxy.conf.html?v=COMMIT_HASH'" onload="refreshHighlighting()"></code></pre>
|
||||
</div><div id="file-proxy" class="code highlighted"></div>
|
||||
</section>
|
||||
<section class="col-xl-6 grid-item file" ng-if="hasWordPress() && isModularized()" ng-cloak>
|
||||
<strong>{{ data.directory_nginx }}nginxconfig.io/wordpress.conf</strong>
|
||||
<button class="btn btn-light btn-clipboard" ngclipboard data-clipboard-target="#file-wordpress" ngclipboard-success="clipboardSuccess('wordpress.conf')">
|
||||
<img src="assets/img/clipboard-dark.svg" alt="Copy to clipboard">
|
||||
</button>
|
||||
<div class="code source" data-filename="nginxconfig.io/wordpress.conf">
|
||||
<pre><code class="nginx" ng-include="'templates/conf/nginxconfig.io/wordpress.conf.html?v=COMMIT_HASH'" onload="refreshHighlighting()"></code></pre>
|
||||
</div><div id="file-wordpress" class="code highlighted"></div>
|
||||
</section>
|
||||
<section class="col-xl-6 grid-item file" ng-if="hasDrupal() && isModularized()" ng-cloak>
|
||||
<strong>{{ data.directory_nginx }}nginxconfig.io/drupal.conf</strong>
|
||||
<button class="btn btn-light btn-clipboard" ngclipboard data-clipboard-target="#file-drupal" ngclipboard-success="clipboardSuccess('drupal.conf')">
|
||||
<img src="assets/img/clipboard-dark.svg" alt="Copy to clipboard">
|
||||
</button>
|
||||
<div class="code source" data-filename="nginxconfig.io/drupal.conf">
|
||||
<pre><code class="nginx" ng-include="'templates/conf/nginxconfig.io/drupal.conf.html?v=COMMIT_HASH'" onload="refreshHighlighting()"></code></pre>
|
||||
</div><div id="file-drupal" class="code highlighted"></div>
|
||||
</section>
|
||||
<section class="col-xl-6 grid-item file" ng-if="hasMagento() && isModularized()" ng-cloak>
|
||||
<strong>{{ data.directory_nginx }}nginxconfig.io/magento.conf</strong>
|
||||
<button class="btn btn-light btn-clipboard" ngclipboard data-clipboard-target="#file-magento" ngclipboard-success="clipboardSuccess('magento.conf')">
|
||||
<img src="assets/img/clipboard-dark.svg" alt="Copy to clipboard">
|
||||
</button>
|
||||
<div class="code source" data-filename="nginxconfig.io/magento.conf">
|
||||
<pre><code class="nginx" ng-include="'templates/conf/nginxconfig.io/magento.conf.html?v=COMMIT_HASH'" onload="refreshHighlighting()"></code></pre>
|
||||
</div><div id="file-magento" class="code highlighted"></div>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
<footer>
|
||||
<div class="container-fluid">
|
||||
Lovingly made by <a href="https://balint.szekeres.me" target="_blank">Bálint Szekeres</a>
|
||||
</div>
|
||||
</footer>
|
||||
|
|
@ -1,34 +0,0 @@
|
|||
<div class="announcement">
|
||||
<div class="container">
|
||||
<span class="badge">NEW</span>
|
||||
<a href="https://blog.digitalocean.com/introducing-memory-optimized-droplets/" target="_blank">Now available: Memory-Optimized Droplets ❯</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="menu">
|
||||
<div class="container">
|
||||
<nav class="navbar navbar-expand-lg navbar-light">
|
||||
<a class="navbar-brand" href="#" ng-include="'assets/img/do.svg'"></a>
|
||||
|
||||
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
|
||||
<div class="collapse navbar-collapse" id="navbarSupportedContent">
|
||||
<ul class="navbar-nav mr-auto">
|
||||
<li class="nav-item active">
|
||||
<a class="nav-link" href="#">Community</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Tutorials</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Questions</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">Get Involved</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -0,0 +1,72 @@
|
|||
<button
|
||||
type="button"
|
||||
class="btn btn-sm btn-light"
|
||||
ng-click="setPreset('frontend')"
|
||||
ng-class="{ 'active': !isPHP() && !isPython() && !isProxy() && isIndexHTML() && isFallbackHTML() }"
|
||||
tooltips
|
||||
tooltip-template="• disabled PHP<br>• index.html fallback routing"
|
||||
tooltip-side="bottom"
|
||||
>Frontend</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-sm btn-light"
|
||||
ng-click="setPreset('backend')"
|
||||
ng-class="{ 'active': isPHP() && isIndexPHP() && isFallbackPHP() && !isFallbackHTML() && !isWordPress() && !isDrupal() && !isMagento() }"
|
||||
tooltips
|
||||
tooltip-template="• enabled PHP<br>• index.php fallback routing"
|
||||
tooltip-side="bottom"
|
||||
>PHP</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-sm btn-light"
|
||||
ng-click="setPreset('django')"
|
||||
ng-class="{ 'active': isPython() && isDjango() && !isRoot() }"
|
||||
tooltips
|
||||
tooltip-template="• enabled Python<br>• Django rules<br>• <code>root</code> disabled"
|
||||
tooltip-side="bottom"
|
||||
>Django</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-sm btn-light"
|
||||
ng-class="{ 'active': isProxy() && !isRoot() }"
|
||||
ng-click="setPreset('nodejs')"
|
||||
tooltips
|
||||
tooltip-template="• enabled reverse proxy"
|
||||
tooltip-side="bottom"
|
||||
>Node.js</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-sm btn-light"
|
||||
ng-class="{ 'active': isPHP() && isIndexHTML() && isFallbackHTML() }"
|
||||
ng-click="setPreset('spa')"
|
||||
tooltips
|
||||
tooltip-template="• enabled PHP<br>• index.html fallback routing<br>• index.php API routing"
|
||||
tooltip-side="bottom"
|
||||
>Single-page application</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-sm btn-light"
|
||||
ng-click="setPreset('wordpress')"
|
||||
ng-class="{ 'active': isIndexPHP() && isFallbackPHP() && !isFallbackHTML() && isWordPress() && !isDrupal() && !isMagento() }"
|
||||
tooltips
|
||||
tooltip-template="• enabled PHP<br>• index.php fallback routing<br>• WordPress security rules"
|
||||
tooltip-side="bottom"
|
||||
>WordPress</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-sm btn-light"
|
||||
ng-click="setPreset('drupal')"
|
||||
ng-class="{ 'active': isIndexPHP() && isFallbackPHP() && !isFallbackHTML() && !isWordPress() && isDrupal() && !isMagento() }"
|
||||
tooltips
|
||||
tooltip-template="• enabled PHP<br>• index.php fallback routing<br>• Drupal security rules"
|
||||
tooltip-side="bottom"
|
||||
>Drupal</button>
|
||||
<button
|
||||
type="button"
|
||||
class="btn btn-sm btn-light"
|
||||
ng-click="setPreset('magento')"
|
||||
ng-class="{ 'active': isIndexPHP() && isFallbackPHP() && !isFallbackHTML() && !isWordPress() && !isDrupal() && isMagento() }"
|
||||
tooltips
|
||||
tooltip-template="• enabled PHP<br>• index.php fallback routing<br>• Magento security rules"
|
||||
tooltip-side="bottom"
|
||||
>Magento</button>
|
||||
|
|
@ -380,7 +380,7 @@
|
|||
/////////////////////
|
||||
// SCOPE VARIABLES //
|
||||
/////////////////////
|
||||
$scope.layout = 'default';
|
||||
$scope.layout = 'do';
|
||||
$scope.defaultData = DEFAULTS;
|
||||
|
||||
$scope.dataInit = false;
|
||||
|
|
@ -393,6 +393,10 @@
|
|||
$scope.tab_common = 0;
|
||||
|
||||
$scope.tabs_site = [
|
||||
{
|
||||
name: 'Presets',
|
||||
slug: 'presets',
|
||||
},
|
||||
{
|
||||
name: 'Server',
|
||||
slug: 'server',
|
||||
|
|
@ -1302,11 +1306,13 @@
|
|||
//////////
|
||||
// INIT //
|
||||
//////////
|
||||
setDataFromHash();
|
||||
initMasonry();
|
||||
$scope.init = function() {
|
||||
setDataFromHash();
|
||||
initMasonry();
|
||||
|
||||
if ($window.LAYOUT !== $scope.layout) {
|
||||
$scope.toggleLayout();
|
||||
}
|
||||
if ($window.LAYOUT && $window.LAYOUT !== $scope.layout) {
|
||||
$scope.toggleLayout();
|
||||
}
|
||||
};
|
||||
}
|
||||
})();
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
body {
|
||||
#app {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-height: 100vh;
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
@import 'https://fonts.googleapis.com/css?family=Quicksand:400,700&display=swap';
|
||||
|
||||
body {
|
||||
#app {
|
||||
font-family: 'Quicksand', sans-serif;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -40,9 +40,26 @@
|
|||
|
||||
|
||||
|
||||
body.layout-do {
|
||||
#app.layout-do {
|
||||
font-family: 'Sailec', sans-serif;
|
||||
|
||||
.btn-sm {
|
||||
padding: 0.375rem 0.5rem;
|
||||
}
|
||||
|
||||
.btn-light.active {
|
||||
@extend .btn-primary;
|
||||
}
|
||||
|
||||
.btn-primary,
|
||||
.btn-light.active {
|
||||
background-color: #0069ff !important;
|
||||
}
|
||||
|
||||
.btn-light {
|
||||
background-color: #e5e5e5;
|
||||
}
|
||||
|
||||
header {
|
||||
padding: 0;
|
||||
background-color: #031b4e;
|
||||
|
|
@ -270,6 +287,31 @@ body.layout-do {
|
|||
font-size: 1rem;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
select.form-control-sm {
|
||||
height: calc(1.5em + 0.75rem + 2px);
|
||||
}
|
||||
|
||||
.form-check.form-check-radio {
|
||||
@extend .custom-radio;
|
||||
}
|
||||
|
||||
.form-check.form-check-checkbox {
|
||||
@extend .custom-checkbox;
|
||||
}
|
||||
|
||||
.form-check.form-check-radio,
|
||||
.form-check.form-check-checkbox {
|
||||
@extend .custom-control;
|
||||
|
||||
.form-check-input {
|
||||
@extend .custom-control-input;
|
||||
}
|
||||
|
||||
.form-check-label {
|
||||
@extend .custom-control-label;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.tab-navigation-buttons {
|
||||
|
|
@ -277,10 +319,6 @@ body.layout-do {
|
|||
text-align: right;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background-color: #0069ff;
|
||||
}
|
||||
|
||||
.btn-outline-light {
|
||||
box-shadow: none !important;
|
||||
color: #666;
|
||||
|
|
@ -292,12 +330,6 @@ body.layout-do {
|
|||
background-color: #fff;
|
||||
border-color: #212529;
|
||||
color: #000;
|
||||
|
||||
svg {
|
||||
path {
|
||||
fill: #000;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
svg {
|
||||
|
|
|
|||
Loading…
Reference in New Issue