-
Notifications
You must be signed in to change notification settings - Fork 2.4k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #24 from brave/customize_tab_shape_mac
rectangle tabs for macOS
- Loading branch information
Showing
4 changed files
with
178 additions
and
0 deletions.
There are no files selected for viewing
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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,97 @@ | ||
diff --git a/chrome/browser/ui/cocoa/new_tab_button.mm b/chrome/browser/ui/cocoa/new_tab_button.mm | ||
index bd8f593b4560220bd52f4b3c3d48d5325e542151..58d0c0dd1de60fad2822cd1f135d380350de6fc6 100644 | ||
--- a/chrome/browser/ui/cocoa/new_tab_button.mm | ||
+++ b/chrome/browser/ui/cocoa/new_tab_button.mm | ||
@@ -25,7 +25,7 @@ enum class OverlayOption { | ||
DARKEN, | ||
}; | ||
|
||
-const NSSize newTabButtonImageSize = {34, 18}; | ||
+const NSSize newTabButtonImageSize = {19, 19}; | ||
|
||
NSImage* GetMaskImageFromCell(NewTabButtonCell* aCell) { | ||
return [aCell imageForState:image_button_cell::kDefaultState view:nil]; | ||
@@ -347,34 +347,30 @@ CGFloat LineWidthFromContext(CGContextRef context) { | ||
+ (NSBezierPath*)newTabButtonBezierPathWithLineWidth:(CGFloat)lineWidth { | ||
NSBezierPath* bezierPath = [NSBezierPath bezierPath]; | ||
|
||
- // This data comes straight from the SVG. | ||
- [bezierPath moveToPoint:NSMakePoint(15.2762236,30)]; | ||
+ const CGFloat closeBtnWidth = 35; | ||
+ const CGFloat closeBtnHeight = 30; | ||
+ const CGFloat closeBtnCornerRadius = 2; | ||
|
||
- [bezierPath curveToPoint:NSMakePoint(11.0354216,27.1770115) | ||
- controlPoint1:NSMakePoint(13.3667706,30) | ||
- controlPoint2:NSMakePoint(11.7297681,28.8344828)]; | ||
+ [bezierPath moveToPoint:NSMakePoint(0, 0 + closeBtnCornerRadius)]; | ||
|
||
- [bezierPath curveToPoint:NSMakePoint(7.28528951e-08,2.01431416) | ||
- controlPoint1:NSMakePoint(11.0354216,27.1770115) | ||
- controlPoint2:NSMakePoint(0.000412425082,3.87955717)]; | ||
+ [bezierPath curveToPoint:NSMakePoint(0 + closeBtnCornerRadius, 0) | ||
+ controlPoint1:NSMakePoint(0, 0) | ||
+ controlPoint2:NSMakePoint(0, 0)]; | ||
|
||
- [bezierPath curveToPoint:NSMakePoint(1.70510791,0) | ||
- controlPoint1:NSMakePoint(-0.000270516213,0.790325707) | ||
- controlPoint2:NSMakePoint(0.753255356,0)]; | ||
+ [bezierPath lineToPoint:NSMakePoint(closeBtnWidth - closeBtnCornerRadius, 0)]; | ||
+ [bezierPath curveToPoint:NSMakePoint(closeBtnWidth, 0 + closeBtnCornerRadius) | ||
+ controlPoint1:NSMakePoint(closeBtnWidth, 0) | ||
+ controlPoint2:NSMakePoint(closeBtnWidth, 0)]; | ||
|
||
- [bezierPath lineToPoint:NSMakePoint(48.7033642,0)]; | ||
+ [bezierPath lineToPoint:NSMakePoint(closeBtnWidth, closeBtnHeight - closeBtnCornerRadius)]; | ||
+ [bezierPath curveToPoint:NSMakePoint(closeBtnWidth - closeBtnCornerRadius, closeBtnHeight) | ||
+ controlPoint1:NSMakePoint(closeBtnWidth, closeBtnHeight) | ||
+ controlPoint2:NSMakePoint(closeBtnWidth, closeBtnHeight)]; | ||
|
||
- [bezierPath curveToPoint:NSMakePoint(52.9464653,2.82643678) | ||
- controlPoint1:NSMakePoint(50.6151163,0) | ||
- controlPoint2:NSMakePoint(52.2521188,1.16666667)]; | ||
- | ||
- [bezierPath curveToPoint:NSMakePoint(64.0268555,27.5961914) | ||
- controlPoint1:NSMakePoint(52.9464653,2.82643678) | ||
- controlPoint2:NSMakePoint(64.0268555,27.4111339)]; | ||
- | ||
- [bezierPath curveToPoint:NSMakePoint(62.2756294,30) | ||
- controlPoint1:NSMakePoint(64.0268555,28.5502144) | ||
- controlPoint2:NSMakePoint(63.227482,29.9977011)]; | ||
+ [bezierPath lineToPoint:NSMakePoint(0 + closeBtnCornerRadius, closeBtnHeight)]; | ||
+ [bezierPath curveToPoint:NSMakePoint(0, closeBtnHeight - closeBtnCornerRadius) | ||
+ controlPoint1:NSMakePoint(0, closeBtnHeight) | ||
+ controlPoint2:NSMakePoint(0, closeBtnHeight)]; | ||
|
||
[bezierPath closePath]; | ||
|
||
@@ -432,9 +428,11 @@ CGFloat LineWidthFromContext(CGContextRef context) { | ||
CGFloat buttonWidth = newTabButtonImageSize.width; | ||
|
||
// Bottom edge. | ||
- const CGFloat kBottomEdgeX = 9; | ||
+ const CGFloat kBottomEdgeX = 1; | ||
const CGFloat kBottomEdgeY = 1.2825; | ||
- const CGFloat kBottomEdgeWidth = 22; | ||
+ const CGFloat kBottomEdgeWidth = 17.5; //35/2 this is just for doubled line at the bottom | ||
+ | ||
+ | ||
NSPoint bottomEdgeStart = NSMakePoint(kBottomEdgeX, kBottomEdgeY); | ||
NSPoint bottomEdgeEnd = NSMakePoint(kBottomEdgeX + kBottomEdgeWidth, | ||
kBottomEdgeY); | ||
@@ -455,11 +453,13 @@ CGFloat LineWidthFromContext(CGContextRef context) { | ||
CGPoint shadowStart = NSZeroPoint; | ||
CGPoint shadowEnd = NSZeroPoint; | ||
NSColor* overlayColor = nil; | ||
- const CGFloat kBottomShadowX = 8; | ||
+ | ||
+ const CGFloat kBottomShadowX = kBottomEdgeX - 1; | ||
const CGFloat kBottomShadowY = kBottomEdgeY - lineWidth; | ||
const CGFloat kTopShadowX = 1; | ||
const CGFloat kTopShadowY = kBottomShadowY + 15; | ||
- const CGFloat kShadowWidth = 24; | ||
+ const CGFloat kShadowWidth = kBottomEdgeWidth; | ||
+ | ||
static NSColor* lightOverlayColor = | ||
[[NSColor colorWithCalibratedWhite:1 alpha:0.20] retain]; | ||
static NSColor* darkOverlayColor = |
15 changes: 15 additions & 0 deletions
15
patches/chrome-browser-ui-cocoa-tabs-tab_controller.mm.patch
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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,15 @@ | ||
diff --git a/chrome/browser/ui/cocoa/tabs/tab_controller.mm b/chrome/browser/ui/cocoa/tabs/tab_controller.mm | ||
index 84d02bda00a0d9269acfc327c58b1b3e8b7445f6..e45fdc15f1764943d4525e7a3180b482ec5ee20f 100644 | ||
--- a/chrome/browser/ui/cocoa/tabs/tab_controller.mm | ||
+++ b/chrome/browser/ui/cocoa/tabs/tab_controller.mm | ||
@@ -63,8 +63,8 @@ class MenuDelegate : public ui::SimpleMenuModel::Delegate { | ||
} // TabControllerInternal namespace | ||
|
||
namespace { | ||
-static const CGFloat kTabLeadingPadding = 18; | ||
-static const CGFloat kTabTrailingPadding = 15; | ||
+static const CGFloat kTabLeadingPadding = 9; | ||
+static const CGFloat kTabTrailingPadding = 7; | ||
static const CGFloat kIconSize = 16; | ||
static const CGFloat kCloseButtonSize = 16; | ||
static const CGFloat kInitialTabWidth = 160; |
22 changes: 22 additions & 0 deletions
22
patches/chrome-browser-ui-cocoa-tabs-tab_strip_controller.mm.patch
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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,22 @@ | ||
diff --git a/chrome/browser/ui/cocoa/tabs/tab_strip_controller.mm b/chrome/browser/ui/cocoa/tabs/tab_strip_controller.mm | ||
index 9ecc8fefe1f54226fabf449bbedbd79a2645d81a..f794922f8e263c445125989f7f2a3b39cbdf7f5d 100644 | ||
--- a/chrome/browser/ui/cocoa/tabs/tab_strip_controller.mm | ||
+++ b/chrome/browser/ui/cocoa/tabs/tab_strip_controller.mm | ||
@@ -90,7 +90,7 @@ const CGFloat kUseFullAvailableWidth = -1.0; | ||
const CGFloat kLastPinnedTabSpacing = 2.0; | ||
|
||
// The amount by which the new tab button is offset (from the tabs). | ||
-const CGFloat kNewTabButtonOffset = 10.0; | ||
+const CGFloat kNewTabButtonOffset = -7.0; | ||
|
||
// Time (in seconds) in which tabs animate to their final position. | ||
const NSTimeInterval kAnimationDuration = 0.125; | ||
@@ -587,7 +587,7 @@ NSRect FlipRectInView(NSView* view, NSRect rect) { | ||
// tab. Else, every time the throbber is painted, the throbber's invalidation | ||
// will also invalidate parts of the tab to the left, and two tabs's | ||
// backgrounds need to be painted on each throbber frame instead of one. | ||
- const CGFloat kTabOverlap = 18.0; | ||
+ const CGFloat kTabOverlap = 2.0; | ||
return kTabOverlap; | ||
} | ||
|
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
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,44 @@ | ||
diff --git a/chrome/browser/ui/cocoa/tabs/tab_view.mm b/chrome/browser/ui/cocoa/tabs/tab_view.mm | ||
index fa3ecea4d9a524ce4d675a3125a9abce027b04a7..c71e19d0a0fd606749f2e8e73e557d8901ad6020 100644 | ||
--- a/chrome/browser/ui/cocoa/tabs/tab_view.mm | ||
+++ b/chrome/browser/ui/cocoa/tabs/tab_view.mm | ||
@@ -459,7 +459,6 @@ CGFloat LineWidthFromContext(CGContextRef context) { | ||
- (void)drawFill:(NSRect)dirtyRect { | ||
gfx::ScopedNSGraphicsContextSaveGState scopedGState; | ||
NSRect bounds = [self bounds]; | ||
- | ||
NSRect clippingRect = bounds; | ||
clippingRect.size.height = [TabView maskImageFillHeight]; | ||
if (state_ != NSOnState) { | ||
@@ -991,6 +990,7 @@ CGFloat LineWidthFromContext(CGContextRef context) { | ||
@implementation TabImageMaker | ||
|
||
+ (NSBezierPath*)tabLeftEdgeBezierPathForContext:(CGContextRef)context { | ||
+ | ||
NSBezierPath* bezierPath = [NSBezierPath bezierPath]; | ||
|
||
[bezierPath moveToPoint:NSMakePoint(-2, 0)]; | ||
@@ -998,10 +998,11 @@ CGFloat LineWidthFromContext(CGContextRef context) { | ||
controlPoint1:NSMakePoint(1.805, -0.38) | ||
controlPoint2:NSMakePoint(2.17, 1.415)]; | ||
|
||
- [bezierPath lineToPoint:NSMakePoint(14, 27)]; | ||
- [bezierPath curveToPoint:NSMakePoint(16, 29) | ||
- controlPoint1:NSMakePoint(14.25, 27.25) | ||
- controlPoint2:NSMakePoint(14.747467, 29.118899)]; | ||
+ [bezierPath lineToPoint:NSMakePoint(2.5, 27)]; | ||
+ | ||
+ [bezierPath curveToPoint:NSMakePoint(4.5, 29) | ||
+ controlPoint1:NSMakePoint(2.25, 27.25) | ||
+ controlPoint2:NSMakePoint(2.747467, 29.118899)]; | ||
|
||
[bezierPath lineToPoint:NSMakePoint(18, 29)]; | ||
|
||
@@ -1031,6 +1032,7 @@ CGFloat LineWidthFromContext(CGContextRef context) { | ||
} | ||
|
||
+ (void)setTabEdgeStrokeColor { | ||
+ | ||
static NSColor* strokeColor = | ||
[skia::SkColorToSRGBNSColor(SkColorSetARGB(76, 0, 0, 0)) retain]; | ||
[strokeColor set]; |