fix overlapping github fork button with account link

daras_ai_v2/base.py

@@ -349,16 +349,6 @@ def render(self):
         with header_placeholder:
             self._render_header()
 
-        github_url = github_url_for_file(inspect.getfile(self.__class__))
-        gui.html(
-            f"""
-            <a style="position: absolute; top: 0; right: 0; z-index: 9" href="{github_url}" target="_blank">
-            <i class="d-lg-none fa-brands fa-github-alt fa-lg pe-3 pt-4"></i>
-            <img class="d-none d-lg-block" decoding="async" width="149" height="149" src="https://github.blog/wp-content/uploads/2008/12/forkme_right_darkblue_121621.png?resize=149%2C149" alt="Fork me on GitHub" loading="lazy">
-            </a>
-            """
-        )
-
     def _render_header(self):
         sr, pr = self.current_sr_pr
         is_example = pr.saved_run == sr
@@ -456,6 +446,15 @@ def _render_unpublished_changes_indicator(self):
 
     def _render_social_buttons(self, show_button_text: bool = False):
         if show_button_text:
+            github_url = github_url_for_file(inspect.getfile(self.__class__))
+            gui.anchor(
+                '<i class="fa-brands fa-github-alt fa-lg"></i> <span class="d-none d-lg-inline">GitHub</span>',
+                href=github_url,
+                unsafe_allow_html=True,
+                target="_blank",
+                type="tertiary",
+            )
+
             button_text = '<span class="d-none d-lg-inline"> Copy Link</span>'
         else:
             button_text = ""

routers/root.py

@@ -711,7 +711,7 @@ def page_wrapper(request: Request, className=""):
         gui.html(templates.get_template("header.html").render(**context))
         gui.html(copy_to_clipboard_scripts)
 
-        with gui.div(id="main-content", className="container " + className):
+        with gui.div(id="main-content", className="container-xxl " + className):
             yield
 
         gui.html(templates.get_template("footer.html").render(**context))

templates/header.html

@@ -1,6 +1,6 @@
 <div class="header">
     <nav class="navbar navbar-expand-xl bg-transparent p-0 m-0">
-        <div class="container my-2">
+        <div class="container-xxl my-2">
             <a href="/">
                 <img width="300" height="142"
                      src="{{ settings.GOOEY_LOGO_IMG }}"