diff --git a/apps/web/src/components/Github.css b/apps/web/src/components/Github.css
new file mode 100644
index 0000000..e03c07e
--- /dev/null
+++ b/apps/web/src/components/Github.css
@@ -0,0 +1,12 @@
+button.github-btn {
+ svg {
+ width: 100%;
+ height: 100%;
+ fill: var(--style-color);
+ transition: fill 0.2s ease-in-out;
+ }
+ @media (hover: hover) {
+ &:hover svg { fill: var(--style-background); }
+ }
+ &:active svg{ fill: var(--style-background); }
+}
\ No newline at end of file
diff --git a/apps/web/src/components/Github.tsx b/apps/web/src/components/Github.tsx
new file mode 100644
index 0000000..5e55bfe
--- /dev/null
+++ b/apps/web/src/components/Github.tsx
@@ -0,0 +1,20 @@
+import './Github.css'
+export function Github() {
+ return (
+
+ )
+}
+export default Github
diff --git a/apps/web/src/components/ThemeToggle.tsx b/apps/web/src/components/ThemeToggle.tsx
index 39269ea..50270b1 100644
--- a/apps/web/src/components/ThemeToggle.tsx
+++ b/apps/web/src/components/ThemeToggle.tsx
@@ -65,8 +65,9 @@ export function ThemeToggle() {
cy="12"
r="5"
mask="url(#ios-fail-proof-mask)"
+ fill="currentColor"
/>
-
+
diff --git a/apps/web/src/containers/Home.css b/apps/web/src/containers/Home.css
index 0fbb8d7..d6c2e4a 100644
--- a/apps/web/src/containers/Home.css
+++ b/apps/web/src/containers/Home.css
@@ -7,19 +7,19 @@
justify-content: center;
.main { font-weight: bold; }
}
- .theme-toggle-btn {
+ > .actions {
position: fixed;
bottom: 1rem;
right: 1rem;
+ width: auto;
display: flex;
- width: 2.5rem;
- height: 2.5rem;
- padding: 0.25rem;
- cursor: pointer;
- align-items: center;
- justify-content: center;
- -webkit-tap-highlight-color: transparent;
- transition: background-color 0.3s;
+ gap: 1rem;
+ >.github-btn,
+ >.theme-toggle-btn {
+ width: 2.5rem;
+ height: 2.5rem;
+ padding: 0.25rem;
+ }
}
>.controls {
flex-direction: column;
diff --git a/apps/web/src/containers/Home.tsx b/apps/web/src/containers/Home.tsx
index 02738d1..55f32e9 100644
--- a/apps/web/src/containers/Home.tsx
+++ b/apps/web/src/containers/Home.tsx
@@ -1,6 +1,7 @@
import { useRemake, useFeatures, useGoAchv, useGoThanks } from '@remake/hooks'
import { TextSvg } from '@/components/TextSvg'
import ThemeToggle from '@/components/ThemeToggle'
+import Github from '@/components/Github'
import './Home.css'
export default function Home() {
@@ -31,7 +32,10 @@ export default function Home() {
)}
-
+
+ {features && }
+
+
)
}
diff --git a/apps/web/src/styles/common.css b/apps/web/src/styles/common.css
index 9ad6998..b654389 100644
--- a/apps/web/src/styles/common.css
+++ b/apps/web/src/styles/common.css
@@ -66,6 +66,7 @@ button {
user-select: none;
transition: all 0.2s ease-in-out;
outline: none;
+ -webkit-tap-highlight-color: transparent;
@media (hover: hover) {
&:hover {
background: var(--style-color);