Latest commit

History

2 Commits

Folders and files

NameName
Last commit message
Last commit date

Repository files navigation

Silverpoint Skin Editor

With the help of Silverpoint Skin Editor designers will be able to easily create and modify skins of applications based on SpTBXLib.

Basic Concepts

The term skin refers to the concept of changing the software's look and feel, making it aesthetically pleasing. Software that is capable of having a skin applied is referred to as being skinnable, and the process of writing or applying such a skin is known as skinning.

A skin for Silverpoint Skin Editor is made of a SKN file describing the logical structure of the skin. This is a text file that follows a specific format and it is used by the skin engine to skin the application's controls.

Getting Started

When Skin Editor is opened you have the option to create a new skin, open an existing one or create a skin based on a template.

Skin Editor has 4 sections or panes:

  1. Elements: this pane has a list of every control/element and their different states.
  2. Skin Properties: shows the skin properties and their values. Some of the properties you can change are:
    • Name: the skin name.
    • Author: the skin author.
    • Office Icons: when set to true the menu item icons are painted with shadows (imitating Office).
    • Office Menu: when set to true the height of the separators on popup menus is 6 pixels (imitating Office), otherwise the size is 10 pixels. Also when the items are disabled the hottrack is not painted.
    • Office Statusbar: when set to true the Statusbar panels are painted with rectangular separators like Office.
  3. Element Properties: shows the selected element properties. Some of the properties you can change are:
    • Body: to edit the Body properties select the type of the Body and change the gradient colors, Solid uses 1 color, the Simple Gradients uses 2, and the rest uses 4 colors.
    • Borders: to edit the Borders properties select the type of the Borders and change the border colors. You can specify the external and internal borders.
    • Text: specifies the text color.
  4. Preview: this pane shows the preview of the skin.

Creating a New Skin

  1. Create a new project by clicking the New button on the toolbar.
  2. Specify the Skin Name and Author on the New Skin dialog.
    You can also create a skin based upon a template.
  3. You can now start editing the skin.
    An element can consist of several states, for instance the Button element has 6 states (Normal, Disabled, Hot, Pushed, Checked, Checked & Hot), while other elements have just a few like the ProgressBar element that has only 2 states (Normal, Hot).
    To access a specific element property, you must first locate the element on the Elements pane and then select the corresponding state, when the state is selected the properties will be showed on the Element Properties pane.

For more info go to: http://www.silverpointdevelopment.com

License

The contents of this package are licensed under the terms of the Mozilla Public License Version 1.1, found at:
http://www.mozilla.org/MPL/MPL-1.1.html

Software is distributed on an "AS IS" basis, WITHOUT WARRANTY OF ANY KIND, either express or implied.

The initial developer of this package is Robert Lee.

About

With Silverpoint Skin Editor easily create and modify skins of applications based on SpTBXLib.

Topics

Resources

Stars

