[Kimchi-devel] [PATCH] [Kimchi] Fixed "Add Template" modal window alignment

[Socorro Stoppler]

Reviewed-by: Socorro Stoppler <socorro at linux.vnet.ibm.com>
Tested-by: Socorro Stoppler <socorro at linux.vnet.ibm.com>

On 05/11/2016 05:25 AM, sguimaraes943 at gmail.com wrote:
> From: Samuel Guimarães <sguimaraes943 at gmail.com>
>
> Minor alignment issues with kimchi.css and Add Template modal html
>
> Signed-off-by: Samuel Guimarães <sguimaraes943 at gmail.com>
> ---
>   ui/css/kimchi.css                     | 18 +++++++++++++++++-
>   ui/css/src/modules/_templates.scss    | 16 +++++++++++++++-
>   ui/js/src/kimchi.template_add_main.js |  2 +-
>   ui/pages/template-add.html.tmpl       | 17 ++++++-----------
>   4 files changed, 39 insertions(+), 14 deletions(-)
>
> diff --git a/ui/css/kimchi.css b/ui/css/kimchi.css
> index e7bed2e..49ea39a 100644
> --- a/ui/css/kimchi.css
> +++ b/ui/css/kimchi.css
> @@ -1462,6 +1462,14 @@ body.wok-gallery {
>     margin: 15px 0 0;
>   }
>   
> +#template-edit-window label.check-all {
> +  margin: 0 !important;
> +  padding: 0 !important;
> +  width: 100px;
> +  display: inline-block;
> +  vertical-align: middle;
> +}
> +
>   #template-edit-window .hide {
>     display: none;
>   }
> @@ -1655,7 +1663,6 @@ body.wok-gallery {
>   
>   #template-add-window.modal-content button#iso-more,
>   #template-add-window.modal-content button#iso-more-loading {
> -  margin-bottom: 17px;
>     clear: both;
>   }
>   
> @@ -1667,10 +1674,19 @@ body.wok-gallery {
>     left: 0;
>   }
>   
> +#template-add-window .check-all {
> +  margin-right: 0 !important;
> +  padding-left: 0 !important;
> +}
> +
>   #template-add-window .filter {
> +  width: 977px;
>     height: 40px;
>     overflow: visible;
>     clear: both;
> +  margin-bottom: 0;
> +  display: inline-block;
> +  vertical-align: middle;
>   }
>   
>   #template-add-window .pull-right .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
> diff --git a/ui/css/src/modules/_templates.scss b/ui/css/src/modules/_templates.scss
> index ad76d0f..04bcadc 100644
> --- a/ui/css/src/modules/_templates.scss
> +++ b/ui/css/src/modules/_templates.scss
> @@ -47,6 +47,13 @@
>       form {
>           margin: 15px 0 0;
>       }
> +    label.check-all {
> +        margin: 0 !important;
> +        padding: 0 !important;
> +        width: 100px;
> +        display: inline-block;
> +        vertical-align: middle;
> +    }
>       .hide {
>           display: none;
>       }
> @@ -208,7 +215,6 @@
>       }
>       &.modal-content button#iso-more,
>       &.modal-content button#iso-more-loading {
> -        margin-bottom: 17px;
>           clear: both;
>       }
>       &.modal-content div#iso-remote-box {
> @@ -217,10 +223,18 @@
>       &.modal-content div#iso-local-box {
>           left: 0;
>       }
> +    .check-all {
> +        margin-right: 0 !important;
> +        padding-left: 0 !important;
> +    }
>       .filter {
> +         width: 977px;
>           height: 40px;
>           overflow: visible;
>           clear: both;
> +        margin-bottom: 0;
> +        display: inline-block;
> +        vertical-align: middle;
>       }
>       .pull-right .bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
>           width: 133px;
> diff --git a/ui/js/src/kimchi.template_add_main.js b/ui/js/src/kimchi.template_add_main.js
> index 88d26e2..38a8f5b 100644
> --- a/ui/js/src/kimchi.template_add_main.js
> +++ b/ui/js/src/kimchi.template_add_main.js
> @@ -167,7 +167,7 @@ kimchi.template_add_main = function() {
>       };
>   
>       var setupFilters = function() {
> -        $('input#template-add-iso-filter', '#form-template-add').on('keyup', function() {
> +        $('input#template-add-iso-filter', '#template-filter').on('keyup', function() {
>               filterISOs("all", $(this).val());  // Default to 'all' for now
>           });
>       };
> diff --git a/ui/pages/template-add.html.tmpl b/ui/pages/template-add.html.tmpl
> index 2a8fdb7..cecead7 100644
> --- a/ui/pages/template-add.html.tmpl
> +++ b/ui/pages/template-add.html.tmpl
> @@ -50,20 +50,15 @@
>   
>                                   <!-- 1-1-1 -->
>                                   <div id="local-iso-field" class="iso-field" style="display: none;">
> -                                    <form id="form-template-add">
> -                                        <div class="filter">
> -                                            <div class="form-group pull-right">
> -                                                <input type="text" class="form-control" id="template-add-iso-filter" placeholder="$_("Filter")" />
> -                                            </div>
> -                                        </div>
> -                                    </form>
>                                       <div class="row">
>                                           <p>$_("The following ISOs are available:")</p>
>                                       </div>
> -                                    <div class="checkbox">
> -                                        <label class="check-all">
> -                                            <input type="checkbox" id="select-all-local-iso">$_("All")
> -                                        </label>
> +                                    <div class="checkbox row">
> +                                        <input type="checkbox" class="wok-checkbox" id="select-all-local-iso">
> +                                        <label class="check-all" for="select-all-local-iso">$_("All")</label>
> +                                        <div id="template-filter" class="form-group filter">
> +                                                <input type="text" class="form-control" id="template-add-iso-filter" placeholder="$_("Filter")" />
> +                                        </div>
>                                       </div>
>                                       <div class="row" id="isoRow">
>                                           <form id="form-local-iso">