diff --git a/public/CCFaceFront Italic.ttf b/public/CCFaceFront Italic.ttf deleted file mode 100644 index f77a120..0000000 Binary files a/public/CCFaceFront Italic.ttf and /dev/null differ diff --git a/public/CCFaceFront-BoldItalic.woff2 b/public/CCFaceFront-BoldItalic.woff2 new file mode 100644 index 0000000..bdaa4ad Binary files /dev/null and b/public/CCFaceFront-BoldItalic.woff2 differ diff --git a/public/oldclient-wave.svg b/public/oldclient-wave.svg new file mode 100644 index 0000000..c5cec9a --- /dev/null +++ b/public/oldclient-wave.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + + + diff --git a/public/oldclient-wave2.svg b/public/oldclient-wave2.svg new file mode 100644 index 0000000..4b7d9ed --- /dev/null +++ b/public/oldclient-wave2.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + diff --git a/src/ButtonNew.tsx b/src/ButtonNew.tsx index e7c5bec..c0cdbb4 100644 --- a/src/ButtonNew.tsx +++ b/src/ButtonNew.tsx @@ -3,6 +3,7 @@ import './buttonNew.scss' function ButtonNew() { return (
+
Start
) diff --git a/src/ButtonOld.tsx b/src/ButtonOld.tsx index 25f048b..fd2d4ba 100644 --- a/src/ButtonOld.tsx +++ b/src/ButtonOld.tsx @@ -1,10 +1,16 @@ import './buttonOld.scss' +import oldclientWave from '/oldclient-wave.svg' function ButtonOld() { return (
-
STA RT
+
+ +
JOIN WITH THE
+
OLD CLIENT
+
+
START
) diff --git a/src/buttonNew.scss b/src/buttonNew.scss index 16d2a5a..a442957 100644 --- a/src/buttonNew.scss +++ b/src/buttonNew.scss @@ -8,12 +8,15 @@ border-radius: 5px; display: flex; - justify-content: center; + align-items: center; + flex-direction: column; + + .content { + flex-grow: 1; + } } .new-button { - align-self: flex-end; - display: inline-block; user-select: none; diff --git a/src/buttonOld.scss b/src/buttonOld.scss index 74eee1b..147835d 100644 --- a/src/buttonOld.scss +++ b/src/buttonOld.scss @@ -1,11 +1,19 @@ @font-face { font-family: 'CCFaceFront Italic'; - src: url('/CCFaceFront Italic.ttf') format('opentype'); + src: url('/CCFaceFront-BoldItalic.woff2') format('opentype'); } .oldclient { border: 10px solid #0062b6; border-radius: 40px; + + color: white; + font-family: 'CCFaceFront Italic', Helvetica, Arial, sans-serif; + text-decoration: none; + font-size: 30px; + font-style: italic; + text-align: center; + background: linear-gradient(0deg, #016ec1 0%, #0280cd 100%); @@ -28,25 +36,29 @@ width: 100%; height: 100%; display: flex; - justify-content: center; + align-items: center; + flex-direction: column; + + .content { + flex-grow: 1; + + text-align: center; + padding: 20px; + + img { + width: 100%; + height: 70%; + margin-bottom: 30px; + } + } } } .old-button { - align-self: flex-end; - display: inline-block; user-select: none; - color: white; - font-family: 'CCFaceFront Italic', Helvetica, Arial, sans-serif; - letter-spacing: -0.7rem; - word-spacing: 0.65rem; - text-decoration: none; font-size: 40px; - font-style: italic; - text-align: center; - -webkit-text-stroke: 6px black; paint-order: stroke fill; diff --git a/src/buttons.scss b/src/buttons.scss index 6d6c3f3..8777a93 100644 --- a/src/buttons.scss +++ b/src/buttons.scss @@ -9,8 +9,6 @@ align-items: center; justify-content: center; - // background: #00529B; - .client { width: 500px; height: 800px;