5 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Add copy buttons to all
 blocks\n(function() {\n function addCopyButtons() {\n document.querySelectorAll('pre code').forEach(function(codeBlock) {\n if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;\n codeBlock.parentElement.setAttribute('data-copy-added', 'true');\n \n var btn = document.createElement('button');\n btn.textContent = 'Copy';\n btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';\n btn.onmouseover = function() { this.style.opacity = '1'; };\n btn.onmouseout = function() { this.style.opacity = '0.7'; };\n btn.onclick = function() {\n navigator.clipboard.writeText(codeBlock.textContent).then(function() {\n btn.textContent = 'Copied!';\n setTimeout(function() { btn.textContent = 'Copy'; }, 1500);\n });\n };\n codeBlock.parentElement.style.position = 'relative';\n codeBlock.parentElement.appendChild(btn);\n });\n }\n \n addCopyButtons();\n \n // Re-run on dynamic content\n var observer = new MutationObserver(addCopyButtons);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Add Copy Buttons to Code Blocks");
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '
Skip to content

Latest commit

History

2 Commits

Folders and files

NameName
Last commit message
Last commit date

Repository files navigation

Silverpoint Skin Editor

With the help of Silverpoint Skin Editor designers will be able to easily create and modify skins of applications based on SpTBXLib.

Basic Concepts

The term skin refers to the concept of changing the software's look and feel, making it aesthetically pleasing. Software that is capable of having a skin applied is referred to as being skinnable, and the process of writing or applying such a skin is known as skinning.

A skin for Silverpoint Skin Editor is made of a SKN file describing the logical structure of the skin. This is a text file that follows a specific format and it is used by the skin engine to skin the application's controls.

Getting Started

When Skin Editor is opened you have the option to create a new skin, open an existing one or create a skin based on a template.

Skin Editor has 4 sections or panes:

  1. Elements: this pane has a list of every control/element and their different states.
  2. Skin Properties: shows the skin properties and their values. Some of the properties you can change are:
    • Name: the skin name.
    • Author: the skin author.
    • Office Icons: when set to true the menu item icons are painted with shadows (imitating Office).
    • Office Menu: when set to true the height of the separators on popup menus is 6 pixels (imitating Office), otherwise the size is 10 pixels. Also when the items are disabled the hottrack is not painted.
    • Office Statusbar: when set to true the Statusbar panels are painted with rectangular separators like Office.
  3. Element Properties: shows the selected element properties. Some of the properties you can change are:
    • Body: to edit the Body properties select the type of the Body and change the gradient colors, Solid uses 1 color, the Simple Gradients uses 2, and the rest uses 4 colors.
    • Borders: to edit the Borders properties select the type of the Borders and change the border colors. You can specify the external and internal borders.
    • Text: specifies the text color.
  4. Preview: this pane shows the preview of the skin.

Creating a New Skin

  1. Create a new project by clicking the New button on the toolbar.
  2. Specify the Skin Name and Author on the New Skin dialog.
    You can also create a skin based upon a template.
  3. You can now start editing the skin.
    An element can consist of several states, for instance the Button element has 6 states (Normal, Disabled, Hot, Pushed, Checked, Checked & Hot), while other elements have just a few like the ProgressBar element that has only 2 states (Normal, Hot).
    To access a specific element property, you must first locate the element on the Elements pane and then select the corresponding state, when the state is selected the properties will be showed on the Element Properties pane.

For more info go to: http://www.silverpointdevelopment.com

License

The contents of this package are licensed under the terms of the Mozilla Public License Version 1.1, found at:
http://www.mozilla.org/MPL/MPL-1.1.html

Software is distributed on an "AS IS" basis, WITHOUT WARRANTY OF ANY KIND, either express or implied.

The initial developer of this package is Robert Lee.

About

With Silverpoint Skin Editor easily create and modify skins of applications based on SpTBXLib.

Topics

Resources

Stars

5 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Force GitHub README to respect dark mode\n(function() {\n var style = document.createElement('style');\n style.textContent = '\n .markdown-body {\n color-scheme: dark light;\n }\n .markdown-body pre { background: #161b22 !important; }\n .markdown-body code { background: rgba(110, 118, 129, 0.4) !important; }\n .markdown-body table th, .markdown-body table td { border-color: #30363d !important; }\n .markdown-body img { background: #0d1117; }\n .markdown-body blockquote { border-left-color: #8b949e; }\n .markdown-body hr { border-color: #30363d; }\n ';\n document.head.appendChild(style);\n})();", "GitHub Dark Mode README Fix"); } } catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

Latest commit

History

2 Commits

Folders and files

NameName
Last commit message
Last commit date

Repository files navigation

Silverpoint Skin Editor

With the help of Silverpoint Skin Editor designers will be able to easily create and modify skins of applications based on SpTBXLib.

Basic Concepts

The term skin refers to the concept of changing the software's look and feel, making it aesthetically pleasing. Software that is capable of having a skin applied is referred to as being skinnable, and the process of writing or applying such a skin is known as skinning.

A skin for Silverpoint Skin Editor is made of a SKN file describing the logical structure of the skin. This is a text file that follows a specific format and it is used by the skin engine to skin the application's controls.

Getting Started

When Skin Editor is opened you have the option to create a new skin, open an existing one or create a skin based on a template.

Skin Editor has 4 sections or panes:

  1. Elements: this pane has a list of every control/element and their different states.
  2. Skin Properties: shows the skin properties and their values. Some of the properties you can change are:
    • Name: the skin name.
    • Author: the skin author.
    • Office Icons: when set to true the menu item icons are painted with shadows (imitating Office).
    • Office Menu: when set to true the height of the separators on popup menus is 6 pixels (imitating Office), otherwise the size is 10 pixels. Also when the items are disabled the hottrack is not painted.
    • Office Statusbar: when set to true the Statusbar panels are painted with rectangular separators like Office.
  3. Element Properties: shows the selected element properties. Some of the properties you can change are:
    • Body: to edit the Body properties select the type of the Body and change the gradient colors, Solid uses 1 color, the Simple Gradients uses 2, and the rest uses 4 colors.
    • Borders: to edit the Borders properties select the type of the Borders and change the border colors. You can specify the external and internal borders.
    • Text: specifies the text color.
  4. Preview: this pane shows the preview of the skin.

Creating a New Skin

  1. Create a new project by clicking the New button on the toolbar.
  2. Specify the Skin Name and Author on the New Skin dialog.
    You can also create a skin based upon a template.
  3. You can now start editing the skin.
    An element can consist of several states, for instance the Button element has 6 states (Normal, Disabled, Hot, Pushed, Checked, Checked & Hot), while other elements have just a few like the ProgressBar element that has only 2 states (Normal, Hot).
    To access a specific element property, you must first locate the element on the Elements pane and then select the corresponding state, when the state is selected the properties will be showed on the Element Properties pane.

For more info go to: http://www.silverpointdevelopment.com

License

The contents of this package are licensed under the terms of the Mozilla Public License Version 1.1, found at:
http://www.mozilla.org/MPL/MPL-1.1.html

Software is distributed on an "AS IS" basis, WITHOUT WARRANTY OF ANY KIND, either express or implied.

The initial developer of this package is Robert Lee.

About

With Silverpoint Skin Editor easily create and modify skins of applications based on SpTBXLib.

Topics

Resources

Stars

5 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Highlight search terms from Google/DuckDuckGo/Bing referrer\n(function() {\n var ref = document.referrer;\n var terms = [];\n \n if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) {\n var url = new URL(ref);\n var q = url.searchParams.get('q') || url.searchParams.get('p');\n if (q) {\n terms = q.split(/\\s+/).filter(function(t) { return t.length > 2; });\n }\n }\n \n if (terms.length === 0) return;\n \n var style = document.createElement('style');\n style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }';\n document.head.appendChild(style);\n \n function highlight(node) {\n if (node.nodeType === 3) { // text node\n var text = node.textContent;\n var found = false;\n terms.forEach(function(term) {\n var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\') + ')', 'gi');\n if (regex.test(text)) {\n found = true;\n var frag = document.createDocumentFragment();\n var parts = text.split(regex);\n parts.forEach(function(part, i) {\n if (i % 2 === 0) {\n frag.appendChild(document.createTextNode(part));\n } else {\n var span = document.createElement('span');\n span.className = 'userscript-highlight';\n span.textContent = part;\n frag.appendChild(span);\n }\n });\n node.parentNode.replaceChild(frag, node);\n }\n });\n } else if (node.nodeType === 1 && node.childNodes) { // element\n var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT'];\n if (!skipTags.includes(node.tagName)) {\n Array.from(node.childNodes).forEach(highlight);\n }\n }\n }\n \n highlight(document.body);\n \n // Re-highlight on dynamic content\n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1 || node.nodeType === 3) highlight(node);\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Highlight Search Terms"); } } catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

Latest commit

History

2 Commits

Folders and files

NameName
Last commit message
Last commit date

Repository files navigation

Silverpoint Skin Editor

With the help of Silverpoint Skin Editor designers will be able to easily create and modify skins of applications based on SpTBXLib.

Basic Concepts

The term skin refers to the concept of changing the software's look and feel, making it aesthetically pleasing. Software that is capable of having a skin applied is referred to as being skinnable, and the process of writing or applying such a skin is known as skinning.

A skin for Silverpoint Skin Editor is made of a SKN file describing the logical structure of the skin. This is a text file that follows a specific format and it is used by the skin engine to skin the application's controls.

Getting Started

When Skin Editor is opened you have the option to create a new skin, open an existing one or create a skin based on a template.

Skin Editor has 4 sections or panes:

  1. Elements: this pane has a list of every control/element and their different states.
  2. Skin Properties: shows the skin properties and their values. Some of the properties you can change are:
    • Name: the skin name.
    • Author: the skin author.
    • Office Icons: when set to true the menu item icons are painted with shadows (imitating Office).
    • Office Menu: when set to true the height of the separators on popup menus is 6 pixels (imitating Office), otherwise the size is 10 pixels. Also when the items are disabled the hottrack is not painted.
    • Office Statusbar: when set to true the Statusbar panels are painted with rectangular separators like Office.
  3. Element Properties: shows the selected element properties. Some of the properties you can change are:
    • Body: to edit the Body properties select the type of the Body and change the gradient colors, Solid uses 1 color, the Simple Gradients uses 2, and the rest uses 4 colors.
    • Borders: to edit the Borders properties select the type of the Borders and change the border colors. You can specify the external and internal borders.
    • Text: specifies the text color.
  4. Preview: this pane shows the preview of the skin.

Creating a New Skin

  1. Create a new project by clicking the New button on the toolbar.
  2. Specify the Skin Name and Author on the New Skin dialog.
    You can also create a skin based upon a template.
  3. You can now start editing the skin.
    An element can consist of several states, for instance the Button element has 6 states (Normal, Disabled, Hot, Pushed, Checked, Checked & Hot), while other elements have just a few like the ProgressBar element that has only 2 states (Normal, Hot).
    To access a specific element property, you must first locate the element on the Elements pane and then select the corresponding state, when the state is selected the properties will be showed on the Element Properties pane.

For more info go to: http://www.silverpointdevelopment.com

License

The contents of this package are licensed under the terms of the Mozilla Public License Version 1.1, found at:
http://www.mozilla.org/MPL/MPL-1.1.html

Software is distributed on an "AS IS" basis, WITHOUT WARRANTY OF ANY KIND, either express or implied.

The initial developer of this package is Robert Lee.

About

With Silverpoint Skin Editor easily create and modify skins of applications based on SpTBXLib.

Topics

Resources

Stars

5 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Strip utm_, fbclid, gclid, etc. from all links on page\n(function() {\n var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content',\n 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid',\n 'ref', 'ref_src', 'source', 'medium', 'campaign'];\n \n function cleanUrl(url) {\n try {\n var u = new URL(url, window.location.origin);\n var changed = false;\n trackingParams.forEach(function(p) {\n if (u.searchParams.has(p)) {\n u.searchParams.delete(p);\n changed = true;\n }\n });\n return changed ? u.toString() : url;\n } catch (e) {\n return url;\n }\n }\n \n function cleanLinks() {\n document.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n \n cleanLinks();\n \n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1) {\n if (node.tagName === 'A') cleanLinks();\n node.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Remove Tracking Parameters from Links"); } } catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); } })(); (function(){ try { var __m = "youtube.com"; var __re = new RegExp('^' + "youtube\\.com" + '
Skip to content

Latest commit

History

2 Commits

Folders and files

NameName
Last commit message
Last commit date

Repository files navigation

Silverpoint Skin Editor

With the help of Silverpoint Skin Editor designers will be able to easily create and modify skins of applications based on SpTBXLib.

Basic Concepts

The term skin refers to the concept of changing the software's look and feel, making it aesthetically pleasing. Software that is capable of having a skin applied is referred to as being skinnable, and the process of writing or applying such a skin is known as skinning.

A skin for Silverpoint Skin Editor is made of a SKN file describing the logical structure of the skin. This is a text file that follows a specific format and it is used by the skin engine to skin the application's controls.

Getting Started

When Skin Editor is opened you have the option to create a new skin, open an existing one or create a skin based on a template.

Skin Editor has 4 sections or panes:

  1. Elements: this pane has a list of every control/element and their different states.
  2. Skin Properties: shows the skin properties and their values. Some of the properties you can change are:
    • Name: the skin name.
    • Author: the skin author.
    • Office Icons: when set to true the menu item icons are painted with shadows (imitating Office).
    • Office Menu: when set to true the height of the separators on popup menus is 6 pixels (imitating Office), otherwise the size is 10 pixels. Also when the items are disabled the hottrack is not painted.
    • Office Statusbar: when set to true the Statusbar panels are painted with rectangular separators like Office.
  3. Element Properties: shows the selected element properties. Some of the properties you can change are:
    • Body: to edit the Body properties select the type of the Body and change the gradient colors, Solid uses 1 color, the Simple Gradients uses 2, and the rest uses 4 colors.
    • Borders: to edit the Borders properties select the type of the Borders and change the border colors. You can specify the external and internal borders.
    • Text: specifies the text color.
  4. Preview: this pane shows the preview of the skin.

Creating a New Skin

  1. Create a new project by clicking the New button on the toolbar.
  2. Specify the Skin Name and Author on the New Skin dialog.
    You can also create a skin based upon a template.
  3. You can now start editing the skin.
    An element can consist of several states, for instance the Button element has 6 states (Normal, Disabled, Hot, Pushed, Checked, Checked & Hot), while other elements have just a few like the ProgressBar element that has only 2 states (Normal, Hot).
    To access a specific element property, you must first locate the element on the Elements pane and then select the corresponding state, when the state is selected the properties will be showed on the Element Properties pane.

For more info go to: http://www.silverpointdevelopment.com

License

The contents of this package are licensed under the terms of the Mozilla Public License Version 1.1, found at:
http://www.mozilla.org/MPL/MPL-1.1.html

Software is distributed on an "AS IS" basis, WITHOUT WARRANTY OF ANY KIND, either express or implied.

The initial developer of this package is Robert Lee.

About

With Silverpoint Skin Editor easily create and modify skins of applications based on SpTBXLib.

Topics

Resources

Stars

5 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Auto-enable theater mode on YouTube\n(function() {\n function tryTheater() {\n var btn = document.querySelector('button[aria-label=\"Theater mode\"], ytd-player #player button[title=\"Theater mode\"]');\n if (btn && !btn.classList.contains('activated')) {\n btn.click();\n }\n }\n \n // Try immediately\n tryTheater();\n \n // Try after navigation (SPA)\n var lastUrl = location.href;\n setInterval(function() {\n if (location.href !== lastUrl) {\n lastUrl = location.href;\n setTimeout(tryTheater, 500);\n }\n }, 1000);\n \n // Also try on player load\n var observer = new MutationObserver(tryTheater);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "YouTube Theater Mode Default"); } } catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

Latest commit

History

2 Commits

Folders and files

NameName
Last commit message
Last commit date

Repository files navigation

Silverpoint Skin Editor

With the help of Silverpoint Skin Editor designers will be able to easily create and modify skins of applications based on SpTBXLib.

Basic Concepts

The term skin refers to the concept of changing the software's look and feel, making it aesthetically pleasing. Software that is capable of having a skin applied is referred to as being skinnable, and the process of writing or applying such a skin is known as skinning.

A skin for Silverpoint Skin Editor is made of a SKN file describing the logical structure of the skin. This is a text file that follows a specific format and it is used by the skin engine to skin the application's controls.

Getting Started

When Skin Editor is opened you have the option to create a new skin, open an existing one or create a skin based on a template.

Skin Editor has 4 sections or panes:

  1. Elements: this pane has a list of every control/element and their different states.
  2. Skin Properties: shows the skin properties and their values. Some of the properties you can change are:
    • Name: the skin name.
    • Author: the skin author.
    • Office Icons: when set to true the menu item icons are painted with shadows (imitating Office).
    • Office Menu: when set to true the height of the separators on popup menus is 6 pixels (imitating Office), otherwise the size is 10 pixels. Also when the items are disabled the hottrack is not painted.
    • Office Statusbar: when set to true the Statusbar panels are painted with rectangular separators like Office.
  3. Element Properties: shows the selected element properties. Some of the properties you can change are:
    • Body: to edit the Body properties select the type of the Body and change the gradient colors, Solid uses 1 color, the Simple Gradients uses 2, and the rest uses 4 colors.
    • Borders: to edit the Borders properties select the type of the Borders and change the border colors. You can specify the external and internal borders.
    • Text: specifies the text color.
  4. Preview: this pane shows the preview of the skin.

Creating a New Skin

  1. Create a new project by clicking the New button on the toolbar.
  2. Specify the Skin Name and Author on the New Skin dialog.
    You can also create a skin based upon a template.
  3. You can now start editing the skin.
    An element can consist of several states, for instance the Button element has 6 states (Normal, Disabled, Hot, Pushed, Checked, Checked & Hot), while other elements have just a few like the ProgressBar element that has only 2 states (Normal, Hot).
    To access a specific element property, you must first locate the element on the Elements pane and then select the corresponding state, when the state is selected the properties will be showed on the Element Properties pane.

For more info go to: http://www.silverpointdevelopment.com

License

The contents of this package are licensed under the terms of the Mozilla Public License Version 1.1, found at:
http://www.mozilla.org/MPL/MPL-1.1.html

Software is distributed on an "AS IS" basis, WITHOUT WARRANTY OF ANY KIND, either express or implied.

The initial developer of this package is Robert Lee.

About

With Silverpoint Skin Editor easily create and modify skins of applications based on SpTBXLib.

Topics

Resources

Stars

5 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Remove or un-stick sticky/fixed headers that block content\n(function() {\n function unstick() {\n document.querySelectorAll('header, nav, [role=\"banner\"], .header, .navbar, .sticky, .fixed-top, [style*=\"position: fixed\"], [style*=\"position:sticky\"]').forEach(function(el) {\n if (el.style.position === 'fixed' || el.style.position === 'sticky' || \n getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') {\n el.style.position = 'static';\n el.style.top = 'auto';\n el.style.zIndex = 'auto';\n }\n });\n }\n \n unstick();\n \n var observer = new MutationObserver(unstick);\n observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] });\n})();", "Kill Sticky Headers"); } } catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

Latest commit

History

2 Commits

Folders and files

NameName
Last commit message
Last commit date

Repository files navigation

Silverpoint Skin Editor

With the help of Silverpoint Skin Editor designers will be able to easily create and modify skins of applications based on SpTBXLib.

Basic Concepts

The term skin refers to the concept of changing the software's look and feel, making it aesthetically pleasing. Software that is capable of having a skin applied is referred to as being skinnable, and the process of writing or applying such a skin is known as skinning.

A skin for Silverpoint Skin Editor is made of a SKN file describing the logical structure of the skin. This is a text file that follows a specific format and it is used by the skin engine to skin the application's controls.

Getting Started

When Skin Editor is opened you have the option to create a new skin, open an existing one or create a skin based on a template.

Skin Editor has 4 sections or panes:

  1. Elements: this pane has a list of every control/element and their different states.
  2. Skin Properties: shows the skin properties and their values. Some of the properties you can change are:
    • Name: the skin name.
    • Author: the skin author.
    • Office Icons: when set to true the menu item icons are painted with shadows (imitating Office).
    • Office Menu: when set to true the height of the separators on popup menus is 6 pixels (imitating Office), otherwise the size is 10 pixels. Also when the items are disabled the hottrack is not painted.
    • Office Statusbar: when set to true the Statusbar panels are painted with rectangular separators like Office.
  3. Element Properties: shows the selected element properties. Some of the properties you can change are:
    • Body: to edit the Body properties select the type of the Body and change the gradient colors, Solid uses 1 color, the Simple Gradients uses 2, and the rest uses 4 colors.
    • Borders: to edit the Borders properties select the type of the Borders and change the border colors. You can specify the external and internal borders.
    • Text: specifies the text color.
  4. Preview: this pane shows the preview of the skin.

Creating a New Skin

  1. Create a new project by clicking the New button on the toolbar.
  2. Specify the Skin Name and Author on the New Skin dialog.
    You can also create a skin based upon a template.
  3. You can now start editing the skin.
    An element can consist of several states, for instance the Button element has 6 states (Normal, Disabled, Hot, Pushed, Checked, Checked & Hot), while other elements have just a few like the ProgressBar element that has only 2 states (Normal, Hot).
    To access a specific element property, you must first locate the element on the Elements pane and then select the corresponding state, when the state is selected the properties will be showed on the Element Properties pane.

For more info go to: http://www.silverpointdevelopment.com

License

The contents of this package are licensed under the terms of the Mozilla Public License Version 1.1, found at:
http://www.mozilla.org/MPL/MPL-1.1.html

Software is distributed on an "AS IS" basis, WITHOUT WARRANTY OF ANY KIND, either express or implied.

The initial developer of this package is Robert Lee.

About

With Silverpoint Skin Editor easily create and modify skins of applications based on SpTBXLib.

Topics

Resources

Stars

5 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Universal Dark Mode - works on any site\n(function() {\n var enabled = true;\n \n function applyDarkMode() {\n if (!enabled) return;\n \n // Create style element if it doesn't exist\n var style = document.getElementById('universal-dark-mode-style');\n if (!style) {\n style = document.createElement('style');\n style.id = 'universal-dark-mode-style';\n document.head.appendChild(style);\n }\n \n // Dark mode CSS - inverts colors but preserves images/video\n style.textContent = '\n /* Invert everything except media */\n html {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #1a1a2e !important;\n }\n \n /* Restore images, videos, iframes, canvas */\n img, video, iframe, canvas, svg, picture, [style*=\"background-image\"] {\n filter: invert(1) hue-rotate(180deg) !important;\n }\n \n /* Preserve specific elements that should not be inverted */\n .no-dark-mode, .no-dark-mode *,\n [data-theme=\"light\"], [data-theme=\"light\"],\n .ace_editor, .ace_editor *,\n .CodeMirror, .CodeMirror *,\n .monaco-editor, .monaco-editor *,\n .markdown-body pre, .markdown-body pre *,\n .highlight, .highlight *,\n pre code, pre code * {\n filter: none !important;\n }\n \n /* Fix common UI elements */\n .modal, .popup, .dropdown-menu, .tooltip, .popover {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #2d2d44 !important;\n border-color: #444 !important;\n }\n \n /* Scrollbars */\n ::-webkit-scrollbar { background: #1a1a2e !important; }\n ::-webkit-scrollbar-thumb { background: #444 !important; }\n ::-webkit-scrollbar-thumb:hover { background: #555 !important; }\n \n /* Selection */\n ::selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ';\n }\n \n function removeDarkMode() {\n var style = document.getElementById('universal-dark-mode-style');\n if (style) style.remove();\n }\n \n // Toggle with Alt+Shift+D\n document.addEventListener('keydown', function(e) {\n if (e.altKey && e.shiftKey && e.key === 'D') {\n e.preventDefault();\n enabled = !enabled;\n if (enabled) {\n applyDarkMode();\n console.log('[Universal Dark Mode] Enabled');\n } else {\n removeDarkMode();\n console.log('[Universal Dark Mode] Disabled');\n }\n }\n });\n \n // Apply on load\n applyDarkMode();\n \n // Re-apply on dynamic content\n var observer = new MutationObserver(function(mutations) {\n if (enabled && !document.getElementById('universal-dark-mode-style')) {\n applyDarkMode();\n }\n });\n observer.observe(document.head, { childList: true });\n \n console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle');\n})();", "Universal Dark Mode"); } } catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); } })(); })();
Skip to content

Latest commit

History

2 Commits

Folders and files

NameName
Last commit message
Last commit date

Repository files navigation

Silverpoint Skin Editor

With the help of Silverpoint Skin Editor designers will be able to easily create and modify skins of applications based on SpTBXLib.

Basic Concepts

The term skin refers to the concept of changing the software's look and feel, making it aesthetically pleasing. Software that is capable of having a skin applied is referred to as being skinnable, and the process of writing or applying such a skin is known as skinning.

A skin for Silverpoint Skin Editor is made of a SKN file describing the logical structure of the skin. This is a text file that follows a specific format and it is used by the skin engine to skin the application's controls.

Getting Started

When Skin Editor is opened you have the option to create a new skin, open an existing one or create a skin based on a template.

Skin Editor has 4 sections or panes:

  1. Elements: this pane has a list of every control/element and their different states.
  2. Skin Properties: shows the skin properties and their values. Some of the properties you can change are:
    • Name: the skin name.
    • Author: the skin author.
    • Office Icons: when set to true the menu item icons are painted with shadows (imitating Office).
    • Office Menu: when set to true the height of the separators on popup menus is 6 pixels (imitating Office), otherwise the size is 10 pixels. Also when the items are disabled the hottrack is not painted.
    • Office Statusbar: when set to true the Statusbar panels are painted with rectangular separators like Office.
  3. Element Properties: shows the selected element properties. Some of the properties you can change are:
    • Body: to edit the Body properties select the type of the Body and change the gradient colors, Solid uses 1 color, the Simple Gradients uses 2, and the rest uses 4 colors.
    • Borders: to edit the Borders properties select the type of the Borders and change the border colors. You can specify the external and internal borders.
    • Text: specifies the text color.
  4. Preview: this pane shows the preview of the skin.

Creating a New Skin

  1. Create a new project by clicking the New button on the toolbar.
  2. Specify the Skin Name and Author on the New Skin dialog.
    You can also create a skin based upon a template.
  3. You can now start editing the skin.
    An element can consist of several states, for instance the Button element has 6 states (Normal, Disabled, Hot, Pushed, Checked, Checked & Hot), while other elements have just a few like the ProgressBar element that has only 2 states (Normal, Hot).
    To access a specific element property, you must first locate the element on the Elements pane and then select the corresponding state, when the state is selected the properties will be showed on the Element Properties pane.

For more info go to: http://www.silverpointdevelopment.com

License

The contents of this package are licensed under the terms of the Mozilla Public License Version 1.1, found at:
http://www.mozilla.org/MPL/MPL-1.1.html

Software is distributed on an "AS IS" basis, WITHOUT WARRANTY OF ANY KIND, either express or implied.

The initial developer of this package is Robert Lee.

About

With Silverpoint Skin Editor easily create and modify skins of applications based on SpTBXLib.

Topics

Resources

Stars

5 stars

Watchers

1 watching

Forks

Releases

Packages

Contributors

Languages