tyler/proxmox-backup
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

add CSS file for PBS ExtJS6 basic ui

Browse Source 
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 <t.lamprecht@proxmox.com>
This commit is contained in:
Thomas Lamprecht 2019-12-16 18:16:05 +01:00 committed by Dietmar Maurer
parent 25cdd0e0a1
commit 2d694f8f1f
4 changed files with 80 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/bin/proxmox-backup-proxy.rs
View File

@ -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);

1
src/server/rest.rs
View File

@ -337,6 +337,7 @@ fn get_index(username: Option<String>, token: Option<String>) -> Response<Body>
<link rel="stylesheet" type="text/css" href="/extjs/theme-crisp/resources/theme-crisp-all.css" />
<link rel="stylesheet" type="text/css" href="/extjs/crisp/resources/charts-all.css" />
<link rel="stylesheet" type="text/css" href="/fontawesome/css/font-awesome.css" />
<link rel="stylesheet" type="text/css" href="/css/ext6-pbs.css" />
<script type='text/javascript'> function gettext(buf) {{ return buf; }} </script>
<script type="text/javascript" src="/extjs/ext-all-debug.js"></script>
<script type="text/javascript" src="/extjs/charts-debug.js"></script>

6
www/Makefile
View File

@ -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/ ;)

74
www/css/ext6-pbs.css Normal file
View File

@ -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;
}