mirror of
https://github.com/finos/SymphonyElectron.git
synced 2024-11-28 19:53:53 -06:00
Electron-134 - Optimized CSS & made changes as per review comments
This commit is contained in:
parent
f5ab7035e6
commit
6675d3937f
@ -9,6 +9,8 @@
|
||||
const electron = require('electron');
|
||||
const ipc = electron.ipcRenderer;
|
||||
|
||||
const whiteColorRegExp = new RegExp(/^(?:white|#fff(?:fff)?|rgba?\(\s*255\s*,\s*255\s*,\s*255\s*(?:,\s*1\s*)?\))$/i);
|
||||
|
||||
/**
|
||||
* Sets style for a notification
|
||||
* @param config
|
||||
@ -19,6 +21,7 @@ function setStyle(config) {
|
||||
let container = notiDoc.getElementById('container');
|
||||
let header = notiDoc.getElementById('header');
|
||||
let image = notiDoc.getElementById('image');
|
||||
let logo = notiDoc.getElementById('symphony-logo');
|
||||
let title = notiDoc.getElementById('title');
|
||||
let pod = notiDoc.getElementById('pod');
|
||||
let message = notiDoc.getElementById('message');
|
||||
@ -38,6 +41,8 @@ function setStyle(config) {
|
||||
|
||||
setStyleOnDomElement(config.defaultStyleImage, image);
|
||||
|
||||
setStyleOnDomElement(config.defaultStyleLogo, logo);
|
||||
|
||||
setStyleOnDomElement(config.defaultStyleTitle, title);
|
||||
|
||||
setStyleOnDomElement(config.defaultStylePod, pod);
|
||||
@ -78,13 +83,11 @@ function setContents(event, notificationObj) {
|
||||
|
||||
if (notificationObj.color) {
|
||||
container.style.backgroundColor = notificationObj.color;
|
||||
let logo = notiDoc.getElementById('symphony-logo');
|
||||
|
||||
if (notificationObj.color.match(/^(?:white|#fff(?:fff)?|rgba?\(\s*255\s*,\s*255\s*,\s*255\s*(?:,\s*1\s*)?\))$/i)) {
|
||||
let logo = notiDoc.getElementById('symphony-logo');
|
||||
if (notificationObj.color.match(whiteColorRegExp)) {
|
||||
logo.src = './assets/symphony-logo-black.png';
|
||||
} else {
|
||||
|
||||
let logo = notiDoc.getElementById('symphony-logo');
|
||||
let title = notiDoc.getElementById('title');
|
||||
let pod = notiDoc.getElementById('pod');
|
||||
let message = notiDoc.getElementById('message');
|
||||
|
@ -2,7 +2,7 @@
|
||||
<head></head>
|
||||
<body style='margin:0; overflow: hidden; -webkit-user-select: none;'>
|
||||
<div id="container">
|
||||
<div style="overflow: hidden; position: absolute; transform: translate(-25px, 10px);">
|
||||
<div>
|
||||
<img src="" id="symphony-logo">
|
||||
</div>
|
||||
<div id="header">
|
||||
@ -11,7 +11,7 @@
|
||||
<span id="message"></span>
|
||||
</div>
|
||||
<div id="picture">
|
||||
<img src="" id="image" />
|
||||
<img src="" id="image" style="border-radius: 4px" />
|
||||
</div>
|
||||
<div id="close">
|
||||
<svg fill="#000000" height="16" viewBox="0 0 24 24" width="16" xmlns="http://www.w3.org/2000/svg">
|
||||
|
@ -67,52 +67,45 @@ let config = {
|
||||
defaultStyleContainer: {
|
||||
display: 'flex',
|
||||
justifyContent: 'center',
|
||||
flexDirection: 'column',
|
||||
backgroundColor: '#f0f0f0',
|
||||
overflow: 'hidden',
|
||||
padding: 10,
|
||||
position: 'relative',
|
||||
lineHeight: '15px',
|
||||
boxSizing: 'border-box'
|
||||
},
|
||||
defaultStyleHeader: {
|
||||
flex: '1 0 auto',
|
||||
display: 'flex',
|
||||
flexDirection: 'column'
|
||||
width: 245,
|
||||
minWidth: 230,
|
||||
margin: "12px 10px"
|
||||
},
|
||||
defaultStyleImage: {
|
||||
height: 43,
|
||||
position: 'absolute',
|
||||
right: 30,
|
||||
top: 11,
|
||||
borderRadius: 4,
|
||||
marginTop: 12,
|
||||
width: 43
|
||||
},
|
||||
defaultStyleClose: {
|
||||
position: 'absolute',
|
||||
top: 8,
|
||||
right: 8,
|
||||
width: 16,
|
||||
height: 16,
|
||||
margin: "10px 8px 0 8px",
|
||||
opacity: 0.54,
|
||||
fontSize: 12,
|
||||
color: '#CCC'
|
||||
},
|
||||
defaultStyleTitle: {
|
||||
fontFamily: 'Lato-Bold, san-serif',
|
||||
fontFamily: 'sans-serif',
|
||||
fontSize: 14,
|
||||
fontWeight: 700,
|
||||
color: '#4a4a4a',
|
||||
marginLeft: 52,
|
||||
overflow: 'hidden',
|
||||
display: '-webkit-box',
|
||||
webkitLineClamp: 1,
|
||||
webkitBoxOrient: 'vertical',
|
||||
},
|
||||
defaultStylePod: {
|
||||
fontFamily: 'Lato-Regular, san-serif',
|
||||
fontFamily: 'sans-serif',
|
||||
fontSize: 11,
|
||||
color: '#adadad',
|
||||
marginLeft: 52,
|
||||
overflow: 'hidden',
|
||||
filter: 'brightness(70%)',
|
||||
display: '-webkit-box',
|
||||
@ -120,18 +113,20 @@ let config = {
|
||||
webkitBoxOrient: 'vertical',
|
||||
},
|
||||
defaultStyleText: {
|
||||
fontFamily: 'Lato-Regular, san-serif',
|
||||
fontFamily: 'sans-serif',
|
||||
fontSize: 12,
|
||||
color: '#4a4a4a',
|
||||
marginTop: 12,
|
||||
marginRight: 65,
|
||||
marginLeft: 52,
|
||||
overflow: 'hidden',
|
||||
display: '-webkit-box',
|
||||
webkitLineClamp: 1,
|
||||
webkitBoxOrient: 'vertical',
|
||||
cursor: 'default'
|
||||
},
|
||||
defaultStyleLogo: {
|
||||
margin: "12px 0 0 -12px",
|
||||
opacity: 0.6,
|
||||
},
|
||||
defaultWindow: {
|
||||
alwaysOnTop: true,
|
||||
skipTaskbar: true,
|
||||
|
Loading…
Reference in New Issue
Block a user