Revert custom ad changes

components/custom-ad.tsx

@@ -1,8 +1,6 @@
-import { Box } from '@chakra-ui/react';
-
 export const CustomAd = () => {
   return (
-    <Box className='custom-ad' d={['none !important', 'flex !important']}>
+    <div id='carbonads'>
       <span>
         <span className='carbon-wrap'>
           <a
@@ -34,6 +32,6 @@ export const CustomAd = () => {
           Sponsored by
         </a>
       </span>
-    </Box>
+    </div>
   );
 };

components/footer.tsx

@@ -66,7 +66,7 @@ export function Footer() {
       </Container>
 
       <CustomAd />
-      {process.env.GA_SECRET && (
+      {process.env.GA_SECRET && false && (
         <script
           async
           type='text/javascript'

styles/carbon.css

@@ -1,4 +1,4 @@
-#carbonads, .custom-ad {
+#carbonads {
   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu,
   Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif;
   position: fixed;
@@ -6,34 +6,29 @@
   right: 20px;
 }
 
-.custom-ad {
+#carbonads {
-  left: 20px !important;
-  right: auto !important;
-}
-
-#carbonads, .custom-ad {
   display: flex;
   max-width: 330px;
   background-color: hsl(0, 0%, 98%);
   box-shadow: 0 1px 4px 1px hsla(0, 0%, 0%, .1);
 }
 
-#carbonads a, .custom-ad a {
+#carbonads a {
   color: inherit;
   text-decoration: none;
 }
 
-#carbonads a:hover, .custom-ad a:hover {
+#carbonads a:hover {
   color: inherit;
 }
 
-#carbonads span, .custom-ad span {
+#carbonads span {
   position: relative;
   display: block;
   overflow: hidden;
 }
 
-#carbonads .carbon-wrap, .custom-ad .carbon-wrap  {
+#carbonads .carbon-wrap {
   display: flex;
 }