inline checkbox

public/index.html

@@ -209,22 +209,18 @@
 									<label class="col-sm-3 col-form-label col-form-label-sm">
 										<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-3">
+									<div class="col-sm-9">
-										<div class="form-check" ng-class="{ 'input-changed': data.hsts !== defaultData.hsts }">
+										<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.hsts !== defaultData.hsts }">
 											<input class="form-check-input" type="checkbox" id="hsts" ng-model="data.hsts">
 											<label class="form-check-label" for="hsts">enabled</label>
 										</div>
-									</div>
+										<div class="form-check form-check-inline" ng-if="isHSTS()" ng-class="{ 'input-changed': data.hsts_subdomains !== defaultData.hsts_subdomains }">
-									<div class="col-sm-3 small">
-										<div class="form-check" ng-if="isHSTS()" ng-class="{ 'input-changed': data.hsts_subdomains !== defaultData.hsts_subdomains }">
 											<input class="form-check-input" type="checkbox" id="hsts_subdomains" ng-model="data.hsts_subdomains">
-											<label class="form-check-label" for="hsts_subdomains"><code>includeSubDomains</code></label>
+											<label class="form-check-label" for="hsts_subdomains"><code class="small">includeSubDomains</code></label>
-										</div>
 										</div>
-									<div class="col-sm-3 small">
+										<div class="form-check form-check-inline" ng-if="isHSTSSubdomains()" ng-class="{ 'input-changed': data.hsts_preload !== defaultData.hsts_preload }">
-										<div class="form-check" ng-if="isHSTSSubdomains()" ng-class="{ 'input-changed': data.hsts_preload !== defaultData.hsts_preload }">
 											<input class="form-check-input" type="checkbox" id="hsts_preload" ng-model="data.hsts_preload">
-											<label class="form-check-label" for="hsts_preload"><code>preload</code></label>
+											<label class="form-check-label" for="hsts_preload"><code class="small">preload</code></label>
 										</div>
 									</div>
 								</div>
@@ -232,19 +228,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" ng-class="{ 'input-changed': data.ssl_profile !== defaultData.ssl_profile && data.ssl_profile === 'modern' }">
+											<div class="form-check 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="modern" ng-model="data.ssl_profile" value="modern">
 												<label class="form-check-label" for="modern">
 													<span tooltips tooltip-template="Oldest compatible clients: Firefox 27, Chrome 30, IE 11 on Windows 7, Edge, Opera 17, Safari 9, Android 5.0, and Java 8">modern</span>
 												</label>
 											</div>
-											<div class="form-check" ng-class="{ 'input-changed': data.ssl_profile !== defaultData.ssl_profile && data.ssl_profile === 'intermediate' }">
+											<div class="form-check 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="intermediate" ng-model="data.ssl_profile" value="intermediate">
 												<label class="form-check-label" for="intermediate">
 													<span tooltips tooltip-template="Oldest compatible clients: Firefox 1, Chrome 1, IE 7, Opera 5, Safari 1, Windows XP IE8, Android 2.3, Java 7">intermediate</span>
 												</label>
 											</div>
-											<div class="form-check" ng-class="{ 'input-changed': data.ssl_profile !== defaultData.ssl_profile && data.ssl_profile === 'old' }">
+											<div class="form-check 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="old" ng-model="data.ssl_profile" value="old">
 												<label class="form-check-label" for="old">
 													<span tooltips tooltip-template="Oldest compatible clients: Windows XP IE6, Java 6">old</span>
@@ -257,13 +253,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.cert_type !== defaultData.cert_type && data.cert_type === 'letsencrypt' }">
+											<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.cert_type !== defaultData.cert_type && data.cert_type === 'letsencrypt' }">
 												<input class="form-check-input" type="radio" id="letsencrypt" ng-model="data.cert_type" value="letsencrypt">
 												<label class="form-check-label" for="letsencrypt">
 													<span tooltips tooltip-template="Let's Encrypt based SSl.<br><br><i>free, automated, and open Certificate Authority</i>">Let's Encrypt</span>
 												</label>
 											</div>
-											<div class="form-check" ng-class="{ 'input-changed': data.cert_type !== defaultData.cert_type && data.cert_type === 'custom' }">
+											<div class="form-check form-check-inline" ng-class="{ 'input-changed': data.cert_type !== defaultData.cert_type && data.cert_type === 'custom' }">
 												<input class="form-check-input" type="radio" id="custom_cert" ng-model="data.cert_type" value="custom">
 												<label class="form-check-label" for="custom_cert">Custom certificate</label>
 											</div>