1
0
mirror of https://github.com/laurent22/joplin.git synced 2025-01-11 18:24:43 +02:00

Electron: styling

This commit is contained in:
Laurent Cozic 2017-11-12 17:53:26 +00:00
parent 6d2a5a7b32
commit 6e75c93f3c
5 changed files with 42 additions and 7 deletions

View File

@ -73,6 +73,7 @@ class SideBarComponent extends React.Component {
display: 'flex',
alignItems: 'left',
justifyContent: 'top',
flexDirection: 'column',
marginTop: 10,
marginLeft: 5,
marginRight: 5,
@ -182,8 +183,11 @@ class SideBarComponent extends React.Component {
}
let lines = Synchronizer.reportToLines(this.props.syncReport);
while (lines.length < 10) lines.push(''); // Add blank lines so that height of report text is fixed and doesn't affect scrolling
const syncReportText = lines.join("\n");
console.info(lines);
const syncReportText = [];
for (let i = 0; i < lines.length; i++) {
syncReportText.push(<div key={i}>{lines[i]}</div>);
}
items.push(this.synchronizeButton(this.props.syncStarted ? _('Cancel') : _('Synchronise')));

View File

@ -131,4 +131,18 @@ contentElement.addEventListener('scroll', function(e) {
const m = maxScrollTop();
ipcRenderer.sendToHost('percentScroll', m ? contentElement.scrollTop / m : 0);
});
// Disable drag and drop otherwise it's possible to drop a URL
// on it and it will open in the view as a website.
document.addEventListener('drop', function(e) {
e.preventDefault();
e.stopPropagation();
});
document.addEventListener('dragover', function(e) {
e.preventDefault();
e.stopPropagation();
});
webview.addEventListener('dragover', function(e) {
e.preventDefault();
});
</script>

View File

@ -15,7 +15,12 @@ body, textarea {
.side-bar .list-item:hover,
.side-bar .synchronize-button:hover {
background-color: #533d7d;
background-color: #453E53;
}
.side-bar .list-item:active,
.side-bar .synchronize-button:active {
background-color: #564B6C;
}
.header .button:hover {
@ -24,6 +29,12 @@ body, textarea {
box-sizing: 'border-box';
}
.header .button:active {
background-color: rgba(0,160,255,0.2);
border: 1px solid rgba(0,160,255,0.7);
box-sizing: 'border-box';
}
.header .button {
border: 1px solid rgba(0,160,255,0);
}
@ -32,4 +43,10 @@ body, textarea {
background-color: rgba(0,0,0,0.05) !important;
border: 1px solid rgba(0,0,0,0.10);
border-radius: 5px;
}
.icon-button:active {
background-color: rgba(0,0,0,0.10) !important;
border: 1px solid rgba(0,0,0,0.15);
border-radius: 5px;
}

View File

@ -20,9 +20,9 @@ const globalStyle = {
buttonMinHeight: 30,
textAreaLineHeight: 17,
backgroundColor2: "#3B314E",
backgroundColor2: "#2B2634",
color2: "#ffffff",
selectedColor2: "#674b98",
selectedColor2: "#5A4D70",
headerHeight: 35,
headerButtonHPadding: 6,

View File

@ -346,7 +346,7 @@ Setting.metadata_ = {
'locale': { value: defaultLocale(), type: Setting.TYPE_STRING, isEnum: true, public: true, label: () => _('Language'), options: () => {
return supportedLocalesToLanguages();
}},
'theme': { value: Setting.THEME_LIGHT, type: Setting.TYPE_INT, public: true, appTypes: ['mobile', 'desktop'], isEnum: true, label: () => _('Theme'), options: () => {
'theme': { value: Setting.THEME_LIGHT, type: Setting.TYPE_INT, public: true, appTypes: ['mobile'], isEnum: true, label: () => _('Theme'), options: () => {
let output = {};
output[Setting.THEME_LIGHT] = _('Light');
output[Setting.THEME_DARK] = _('Dark');
@ -374,7 +374,7 @@ Setting.metadata_ = {
86400: _('%d hours', 24),
};
}},
'showAdvancedOptions': { value: false, type: Setting.TYPE_BOOL, public: true, appTypes: ['mobile', 'desktop'], label: () => _('Show advanced options') },
'showAdvancedOptions': { value: false, type: Setting.TYPE_BOOL, public: true, appTypes: ['mobile' ], label: () => _('Show advanced options') },
'noteVisiblePanes': { value: ['editor', 'viewer'], type: Setting.TYPE_ARRAY, public: false, appTypes: ['desktop'] },
};