Made settings ui a little less jumpy

diff --git a/resources/assets/js/directives.js b/resources/assets/js/directives.js
index e5c390ad22074ebc97246ea1b161359ede593b38..97d8a89e293fe9055b6ba843b342ba860b34383b 100644 (file)
--- a/resources/assets/js/directives.js
+++ b/resources/assets/js/directives.js
@@ -15,7 +15,7 @@ module.exports = function (ngApp, events) {
      */
     ngApp.directive('toggleSwitch', function () {
         return {
-            restrict: 'E',
+            restrict: 'A',
             template: toggleSwitchTemplate,
             scope: true,
             link: function (scope, element, attrs) {

diff --git a/resources/assets/sass/_forms.scss b/resources/assets/sass/_forms.scss
index 4a505c5f857b755761de1a99ccbb86fa09b7ee0e..482cf54bd8720e0f10fa11025e2ed54c023d5a58 100644 (file)
--- a/resources/assets/sass/_forms.scss
+++ b/resources/assets/sass/_forms.scss
@@ -248,4 +248,9 @@ div[editor-type="markdown"] .title-input.page-title input[type="text"] {
 
 .image-picker img {
   background-color: #BBB;
+}
+
+div[toggle-switch] {
+  height: 18px;
+  width: 150px;
 }
\ No newline at end of file

diff --git a/resources/views/settings/index.blade.php b/resources/views/settings/index.blade.php
index 7e38154d5f00e33f25bafc325f8aefcbdac56e79..7c1ec59bfd44c6189c98b0313aa64230039c834e 100644 (file)
--- a/resources/views/settings/index.blade.php
+++ b/resources/views/settings/index.blade.php
@@ -21,12 +21,12 @@
                 </div>
                 <div class="form-group">
                     <label>Allow public viewing?</label>
-                    <toggle-switch name="setting-app-public" value="{{ setting('app-public') }}"></toggle-switch>
+                    <div toggle-switch name="setting-app-public" value="{{ setting('app-public') }}"></div>
                 </div>
                 <div class="form-group">
                     <label>Enable higher security image uploads?</label>
                     <p class="small">For performance reasons, all images are public by default, This option adds a random, hard-to-guess characters in front of image names. Ensure directory indexes are not enabled to prevent easy access.</p>
-                    <toggle-switch name="setting-app-secure-images" value="{{ setting('app-secure-images') }}"></toggle-switch>
+                    <div toggle-switch name="setting-app-secure-images" value="{{ setting('app-secure-images') }}"></div>
                 </div>
                 <div class="form-group">
                     <label for="setting-app-editor">Page editor</label>
@@ -61,7 +61,7 @@
             <div class="col-md-6">
                 <div class="form-group">
                     <label for="setting-registration-enabled">Allow registration?</label>
-                    <toggle-switch name="setting-registration-enabled" value="{{ setting('registration-enabled') }}"></toggle-switch>
+                    <div toggle-switch name="setting-registration-enabled" value="{{ setting('registration-enabled') }}"></div>
                 </div>
                 <div class="form-group">
                     <label for="setting-registration-role">Default user role after registration</label>
@@ -78,7 +78,7 @@
                 <div class="form-group">
                     <label for="setting-registration-confirmation">Require email confirmation?</label>
                     <p class="small">If domain restriction is used then email confirmation will be required and the below value will be ignored.</p>
-                    <toggle-switch name="setting-registration-confirmation" value="{{ setting('registration-confirmation') }}"></toggle-switch>
+                    <div toggle-switch name="setting-registration-confirmation" value="{{ setting('registration-confirmation') }}"></div>
                 </div>
             </div>
             <div class="col-md-6">