Skip to content

Commit 2849e46

Browse files
committed
smaller skin tweaks
1 parent 7434f42 commit 2849e46

File tree

4 files changed

+48
-27
lines changed

4 files changed

+48
-27
lines changed
Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
Fonts are not well maintained by Google!
22
- Get recent woff2 version from here: https://fonts.googleapis.com/icon?family=Material+Icons
3-
- Convert to woff e.g. with an online converter, e.g. (default settings): https://transfonter.org/
3+
- Convert to woff e.g. with an online converter, e.g. (default settings): https://transfonter.org/ or https://font-converter.net/
44
- View new woff with e.g.: http://torinak.com/font/lsfont.html or https://opentype.js.org
55
- Watch issue: https://github.com/google/material-design-icons/issues/786
66

77
After update:
8-
- Get new glyph table via: https://opentype.js.org/font-inspector.html
8+
- Get new glyph table (PostScript table) via: https://opentype.js.org/font-inspector.html
99
- Remove broken ones, remove "uni..." and "u..." from entries and add new array to: googleMaterialIcons.js

www/css/sepiaFW-skin-history-of-future.css

Lines changed: 13 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ html {
2424
border-radius: 28px;
2525
}
2626
#sepiaFW-nav-bar {
27+
border-top: 0 !important;
2728
border-radius: 26px 26px 0 0 !important;
2829
}
2930
#sepiaFW-chat-controls-form {
@@ -64,8 +65,8 @@ html {
6465
#sepiaFW-adC { background-color: #fb9e37; }
6566
#sepiaFW-lC { background-color: #292929; }
6667

67-
/*#sepiaFW-statC { background-color: #ffad01; }*/
68-
/*#sepiaFW-navC { background-color: #df616d; }*/
68+
#sepiaFW-statC { background-color: #fb9e37; }
69+
#sepiaFW-navC { background-color: #fd827b; }
6970

7071
#sepiaFW-login-box {
7172
background: #ffad01;
@@ -103,8 +104,9 @@ html {
103104
#sepiaFW-nav-bar {
104105
background: #ffad01;
105106
color: #111111;
107+
border-top: 2px solid #292929;
106108
border-bottom: 2px solid #292929;
107-
border-radius: 28px;
109+
/*border-radius: 28px;*/
108110
}
109111
#sepiaFW-chat-controls-form {
110112
background: #df616d;
@@ -123,15 +125,21 @@ html {
123125
background: transparent;
124126
border-bottom-color: #111111;
125127
border: 2px solid #292929;
126-
border-radius: 28px;
128+
border-left: 0;
129+
border-right: 0;
130+
border-radius: 0;
131+
/*border-radius: 28px 28px 0 0;*/
127132
}
128133
#sepiaFW-chat-controls.full-screen {
129134
border: 0;
135+
border-radius: 0;
130136
}
131137
#sepiaFW-chat-controls.full-screen #sepiaFW-chat-controls-right {
132-
border-radius: 28px 0 0 26px;
138+
border-radius: 0;
139+
/*border-radius: 28px 0 0 26px;*/
133140
border: 2px solid #292929;
134141
border-right: 1px solid;
142+
border-left: 0;
135143
}
136144
#sepiaFW-chat-controls.full-screen #sepiaFW-assist-btn-area {
137145
border-radius: 0 28px 28px 0;

www/css/sepiaFW-skin-myMessage.css

Lines changed: 32 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,19 @@ html {
22
background-image: url(../img/SEPIA_back.png);
33
background-size: auto 50%;
44
}
5-
#sepiaFW-main-window.sepiaFW-skin-mod {
6-
color: #000;
7-
border: 4px solid transparent;
8-
}
95
.sepiaFW-results-container {
106
scrollbar-color: #f5f5f5 #fff;
117
}
8+
@media (min-width: 480px) and (min-height: 481px) {
9+
#sepiaFW-main-window.sepiaFW-skin-mod {
10+
color: #000;
11+
border: 4px solid transparent;
12+
}
13+
#sepiaFW-chat-controls {
14+
border: 0 !important;
15+
border-bottom: 0 !important;
16+
}
17+
}
1218

