@@ -28,7 +28,7 @@ export default function Scraps() {
2828 height : '100%' ,
2929 width : 'auto' ,
3030 objectFit : 'contain' ,
31- display : [ 'none' , 'none' , 'block ' , 'block' ] ,
31+ display : [ 'none' , 'none' , 'none ' , 'block' ] ,
3232 zIndex : 1
3333 } }
3434 />
@@ -37,7 +37,11 @@ export default function Scraps() {
3737 position : 'relative' ,
3838 zIndex : 2 ,
3939 paddingInline : '50px' ,
40- maxWidth : [ '100%' , '100%' , '50%' ]
40+ maxWidth : [ '100%' , '100%' , '100%' , '50%' ] ,
41+ display : 'flex' ,
42+ flexDirection : 'column' ,
43+ justifyContent : 'space-around' ,
44+ height : '100%'
4145 } }
4246 >
4347 < Text
@@ -55,21 +59,6 @@ export default function Scraps() {
5559 scraps
5660 </ Text >
5761
58- < Text
59- variant = "subtitle"
60- sx = { {
61- fontFamily : 'system-ui, -apple-system, sans-serif' ,
62- color : 'black' ,
63- fontSize : [ '16px' , '18px' ] ,
64- fontWeight : 'normal' ,
65- lineHeight : 1.5 ,
66- mb : 1 ,
67- display : 'block' ,
68- textAlign : 'left'
69- } }
70- >
71- < strong > ys:</ strong > any project (silly, nonsensical, or fun)
72- </ Text >
7362 < Text
7463 variant = "subtitle"
7564 sx = { {
@@ -83,14 +72,17 @@ export default function Scraps() {
8372 textAlign : 'left'
8473 } }
8574 >
86- < strong > ws:</ strong > a chance to win something amazing (including rare
87- stickers)
75+ Build any project, track your hours, and earn a virtual currency
76+ called scraps. Roll for prizes like hardware, stickers, and rare
77+ collectibles from Hack Club HQ - all for free!
8878 </ Text >
89- < a
79+ < Box
80+ as = "a"
9081 href = "https://scraps.hackclub.com/?utm_source=site-card"
91- style = { {
82+ sx = { {
9283 display : 'inline-flex' ,
9384 alignItems : 'center' ,
85+ justifyContent : 'center' ,
9486 gap : '8px' ,
9587 background : 'black' ,
9688 color : 'white' ,
@@ -100,7 +92,17 @@ export default function Scraps() {
10092 fontWeight : 'bold' ,
10193 cursor : 'pointer' ,
10294 fontSize : '16px' ,
103- textDecoration : 'none'
95+ textDecoration : 'none' ,
96+ width : 'fit-content' ,
97+ alignSelf : 'flex-start' ,
98+ transition : 'transform 0.2s ease, box-shadow 0.2s ease' ,
99+ '&:hover' : {
100+ transform : 'translateY(-2px) scale(1.02)' ,
101+ boxShadow : '0 4px 12px rgba(0, 0, 0, 0.3)'
102+ } ,
103+ '&:active' : {
104+ transform : 'translateY(0) scale(1)'
105+ }
104106 } }
105107 >
106108 < svg
@@ -114,12 +116,11 @@ export default function Scraps() {
114116 strokeLinecap = "round"
115117 strokeLinejoin = "round"
116118 >
117- < path d = "M12 12V4a1 1 0 0 1 1-1h6.297a1 1 0 0 1 .651 1.759l-4.696 4.025" />
118- < path d = "m12 21-7.414-7.414A2 2 0 0 1 4 12.172V6.415a1.002 1.002 0 0 1 1.707-.707L20 20.009" />
119- < path d = "m12.214 3.381 8.414 14.966a1 1 0 0 1-.167 1.199l-1.168 1.163a1 1 0 0 1-.706.291H6.351a1 1 0 0 1-.625-.219L3.25 18.8a1 1 0 0 1 .631-1.781l4.165.027" />
119+ < path d = "M5 12h14" />
120+ < path d = "m12 5 7 7-7 7" />
120121 </ svg >
121122 start scrapping
122- </ a >
123+ </ Box >
123124 </ Box >
124125 </ CardModel >
125126 )
0 commit comments