ajuste nos menus do topo da edição dinamica da compilação

sapl-frontend/src/apps/compilacao/scss/compilacao.scss

@@ -175,6 +175,7 @@ a:link:after, a:visited:after {
     list-style: none;
     margin: 4rem 0 3rem;
     padding: 0;
+    justify-content: center;
     ul {
       list-style: none;
       margin: 0;
@@ -189,6 +190,7 @@ a:link:after, a:visited:after {
       background: black;
       height: 2px;
       text-align: center;
+      max-width: 4rem;
       .circle {
         display: block;
         width:  10px;
@@ -689,12 +691,21 @@ a:link:after, a:visited:after {
       font-size: 2rem;
     }
   }
+  .btn-sm {
+    line-height: 1rem;
+  }
+  .btn-outline-primary {
+   background-color: white;
+   &:hover {
+     background-color: #02baf2;
+   }
+  }
 
   .dpt {
     display: block;
     & > .dpt-actions-fixed {
       position: absolute;
-      right: -0.8em;
+      right: -1em;
       top: -0.8em;
       z-index: 3;
       opacity: 0;
@@ -705,7 +716,7 @@ a:link:after, a:visited:after {
       .deactivate {
         display:inline;
       }
-      .btn-dpt-edit.btn-default {
+      .btn-dpt-edit.btn-outline-primary {
         color: #333;
         &:hover {
           color: #fff;
@@ -832,7 +843,7 @@ a:link:after, a:visited:after {
       & > .dpt-actions, & > .dpt-actions-bottom {
         display: table;
         background-color: #e5e5e5;
-        padding: 1em;
+        padding: 0.8rem 0.6rem 0.2rem 0.6rem;
         margin-bottom: 0em;
         width: 100%;
         & > .btn-action {
@@ -884,7 +895,7 @@ a:link:after, a:visited:after {
     }
     & > .dpt-actions-fixed {
       opacity: 1;
-      top: -12px;
+      top: -15px;
       right: 0.5em;
       .activate {
         display:inline;
@@ -893,11 +904,15 @@ a:link:after, a:visited:after {
         display:none;
       }
       .btn-dpt-edit {
-        padding-top: 2px;
+        padding: 0 6px;
-        padding-bottom: 1px;
+        line-height: 1.2rem;
-        &.btn-default {
+        &.btn-outline-primary {
           background-color: #fad46b;
-          border: 1px solid #fad46b;
+          border: 1px solid #444;
+          &:hover {
+            background-color: #fad46b;
+            border: 1px solid #444;
+          }
         }
       }
     }
@@ -906,26 +921,26 @@ a:link:after, a:visited:after {
       &.dropdown-menu-left {
         right: auto !important;
         left: 0;
-        padding: 2px 0;
+        padding: 0;
-        & > .top.arrow {
-          right: 88%;
-          left: auto;
-        }
       }
       li {
+        line-height: 1;
         a {
-          padding-top: 2px;
+          display: block;
-          padding-bottom: 2px;
+          line-height: 1.5rem;
-
+          padding: 0 0.5rem;
+          white-space: nowrap;
+          &:hover {
+            background-color: #f0f0f0;
+          }
         }
       }
     }
     .btn-group {
       .radius-right {
-        border-bottom-right-radius: 4px !important;
+        border-bottom-right-radius: 0.2rem !important;
-        border-top-right-radius: 4px !important;
+        border-top-right-radius: 0.2rem !important;
       }
-
     }
     &:hover {
       & > .dpt-actions-fixed {

sapl/templates/compilacao/ajax_actions_dinamic_edit.html

@@ -1,77 +1,79 @@
 {% load i18n %}
 
-<div class="btn-toolbar float-right" role="toolbar" >
+<div class="d-flex justify-content-between">
-  {% if perms.compilacao.change_dispositivo_registros_compilacao %}
-    {% if object.tipo_dispositivo.dispositivo_de_articulacao and object.tipo_dispositivo.dispositivo_de_alteracao %}
-      <div class="btn-group " role="group">
-        <button type="button" class="btn btn-outline-primary btn-sm btn-compila" pk="{{object.pk}}" action="get_form_revogacao" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
-          {% trans "Registrar Revogação" %}
 
-        </button>
+  <div class="btn-toolbar" role="toolbar" >
-        <button type="button" class="btn btn-outline-primary btn-sm btn-compila" pk="{{object.pk}}" action="get_form_alteracao" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
+    <div class="btn-group dropdown mr-1 btn-group-sm" role="group">
-          {% trans "Registrar Alteração" %}
+      {% if object.dispositivo_subsequente == None %}
-        </button>
+        {% for inserts in allowed_inserts %}
-        <button type="button" class="btn btn-outline-primary btn-sm btn-compila" pk="{{object.pk}}" action="get_form_inclusao" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
+          {% if inserts.itens %}
-          {% trans "Registrar Inclusão" %}
+            <div class="btn-group btn-group-sm mb-2 btn-group-inserts" role="group">
-        </button>
+              <button type="button" class="btn btn-success btn-sm {% if forloop.last %}radius-right{%endif%}" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
+                {{inserts.icone|safe}}<span>{{inserts.tipo_insert}}</span>
+              </button>
+              <ul class="dropdown-menu btn-group-sm dropdown-menu-left">
+                <div class="arrow top"></div>
+                {% for item in inserts.itens %}
+                  <li><a class="btn-inserts btn-action " action="{{inserts.action}}" pk="{{item.dispositivo_base}}" variacao="{{item.variacao}}" tipo_pk="{{item.tipo_pk}}">{{item.provavel|safe}}</a></li>
+                {% endfor %}
+              </ul>
+            </div>
+          {% endif %}
+        {% endfor %}
+      {% endif %}
+    </div>
+
+    <div class="btn-group mr-1 btn-group-sm mb-2" role="group">
+      {% if not object.dispositivo_subsequente %}
+        {% for perfil in perfil_estrutural_list%}
+          <button type="button" class="btn-action btn-perfis btn btn-xs {%if request.session.perfil_estrutural == perfil.pk %}btn-primary{%else%}btn-outline-primary{%endif%}" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"  pk="{{object.pk}}" perfil_pk="{{perfil.pk}}" action="json_get_perfis" title="{{perfil.nome}}">
+            {{perfil.sigla}}
+          </button>
+        {% endfor %}
+      {%endif%}
+    </div>
 
-      </div>
+    {% if perms.compilacao.change_dispositivo_de_vigencia_global %}
-    {%endif%}
+      {% if not object.ta_publicado and not object.dispositivo_subsequente and not object.tipo_dispositivo.dispositivo_de_alteracao%}
-  {% endif %}
+        <div class="btn-group mr-1 btn-group-sm mb-2" role="group">
-  <div class="btn-group " role="group">
+          <button type="button" class="btn-action btn btn-xs {% if object.pk == object.dispositivo_vigencia_id %}btn-primary{%else%}btn-outline-primary{%endif%}"  pk="{{object.pk}}"  action="json_set_dvt" title="{% if object.pk == object.dispositivo_vigencia_id %}{% trans 'Dispositivo de Vigência Atual'%}{%else%}{% trans 'Tornar este o Dispositivo de Vigência de todo o Texto Articulado.'%}{%endif%}">
-    <button type="button" class="btn btn-outline-primary btn-sm radius-right" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
+            DVt
-      <i class="fa fa-edit fa-lg"></i>
+          </button>
-    </button>
+        </div>
-    <ul class="dropdown-menu">
-      <div class="arrow top"></div>
-      <li><a class="btn-editor-type" editortype="construct">Construtor</a></li>
-      <li><a class="btn-editor-type" editortype="textarea">Editor Simples</a></li>
-      <li><a class="btn-editor-type" editortype="tinymce">Editor Tinymce</a></li>
-      {% if perms.compilacao.change_dispositivo_edicao_avancada %}
-        <li><a class="btn-editor-avancado" href="{% url 'sapl.compilacao:dispositivo_edit' object.ta_id object.pk %}" >Editor Avançado</a></li>
       {% endif %}
-    </ul>
+    {% endif %}
   </div>
-</div>
-
-<div class="btn-toolbar" role="toolbar" >
 
-  <div class="btn-group dropdown" role="group">
+  <div class="btn-toolbar" role="toolbar" >
-    {% if object.dispositivo_subsequente == None %}
+    {% if perms.compilacao.change_dispositivo_registros_compilacao %}
-      {% for inserts in allowed_inserts %}
+      {% if object.tipo_dispositivo.dispositivo_de_articulacao and object.tipo_dispositivo.dispositivo_de_alteracao %}
-        {% if inserts.itens %}
+        <div class="btn-group mr-1 btn-group-sm mb-2" role="group">
-          <div class="btn-group btn-group-inserts" role="group">
+          <button type="button" class="btn btn-outline-primary btn-sm btn-compila" pk="{{object.pk}}" action="get_form_revogacao" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true" title="{% trans "Registar Revogação" %}">
-            <button type="button" class="btn btn-success btn-sm {% if forloop.last %}radius-right{%endif%}" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
+            {% trans "Revogação" %}
-              {{inserts.icone|safe}}<span>{{inserts.tipo_insert}}</span>
+          </button>
-            </button>
+          <button type="button" class="btn btn-outline-primary btn-sm btn-compila" pk="{{object.pk}}" action="get_form_alteracao" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true" title="{% trans "Registar Alteração" %}">
+            {% trans "Alteração" %}
+          </button>
+          <button type="button" class="btn btn-outline-primary btn-sm btn-compila" pk="{{object.pk}}" action="get_form_inclusao" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true" title="{% trans "Registar Inclusão" %}">
+            {% trans "Inclusão" %}
+          </button>
+        </div>
+      {%endif%}
+    {% endif %}
 
-            <ul class="dropdown-menu dropdown-menu-left">
+    <div class="btn-group btn-group-sm mb-2" role="group">
-              <div class="arrow top"></div>
+      <button type="button" class="btn btn-outline-primary btn-sm radius-right" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
-              {% for item in inserts.itens %}
+        <i class="fa fa-edit fa-lg"></i>
-                <li><a class="btn-inserts btn-action " action="{{inserts.action}}" pk="{{item.dispositivo_base}}" variacao="{{item.variacao}}" tipo_pk="{{item.tipo_pk}}">{{item.provavel|safe}}</a></li>
+      </button>
-              {% endfor %}
+      <ul class="dropdown-menu">
-            </ul>
+        <div class="arrow top"></div>
-          </div>
+        <li><a class="btn-editor-type" editortype="construct">Construtor</a></li>
+        <li><a class="btn-editor-type" editortype="textarea">Editor Simples</a></li>
+        <li><a class="btn-editor-type" editortype="tinymce">Editor Tinymce</a></li>
+        {% if perms.compilacao.change_dispositivo_edicao_avancada %}
+          <li><a class="btn-editor-avancado" href="{% url 'sapl.compilacao:dispositivo_edit' object.ta_id object.pk %}" >Editor Avançado</a></li>
         {% endif %}
-      {% endfor %}
+      </ul>
-    {% endif %}
+    </div>
   </div>
-  <div class="btn-group " role="group">
-    {% if not object.dispositivo_subsequente %}
-      {% for perfil in perfil_estrutural_list%}
-        <button type="button" class="btn-action btn-perfis btn btn-xs {%if request.session.perfil_estrutural == perfil.pk %}btn-primary{%else%}btn-outline-primary{%endif%}" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"  pk="{{object.pk}}" perfil_pk="{{perfil.pk}}" action="json_get_perfis" title="{{perfil.nome}}">
-          {{perfil.sigla}}
-        </button>
-      {% endfor %}
-    {%endif%}
-  </div>
-  {% if perms.compilacao.change_dispositivo_de_vigencia_global %}
-    {% if not object.ta_publicado and not object.dispositivo_subsequente and not object.tipo_dispositivo.dispositivo_de_alteracao%}
-      <div class="btn-group " role="group">
-        <button type="button" class="btn-action btn btn-xs radius-right {% if object.pk == object.dispositivo_vigencia_id %}btn-primary{%else%}btn-outline-primary{%endif%}"  pk="{{object.pk}}"  action="json_set_dvt" title="{% if object.pk == object.dispositivo_vigencia_id %}{% trans 'Dispositivo de Vigência Atual'%}{%else%}{% trans 'Tornar este o Dispositivo de Vigência de todo o Texto Articulado.'%}{%endif%}">
-          DVt
-        </button>
-      </div>
-    {% endif %}
-  {% endif %}
 </div>

sapl/templates/compilacao/text_edit.html

@@ -55,8 +55,8 @@
   <div class="modal-dialog modal-xs modal-lg" role="document">
     <div class="modal-content">
       <div class="modal-header">
-        <button type="button" class="close" data-dismiss="modal" aria-label="{% trans "Fechar" %}"><span aria-hidden="true">&times;</span></button>
         <h4 class="modal-title" id="myModalLabel">Orientações Gerais <small>Dicas e Boas Práticas</small></h4>
+        <button type="button" class="close" data-dismiss="modal" aria-label="{% trans "Fechar" %}"><span aria-hidden="true">&times;</span></button>
       </div>
       <div class="modal-body">
         {% blocktrans %}

webpack-stats.json

@@ -1 +1 @@
-{"status":"done","publicPath":"/static/","chunks":{"chunk-vendors":[{"name":"css/chunk-vendors.606a90f4.css","publicPath":"/static/css/chunk-vendors.606a90f4.css","path":"../sapl/static/css/chunk-vendors.606a90f4.css"},{"name":"js/chunk-vendors.3e94208e.js","publicPath":"/static/js/chunk-vendors.3e94208e.js","path":"../sapl/static/js/chunk-vendors.3e94208e.js"}],"compilacao":[{"name":"css/compilacao.ec5c90e3.css","publicPath":"/static/css/compilacao.ec5c90e3.css","path":"../sapl/static/css/compilacao.ec5c90e3.css"},{"name":"js/compilacao.36a0ff40.js","publicPath":"/static/js/compilacao.36a0ff40.js","path":"../sapl/static/js/compilacao.36a0ff40.js"}],"global":[{"name":"css/global.8608d5e7.css","publicPath":"/static/css/global.8608d5e7.css","path":"../sapl/static/css/global.8608d5e7.css"},{"name":"js/global.eeba74c5.js","publicPath":"/static/js/global.eeba74c5.js","path":"../sapl/static/js/global.eeba74c5.js"}],"sapl-oficial-theme":[{"name":"js/sapl-oficial-theme.391f1e2f.js","publicPath":"/static/js/sapl-oficial-theme.391f1e2f.js","path":"../sapl/static/js/sapl-oficial-theme.391f1e2f.js"}]}}
+{"status":"done","publicPath":"http://localhost:8080/","chunks":{"compilacao":[{"name":"compilacao.js","publicPath":"http://localhost:8080/compilacao.js","path":"../sapl/static/compilacao.js"},{"name":"compilacao.48a19ffff61168ddc6b7.hot-update.js","publicPath":"http://localhost:8080/compilacao.48a19ffff61168ddc6b7.hot-update.js","path":"../sapl/static/compilacao.48a19ffff61168ddc6b7.hot-update.js"}],"global":[{"name":"global.js","publicPath":"http://localhost:8080/global.js","path":"../sapl/static/global.js"}],"sapl-oficial-theme":[{"name":"sapl-oficial-theme.js","publicPath":"http://localhost:8080/sapl-oficial-theme.js","path":"../sapl/static/sapl-oficial-theme.js"}]},"error":"ModuleBuildError","message":"Module build failed (from ./node_modules/sass-loader/lib/loader.js):\n\n     background-color: $primary;\n                      ^\n      Undefined variable: \"$primary\".\n      in /home/leandro/desenvolvimento/envs/sapl/sapl-frontend/src/apps/compilacao/scss/compilacao.scss (line 700, column 24)"}