diff options
author | Simo Sorce <simo@redhat.com> | 2014-11-06 14:01:04 -0500 |
---|---|---|
committer | Patrick Uiterwijk <puiterwijk@redhat.com> | 2014-11-12 23:48:02 +0100 |
commit | dc9f4a30a47cdce1e0070c18398351ea6c307305 (patch) | |
tree | 19ddbaa13ca9903098e48a8b9a7157ba3e0497e3 /templates | |
parent | 0034ad1215de99fc13e9dc57bc652cfb8eeb58ae (diff) | |
download | ipsilon-dc9f4a30a47cdce1e0070c18398351ea6c307305.tar.gz ipsilon-dc9f4a30a47cdce1e0070c18398351ea6c307305.tar.xz ipsilon-dc9f4a30a47cdce1e0070c18398351ea6c307305.zip |
Add visual cues to configuration panels
Make it easier to recognize which plugins are enabled and which are
disabled. Also make it easier to recognize when a plugin has just changed
state, by flashing its row (help also realize it may have moved up/down)
Based on concept work by Petr Vobornik
Signed-off-by: Simo Sorce <simo@redhat.com>
Reviewed-by: Patrick Uiterwijk <puiterwijk@redhat.com>
Diffstat (limited to 'templates')
-rw-r--r-- | templates/admin/plugins.html | 33 | ||||
-rw-r--r-- | templates/admin/providers.html | 62 |
2 files changed, 49 insertions, 46 deletions
diff --git a/templates/admin/plugins.html b/templates/admin/plugins.html index 7ef50a0..54462b7 100644 --- a/templates/admin/plugins.html +++ b/templates/admin/plugins.html @@ -15,21 +15,27 @@ </div> </div> - <table class="table"> {% for p in enabled %} - <tr><td> - <div class="row"> + {% set highlight = "hl-enabled" %} + {% if p in changed %} + {% if changed[p] == 'enabled' %} + {% set highlight = "hl-enabled-new" %} + {% elif changed[p] == 'reordered' %} + {% set highlight = "hl-enabled-flash" %} + {% endif %} + {% endif %} + <div class="row ipsilon-row {{ highlight }}"> <div class="col-md-3 col-sm-3 col-xs-5"> - <strong>{{ p }}</strong> + <p><strong>{{ p }}</strong></p> </div> <div class="col-md-7 col-sm-7 col-xs-5"> <div class="row"> <div class="col-md-6 col-sm-6 col-xs-12"> - <a class="text-info" href="{{ baseurl }}/disable/{{ p }}">Disable</a> + <p class="text-info"><a href="{{ baseurl }}/disable/{{ p }}">Disable</a></p> </div> <div class="col-md-6 col-sm-6 col-xs-12"> {%- if available[p].get_config_obj() %} - <a class="text-primary" href="{{ baseurl }}/{{ p }}">Configure</a> + <p class="text-primary"><a href="{{ baseurl }}/{{ p }}">Configure</a></p> {% endif %} </div> </div> @@ -73,12 +79,16 @@ {%- endif %} </div> </div> - </td></tr> {% endfor %} {% for p in available if not p in enabled %} - <tr><td> - <div class="row"> + {% set highlight = "hl-disabled" %} + {% if p in changed %} + {% if changed[p] == 'disabled' %} + {% set highlight = "hl-disabled-new" %} + {% endif %} + {% endif %} + <div class="row ipsilon-row {{ highlight }}"> <div class="col-md-3 col-sm-3 col-xs-5"> <strong>{{ p }}</strong> </div> @@ -97,12 +107,7 @@ <div class="col-md-2 col-sm-2 col-xs-1"> </div> </div> - </td></tr> {% endfor %} - <tr><td> - </td></tr> - </table> - {% endif %} {% endblock %} diff --git a/templates/admin/providers.html b/templates/admin/providers.html index 333b10d..a0ca765 100644 --- a/templates/admin/providers.html +++ b/templates/admin/providers.html @@ -15,58 +15,56 @@ </div> </div> - <hr> - - {% for p in enabled %} - <div class="row"> + {% for p in available %} + {%- if p in enabled %} + {%- set highlight = "hl-enabled" %} + {%- set actpath = "disable" %} + {%- set actlabel = "Disable" %} + {%- if p in changed %} + {%- if changed[p] == 'enabled' %} + {%- set highlight = "hl-enabled-new" %} + {%- endif %} + {%- endif %} + {%- else %} + {%- set highlight = "hl-disabled" %} + {%- set actpath = "enable" %} + {%- set actlabel = "Enable" %} + {%- if p in changed %} + {%- if changed[p] == 'disabled' %} + {%- set highlight = "hl-disabled-new" %} + {%- endif %} + {%- endif %} + {%- endif %} + <div class="row ipsilon-row {{ highlight }}"> <div class="col-md-3 col-sm-3 col-xs-6"> <p><strong>{{ p }}</strong></p> </div> <div class="col-md-9 col-sm-9 col-xs-6"> <div class="row"> <div class="col-md-4 col-sm-4 col-xs-12"> - <p class="text-info"><a href="{{ baseurl }}/disable/{{ p }}">Disable</a></p> + <p class="text-info"><a href="{{ baseurl }}/{{ actpath }}/{{ p }}">{{ actlabel }}</a></p> </div> <div class="col-md-4 col-sm-4 col-xs-12"> {%- if available[p].get_config_obj() %} + {%- if p in enabled %} <p class="text-primary"><a href="{{ baseurl }}/{{ p }}">Configure</a></p> - {% endif %} - </div> - <div class="col-md-4 col-sm-4 col-xs-12"> - {%- if available[p].admin %} - <p class="text-primary"><a href="{{ baseurl }}/{{ p }}/admin">Manage</a></p> - {% endif %} - </div> - </div> - </div> - </div> - <hr> - {% endfor %} - - {% for p in available if not p in enabled %} - <div class="row"> - <div class="col-md-3 col-sm-3 col-xs-6"> - <p><strong>{{ p }}</strong></p> - </div> - <div class="col-md-9 col-sm-9 col-xs-6"> - <div class="row"> - <div class="col-md-4 col-sm-4 col-xs-12"> - <p class="text-info"><a href="{{ baseurl }}/enable/{{ p }}">Enable</a></p> - </div> - <div class="col-md-4 col-sm-4 col-xs-12"> - {%- if available[p].get_config_obj() %} + {%- else %} <p class="text-muted">Configure</p> - {% endif %} + {%- endif %} + {%- endif %} </div> <div class="col-md-4 col-sm-4 col-xs-12"> {%- if available[p].admin %} + {%- if p in enabled %} + <p class="text-primary"><a href="{{ baseurl }}/{{ p }}/admin">Manage</a></p> + {%- else %} <p class="text-muted">Manage</p> + {%- endif %} {% endif %} </div> </div> </div> </div> - <hr> {% endfor %} {% endif %} |