Bump edit-design plugin version

Fix custom font size in edit-design & time font in example notification
Fix separator before 'Open dev tools' in example notification context menu
2025-09-14 10:32:10 +02:00 · 2017-10-12 10:58:12 +02:00 · 2017-10-11 20:42:42 +02:00 · 2017-10-11 20:34:50 +02:00 · 2017-10-11 20:33:39 +02:00 · 2017-10-11 20:24:09 +02:00
10 changed files with 87 additions and 61 deletions
--- a/Core/Bridge/TweetDeckBridge.cs
+++ b/Core/Bridge/TweetDeckBridge.cs
@@ -11,8 +11,8 @@ using TweetDuck.Resources;
 namespace TweetDuck.Core.Bridge{
    sealed class TweetDeckBridge{
-        public static string FontSizeClass;
+        public static string FontSize { get; private set; }
-        public static string NotificationHeadContents;
+        public static string NotificationHeadLayout { get; private set; }
        public static string LastHighlightedTweetUrl = string.Empty;
        public static string LastHighlightedQuoteUrl = string.Empty;
@@ -25,7 +25,7 @@ namespace TweetDuck.Core.Bridge{
        private static readonly Dictionary<string, string> SessionData = new Dictionary<string, string>(2);
        public static void ResetStaticProperties(){
-            FontSizeClass = NotificationHeadContents = null;
+            FontSize = NotificationHeadLayout = null;
            LastHighlightedTweetUrl = LastHighlightedQuoteUrl = LastHighlightedTweetAuthors = LastHighlightedTweetImages = string.Empty;
        }
@@ -56,12 +56,11 @@ namespace TweetDuck.Core.Bridge{
            });
        }
-        public void LoadFontSizeClass(string fsClass){
+        public void LoadNotificationLayout(string fontSize, string headLayout){
-            form.InvokeAsyncSafe(() => FontSizeClass = fsClass);
+            form.InvokeAsyncSafe(() => {
-        }
+                FontSize = fontSize;
-
+                NotificationHeadLayout = headLayout;
-        public void LoadNotificationHeadContents(string headContents){
+            });
            form.InvokeAsyncSafe(() => NotificationHeadContents = headContents);
        }
        public void SetLastRightClickInfo(string type, string link){
--- a/Core/Handling/ContextMenuNotification.cs
+++ b/Core/Handling/ContextMenuNotification.cs
@@ -48,7 +48,7 @@ namespace TweetDuck.Core.Handling{
            }
            if (HasDevTools){
-                model.AddSeparator();
+                AddSeparator(model);
                AddDebugMenuItems(model);
            }
--- a/Core/Notification/FormNotificationBase.cs
+++ b/Core/Notification/FormNotificationBase.cs
@@ -15,7 +15,7 @@ namespace TweetDuck.Core.Notification{
    partial class FormNotificationBase : Form{
        protected static int FontSizeLevel{
            get{
-                switch(TweetDeckBridge.FontSizeClass){
+                switch(TweetDeckBridge.FontSize){
                    case "largest": return 4;
                    case "large": return 3;
                    case "small": return 1;
--- a/Core/Notification/TweetNotification.cs
+++ b/Core/Notification/TweetNotification.cs
@@ -5,9 +5,7 @@ using TweetDuck.Resources;
 namespace TweetDuck.Core.Notification{
    sealed class TweetNotification{
-        private const string DefaultFontSizeClass = "medium";
+        private const string DefaultHeadLayout = @"<html class='os-windows txt-size--14' data-td-font='medium' data-td-theme='dark'><head><meta charset='utf-8'><meta http-equiv='X-UA-Compatible' content='chrome=1'><link rel='stylesheet' href='https://ton.twimg.com/tweetdeck-web/web/css/font.5ef884f9f9.css'><link rel='stylesheet' href='https://ton.twimg.com/tweetdeck-web/web/css/app-dark.5631e0dd42.css'><style type='text/css'>body{background:#222426}</style>";
        private const string DefaultHeadContents = @"<meta charset='utf-8'><meta http-equiv='X-UA-Compatible' content='chrome=1'><link rel='stylesheet' href='https://ton.twimg.com/tweetdeck-web/web/css/font.5ef884f9f9.css'><link rel='stylesheet' href='https://ton.twimg.com/tweetdeck-web/web/css/app-dark.5631e0dd42.css'><style type='text/css'>body{background:#222426}</style>";
        private static readonly string CustomCSS = ScriptLoader.LoadResource("styles/notification.css");
        private static string ExampleTweetHTML;
@@ -67,8 +65,7 @@ namespace TweetDuck.Core.Notification{
        public string GenerateHtml(string bodyClasses = null, bool enableCustomCSS = true){
            StringBuilder build = new StringBuilder();
            build.Append("<!DOCTYPE html>");
-            build.Append("<html class='os-windows txt-base-").Append(TweetDeckBridge.FontSizeClass ?? DefaultFontSizeClass).Append("'>");
+            build.Append(TweetDeckBridge.NotificationHeadLayout ?? DefaultHeadLayout);
            build.Append("<head>").Append(TweetDeckBridge.NotificationHeadContents ?? DefaultHeadContents);
            if (enableCustomCSS){
                build.Append("<style type='text/css'>").Append(CustomCSS).Append("</style>");
--- a/README.md
+++ b/README.md
@@ -1,3 +1,11 @@
 # Support
 [Follow TweetDuck on Twitter](https://twitter.com/TryTweetDuck) &nbsp;|&nbsp; [Support via PayPal](https://paypal.me/chylex) &nbsp;|&nbsp; [Support via Patreon](https://www.patreon.com/chylex)
 <a target='_blank' rel='nofollow' href='https://app.codesponsor.io/link/2W76v7hRmUe7NfaeUKq9K8Wq/chylex/TweetDuck'>
  <img alt='Sponsor' width='888' height='68' src='https://app.codesponsor.io/embed/2W76v7hRmUe7NfaeUKq9K8Wq/chylex/TweetDuck.svg' />
 </a>
 # Build Instructions
 ### Setup
--- a/Resources/Plugins/edit-design/.meta
+++ b/Resources/Plugins/edit-design/.meta
@@ -8,10 +8,10 @@ Edit layout & design
 chylex
 [version]
-1.1.3
+1.1.4
 [website]
 https://tweetduck.chylex.com
 [requires]
-1.7
+1.10.2
--- a/Resources/Plugins/edit-design/browser.js
+++ b/Resources/Plugins/edit-design/browser.js
@@ -331,7 +331,7 @@ enabled(){
    this.css.insert("#general_settings .cf { display: none !important }");
    this.css.insert("#settings-modal .js-setting-list li:nth-child(3) { border-bottom: 1px solid #ccd6dd }");
-    this.css.insert(".txt-base-smallest:not(.icon), .txt-base-largest:not(.icon) { font-size: "+this.config.fontSize+" !important }");
+    this.css.insert("html[data-td-font] { font-size: "+this.config.fontSize+" !important }");
    this.css.insert(".avatar { border-radius: "+this.config.avatarRadius+"% !important }");
    let notificationScrollbarColor = null;
@@ -507,7 +507,7 @@ enabled(){
    $TDP.injectIntoNotificationsBefore(this.$token, "css", "</head>", `
 <style type='text/css'>
-.txt-base-smallest:not(.icon), .txt-base-largest:not(.icon) { font-size: ${this.config.fontSize} !important }
+html[data-td-font] { font-size: ${this.config.fontSize} !important }
 .avatar { border-radius: ${this.config.avatarRadius}% !important }
 ${this.config.revertIcons ? `
--- a/Resources/Scripts/code.js
+++ b/Resources/Scripts/code.js
@@ -14,6 +14,11 @@
  //
  var onAppReady = [];
  //
  // Variable: DOM HTML element.
  //
  var doc = document.documentElement;
  //
  // Variable: DOM object containing the main app element.
  //
@@ -258,49 +263,62 @@
  })();
  //
-  // Function: Retrieves the tags to be put into <head> for notification HTML code.
+  // Block: Hook into settings object to detect when the settings change, and update html attributes and notification layout.
  //
-  var getNotificationHeadContents = function(){
+  (function(){
-    let tags = [];
+    let refreshSettings = function(){      
      let fontSizeName = TD.settings.getFontSize();
      let themeName = TD.settings.getTheme();
      let tags = [
        `<html class='os-windows ${(doc.getAttribute("class").match(/txt-\S+/) || [ "txt-size--14" ])[0]}' data-td-font='${fontSizeName}' data-td-theme='${themeName}'><head>`
      ];
      $(document.head).children("link[rel='stylesheet']:not([title]),link[title='"+themeName+"'],meta[charset],meta[http-equiv]").each(function(){
        tags.push($(this)[0].outerHTML);
      });
      tags.push("<style type='text/css'>");
      tags.push("body { background: "+getClassStyleProperty("column", "background-color")+" }"); // set background color
      tags.push("a[data-full-url] { word-break: break-all }"); // break long urls
      tags.push(".media-item, .media-preview { border-radius: 1px !important }"); // square-ify media
      tags.push(".quoted-tweet { border-radius: 0 !important }"); // square-ify quoted tweets
      tags.push(".activity-header { align-items: center !important; margin-bottom: 4px }"); // tweak alignment of avatar and text in notifications
      tags.push(".activity-header .tweet-timestamp { line-height: unset }"); // fix timestamp position in notifications
      if (fontSizeName === "smallest"){
        tags.push(".badge-verified:before { width: 13px !important; height: 13px !important; background-position: -223px -98px !important }"); // fix cut off badge icon
      }
      tags.push("</style>");
      doc.setAttribute("data-td-font", fontSizeName);
      doc.setAttribute("data-td-theme", themeName);
      $TD.loadNotificationLayout(fontSizeName, tags.join(""));
    };
-    $(document.head).children("link[rel='stylesheet']:not([title]),link[title='"+TD.settings.getTheme()+"'],meta[charset],meta[http-equiv]").each(function(){
+    TD.settings.setFontSize = appendToFunction(TD.settings.setFontSize, function(name){
-      tags.push($(this)[0].outerHTML);
+      setTimeout(refreshSettings, 0);
    });
-    
+
-    tags.push("<style type='text/css'>");
+    TD.settings.setTheme = appendToFunction(TD.settings.setTheme, function(name){
-    tags.push("body { background: "+getClassStyleProperty("column", "background-color")+" }"); // set background color
+      setTimeout(refreshSettings, 0);
-    tags.push("a[data-full-url] { word-break: break-all }"); // break long urls
+    });
-    tags.push(".txt-base-smallest .badge-verified:before { width: 13px !important; height: 13px !important; background-position: -223px -98px !important }"); // fix cut off badge icon
+
-    tags.push(".media-item, .media-preview { border-radius: 1px !important }"); // square-ify media
+    onAppReady.push(refreshSettings);
-    tags.push(".quoted-tweet { border-radius: 0 !important }"); // square-ify quoted tweets
+  })();
    tags.push(".activity-header { align-items: center !important; margin-bottom: 4px }"); // tweak alignment of avatar and text in notifications
    tags.push(".activity-header .tweet-timestamp { line-height: unset }"); // fix timestamp position in notifications
    tags.push("</style>");
    return tags.join("");
  };
  //
-  // Block: Hook into settings object to detect when the settings change.
+  // Block: Fix OS name.
  //
-  TD.settings.setFontSize = appendToFunction(TD.settings.setFontSize, function(name){
+  if (ensurePropertyExists(TD, "util", "getOSName")){
-    $TD.loadFontSizeClass(name);
+    TD.util.getOSName = function(){
-  });
+      return "windows";
-  
+    };
  TD.settings.setTheme = appendToFunction(TD.settings.setTheme, function(name){
    document.documentElement.setAttribute("data-td-theme", name);
-    setTimeout(function(){
+    doc.classList.remove("os-");
-      $TD.loadNotificationHeadContents(getNotificationHeadContents());
+    doc.classList.add("os-windows");
-    }, 0);
+  }
  });
  onAppReady.push(function(){
    document.documentElement.setAttribute("data-td-theme", TD.settings.getTheme());
    $TD.loadFontSizeClass(TD.settings.getFontSize());
    $TD.loadNotificationHeadContents(getNotificationHeadContents());
  });
  //
  // Block: Enable popup notifications.
--- a/Resources/Scripts/pages/example.html
+++ b/Resources/Scripts/pages/example.html
@@ -3,7 +3,7 @@
    <div class="js-tweet tweet">
      <header class="tweet-header">
        <time class="tweet-timestamp js-timestamp pull-right txt-mute">
-          <a target="_blank" rel="url" href="https://twitter.com/chylexmc" class="txt-small">0s</a>
+          <a target="_blank" rel="url" href="https://twitter.com/chylexmc" class="txt-size-variable--12">0s</a>
        </time>
        <a target="_blank" rel="user" href="https://twitter.com/chylexmc" class="account-link link-complex block">
          <div class="obj-left item-img tweet-img">
--- a/Resources/Scripts/styles/browser.css
+++ b/Resources/Scripts/styles/browser.css
@@ -38,11 +38,15 @@
 /* Square-ify stuff */
 /********************/
-.btn, .mdl, .mdl-content, .app-search-fake, .app-search-input, .popover, .lst-modal, .media-item, .media-preview, .tooltip-inner {
+.btn, .mdl, .mdl-content, .app-search-fake, .app-search-input, .popover, .lst-modal, .tooltip-inner {
  border-radius: 1px !important;
 }
-.compose-text-container, .compose-reply-tweet, .compose-message-recipient-input-container, .compose-message-recipient {
+.media-item, .media-preview, .media-image, .js-media-added .br--4 {
  border-radius: 1px !important;
 }
 .compose-text-container, .compose-reply-tweet, .compose-message-recipient-input-container, .compose-message-recipient, .compose-media-bar-holder, .media-grid-container {
  border-radius: 0 !important;
 }
@@ -164,14 +168,14 @@ a[data-full-url] {
  vertical-align: 10%;
 }
-.txt-base-smallest .sprite-verified-mini {
+html[data-td-font='smallest'] .sprite-verified-mini {
  /* fix cut off badge when zoomed in */
  width: 13px !important;
  height: 13px !important;
  background-position: -223px -99px !important;
 }
-.txt-base-smallest .badge-verified:before {
+html[data-td-font='smallest'] .badge-verified:before {
  /* fix cut off badge in notifications */
  width: 13px !important;
  height: 13px !important;
Author	SHA1	Message	Date
chylex	ea53ce361f	Bump edit-design plugin version	2017-10-12 10:58:12 +02:00
chylex	2fce80b347	Fix custom font size in edit-design & time font in example notification	2017-10-11 20:42:42 +02:00
chylex	373c0b1cc3	Fix separator before 'Open dev tools' in example notification context menu	2017-10-11 20:34:50 +02:00
chylex	e5e1b7e608	Fix TweetDeck being unable to detect OS name	2017-10-11 20:33:39 +02:00
chylex	7e9221c9e0	Merge branch 'master' of https://github.com/chylex/TweetDuck	2017-10-11 20:24:09 +02:00
chylex	6b849f854e	Rewrite font size & theme handling, add <html> attributes to notifications	2017-10-11 20:22:32 +02:00
Daniel Chýlek	831f6bc744	Add support section to readme	2017-10-10 12:25:52 +02:00
chylex	d282a7a537	Fix border-radius in media upload previews	2017-10-08 05:43:54 +02:00