debug : footer-line break issue (#695)

* chore : change margin-left value * Update main.css * change the margin-left value * fix css and remove seperator between links in footer --------- Co-authored-by: Camillo Bruni <[email protected]>
v8 · Dec 11, 2024 · a5b4986 · a5b4986
1 parent b04511a
commit a5b4986
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 8 deletions.
diff --git a/src/_css/main.css b/src/_css/main.css
@@ -214,8 +214,8 @@ hr {
 }
 #footer {
   color: var(--footer-color);
-  background: var(--footer-background) url(/_img/v8-outline.svg) no-repeat 95.5% center;
-  padding-right: 12em;
+  background: var(--footer-background) url(/_img/v8-outline.svg) no-repeat 96% center;
+  padding-right: 10.8em;
   background-size: 10em;
 }
 #footer div {
@@ -224,6 +224,10 @@ hr {
   align-items: flex-end;
 }
 
+#footer nav a {
+  margin-right : 0.2em;
+}
+
 pre, code, var, kbd, samp {
   font-family: Source Code Pro, Monaco, Lucida Console, monospace;
   font-size: 1em;
@@ -486,7 +490,6 @@ dark-mode-toggle {
   --dark-mode-toggle-dark-icon: url(/_css/img/sun.svg);
   --dark-mode-toggle-color: var(--main-and-footer-link-color);
   --dark-mode-toggle-icon-filter: invert(80%);
-  margin-left: 1em;
   position: relative;
   top: 0.4rem;
 }

diff --git a/src/_includes/layouts/base.njk b/src/_includes/layouts/base.njk
@@ -43,13 +43,13 @@
     <footer id="footer">
       <div>
         <nav>
-          <a href="/logo">Branding</a> ·
-          <a href="/terms">Terms</a> ·
-          <a href="https://policies.google.com/privacy">Privacy</a> ·
-          <a href="https://twitter.com/v8js" rel="me nofollow">Twitter</a> ·
+          <a href="/logo">Branding</a>
+          <a href="/terms">Terms</a>
+          <a href="https://policies.google.com/privacy">Privacy</a>
+          <a href="https://twitter.com/v8js" rel="me nofollow">Twitter</a>
           <a href="https://github.com/v8/v8.dev/tree/main/{{ page.inputPath }}" rel="nofollow">Edit this page on GitHub</a>
         </nav>
-        <dark-mode-toggle permanent dark="Light Theme" light="Dark Theme"></dark-mode-toggle>
+        <dark-mode-toggle permanent dark="Light Mode" light="Dark Mode"></dark-mode-toggle>
       </div>
       <p><small>Except as otherwise noted, any code samples from the V8 project are licensed under <a href="https://chromium.googlesource.com/v8/v8.git/+/main/LICENSE">V8’s BSD-style license</a>. Other content on this page is licensed under <a href="https://creativecommons.org/licenses/by/3.0/">the Creative Commons Attribution 3.0 License</a>. For details, see <a href="/terms#site-policies">our site policies</a>.</small></p>
     </footer>