[checkmk-commits] Fixed broken icon and styling of profile replication

Module: check_mk Branch: master Commit: 3a6296489b64cf2d81d20e29914314f9a620dff7 URL: http://git.mathias-kettner.de/git/?p=check_mk.git;a=commit;h=3a6296489b64cf… Author: Lars Michelsen <lm(a)mathias-kettner.de> Date: Wed Feb 27 09:17:56 2019 +0100 Fixed broken icon and styling of profile replication Change-Id: I8f851ea265783dfb63159c07775d5bd08bde56cc --- cmk/gui/wato/user_profile.py | 3 +-- web/htdocs/js/modules/profile_replication.js | 6 ++--- web/htdocs/themes/classic/scss/_check_mk.scss | 4 ++-- web/htdocs/themes/classic/scss/_wato.scss | 34 ++++++++++++++++++++++++++- web/htdocs/themes/facelift/scss/_main.scss | 6 +++++ 5 files changed, 45 insertions(+), 8 deletions(-) diff --git a/cmk/gui/wato/user_profile.py b/cmk/gui/wato/user_profile.py index e23c708..ce37acf 100644 --- a/cmk/gui/wato/user_profile.py +++ b/cmk/gui/wato/user_profile.py @@ -82,8 +82,7 @@ def user_profile_async_replication_dialog(sites): icon = 'repl_pending' html.open_div(class_="site", id_="site-%s" % site_id) - - html.icon(status_txt, icon) + html.div("", title=status_txt, class_=["icon", "repl_status", icon]) if start_sync: changes_manager = watolib.ActivateChanges() changes_manager.load() diff --git a/web/htdocs/js/modules/profile_replication.js b/web/htdocs/js/modules/profile_replication.js index ba72e0f..43377b0 100644 --- a/web/htdocs/js/modules/profile_replication.js +++ b/web/htdocs/js/modules/profile_replication.js @@ -60,9 +60,9 @@ export function start(siteid, est, progress_text) { } function set_status(siteid, image, text) { - var oImg = document.getElementById("site-" + siteid).childNodes[0]; - oImg.title = text; - oImg.src = "images/icon_"+image+".png"; + var icon = document.getElementById("site-" + siteid).getElementsByClassName("repl_status")[0]; + icon.title = text; + icon.className = "icon repl_status " + image; } export function step(siteid, est, progress_text) { diff --git a/web/htdocs/themes/classic/scss/_check_mk.scss b/web/htdocs/themes/classic/scss/_check_mk.scss index 456ae47..773ca47 100644 --- a/web/htdocs/themes/classic/scss/_check_mk.scss +++ b/web/htdocs/themes/classic/scss/_check_mk.scss @@ -326,13 +326,13 @@ input:hover, select:hover, textarea:hover { browser. That way if you select a zoom level in the browser, the quality of the images are better */ -img.icon { +img.icon, div.icon { width: 20px; height: 20px; } a.inline img.icon, -img.icon.inline { +img.icon.inline, div.icon { vertical-align: middle; width: 16px; height: 16px; diff --git a/web/htdocs/themes/classic/scss/_wato.scss b/web/htdocs/themes/classic/scss/_wato.scss index c72d7f7..7990b44 100644 --- a/web/htdocs/themes/classic/scss/_wato.scss +++ b/web/htdocs/themes/classic/scss/_wato.scss @@ -1395,10 +1395,42 @@ table.nform.rulesettings td.legend div.title { text-overflow: ellipsis; } -#profile_repl .site img, #profile_repl .site span { +#profile_repl div.site div, #profile_repl div.site span { vertical-align: middle; + display: inline-block; +} + +#profile_repl div.repl_status { + background-size: contain; +} + +#profile_repl div.repl_locked { + background-image: url(images/icon_repl_locked.png); +} + +#profile_repl div.repl_pending { + background-image: url(images/icon_repl_pending.png); +} + +#profile_repl div.repl_failed { + background-image: url(images/icon_repl_failed.png); +} + +#profile_repl div.repl_25 { + background-image: url(images/icon_repl_25.png); +} + +#profile_repl div.repl_50 { + background-image: url(images/icon_repl_50.png); +} + +#profile_repl div.repl_75 { + background-image: url(images/icon_repl_75.png); } +#profile_repl div.repl_success { + background-image: url(images/icon_success.png); +} .wato table.data.check_catalog td.title { width: 500px; diff --git a/web/htdocs/themes/facelift/scss/_main.scss b/web/htdocs/themes/facelift/scss/_main.scss index 6974e83..f3c6f30 100644 --- a/web/htdocs/themes/facelift/scss/_main.scss +++ b/web/htdocs/themes/facelift/scss/_main.scss @@ -1767,3 +1767,9 @@ img.glass { display: block; } #hover_menu .graph_container div.time { letter-spacing: 0px; } + +#profile_repl .site { + box-shadow: none; + background: $theme-color-white; + border: 1px solid $theme-color-table-border; +}