Skip to content

Commit 49e1745

Browse files
jsaq007ignapas
jsaq007
and
ignapas
authored
🎨 App design and Web presence alignment (ITISFoundation#5065)
Co-authored-by: Ignacio Pascual <4764217+ignapas@users.noreply.github.com>
1 parent 4708085 commit 49e1745

37 files changed

+224
-82
lines changed

‎services/static-webserver/client/source/class/osparc/About.js

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -94,7 +94,7 @@ qx.Class.define("osparc.About", {
9494
contentPaddingLeft: 0,
9595
barPosition: "top"
9696
});
97-
tabView.getChildControl("pane").setBackgroundColor("background-main-2");
97+
tabView.getChildControl("pane").setBackgroundColor("transparent_overlay");
9898
this.add(tabView, {
9999
flex: 1
100100
});
@@ -113,8 +113,7 @@ qx.Class.define("osparc.About", {
113113
layout.setColumnFlex(0, 1);
114114
layout.setColumnFlex(1, 1);
115115
const tabPage = new qx.ui.tabview.Page(title).set({
116-
layout,
117-
backgroundColor: "background-main-2"
116+
layout
118117
});
119118
return tabPage;
120119
},

‎services/static-webserver/client/source/class/osparc/auth/LoginPage.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -62,7 +62,7 @@ qx.Class.define("osparc.auth.LoginPage", {
6262
control = new osparc.ui.basic.LogoWPlatform();
6363
control.setSize({
6464
width: 300,
65-
height: 120
65+
height: 90
6666
});
6767
control.setFont("text-18");
6868
this.getChildControl("main-layout").add(control);
@@ -133,7 +133,7 @@ qx.Class.define("osparc.auth.LoginPage", {
133133
this.getContentElement().setStyles({
134134
"background-image": backgroundImage,
135135
"background-repeat": "no-repeat",
136-
"background-size": "auto 85%", // auto width, 85% height
136+
"background-size": "auto 100%", // auto width, 85% height
137137
"background-position": "0% 100%" // left bottom
138138
});
139139
},

‎services/static-webserver/client/source/class/osparc/auth/LoginPageS4L.js

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,7 @@ qx.Class.define("osparc.auth.LoginPageS4L", {
2929
const layout = new qx.ui.layout.HBox();
3030
this._setLayout(layout);
3131

32-
this.setBackgroundColor("#025887");
32+
this.setBackgroundColor("primary-background-color");
3333

3434
this._removeAll();
3535

@@ -54,20 +54,20 @@ qx.Class.define("osparc.auth.LoginPageS4L", {
5454
let backgroundImage = "";
5555
switch (osparc.product.Utils.getProductName()) {
5656
case "s4llite":
57-
backgroundImage = "url(resource/osparc/s4llite_splitimage.png)";
57+
backgroundImage = "url(resource/osparc/Sim4Life_login_page_master_transparent_bg.png)";
5858
break;
5959
case "s4lacad":
60-
backgroundImage = "url(resource/osparc/s4lacad_splitimage.png)";
60+
backgroundImage = "url(resource/osparc/Sim4Life_login_page_master_transparent_bg.png)";
6161
break;
6262
case "s4ldesktop":
63-
backgroundImage = "url(resource/osparc/s4ldesktop_splitimage.png)";
63+
backgroundImage = "url(resource/osparc/Sim4Life_login_page_master_transparent_bg.png)";
6464
break;
6565
case "s4ldesktopacad":
66-
backgroundImage = "url(resource/osparc/s4ldesktopacad_splitimage.png)";
66+
backgroundImage = "url(resource/osparc/Sim4Life_login_page_master_transparent_bg.png)";
6767
break;
6868
case "s4l":
6969
default:
70-
backgroundImage = "url(resource/osparc/s4l_splitimage.png)";
70+
backgroundImage = "url(resource/osparc/Sim4Life_login_page_master_transparent_bg.png)";
7171
break;
7272
}
7373
this._setBackgroundImage(backgroundImage);

‎services/static-webserver/client/source/class/osparc/dashboard/GridButtonBase.js

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -129,13 +129,11 @@ qx.Class.define("osparc.dashboard.GridButtonBase", {
129129
},
130130
TSR: {
131131
row: 2,
132-
column: 0,
133-
colSpan: 2
132+
column: 0
134133
},
135134
HITS: {
136135
row: 2,
137-
column: 2,
138-
colSpan: 2
136+
column: 2
139137
},
140138
UPDATES: {
141139
row: 0,

‎services/static-webserver/client/source/class/osparc/dashboard/GridButtonItem.js

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -78,7 +78,10 @@ qx.Class.define("osparc.dashboard.GridButtonItem", {
7878
break;
7979
case "tags":
8080
control = new qx.ui.container.Composite(new qx.ui.layout.Flow(5, 3)).set({
81-
anonymous: true
81+
anonymous: true,
82+
paddingLeft: osparc.dashboard.GridButtonBase.PADDING,
83+
paddingRight: osparc.dashboard.GridButtonBase.PADDING,
84+
paddingBottom: osparc.dashboard.GridButtonBase.PADDING / 2
8285
});
8386
this._mainLayout.add(control, osparc.dashboard.GridButtonBase.POS.TAGS);
8487
break;

‎services/static-webserver/client/source/class/osparc/dashboard/ResourceMoreOptions.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,6 @@ qx.Class.define("osparc.dashboard.ResourceMoreOptions", {
5252

5353
createPage: function(title, widget, icon, id) {
5454
const tabPage = new qx.ui.tabview.Page().set({
55-
backgroundColor: "background-main-2",
5655
paddingLeft: 20,
5756
layout: new qx.ui.layout.VBox(10),
5857
icon: icon + "/24"

‎services/static-webserver/client/source/class/osparc/dashboard/SearchBarFilter.js

Lines changed: 6 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -26,12 +26,12 @@ qx.Class.define("osparc.dashboard.SearchBarFilter", {
2626
this._setLayout(new qx.ui.layout.HBox(5));
2727

2828
this.set({
29-
backgroundColor: "background-main-2",
29+
backgroundColor: "input_background",
3030
paddingLeft: 6,
3131
height: 36
3232
});
3333
this.getContentElement().setStyles({
34-
"border-radius": "8px"
34+
"border-radius": "5px"
3535
});
3636

3737
this.__buildLayout();
@@ -92,12 +92,15 @@ qx.Class.define("osparc.dashboard.SearchBarFilter", {
9292
break;
9393
case "text-field":
9494
control = new qx.ui.form.TextField().set({
95-
backgroundColor: "background-main-2",
95+
backgroundColor: "input_background",
9696
font: "text-16",
9797
placeholder: this.tr("search"),
9898
alignY: "bottom",
9999
marginBottom: 4
100100
});
101+
control.getContentElement().setStyles({
102+
"border-bottom": "none"
103+
});
101104
this._add(control, {
102105
flex: 1
103106
});

‎services/static-webserver/client/source/class/osparc/desktop/MainPage.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@ qx.Class.define("osparc.desktop.MainPage", {
4343
construct: function() {
4444
this.base(arguments);
4545

46-
this._setLayout(new qx.ui.layout.VBox(null, null, "separator-vertical"));
46+
this._setLayout(new qx.ui.layout.VBox(null, null));
4747

4848
this._add(osparc.notification.RibbonNotifications.getInstance());
4949

@@ -119,7 +119,7 @@ qx.Class.define("osparc.desktop.MainPage", {
119119
msg += "<br><br>";
120120
msg += this.tr("Make sure you saved your changes to:");
121121
msg += "<br>";
122-
msg += this.tr("- current <b>smash file</b> (running <b>simulations</b>, if any, will be terminated)");
122+
msg += this.tr("- current <b>smash file</b>");
123123
msg += "<br>";
124124
msg += this.tr("- current <b>notebooks</b> (<b>jupyterlab</b> session will be terminated)");
125125
win.set({

‎services/static-webserver/client/source/class/osparc/desktop/SlideshowView.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -231,7 +231,6 @@ qx.Class.define("osparc.desktop.SlideshowView", {
231231
"border-radius": "12px"
232232
});
233233
view.set({
234-
backgroundColor: "background-main-2",
235234
maxWidth: node.isDynamic() ? null : 800,
236235
margin: this.self().CARD_MARGIN
237236
});

‎services/static-webserver/client/source/class/osparc/desktop/WorkbenchView.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -38,7 +38,7 @@ qx.Class.define("osparc.desktop.WorkbenchView", {
3838
},
3939

4040
statics: {
41-
PRIMARY_COL_BG_COLOR: "background-main-2",
41+
PRIMARY_COL_BG_COLOR: "transparent",
4242
TAB_BUTTON_HEIGHT: 46,
4343

4444
decorateSplitter: function(splitter) {

‎services/static-webserver/client/source/class/osparc/desktop/credits/DesktopCenter.js

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -25,10 +25,6 @@ qx.Class.define("osparc.desktop.credits.DesktopCenter", {
2525
construct: function() {
2626
this.base(arguments);
2727

28-
this.set({
29-
backgroundColor: "background-main-2"
30-
});
31-
3228
const page = new osparc.desktop.credits.ProfilePage();
3329
page.showLabelOnTab();
3430
const profilePos = 2; // 0: Miniview, 1: Summary

‎services/static-webserver/client/source/class/osparc/desktop/credits/Summary.js

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -86,8 +86,7 @@ qx.Class.define("osparc.desktop.credits.Summary", {
8686

8787
__createOverviewCard: function(cardLabel, content, buttonLabel, signalName, signalData) {
8888
const layout = new qx.ui.container.Composite(new qx.ui.layout.VBox(10)).set({
89-
padding: 15,
90-
backgroundColor: "background-main-1"
89+
padding: 15
9190
});
9291
layout.getContentElement().setStyles({
9392
"border-radius": "4px"

‎services/static-webserver/client/source/class/osparc/desktop/organizations/MembersList.js

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -145,8 +145,7 @@ qx.Class.define("osparc.desktop.organizations.MembersList", {
145145
const memebersUIList = new qx.ui.form.List().set({
146146
decorator: "no-border",
147147
spacing: 3,
148-
width: 150,
149-
backgroundColor: "background-main-2"
148+
width: 150
150149
});
151150

152151
const membersModel = this.__membersModel = new qx.data.Array();

‎services/static-webserver/client/source/class/osparc/desktop/organizations/OrganizationDetails.js

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -165,9 +165,7 @@ qx.Class.define("osparc.desktop.organizations.OrganizationDetails", {
165165
const tabView = new qx.ui.tabview.TabView().set({
166166
contentPadding: 10
167167
});
168-
tabView.getChildControl("pane").set({
169-
backgroundColor: "background-main-2"
170-
});
168+
tabView.getChildControl("pane");
171169

172170
const membersListPage = this.__createTabPage(this.tr("Members"), "@FontAwesome5Solid/users/14");
173171
const membersList = this.__membersList = new osparc.desktop.organizations.MembersList();

‎services/static-webserver/client/source/class/osparc/desktop/organizations/OrganizationsList.js

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -124,8 +124,7 @@ qx.Class.define("osparc.desktop.organizations.OrganizationsList", {
124124
decorator: "no-border",
125125
spacing: 3,
126126
height: 150,
127-
width: 150,
128-
backgroundColor: "background-main-2"
127+
width: 150
129128
});
130129
orgsUIList.addListener("changeSelection", e => this.__organizationSelected(e.getData()), this);
131130

‎services/static-webserver/client/source/class/osparc/desktop/organizations/ServicesList.js

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -64,8 +64,7 @@ qx.Class.define("osparc.desktop.organizations.ServicesList", {
6464
__getServicesList: function() {
6565
const servicesUIList = new qx.ui.form.List().set({
6666
decorator: "no-border",
67-
spacing: 3,
68-
backgroundColor: "background-main-2"
67+
spacing: 3
6968
});
7069

7170
const servicesModel = this.__servicesModel = new qx.data.Array();

‎services/static-webserver/client/source/class/osparc/desktop/organizations/TemplatesList.js

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -64,8 +64,7 @@ qx.Class.define("osparc.desktop.organizations.TemplatesList", {
6464
__getTemplatesList: function() {
6565
const templatesUIList = new qx.ui.form.List().set({
6666
decorator: "no-border",
67-
spacing: 3,
68-
backgroundColor: "background-main-2"
67+
spacing: 3
6968
});
7069

7170
const templatesModel = this.__templatesModel = new qx.data.Array();

‎services/static-webserver/client/source/class/osparc/desktop/paymentMethods/PaymentMethods.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -184,7 +184,7 @@ qx.Class.define("osparc.desktop.paymentMethods.PaymentMethods", {
184184
spacing: 3,
185185
height: 150,
186186
width: 150,
187-
backgroundColor: "background-main-2"
187+
backgroundColor: "transparent_overlay"
188188
});
189189

190190
const paymentMethodsModel = this.__paymentMethodsModel = new qx.data.Array();

‎services/static-webserver/client/source/class/osparc/desktop/preferences/pages/BasePage.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ qx.Class.define("osparc.desktop.preferences.pages.BasePage", {
3333
// spacer
3434
this.add(new qx.ui.core.Spacer(null, 10)); // TODO add decorator?
3535
this.set({
36-
backgroundColor: "background-main-2",
36+
backgroundColor: "window-popup-background",
3737
paddingTop: 5,
3838
paddingLeft: 15
3939
});

‎services/static-webserver/client/source/class/osparc/desktop/preferences/pages/ClustersPage.js

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -95,8 +95,7 @@ qx.Class.define("osparc.desktop.preferences.pages.ClustersPage", {
9595
decorator: "no-border",
9696
spacing: 3,
9797
height: 150,
98-
width: 150,
99-
backgroundColor: "background-main-2"
98+
width: 150
10099
});
101100
clustersList.addListener("changeSelection", e => {
102101
this.__clusterSelected(e.getData());

‎services/static-webserver/client/source/class/osparc/desktop/preferences/pages/TagsPage.js

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,6 @@ qx.Class.define("osparc.desktop.preferences.pages.TagsPage", {
2828

2929
this.__container = new qx.ui.container.Composite(new qx.ui.layout.VBox(10));
3030
this.__container.set({
31-
backgroundColor: "background-main-2",
3231
paddingLeft: 10
3332
});
3433
const scroll = new qx.ui.container.Scroll(this.__container);

‎services/static-webserver/client/source/class/osparc/desktop/wallets/MembersList.js

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -158,8 +158,7 @@ qx.Class.define("osparc.desktop.wallets.MembersList", {
158158
const membersUIList = new qx.ui.form.List().set({
159159
decorator: "no-border",
160160
spacing: 3,
161-
width: 150,
162-
backgroundColor: "background-main-2"
161+
width: 150
163162
});
164163

165164
const membersModel = this.__membersModel = new qx.data.Array();

‎services/static-webserver/client/source/class/osparc/desktop/wallets/WalletDetails.js

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -158,10 +158,8 @@ qx.Class.define("osparc.desktop.wallets.WalletDetails", {
158158

159159
__getTabs: function() {
160160
const tabView = new qx.ui.tabview.TabView().set({
161-
contentPadding: 10
162-
});
163-
tabView.getChildControl("pane").set({
164-
backgroundColor: "background-main-2"
161+
contentPadding: 10,
162+
backgroundColor: "transparent"
165163
});
166164

167165
const membersListPage = this.__createTabPage(this.tr("Members"), "@FontAwesome5Solid/users/14");

‎services/static-webserver/client/source/class/osparc/desktop/wallets/WalletsList.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -83,7 +83,7 @@ qx.Class.define("osparc.desktop.wallets.WalletsList", {
8383
spacing: 3,
8484
height: 150,
8585
width: 150,
86-
backgroundColor: "background-main-2"
86+
backgroundColor: "transparent"
8787
});
8888
walletsUIList.addListener("changeSelection", e => this.__walletSelected(e.getData()), this);
8989

‎services/static-webserver/client/source/class/osparc/navigation/NavigationBar.js

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -50,7 +50,7 @@ qx.Class.define("osparc.navigation.NavigationBar", {
5050
paddingLeft: 10,
5151
paddingRight: 10,
5252
height: this.self().HEIGHT,
53-
backgroundColor: "background-main-1"
53+
backgroundColor: "navigation_bar_background_color"
5454
});
5555
},
5656

@@ -110,6 +110,9 @@ qx.Class.define("osparc.navigation.NavigationBar", {
110110
},
111111

112112
__buildLayout: function() {
113+
this.getContentElement().setStyles({
114+
"background": "linear-gradient(0deg, rgba(1, 18, 26, 0.1) 0%, rgba(229, 229, 229, 0.1) 5%)"
115+
});
113116
this.getChildControl("left-items");
114117
this.getChildControl("center-items");
115118
this.getChildControl("right-items");

‎services/static-webserver/client/source/class/osparc/product/Utils.js

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -115,12 +115,12 @@ qx.Class.define("osparc.product.Utils", {
115115
case "s4l": {
116116
if (lightLogo) {
117117
if (longLogo) {
118-
logosPath = "osparc/s4l_logo_white.svg";
118+
logosPath = "osparc/Sim4Life_full_logo_white.svg";
119119
} else {
120120
logosPath = "osparc/s4l_logo_white_short.svg";
121121
}
122122
} else if (longLogo) {
123-
logosPath = "osparc/s4l_logo_black.svg";
123+
logosPath = "osparc/Sim4Life_full_logo_black.svg";
124124
} else {
125125
logosPath = "osparc/s4l_logo_black_short.svg";
126126
}
@@ -130,13 +130,13 @@ qx.Class.define("osparc.product.Utils", {
130130
logosPath = lightLogo ? "osparc/s4llite-white.png" : "osparc/s4llite-black.png";
131131
break;
132132
case "s4lacad":
133-
logosPath = lightLogo ? "osparc/s4lacad-white.png" : "osparc/s4lacad-black.png";
133+
logosPath = lightLogo ? "osparc/Sim4Life_full_logo_white.svg" : "osparc/Sim4Life_full_logo_black.svg";
134134
break;
135135
case "s4ldesktop":
136-
logosPath = lightLogo ? "osparc/s4ldesktop-white.png" : "osparc/s4ldesktop-black.png";
136+
logosPath = lightLogo ? "osparc/Sim4Life_full_logo_white.svg" : "osparc/Sim4Life_full_logo_black.svg";
137137
break;
138138
case "s4ldesktopacad":
139-
logosPath = lightLogo ? "osparc/s4ldesktopacad-white.png" : "osparc/s4ldesktopacad-black.png";
139+
logosPath = lightLogo ? "osparc/Sim4Life_full_logo_white.svg" : "osparc/Sim4Life_full_logo_black.svg";
140140
break;
141141
case "tis":
142142
logosPath = lightLogo ? "osparc/tip_itis-white.svg" : "osparc/tip_itis-black.svg";

‎services/static-webserver/client/source/class/osparc/share/Collaborators.js

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -250,8 +250,7 @@ qx.Class.define("osparc.share.Collaborators", {
250250
decorator: "no-border",
251251
spacing: 3,
252252
width: 150,
253-
padding: 0,
254-
backgroundColor: "background-main-2"
253+
padding: 0
255254
});
256255

257256
const collaboratorsModel = this.__collaboratorsModel = new qx.data.Array();

‎services/static-webserver/client/source/class/osparc/theme/Appearance.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -155,7 +155,7 @@ qx.Theme.define("osparc.theme.Appearance", {
155155
"service-window/captionbar": {
156156
include: "window/captionbar",
157157
style: state => ({
158-
backgroundColor: "background-main-2",
158+
backgroundColor: "transparent",
159159
decorator: "workbench-small-cap-captionbar"
160160
})
161161
},

0 commit comments

Comments
 (0)