From 69f1f42816bf1a750cbe1317dbad768589129c8c Mon Sep 17 00:00:00 2001 From: David Baldwynn Date: Wed, 15 Nov 2017 10:12:01 -0800 Subject: [PATCH] reorganized css for admin-form --- .../css/{edit-form.css => admin-form.css} | 108 +++++------------- .../forms/admin/css/configure-form.css | 80 +++++++++++++ .../forms/admin/css/edit-form-configure.css | 24 ---- .../forms/admin/css/edit-submissions-view.css | 17 ++- public/modules/forms/admin/css/share-form.css | 11 ++ .../directives/share-form.client.directive.js | 11 +- .../form/share-form.client.view.html | 72 ++++++------ 7 files changed, 177 insertions(+), 146 deletions(-) rename public/modules/forms/admin/css/{edit-form.css => admin-form.css} (58%) create mode 100644 public/modules/forms/admin/css/configure-form.css delete mode 100644 public/modules/forms/admin/css/edit-form-configure.css create mode 100644 public/modules/forms/admin/css/share-form.css diff --git a/public/modules/forms/admin/css/edit-form.css b/public/modules/forms/admin/css/admin-form.css similarity index 58% rename from public/modules/forms/admin/css/edit-form.css rename to public/modules/forms/admin/css/admin-form.css index 3ac8a10a..96f14e9f 100644 --- a/public/modules/forms/admin/css/edit-form.css +++ b/public/modules/forms/admin/css/admin-form.css @@ -1,74 +1,75 @@ -.pull-top { +.admin-form .pull-top { display: inline-block; vertical-align: top; float: none; } -.box { +.admin-form .box { padding: 0 5px 0 5px!important; } -.current-fields .field-row { +.admin-form .current-fields .field-row { padding: 5px 0; } -.current-fields .panel { +.admin-form .current-fields .panel { background-color: #f1f1f1; margin-top: 0!important; } - .current-fields .panel:hover { + .admin-form .current-fields .panel:hover { background-color: #fff; cursor: pointer; } -.current-fields .panel.tool-panel { +.admin-form .current-fields .panel.tool-panel { background-color: white; } -.current-fields .panel-heading { +.admin-form .current-fields .panel-heading { background-color: #f1f1f1; position: relative; } - .current-fields .panel-heading:hover { + .admin-form .current-fields .panel-heading:hover { background-color: #fff; cursor: pointer; } - .current-fields .panel-heading a:hover { + .admin-form .current-fields .panel-heading a:hover { text-decoration: none; } -.current-fields .tool-panel.panel:hover { +.admin-form .current-fields .tool-panel.panel:hover { border-color: #9d9d9d; background-color: #eee; cursor: pointer; } - .current-fields .tool-panel.panel:hover .panel-heading { + .admin-form .current-fields .tool-panel.panel:hover .panel-heading { background-color: inherit; color: #000; cursor: pointer; } -.current-fields .tool-panel.panel .panel-heading { +.admin-form .current-fields .tool-panel.panel .panel-heading { background-color: #fff; color: #9d9d9d; } - .current-fields .tool-panel.panel .panel-heading a { + .admin-form .current-fields .tool-panel.panel .panel-heading a { color: inherit; } - .current-fields .tool-panel.panel .panel-heading a:hover{ + .admin-form .current-fields .tool-panel.panel .panel-heading a:hover{ text-decoration: none; } /* Custom Tab CSS */ -.nav.nav-pills.nav-stacked { +.admin-form .nav.nav-pills.nav-stacked { width: 16.66666667%; float: left; position: relative; min-height: 1px; padding-right: 15px; } -div.tab-content { + +.admin-form .tab-content { width: 83.33333333%; position: relative; min-height: 1px; @@ -76,13 +77,13 @@ div.tab-content { padding-top: 0!important; } -.panel-default.startPage { +.admin-form .panel-default.startPage { border-style: dashed; border-color: #a9a9a9; border-width:3px; } -.busy-updating-wrapper { +.admin-form .busy-updating-wrapper { text-align: center; font-size: 20px; position: fixed; @@ -91,7 +92,7 @@ div.tab-content { z-index: 1; } -.busy-submitting-wrapper { +.admin-form .busy-submitting-wrapper { position: fixed; top: 50%; left: 0; @@ -99,7 +100,7 @@ div.tab-content { bottom: 0; } -.dropzone h4.panel-title { +.admin-form .dropzone h4.panel-title { height: 17px; overflow: hidden; } @@ -111,30 +112,30 @@ div.tab-content { /* ** Edit Modal */ -.edit-modal-window .modal-dialog { +.admin-form .edit-modal-window .modal-dialog { width: 90%; } -.edit-modal-window .modal-body { +.admin-form .edit-modal-window .modal-body { padding: 0; } -.edit-modal-window .edit-panel { +.admin-form .edit-modal-window .edit-panel { background-color: #F1F1F1; padding: 0 35px 0 35px; } -.edit-modal-window .preview-field-panel { +.admin-form .edit-modal-window .preview-field-panel { display: flex; flex-direction: column; justify-content: center; } -.edit-modal-window .preview-field-panel form { +.admin-form .edit-modal-window .preview-field-panel form { padding-right: 20px; } -.edit-modal-window .preview-field { +.admin-form .edit-modal-window .preview-field { resize: vertical; } @@ -146,42 +147,6 @@ div.tab-content { background:rgba(0, 0, 0, 0.5) !important; } - -.config-form { - max-width: 100%; -} - -.config-form > .row { - padding: 19px; - margin-bottom: 20px; - background-color: #f5f5f5; - border: 1px solid #e3e3e3; - border-radius: 4px; - -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05); - -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05); - box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05); -} - -div.config-form .row.field { - padding-top:1.5em; -} - - div.config-form > .row > .container:nth-of-type(odd){ - border-right: 1px #ddd solid; - } - div.config-form.design > .row > .container:nth-of-type(odd){ - border-right: none; - } - - div.config-form .row > .field-input { - padding-left:0.1em; - } - div.config-form .row > .field-input label { - padding-left:1.3em; - display: block; - } - - /* Styles for form admin view (/forms/:formID/admin) */ .admin-form > .page-header { padding-bottom: 0; @@ -208,25 +173,6 @@ div.config-form .row.field { padding-top: 3em; } - -/*Styles for submission table*/ -.submissions-table .table-outer.row { - margin: 1.5em 0 2em 0!important; -} -.submissions-table .table-outer .col-xs-12 { - padding-left: 0!important; - border:1px solid #ddd; - overflow-x: scroll; - border-radius:3px; -} -.submissions-table .table > thead > tr > th { - min-width:8em; -} -.submissions-table .table > tbody > tr.selected { - background-color:#efefef; -} - - /*Styles for add fields tab*/ .admin-form .add-field { background-color: #ddd; diff --git a/public/modules/forms/admin/css/configure-form.css b/public/modules/forms/admin/css/configure-form.css new file mode 100644 index 00000000..6db8d6af --- /dev/null +++ b/public/modules/forms/admin/css/configure-form.css @@ -0,0 +1,80 @@ +configure-form-directive .placeholder-tag { + background-color: #999; + border-radius: 3px 3px 3px 3px; + border: 0; + color: #FFFFFF; + font-style: inherit; + font-size: 11px; + padding: 4px 5px; + margin: 0 2px 2px 2px; + font-family: inherit; + white-space: nowrap; + vertical-align: middle; + cursor: pointer !important; + display: inline!important; + width: 100%; +} + +configure-form-directive .tab-content { + padding-top: 0; +} + +configure-form-directive .ui-select input.form-control { + height: 34px; + padding: 6px; +} + +configure-form-directive .config-form .btn-secondary { + border-color: #DDDDDD; +} + +configure-form-directive .notification-toggle.toggle-switch { + margin: 5px 0; +} + +configure-form-directive .ql-picker.ql-placeholder { + width: 118px; +} + +configure-form-directive .ql-picker.ql-placeholder > span.ql-picker-label:before { + content: attr(data-before); +} + +configure-form-directive .ql-picker.ql-placeholder > span.ql-picker-options > span.ql-picker-item::before { + content: attr(data-label); +} + +configure-form-directive .config-form .row.field { + padding-top:1.5em; +} + + configure-form-directive .config-form > .row > .container:nth-of-type(odd){ + border-right: 1px #ddd solid; + } + configure-form-directive .config-form.design > .row > .container:nth-of-type(odd){ + border-right: none; + } + + configure-form-directive .config-form .row > .field-input { + padding-left:0.1em; + } + configure-form-directive .config-form .row > .field-input label { + padding-left:1.3em; + display: block; + } + + +configure-form-directive .config-form { + max-width: 100%; +} + +configure-form-directive .config-form > .row { + padding: 19px; + margin-bottom: 20px; + background-color: #f5f5f5; + border: 1px solid #e3e3e3; + border-radius: 4px; + -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05); + -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05); + box-shadow: inset 0 1px 1px rgba(0, 0, 0, .05); +} \ No newline at end of file diff --git a/public/modules/forms/admin/css/edit-form-configure.css b/public/modules/forms/admin/css/edit-form-configure.css deleted file mode 100644 index 71bc2d0a..00000000 --- a/public/modules/forms/admin/css/edit-form-configure.css +++ /dev/null @@ -1,24 +0,0 @@ -.ui-select input.form-control { - height: 34px; - padding: 6px; -} - -.config-form .btn-secondary { - border-color: #DDDDDD; -} - -.notification-toggle.toggle-switch { - margin: 5px 0; -} - -.ql-picker.ql-placeholder { - width: 118px; -} - -.ql-picker.ql-placeholder > span.ql-picker-label:before { - content: attr(data-before); -} - -.ql-picker.ql-placeholder > span.ql-picker-options > span.ql-picker-item::before { - content: attr(data-label); -} \ No newline at end of file diff --git a/public/modules/forms/admin/css/edit-submissions-view.css b/public/modules/forms/admin/css/edit-submissions-view.css index 57513224..58ff9050 100644 --- a/public/modules/forms/admin/css/edit-submissions-view.css +++ b/public/modules/forms/admin/css/edit-submissions-view.css @@ -1,4 +1,19 @@ - +/*Styles for submission table*/ +.submissions-table .table-outer.row { + margin: 1.5em 0 2em 0!important; +} +.submissions-table .table-outer .col-xs-12 { + padding-left: 0!important; + border:1px solid #ddd; + overflow-x: scroll; + border-radius:3px; +} +.submissions-table .table > thead > tr > th { + min-width:8em; +} +.submissions-table .table > tbody > tr.selected { + background-color:#efefef; +} .analytics .header-title { font-size: 1em; diff --git a/public/modules/forms/admin/css/share-form.css b/public/modules/forms/admin/css/share-form.css new file mode 100644 index 00000000..f3df2b39 --- /dev/null +++ b/public/modules/forms/admin/css/share-form.css @@ -0,0 +1,11 @@ +share-form-directive #copyEmbedded { + min-height: fit-content; + width: 100%; + background-color: #36404B; + color: white; + padding: 18px; +} + +share-form-directive .tab-content { + padding-top: 50px; +} \ No newline at end of file diff --git a/public/modules/forms/admin/directives/share-form.client.directive.js b/public/modules/forms/admin/directives/share-form.client.directive.js index ad8d1536..2ae5657b 100644 --- a/public/modules/forms/admin/directives/share-form.client.directive.js +++ b/public/modules/forms/admin/directives/share-form.client.directive.js @@ -1,7 +1,7 @@ 'use strict'; -angular.module('forms').directive('shareFormDirective', ['$rootScope', - function ($rootScope) { +angular.module('forms').directive('shareFormDirective', ['$rootScope', '$translate', + function ($rootScope, $translate) { return { templateUrl: 'modules/forms/admin/views/directiveViews/form/share-form.client.view.html', restrict: 'E', @@ -10,6 +10,13 @@ angular.module('forms').directive('shareFormDirective', ['$rootScope', }, controller: function($scope){ $scope.actualFormURL = $scope.actualformurl; + + + $scope.fullScreen = ""+ + "
"+ + $translate.instant('POWERED_BY')+ + "TellForm"+ + "
"; } }; } diff --git a/public/modules/forms/admin/views/directiveViews/form/share-form.client.view.html b/public/modules/forms/admin/views/directiveViews/form/share-form.client.view.html index cc795b54..4b71b676 100644 --- a/public/modules/forms/admin/views/directiveViews/form/share-form.client.view.html +++ b/public/modules/forms/admin/views/directiveViews/form/share-form.client.view.html @@ -1,44 +1,40 @@
-
- - -
-
- {{ 'TELLFORM_URL' | translate }} -
-
- -
-
- -
+ + +
+
+ {{ 'TELLFORM_URL' | translate }}
- - -
-
- {{ 'COPY_AND_PASTE' | translate }} -
-
- - - -
-
- -
+
+
- - -
+
+ +
+
+ + +
+
+ {{ 'COPY_AND_PASTE' | translate }} +
+
+ +
+ {{ fullScreen }} +
+ +
+
+ +
+
+ +
\ No newline at end of file