From 130366e5f6b4a1b04f99d4630a1587751edbdbf6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Fla=CC=81vio=20Rodrigues?= Date: Thu, 20 Oct 2016 10:58:41 -0200 Subject: [PATCH] Customizing the panel style to make it fancy Used the browser style property to make it possible to use the firefox style guide. more info on the guide, see the link: https://firefoxux.github.io/StyleGuide/#/controls --- tabs-tabs-tabs/manifest.json | 1 + tabs-tabs-tabs/tabs.css | 13 ++++++++++++ tabs-tabs-tabs/tabs.html | 38 ++++++++++++++++++++++++++---------- tabs-tabs-tabs/tabs.js | 7 +++++++ 4 files changed, 49 insertions(+), 10 deletions(-) diff --git a/tabs-tabs-tabs/manifest.json b/tabs-tabs-tabs/manifest.json index 6877e80..6600171 100644 --- a/tabs-tabs-tabs/manifest.json +++ b/tabs-tabs-tabs/manifest.json @@ -6,6 +6,7 @@ } }, "browser_action": { + "browser_style": true, "default_title": "Tabs, tabs, tabs", "default_popup": "tabs.html" }, diff --git a/tabs-tabs-tabs/tabs.css b/tabs-tabs-tabs/tabs.css index 8620216..d95f922 100644 --- a/tabs-tabs-tabs/tabs.css +++ b/tabs-tabs-tabs/tabs.css @@ -1,3 +1,16 @@ html, body { width: 350px; } + +a { + margin: 10px; + display: inline-block; +} + +button { + margin:10px; +} + +.panel { + margin: 5px; +} diff --git a/tabs-tabs-tabs/tabs.html b/tabs-tabs-tabs/tabs.html index e286521..7b4c5d2 100644 --- a/tabs-tabs-tabs/tabs.html +++ b/tabs-tabs-tabs/tabs.html @@ -7,16 +7,34 @@ - Move active tab to the beginning of the window
- Move active tab to the end of the window
- Duplicate active tab
- Reload active tab
- Remove active tab
- Create a tab
- Alert active tab info
- Zoom in
- Zoom out
- Reset zoom
+
+
+
Tabs-tabs-tabs
+
+ + Move active tab to the beginning of the window
+ Move active tab to the end of the window
+ +
+ + Duplicate active tab
+ Reload active tab
+ Alert active tab info
+ +
+ + Create a tab
+ Remove active tab
+ +
+ + + + + + +
+ diff --git a/tabs-tabs-tabs/tabs.js b/tabs-tabs-tabs/tabs.js index 65a17b6..1e15397 100644 --- a/tabs-tabs-tabs/tabs.js +++ b/tabs-tabs-tabs/tabs.js @@ -84,6 +84,9 @@ document.addEventListener("click", function(e) { alert("Tab zoom factor is already at max!"); } else { var newZoomFactor = zoomFactor + ZOOM_INCREMENT; + //if the newZoomFactor is set to higher than the max accepted + //it won't change, and will never alert that it's at maximum + newZoomFactor = newZoomFactor > MAX_ZOOM ? MAX_ZOOM : newZoomFactor; chrome.tabs.setZoom(tab.id, newZoomFactor); } }); @@ -94,10 +97,14 @@ document.addEventListener("click", function(e) { callOnActiveTab((tab) => { chrome.tabs.getZoom(tab.id, function(zoomFactor){ //the minimum zoomFactor is 0.3, it can't go lower + console.log(zoomFactor) if (zoomFactor <= MIN_ZOOM) { alert("Tab zoom factor is already at minimum!"); } else { var newZoomFactor = zoomFactor - ZOOM_INCREMENT; + //if the newZoomFactor is set to lower than the min accepted + //it won't change, and will never alert that it's at minimum + newZoomFactor = newZoomFactor < MIN_ZOOM ? MIN_ZOOM : newZoomFactor; chrome.tabs.setZoom(tab.id, newZoomFactor); } });