SPDT
/
sapl
mirror of https://github.com/interlegis/sapl.git
5
0
Fork 0
Code Issues Releases Wiki Activity
Browse Source

style sheet refactoring

pull/10/head
LeandroRoberto 9 years ago
parent
e77d34c2c6
commit
4421d6bc1d
5 changed files with 113 additions and 73 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 3
      compilacao/views.py
  2. 3
      sapl/settings.py
  3. 16
      static/js/compilacao.js
  4. 154
      static/styles/compilacao.scss
  5. 10
      templates/compilacao/edit_bloco.html

3
compilacao/views.py
View File

@ -74,9 +74,6 @@ tipo_dispositivo_crud = build_crud(
],
[_('Configurações para Renderização de Rótulo e Texto'),
[('rotulo_prefixo_html', 6),
('rotulo_sufixo_html', 6), ],

3
sapl/settings.py
View File

@ -60,7 +60,8 @@ INSTALLED_APPS = (
'sass_processor',
)
if DEBUG:
INSTALLED_APPS += ('debug_toolbar',)
# INSTALLED_APPS += ('debug_toolbar',)
pass
MIDDLEWARE_CLASSES = (
'django.contrib.sessions.middleware.SessionMiddleware',

16
static/js/compilacao.js
View File

@ -3,7 +3,7 @@ var flag_add_next = false;
var flag_add_next_pk = 0;
var flag_add_next_pai = 0;
var editortype = "construct";
var editortype = "textarea";
var onSubmitEditForm = function(event) {
@ -108,15 +108,13 @@ var clickUpdateDispositivo = function(event, __pk, __action, addeditselected) {
$('.csform form').submit(onSubmitEditForm);
}
else if (editortype == 'construct') {
$('.csform .btn-salvar').parent().remove();
$('.csform .btn-salvar, .csform textarea').remove();
// $('#dpt'+flag_add_next_pk).css('min-height', $('.actions_right').height()*1.35 );
$('#dpt'+flag_add_next_pk).css('min-height', $('.actions_right').height()*2);
$('.actions_inserts').addClass('menu_fixo');
}
$(".edt-"+editortype).addClass('selected');
/*if (_action != null && _action != 'refresh')
$("a.btn-action[pk='"+_pk+"']").css('background-color', '#000000');
*/
if (addeditselected == null || addeditselected) {
$('#dpt'+flag_add_next_pk).addClass('dpt-selected');
$('html, body').animate({
@ -160,14 +158,14 @@ var clickUpdateDispositivo = function(event, __pk, __action, addeditselected) {
function clearEditSelected() {
tinymce.remove();
$('.dpt-selected').removeClass('dpt-selected');
$('.dpt').css('min-height', '');
$('.csform').remove();
}
function reloadFunctionClicks() {
$('.dpt .de, .btn-action, .btn-inserts').off();
$('.dpt .de, .btn-action, .btn-inserts, .btn-edit').off();
$('.dpt .de, .btn-edit').on(
'click', clickEditDispositivo);
$('.dpt .de, .btn-edit').on('click', clickEditDispositivo);
$('.btn-action, .btn-inserts').on(
'click', clickUpdateDispositivo);
@ -199,6 +197,6 @@ $(document).ready(function() {
reloadFunctionClicks();
$("#message_block").css("display", "none");
clickUpdateDispositivo(null, 64941, 'refresh', true);
clickUpdateDispositivo(null, 216879, 'refresh', true);
});

154
static/styles/compilacao.scss
View File

@ -39,6 +39,7 @@ $color_actions_border: #ddd;
box-shadow: 0 1px 2px #999;
}
}
.page {
background-color: #f0f0f0;
}
@ -242,7 +243,7 @@ $color_actions_border: #ddd;
& > .actions_left {
color: #fff;
position: absolute;
left: -2.2em;
left: -2em;
opacity: 0;
transition: all 0.4s ease-in-out;
a {
@ -251,7 +252,7 @@ $color_actions_border: #ddd;
@include border-radius(7px);
color: #ffffff !important;
font-weight: bold;
padding: 2px 6px 2px 7px;
padding: 2px 7px 2px 7px;
&:hover {
@include background-top-down(#3cb0fd, #3498DB);
@ -288,7 +289,6 @@ $color_actions_border: #ddd;
*:hover {
background-color: #eee;
}
}
.articulacao{
margin-left: -0.8em;
@ -305,9 +305,12 @@ $color_actions_border: #ddd;
}
.dpt-selected {
border: 2.2em solid #eee;
font-size: 1em;
border: 1px solid #aabbcc;
margin: 1em -2em 1em -2.8em;
box-shadow: 0 2px 2px #aaa;
padding: 2.2em 2.2em 1.6em 2.2em;
background: #eee;
box-shadow: 0px 10px 18px rgba(0, 0, 0, 0.19), 0px 2px 6px rgba(0, 0, 0, 0.23);
ul {
list-style: none;
@ -317,14 +320,31 @@ $color_actions_border: #ddd;
.bloco {
opacity: 0.5;
&:hover {
opacity: 1;
}
a:hover {
background: transparent;
}
}
& > .bloco {
padding: 1em;
opacity: 1;
margin: 0 !important;
}
& > .dpt {
padding: 0 1em;
&:last-child {
padding-bottom: 1em;
border-bottom: 1px solid black;
}
}
& > .actions_left {
display: none;
}
.csform { /* compilacao simple form */
@ -340,18 +360,17 @@ $color_actions_border: #ddd;
a {
color: $color_actions;
display: block;
font-size: 1em;
background-image: none;
background-color: transparent;
background: transparent;
vertical-align: middle;
line-height: 2.2em;
min-width: 2.2em;
text-align: center;
font-weight: normal;
text-shadow: 0 0 10px rgba(0,0,0,0.3);
padding: 0.33em 0.4em;
}
& > li {
position: relative;
display: table-cell;
vertical-align: top;
&:hover {
background-color: rgba(0,0,0,0.1);
& > a {
@ -363,16 +382,26 @@ $color_actions_border: #ddd;
}
}
.label_status {
position: absolute;
bottom: 0;
right: 0;
color: #889;
padding: 0.3em;
font-size: 80%;
text-align: right;
z-index: 5;
}
.actions_parents {
height: 2.2em;
top: -2.2em;
left: -2.2em;
z-index: 1;
top: 0em;
left: 0em;
a {
padding: 0.2em 0.4em;
text-shadow: 0 0 5px rgba(0,0,0,0.3);
padding: 0.62em;
}
div, li {
font-size: 0.8em;
font-size: 80%;
display: table-cell;
vertical-align: middle;
border-right: 1px solid #ccc;
@ -384,48 +413,48 @@ $color_actions_border: #ddd;
& > li {
&:hover a{
color: $color_actions;
text-shadow: 0 0 0px #777;
font-weight: normal;
}
}
}
.label_status {
position: absolute;
bottom: -2.5em;
right: -1.8em;
color: #889;
padding: 0.3em 0;
font-size: 0.8em;
}
.actions_top {
top: -2.2em;
top: 0em;
right: 0em;
a {
padding-right: 1em;
padding-left: 1em;
}
li {
display: table-cell;
vertical-align: middle;
border-left: 1px solid $color_actions_border;
&:last-child {
border-right: 1px solid $color_actions_border;
}
}
}
.actions_bottom {
@extend .actions_top;
top: auto;
right: auto;
left: 0em;
bottom: -2.2em;
left: 0;
bottom: 0;
display: inline-block;
a {
padding: 0 0.4em;
}
li {
border: 0px;
border-right: 1px solid $color_actions_border;
border-top: 1px solid $color_actions_border;
}
}
.actions_right {
top: 0em;
right: -2.2em;
top: 2.2em;
right: 0em;
bottom:0;
display: block;
li {
width: 2.2em;
display: block;
border-bottom: 1px solid $color_actions_border;
&:first-child {
@ -437,39 +466,39 @@ $color_actions_border: #ddd;
.actions_left {
@extend .actions_right;
right: auto;
left: -2.2em;
left: 0em;
}
.actions_inserts {
background: transparent;
position: relative;
z-index: 9;
display: table;
width: 100%;
li, li:hover {
background: transparent;
background: #2980C9;
a {
background: #2980C9;
background-image: none;
vertical-align: top;
text-shadow: 0 0 0;
color: #fff;
font-weight: normal;
white-space: nowrap;
min-height: 2.4em;
&:hover {
background-color: #196aad;
background: #1770ba;
text-shadow: 0 0 0;
color: #fff;
color: #ffd145;
font-weight: normal;
}
}
}
& > li {
background: #3385CA;
display: table-cell;
table-layout: auto;
vertical-align: middle;
border-right: 1px solid white;
vertical-align: top;
border-right: 1px solid #eee;
&:hover > ul {
display: block;
@ -477,17 +506,25 @@ $color_actions_border: #ddd;
&:last-child {
border-right: 0px;
}
&:only-child {
display: inline-block;
float: right;
}
& > ul {
display: none;
position:absolute;
box-shadow: 0px 6px 18px rgba(0, 0, 0, 0.19), 0px 2px 6px rgba(0, 0, 0, 0.23);
a {
text-align: left;
font-size: 0.8em;
padding: 0 0.5em;
font-size: 80%;
padding: 0.3em 1em;
white-space: nowrap;
}
li:nth-child(even) {
background: #3385CA;
}
}
span {
@ -496,11 +533,12 @@ $color_actions_border: #ddd;
& > a {
@include background-top-down(#3498DB, #2980C9);
&.btn-excluir {
text-align: left;
background: #A70808;
color: #c99;
padding-left: 1.5em;
padding-left: 1.7em;
&:hover {
background-color: #c70808;
color: #ecc;
@ -508,13 +546,12 @@ $color_actions_border: #ddd;
&::before {
z-index: 10;
position: absolute;
background: url(/static/img/icon_delete_white.png) no-repeat 0 50%;
background: url(/static/img/icon_delete_white.png) no-repeat 50% 50%;
content:"";
top: 0;
left: 0;
display: block;
color: black;
margin-top: 0.05em;
margin-left: 0.6em;
height: 2em;
width: 2em;
@ -525,7 +562,6 @@ $color_actions_border: #ddd;
background: #1f8b4d;
color: white;
padding-left: 1.7em;
&:hover {
background: #2d9c5c;
color: white;
@ -536,12 +572,13 @@ $color_actions_border: #ddd;
}
}
} /* fim li de primeiro nivel*/
} /* fim actions_inserts*/
.menu_fixo {
& > li {
vertical-align: top;
background-color: transparent;
background: transparent !important;
& > ul {
display: block;
position: relative;
@ -568,7 +605,10 @@ $color_actions_border: #ddd;
resize: vertical;
min-height: 12.6em;
border: 0px;
border-bottom: 2px #ccc solid;
font-size: 120%;
&:focus {
background: #fff;
}
&::-webkit-input-placeholder {
color: #c70808;
opacity: 0.6;
@ -621,10 +661,10 @@ $color_actions_border: #ddd;
.csform {
.actions_parents, .label_status {
font-size: 0.7em;
font-size: 80%;
position:static !important;
display: block !important;
padding-bottom: 1em;
padding: 0em;
height: auto !important;
div, li {
display: inline-block !important;

10
templates/compilacao/edit_bloco.html
View File

@ -13,6 +13,7 @@
<div class="dpt" id="dpt{{dpt.pk}}" pk="{{dpt.pk}}">
{% endif%}
{% if view|render_actions_head:dpt %}
<div class="csform">
<form method="post" action="" action_ajax="{{dpt.pk}}/refresh">
@ -33,12 +34,15 @@
<li><a class="btn-right btn-action" pk="{{dpt.pk}}" action="refresh" title="{% trans 'TODO: Descer uma posição com todos os subniveis'%}">&#8650;</a></li>
</ul>
<ul class="btns-action actions_bottom">
<li><a class="btn-bottom btn-action" pk="{{dpt.pk}}" title="Button Bottom">BB</a></li>
</ul>
<ul class="btns-action actions_left">
<li><a class="btn-left btn-action" pk="{{dpt.pk}}" title="Button Left">BL</a></li>
<li><a class="btn-left btn-action" pk="{{dpt.pk}}" title="Button Left">BL</a></li>
</ul>
<ul class="btns-action actions_bottom">
<li><a class="btn-bottom btn-action" pk="{{dpt.pk}}" title="Button Bottom">BB</a></li>
<li><a class="btn-bottom btn-action" pk="{{dpt.pk}}" title="Button Bottom">BB</a></li>
</ul>
<ul class="btns-action actions_inserts {% if dpt.tipo_dispositivo.dispositivo_de_articulacao %}menu_fixo{%endif%}">

Write Preview
Loading…
Cancel
Save