diff --git a/src/LiveDevelopment/LivePreviewConstants.js b/src/LiveDevelopment/LivePreviewConstants.js index 3a99822b77..7589613d90 100644 --- a/src/LiveDevelopment/LivePreviewConstants.js +++ b/src/LiveDevelopment/LivePreviewConstants.js @@ -44,5 +44,5 @@ define(function main(require, exports, module) { exports.PREFERENCE_SHOW_STYLES_BAR = "livePreviewShowStylesBar"; - exports.PREFERENCE_STYLES_BAR_DOCK = "livePreviewStylesBarDock"; + exports.PREFERENCE_STYLES_BAR_POSITION = "livePreviewStylesBarPosition"; }); diff --git a/src/LiveDevelopment/main.js b/src/LiveDevelopment/main.js index ba9ef2d3cc..4d64985873 100644 --- a/src/LiveDevelopment/main.js +++ b/src/LiveDevelopment/main.js @@ -72,7 +72,7 @@ define(function main(require, exports, module) { elemHighlights: CONSTANTS.HIGHLIGHT_HOVER, // default value, this will get updated when the extension loads showRulerLines: false, // default value, this will get updated when the extension loads showStylesBar: true, // default value, this will get updated when the extension loads - stylesBarDock: "bottom", // default dock side, this will get updated when the extension loads + stylesBarPosition: "", // saved bar position (":"); empty = default spot syncSourceAndPreview: true, // default value, this will get updated when the extension loads imageGalleryAutoOpen: true, // auto-open gallery on first image click per session isPaidUser: false, // will be updated when we fetch entitlements @@ -345,10 +345,10 @@ define(function main(require, exports, module) { MultiBrowserLiveDev.updateConfig(config); } - function updateStylesBarDockConfig() { - const prefValue = PreferencesManager.get(CONSTANTS.PREFERENCE_STYLES_BAR_DOCK); + function updateStylesBarPositionConfig() { + const prefValue = PreferencesManager.get(CONSTANTS.PREFERENCE_STYLES_BAR_POSITION); const config = MultiBrowserLiveDev.getConfig(); - config.stylesBarDock = prefValue || "bottom"; + config.stylesBarPosition = prefValue || ""; MultiBrowserLiveDev.updateConfig(config); } @@ -376,7 +376,7 @@ define(function main(require, exports, module) { exports.updateElementHighlightConfig = updateElementHighlightConfig; exports.updateRulerLinesConfig = updateRulerLinesConfig; exports.updateStylesBarConfig = updateStylesBarConfig; - exports.updateStylesBarDockConfig = updateStylesBarDockConfig; + exports.updateStylesBarPositionConfig = updateStylesBarPositionConfig; exports.getConnectionIds = MultiBrowserLiveDev.getConnectionIds; exports.getLivePreviewDetails = MultiBrowserLiveDev.getLivePreviewDetails; exports.hideHighlight = MultiBrowserLiveDev.hideHighlight; diff --git a/src/extensionsIntegrated/Phoenix-live-preview/main.js b/src/extensionsIntegrated/Phoenix-live-preview/main.js index 71604883d3..8fb0211052 100644 --- a/src/extensionsIntegrated/Phoenix-live-preview/main.js +++ b/src/extensionsIntegrated/Phoenix-live-preview/main.js @@ -121,11 +121,10 @@ define(function (require, exports, module) { description: Strings.LIVE_DEV_SETTINGS_SHOW_STYLES_BAR_PREFERENCE }); - // live preview styles bar dock side preference (where the bar docks); persists user choice - const PREFERENCE_STYLES_BAR_DOCK = CONSTANTS.PREFERENCE_STYLES_BAR_DOCK; - PreferencesManager.definePreference(PREFERENCE_STYLES_BAR_DOCK, "string", "bottom", { - description: Strings.LIVE_DEV_SETTINGS_STYLES_BAR_DOCK_PREFERENCE, - values: ["top", "bottom", "left", "right"] + // live preview styles bar position preference; persists where the user last dragged the bar + const PREFERENCE_STYLES_BAR_POSITION = CONSTANTS.PREFERENCE_STYLES_BAR_POSITION; + PreferencesManager.definePreference(PREFERENCE_STYLES_BAR_POSITION, "string", "", { + description: Strings.LIVE_DEV_SETTINGS_STYLES_BAR_POSITION_PREFERENCE }); const LIVE_PREVIEW_PANEL_ID = "live-preview-panel"; @@ -1556,14 +1555,14 @@ define(function (require, exports, module) { PreferencesManager.on("change", PREFERENCE_SHOW_STYLES_BAR, function() { LiveDevelopment.updateStylesBarConfig(); }); - PreferencesManager.on("change", PREFERENCE_STYLES_BAR_DOCK, function() { - LiveDevelopment.updateStylesBarDockConfig(); + PreferencesManager.on("change", PREFERENCE_STYLES_BAR_POSITION, function() { + LiveDevelopment.updateStylesBarPositionConfig(); }); // Initialize element highlight, ruler lines and styles bar config on startup LiveDevelopment.updateElementHighlightConfig(); LiveDevelopment.updateRulerLinesConfig(); LiveDevelopment.updateStylesBarConfig(); - LiveDevelopment.updateStylesBarDockConfig(); + LiveDevelopment.updateStylesBarPositionConfig(); LiveDevelopment.openLivePreview(); LiveDevelopment.on(LiveDevelopment.EVENT_OPEN_PREVIEW_URL, _openLivePreviewURL); diff --git a/src/nls/root/strings.js b/src/nls/root/strings.js index 0197e24a47..6ba9b2a279 100644 --- a/src/nls/root/strings.js +++ b/src/nls/root/strings.js @@ -184,7 +184,7 @@ define({ "LIVE_DEV_SETTINGS_ELEMENT_HIGHLIGHT_PREFERENCE": "Inspect element in Live Preview on 'hover' or 'click'. Defaults to 'hover'", "LIVE_DEV_SETTINGS_SHOW_RULER_LINES_PREFERENCE": "Show measurements when elements are selected in live preview. Defaults to 'false'", "LIVE_DEV_SETTINGS_SHOW_STYLES_BAR_PREFERENCE": "Show the styles bar when elements are selected in live preview. Defaults to 'true'", - "LIVE_DEV_SETTINGS_STYLES_BAR_DOCK_PREFERENCE": "Which side the live preview styles bar docks to: 'top', 'bottom', 'left' or 'right'. Defaults to 'bottom'", + "LIVE_DEV_SETTINGS_STYLES_BAR_POSITION_PREFERENCE": "Saved position of the live preview styles bar, set automatically when the bar is dragged. Empty places the bar at its default spot", "LIVE_DEV_TOOLBOX_SELECT_PARENT": "Select Parent", "LIVE_DEV_TOOLBOX_EDIT_TEXT": "Edit Text", "LIVE_DEV_TOOLBOX_DOUBLE_CLICK_HINT": "Double-click", @@ -202,17 +202,11 @@ define({ "LIVE_DEV_STYLER_FONT": "Font family", "LIVE_DEV_STYLER_SIZE": "Font size", "LIVE_DEV_STYLER_WEIGHT": "Font weight", - "LIVE_DEV_STYLER_WEIGHT_CYCLE_HINT": "Click to cycle Regular / Bold / Black · Shift-click for all weights", "LIVE_DEV_STYLER_ALIGN": "Text alignment", "LIVE_DEV_STYLER_BORDER": "Border", "LIVE_DEV_STYLER_SPACING": "Margin & padding", "LIVE_DEV_STYLER_LAYOUT": "Layout", "LIVE_DEV_STYLER_TEXT_STYLE": "Text style", - "LIVE_DEV_STYLER_DOCK": "Dock position", - "LIVE_DEV_STYLER_DOCK_TOP": "Move bar to top", - "LIVE_DEV_STYLER_DOCK_BOTTOM": "Move bar to bottom", - "LIVE_DEV_STYLER_DOCK_LEFT": "Move bar to left", - "LIVE_DEV_STYLER_DOCK_RIGHT": "Move bar to right", "LIVE_DEV_STYLER_RESET": "Reset changes", "LIVE_DEV_STYLER_NOTHING_TO_RESET": "No changes to reset", "LIVE_DEV_STYLER_OVERRIDDEN": "This change is overridden by a more specific rule", @@ -223,8 +217,6 @@ define({ "LIVE_DEV_STYLER_SEARCH_FONTS": "Search fonts…", "LIVE_DEV_STYLER_FONTS_GOOGLE": "Google", "LIVE_DEV_STYLER_FONTS_SYSTEM": "System", - "LIVE_DEV_STYLER_FONTS_CUSTOM": "Custom", - "LIVE_DEV_STYLER_FONT_USE_CUSTOM": "Use \"{0}\"", "LIVE_DEV_STYLER_NO_FONTS_FOUND": "No fonts found", "LIVE_DEV_STYLER_LOAD_MORE": "Load more", "LIVE_DEV_STYLER_FONTS_MANUAL": "Manual", @@ -250,7 +242,6 @@ define({ "LIVE_DEV_STYLER_FORMAT_TAB": "Format", "LIVE_DEV_STYLER_SPACING_TAB": "Spacing", "LIVE_DEV_STYLER_CASE": "Case", - "LIVE_DEV_STYLER_BOLD": "Bold", "LIVE_DEV_STYLER_ITALIC": "Italic", "LIVE_DEV_STYLER_UNDERLINE": "Underline", "LIVE_DEV_STYLER_OVERLINE": "Overline", @@ -314,6 +305,8 @@ define({ "LIVE_DEV_STYLER_OUTLINE": "Outline", "LIVE_DEV_STYLER_OFFSET": "Offset", "LIVE_DEV_STYLER_BORDER_AND_OUTLINE": "Border & Outline", + "LIVE_DEV_STYLER_BORDER_COLOR": "Border color", + "LIVE_DEV_STYLER_OUTLINE_COLOR": "Outline color", "LIVE_DEV_STYLER_SIDE": "Side", "LIVE_DEV_STYLER_PADDING": "Padding", "LIVE_DEV_STYLER_MARGIN": "Margin", @@ -322,6 +315,9 @@ define({ "LIVE_DEV_STYLER_LINK_NONE": "Independent sides - each side has its own value", "LIVE_DEV_STYLER_LINK_PAIRED": "Paired - top & bottom linked, left & right linked", "LIVE_DEV_STYLER_LINK_ALL": "All sides linked - one value for every side", + "LIVE_DEV_STYLER_LINK_NONE_SHORT": "Independent", + "LIVE_DEV_STYLER_LINK_PAIRED_SHORT": "Paired", + "LIVE_DEV_STYLER_LINK_ALL_SHORT": "All linked", "LIVE_DEV_STYLER_LINK_CYCLE_HINT": "Click to change how sides are linked", "LIVE_DEV_STYLER_ALL_SIDES": "All", "LIVE_DEV_STYLER_TOP": "Top", @@ -408,6 +404,7 @@ define({ "LIVE_DEV_STYLER_MAX_WIDTH": "Max width", "LIVE_DEV_STYLER_MIN_HEIGHT": "Min height", "LIVE_DEV_STYLER_MAX_HEIGHT": "Max height", + "LIVE_DEV_STYLER_LIMITS": "Min / max", "LIVE_DEV_STYLER_LIMITS_SHOW": "Show min / max size limits", "LIVE_DEV_STYLER_LIMITS_HIDE": "Hide min / max size limits", "LIVE_DEV_STYLER_OPACITY": "Opacity",