Last active
November 14, 2023 23:27
-
-
Save justinkelly/95e7ea152be9ffc149cfd435b4714d65 to your computer and use it in GitHub Desktop.
Synology Notes UI update using TamperMonkey, install Tampermonkely extension in your browser, then click the Raw button on this page to install the script
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// ==UserScript== | |
// @name Synology Notes UI | |
// @homepage https://github.com/justinkelly/Synology-Notes-UI-update-tampermonkey | |
// @version 0.2.8 | |
// @description Make Synology Notes UI look similar to Notion | |
// @author Justin Kelly | |
// @include https://*/?launchApp=SYNO.SDS.NoteStation.Application* | |
// @icon https://global.download.synology.com/download/Package/img/NoteStation/2.6.1-2450/thumb_256.png | |
// @namespace https://github.com/justinkelly/Synology-Notes-UI-update-tampermonkey | |
// @supportURL https://github.com/justinkelly/Synology-Notes-UI-update-tampermonkey | |
// @downloadURL https://gist.github.com/justinkelly/95e7ea152be9ffc149cfd435b4714d65/raw/Synology_Notes_UI.user.js | |
// @updateURL https://gist.github.com/justinkelly/95e7ea152be9ffc149cfd435b4714d65/raw/Synology_Notes_UI.user.js | |
// @grant none | |
// ==/UserScript== | |
function GM_addStyle(css) { | |
const style = document.getElementById("GM_addStyleBy8626") || (function() { | |
const style = document.createElement('style'); | |
style.type = 'text/css'; | |
style.id = "GM_addStyleBy8626"; | |
document.head.appendChild(style); | |
return style; | |
})(); | |
const sheet = style.sheet; | |
sheet.insertRule(css, (sheet.rules || sheet.cssRules || []).length); | |
} | |
//body | |
GM_addStyle("body {font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif';}"); | |
GM_addStyle(".syno-ns-win .syno-ns-note-snippet-container .syno-ns-note-snippet-title { font-weight: 600;}"); | |
GM_addStyle(".sds-window-v5 .x-layout-split.x-layout-split-west {border-right-width: 0px;}"); | |
GM_addStyle(".syno-ns-note-container-panel {border-right-width: 1px;border-right-color: rgb(223, 225, 228);}"); | |
GM_addStyle(".x-layout-split-west {background: rgba(55, 53, 47, 0.08)}"); | |
//remove snippet/date in list | |
GM_addStyle(".syno-ns-note-snippet-thumbnail{display:none;}"); | |
//top menu bar | |
GM_addStyle(".syno-ns-win .x-window-tl {background: rgb(244, 245, 247)}"); | |
GM_addStyle(".sds-standalone-main-window-header-text {display:none}"); | |
GM_addStyle("#ext-gen60 {display:none}"); | |
GM_addStyle("#ext-gen65 {z-index: 2; overflow: initial;}"); | |
GM_addStyle(".sds-standalone-main-window .sds-standalone-main-window-header { padding: 7px 18px;}"); | |
GM_addStyle("#ext-gen65 {float:right}"); | |
GM_addStyle(".syno-ns-win .syno-ns-mainpanel .syno-ns-toolbar {padding-top: 8px;}"); | |
GM_addStyle("#ext-comp-1230 {background-color: rgb(244, 245, 247); border-bottom: 1px solid rgb(223, 225, 228);}"); | |
GM_addStyle(".sds-window-v5 .x-panel-tbar .x-toolbar-layout-ct { padding-bottom: 4px;}"); | |
GM_addStyle(".syno-ns-win .syno-ns-mainpanel .syno-ns-toolbar { padding-top: 4px;}"); | |
GM_addStyle("#ext-comp-1233 { padding-top: 0px;}"); | |
//left panel | |
GM_addStyle("#ext-gen96 {border-right: 1px solid rgb(223, 225, 228)}"); | |
//middle panel | |
GM_addStyle(".syno-ns-win .syno-ns-note-container-panel {padding-left: 0px;padding-top:5px;}"); | |
GM_addStyle(".syno-ns-win .syno-ns-note-snippet-container .syno-ns-note-snippet-content { color: rgb(46, 46, 46); opacity: .5;}"); | |
//search bar | |
GM_addStyle("#ext-gen79 {background:#f3f2f1}"); | |
//tree background | |
GM_addStyle("div.syno-ux-treepanel {background: rgb(238, 239, 241);}"); | |
//tree border right | |
GM_addStyle("#ext-comp-1022 {border-right: 1px solid #edebe9;}"); | |
//tree icons | |
GM_addStyle(".syno-ns-win .x-tree-node .x-tree-node-el .x-tree-node-icon { opacity: 0.7; }"); | |
//tree text | |
GM_addStyle(".syno-ux-treepanel .x-tree-root-ct .x-tree-node-ct a span {color: rgba(25, 23, 17, 0.6);font-weight: 500; }"); | |
//tree text selected | |
GM_addStyle(".syno-ns-win .x-tree-node .x-tree-selected .syno-ns-notebook-title {font-weight: 600; color: rgb(55, 53, 47);}"); | |
GM_addStyle(".syno-ns-win .x-tree-node .x-tree-selected .syno-ns-notebook-total {font-weight: 600; color: rgb(55, 53, 47);}"); | |
GM_addStyle(".syno-ns-win .x-tree-node .x-tree-selected .x-tree-node-icon {background-position: 0px 0px;}"); | |
GM_addStyle("div.x-tree-selected {color: rgb(253, 253, 253);") | |
GM_addStyle(".syno-ns-win .x-tree-node .x-tree-selected {background: rgb(253, 253, 253);"); | |
//main white section | |
GM_addStyle("#ext-comp-1239 { padding-top: 0px;}"); | |
GM_addStyle("#ext-comp-1022-xsplit {border-top: 1px solid #edebe9;}"); | |
//middle panel | |
GM_addStyle("#ext-gen135 {padding-left: 7px;}"); | |
GM_addStyle("#ext-comp-1028-xsplit {display:none;}"); | |
GM_addStyle(".syno-ns-win .syno-ns-note-snippet-container {margin: 0;padding: 8px 2px 0px 5px;border-color: rgb(223, 225, 228);}"); | |
GM_addStyle(".syno-ns-win .syno-ns-note-snippet-group-container.syno-ns-note-snippet-container-select .syno-ns-note-snippet-container { background-color: rgb(244, 245, 247); border-left: 2px solid rgb(8, 109, 214); }"); | |
GM_addStyle(".syno-ns-win .syno-ns-note-toolbar-ct { margin-right: 0; border-color: rgb(223, 225, 228); }"); | |
GM_addStyle(".syno-ns-win .syno-ns-note-group-header { background-color: rgb(238, 239, 241); color: rgba(25, 23, 17, 0.6); font-weight: 500; padding: 0px 10px; border-color: rgb(223, 225, 228); margin-right: 0px;}"); | |
//buttons | |
GM_addStyle(".syno-ux-button-default { background-color: inherit;}"); | |
GM_addStyle(".syno-ns-win .syno-ns-mainpanel .syno-ns-toolbar .syno-ns-create-btn {background-image: none; background-color: rgb(8, 109, 214); border: 1px solid rgb(8, 109, 214);}"); | |
GM_addStyle(".syno-ns-win .syno-ns-mainpanel .syno-ns-toolbar .syno-ns-create-btn:hover {background-image: none; --tw-brightness: brightness(1.25);filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);}"); | |
GM_addStyle(".syno-ns-win .syno-ns-mainpanel .syno-ns-toolbar .syno-ns-create-btn.syno-ux-button-dropdown.syno-ux-button-split button:first-child { border-right-color: rgb(8, 109, 214);}"); | |
//3rd level notes | |
GM_addStyle("[aria-level='3'] .syno-ns-notebook-fullmenu-notebook-common-icon { margin-left:10px;}"); | |
//editor | |
GM_addStyle(".synohdpack .syno-ns-win .syno-ns-editor-normal-panel .mce-container .mce-container-body .mce-toolbar-grp {border-bottom: 1px solid rgb(223, 225, 228);padding:0;background-image: none;}"); | |
GM_addStyle(".syno-ns-win .syno-ns-editor-normal-panel { padding: 5px 0px 0px 4px;}"); | |
GM_addStyle("#ext-comp-1053 table.x-toolbar-ct { color: rgb(55, 53, 47); opacity: 0.5;}"); | |
/* Colours | |
--themeDarker: #004578; | |
--themeDark: #005A9E; | |
--themeDarkAlt: #106EBE; | |
--themePrimary: #0078d4; | |
--themeSecondary: #2B88D8; | |
--themeTertiary: #71AFE5; | |
--themeLight: #C7E0F4; | |
--themeLighter: #DEECF9; | |
--themeLighterAlt: #EFF6FC; | |
--neutralDark: #201f1e; | |
--neutralPrimary: #323130; | |
--neutralPrimaryAlt: #3b3a39; | |
--neutralSecondary: #605e5c; | |
--neutralTertiary: #a19f9d; | |
--neutralTertiaryAlt: #c8c6c4; | |
--neutralQuaternary: #d2d0ce; | |
--neutralQuaternaryAlt: #e1dfdd; | |
--neutralLight: #edebe9; | |
--neutralLighter: #f3f2f1; | |
--neutralLighterAlt: #faf9f8; | |
*/ |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment