Add >_ terminal prompt favicon and sidebar logo

d3837355 by Isaac Bythewood · 1 month ago

Add >_ terminal prompt favicon and sidebar logo

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

modified pages/_document.js

@@ -9,6 +9,8 @@ class MyDocument extends Document {      <Html lang="en">        <Head>          <meta name="theme-color" content={theme.colors.primary} />          <link rel="icon" type="image/svg+xml" href="/favicon.svg" />          <link rel="icon" href="/favicon.ico" />          <link rel="manifest" href="/manifest.json" />          <script            dangerouslySetInnerHTML={{

modified public/favicon.ico

binary file

added public/favicon.svg

@@ -0,0 +1,10 @@<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 16 16">  <defs>    <linearGradient id="g" x1="0" y1="0" x2="1" y2="1">      <stop offset="0%" stop-color="#0e3ff4"/>      <stop offset="100%" stop-color="#842bff"/>    </linearGradient>  </defs>  <rect width="16" height="16" rx="2" fill="url(#g)"/>  <text x="8" y="11" text-anchor="middle" font-family="monospace" font-weight="bold" font-size="9" fill="rgba(255,255,255,0.9)">&gt;_</text></svg>

modified public/static/images/favicon.png

binary file

modified styles/components/sidebar.module.css

@@ -25,22 +25,43 @@}.navLogo {  display: block;  display: flex;  align-items: center;  justify-content: center;  background-image: linear-gradient(    to right,    var(--color-blue) 0,    135deg,    var(--color-blue) 0%,    var(--color-purple) 100%  );  width: 40px;  height: 40px;  border-radius: 3px;  z-index: 3;  margin-left: 10px;  margin-top: 10px;  transition: transform 0.2s ease-in-out;  transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;  text-decoration: none;}.navLogo span {  display: flex;  align-items: center;  justify-content: center;  padding-bottom: 3px;}.navLogo span::after {  content: ">_";  font-family: monospace;  font-weight: 700;  font-size: 14px;  color: rgba(255, 255, 255, 0.9);  line-height: 1;}.navLogo:hover {  transform: rotate(15deg) scale(1.1);  transform: rotate(12deg) scale(1.08);  box-shadow: 0 0 14px rgba(132, 43, 255, 0.3);}@media (max-width: 767.98px) {