From 02360c1f3cad8e287bc1b94d35b58995508f9a2c Mon Sep 17 00:00:00 2001
From: Ajay Ramachandran <dev@ajay.app>
Date: Thu, 2 Sep 2021 11:44:25 -0400
Subject: [PATCH] Fix centering on submission notice

---
 public/content.css                     | 6 ++++--
 src/components/NoticeComponent.tsx     | 7 +++++--
 src/components/SkipNoticeComponent.tsx | 1 +
 3 files changed, 10 insertions(+), 4 deletions(-)

diff --git a/public/content.css b/public/content.css
index a35664da..9d59a22e 100644
--- a/public/content.css
+++ b/public/content.css
@@ -154,11 +154,13 @@
 }
 
 .sponsorSkipNotice {
-	min-width: calc(100% - 50px);
-
 	transition: all 0.1s ease-out;
 }
 
+.sponsorSkipNoticeLimitWidth {
+	min-width: calc(100% - 50px);
+}
+
 .sponsorSkipNotice .hidden {
 	display: none;
 }
diff --git a/src/components/NoticeComponent.tsx b/src/components/NoticeComponent.tsx
index 68c01d05..fc514ec5 100644
--- a/src/components/NoticeComponent.tsx
+++ b/src/components/NoticeComponent.tsx
@@ -25,6 +25,7 @@ export interface NoticeProps {
     bottomRow?: React.ReactElement[],
 
     smaller?: boolean,
+    limitWidth?: boolean,
 
     // Callback for when this is closed
     closeListener: () => void,
@@ -105,11 +106,13 @@ class NoticeComponent extends React.Component<NoticeProps, NoticeState> {
                 <div className={"sponsorSkipNoticeTableContainer" 
                         + (this.props.fadeIn ? " sponsorSkipNoticeFadeIn" : "")
                         + (this.state.startFaded ? " sponsorSkipNoticeFaded" : "") }>
-                    <table className="sponsorSkipObject sponsorSkipNotice">
+                    <table className={"sponsorSkipObject sponsorSkipNotice"
+                                + (this.props.limitWidth ? " sponsorSkipNoticeLimitWidth" : "")}>
                         <tbody>
 
                             {/* First row */}
-                            <tr id={"sponsorSkipNoticeFirstRow" + this.idSuffix}>
+                            <tr id={"sponsorSkipNoticeFirstRow" + this.idSuffix}
+                                    className="sponsorSkipNoticeFirstRow">
                                 {/* Left column */}
                                 <td className="noticeLeftIcon">
                                     {/* Logo */}
diff --git a/src/components/SkipNoticeComponent.tsx b/src/components/SkipNoticeComponent.tsx
index bacb2b84..0395c19c 100644
--- a/src/components/SkipNoticeComponent.tsx
+++ b/src/components/SkipNoticeComponent.tsx
@@ -165,6 +165,7 @@ class SkipNoticeComponent extends React.Component<SkipNoticeProps, SkipNoticeSta
                 ref={this.noticeRef}
                 closeListener={() => this.closeListener()}
                 smaller={this.state.smaller}
+                limitWidth={true}
                 firstColumn={firstColumn}
                 bottomRow={[...this.getMessageBoxes(), ...this.getBottomRow() ]}
                 onMouseEnter={() => this.onMouseEnter() } >