From 2d694f8f1fbd0d8f5691977884e799f99cdad01a Mon Sep 17 00:00:00 2001 From: Thomas Lamprecht Date: Mon, 16 Dec 2019 18:16:05 +0100 Subject: [PATCH] add CSS file for PBS ExtJS6 basic ui some fitting rules copied over from PVE's ext6-pve.css file. simply place it in the css subfolder where the proxmox-backup-gui.js file is hosted and add a "css/" alias for that directory, the formatter gets use the right content type with that. Signed-off-by: Thomas Lamprecht --- src/bin/proxmox-backup-proxy.rs | 1 + src/server/rest.rs | 1 + www/Makefile | 6 ++- www/css/ext6-pbs.css | 74 +++++++++++++++++++++++++++++++++ 4 files changed, 80 insertions(+), 2 deletions(-) create mode 100644 www/css/ext6-pbs.css diff --git a/src/bin/proxmox-backup-proxy.rs b/src/bin/proxmox-backup-proxy.rs index d4513cbc..716c6888 100644 --- a/src/bin/proxmox-backup-proxy.rs +++ b/src/bin/proxmox-backup-proxy.rs @@ -47,6 +47,7 @@ async fn run() -> Result<(), Error> { config.add_alias("fontawesome", "/usr/share/fonts-font-awesome"); config.add_alias("xtermjs", "/usr/share/pve-xtermjs"); config.add_alias("widgettoolkit", "/usr/share/javascript/proxmox-widget-toolkit"); + config.add_alias("css", "/usr/share/javascript/proxmox-backup/css"); let rest_server = RestServer::new(config); diff --git a/src/server/rest.rs b/src/server/rest.rs index 80c594c8..54cef749 100644 --- a/src/server/rest.rs +++ b/src/server/rest.rs @@ -337,6 +337,7 @@ fn get_index(username: Option, token: Option) -> Response + diff --git a/www/Makefile b/www/Makefile index 8cca37f6..64eb867c 100644 --- a/www/Makefile +++ b/www/Makefile @@ -17,7 +17,7 @@ JSSRC= \ Application.js \ MainView.js -all: js/proxmox-backup-gui.js +all: js/proxmox-backup-gui.js css/ext6-pbs.css js: mkdir js @@ -31,10 +31,12 @@ clean: find . -name '*~' -exec rm {} ';' rm -rf js -install: js/proxmox-backup-gui.js +install: js/proxmox-backup-gui.js css/ext6-pbs.css install -dm755 $(DESTDIR)$(JSDIR) install -dm755 $(DESTDIR)$(JSDIR)/js install -m644 js/proxmox-backup-gui.js $(DESTDIR)$(JSDIR)/js/ + install -dm755 $(DESTDIR)$(JSDIR)/css + install -m644 css/ext6-pbs.css $(DESTDIR)$(JSDIR)/css/ install -dm755 $(DESTDIR)$(JSDIR)/images $(foreach i,$(IMAGES), \ install -m644 $(i) $(DESTDIR)$(JSDIR)/images/ ;) diff --git a/www/css/ext6-pbs.css b/www/css/ext6-pbs.css new file mode 100644 index 00000000..183e7c40 --- /dev/null +++ b/www/css/ext6-pbs.css @@ -0,0 +1,74 @@ +/* overwrite to use full black for enabled buttons */ +.x-btn-inner-default-toolbar-small { + font: 300 12px/16px helvetica, arial, verdana, sans-serif; + color: #000; + padding: 0 5px; + max-width: 100%; +} + +/* add missing class for context menu header */ +.x-menu-header { + font: 400 13px/20px 'Open Sans', 'Helvetica Neue', helvetica, arial, verdana, sans-serif; + color: #fff; + padding: 4px; + background-color: #3892d4; +} + +/* make the upper window end visible */ +.x-css-shadow { + box-shadow: rgb(136,136,136) 0px -1px 15px !important; +} + +/* reduce tree space */ +.x-grid-cell-inner-treecolumn { /* vertical padding */ + padding: 4px 0px 3px 0px; +} + +/* horizontal distance between parent and child leaf */ +.x-tree-elbow-img { + width: 14px; +} + +/* adjust horizontal position of menu icons */ +.x-menu-item-icon-default { + top: 5px; + left: 3px; + font-size: 14px; +} + +/* this gives a better placement for the font-awesome icons */ +.x-btn-icon-el-default-toolbar-small { + height: 14px; +} + +/* this icon looks weird in sizes not n*14px */ +.x-btn-icon-el-default-toolbar-small.fa-ellipsis-v { + font-size: 14px; +} + +.x-btn-icon-el-default-small { + height: 14px; + font-size: 14px; +} + +/* displayfield minheight is wrong */ +.x-form-display-field-default { + min-height: 20px; +} + +.x-button-reset:before { + font-size: 16px; +} + +/* for resetcolumnsbutton */ +.x-button-reset:after{ + content: "\f0e7 "; + position: relative; + text-shadow: 0 0 2px #fff; + left: -3px; + top: 2px; +} + +.proxmox-inline-button .x-btn-inner { + color: black; +}