1319
#sepiaFW-pC { background-color: #fff; }
1420
#sepiaFW-sC { background-color: #027BFF; }
@@ -26,9 +32,16 @@ html {
2632
border: 1px solid #EBEBFF;
2733
}
2834
#sepiaFW-login-box, #sepiaFW-nav-bar, #sepiaFW-chat-controls-form, #sepiaFW-chat-controls-right {
29-
background: rgba(255, 255, 255, 0.75);
35+
background: rgba(255, 255, 255, 0.85);
3036
color: #000;
3137
border: 1px solid #EBEBFF;
38+
}
39+
#sepiaFW-chat-controls {
40+
border: 2px solid transparent;
41+
border-top: 0;
42+
border-bottom: 2px solid #fff;
43+
}
44+
#sepiaFW-chat-controls-form, #sepiaFW-chat-controls-right {
3245
backdrop-filter: blur(5px);
3346
}
3447
#sepiaFW-nav-bar {
@@ -63,7 +76,7 @@ html {
6376
}
6477
#sepiaFW-assist-btn-area {
6578
border-color: #027BFF;
66-
background: rgba(255, 255, 255, 0.75);
79+
background: rgba(255, 255, 255, 0.85);
6780
backdrop-filter: blur(5px);
6881
}
6982
#sepiaFW-assist-btn-area.speaking button {
@@ -94,20 +107,20 @@ html {
94107

95108
#sepiaFW-main-window .chat-buttons-area button {
96109
color: #000;
97-
background: rgba(255, 255, 255, 0.75);
98-
backdrop-filter: blur(5px);
110+
background: rgba(255, 255, 255, 0.85);
111+
/*backdrop-filter: blur(5px);*/
99112
}
100113
#sepiaFW-main-window .chat-buttons-area .my-view-custom-button {
101-
background-color: rgba(255, 255, 255, 0.75);
114+
background-color: rgba(255, 255, 255, 0.85);
102115
color: #000;
103116
}
104117
.sepiaFW-notouch-device #sepiaFW-main-window .chat-buttons-area button:hover {
105118
background: #fbfbfb;
106119
}
107120

108121
.sepiaFW-menu {
109-
background: rgba(255, 255, 255, 0.97) !important;
110-
backdrop-filter: blur(5px);
122+
background: rgba(255, 255, 255, 1.0) !important;
123+
/*backdrop-filter: blur(5px);*/
111124
color: #000 !important;
112125
border: 1px solid #eee;
113126
}
@@ -138,7 +151,7 @@ html {
138151
border-bottom: 0;
139152
}
140153
#sepiaFW-chat-menu li {
141-
background: rgba(235, 235, 235, 0.08);
154+
background: rgba(235, 235, 235, 0.06);
142155
}
143156
#sepiaFW-chat-menu-head-border {
144157
display: none;
@@ -158,8 +171,8 @@ html {
158171

159172
#sepiaFW-chat-output article {
160173
border: 1px solid #e5e5e5;
161-
background: rgba(235, 235, 235, 0.40);
162-
backdrop-filter: blur(5px);
174+
background: rgba(235, 235, 235, 0.50);
175+
/*backdrop-filter: blur(5px);*/
163176
color: #2f3035;
164177
padding-left: 9px;
165178
}
@@ -176,8 +189,8 @@ html {
176189
}
177190
#sepiaFW-chat-output article.chatAssistant {
178191
border: 1px solid #EBEBFF;
179-
background: rgba(255, 255, 255, 0.75);
180-
backdrop-filter: blur(5px);
192+
background: rgba(255, 255, 255, 0.85);
193+
/*backdrop-filter: blur(5px);*/
181194
color: #2f3035;
182195
padding-left: 9px;
183196
}
@@ -277,7 +290,7 @@ html {
277290
.sepiaFW-cards-list-body .linkCard > div,
278291
.sepiaFW-cards-list-body .newsArticle > div {
279292
border: 1px solid #e5e5e5;
280-
backdrop-filter: blur(5px);
293+
/*backdrop-filter: blur(5px);*/
281294
}
282295

283296
.sepiaFW-cards-list-body .weatherNowSmall .weatherNowSmallImage {
@@ -287,7 +300,7 @@ html {
287300
/*----- teachUI -----*/
288301

289302
#sepiaFW-teachUI-nav-bar {
290-
background: #027BFF;
303+
background: linear-gradient(45deg, #027bff, #3e98ff);
291304
color: #fff;
292305
}
293306
#sepiaFW-teachUI-view {
@@ -299,6 +312,6 @@ html {
299312
}
300313
#sepiaFW-teachUI-editor button,
301314
#sepiaFW-teachUI-manager button {
302-
background: #027BFF !important;
315+
background: linear-gradient(45deg, #027bff, #3e98ff) !important;
303316
color: #fff !important;
304317
}

www/scripts/sepiaFW.ui.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -165,7 +165,7 @@ function sepiaFW_build_ui(){
165165
UI.statusBarColor = "";
166166
}
167167
//refresh theme-color
168-
$('meta[name="theme-color"]').replaceWith('<meta name="theme-color" content="' + UI.primaryColor + '">');
168+
$('meta[name="theme-color"]').replaceWith('<meta name="theme-color" content="' + (UI.statusBarColor || UI.primaryColor) + '">');
169169
//set general skin style
170170
var backColor = UI.htmlBackgroundColor;
171171
if ((backColor + '').indexOf('rgb') === 0){

0 commit comments

Comments
 (0)