Skip to content

Commit a6ec65b

Browse files
update og image
1 parent 990832b commit a6ec65b

10 files changed

+26
-111
lines changed

src/app/app.component.html

+9-9
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
>
77
<form [formGroup]="form" class="p-4 md:p-8 w-full">
88
<div class="w-full max-w-xs text-center mx-auto">
9-
<h1 class="mb-4 md:mb-8 text-sm leading-4 text-zinc-300">
9+
<h1 class="mb-4 md:mb-8 text-sm leading-4 text-white">
1010
Just type the data and generate the meta tags for your website
1111
</h1>
1212
</div>
@@ -16,13 +16,13 @@ <h1 class="mb-4 md:mb-8 text-sm leading-4 text-zinc-300">
1616
*ngFor="let field of metatagsList"
1717
>
1818
<ng-container *ngIf="field.type === 'text' || field.type === 'color'">
19-
<label [for]="field.name" class="leading-4 text-xs text-zinc-200">{{
19+
<label [for]="field.name" class="leading-4 text-xs text-white">{{
2020
field.label
2121
}}</label>
2222

2323
<div
2424
*ngIf="field.name === 'image' && form?.get('image')"
25-
class="w-full min-h-60 rounded bg-zinc-800 border border-zinc-700 overflow-hidden"
25+
class="w-full min-h-60 rounded bg-zinc-800 border border-zinc-800 overflow-hidden"
2626
>
2727
<img *ngIf="form?.get('image')?.value" [src]="form.get('image')?.value" width="100%" alt="" />
2828
</div>
@@ -34,7 +34,7 @@ <h1 class="mb-4 md:mb-8 text-sm leading-4 text-zinc-300">
3434
[name]="field.name"
3535
[placeholder]="field.label"
3636
[formControlName]="field.name"
37-
class="h-8 text-xs w-full bg-zinc-900 rounded border border-zinc-800 focus:border-zinc-500 focus:ring-2 focus:ring-zinc-200 outline-none text-zinc-200 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
37+
class="h-8 text-xs w-full bg-zinc-900 rounded border placeholder:text-zinc-500 border-zinc-800 focus:border-zinc-500 focus:ring-2 focus:ring-white outline-none text-white py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
3838
/>
3939
<ng-container class="" *ngIf="field.name === 'color'">
4040
<input
@@ -53,19 +53,19 @@ <h1 class="mb-4 md:mb-8 text-sm leading-4 text-zinc-300">
5353
</div>
5454
</ng-container>
5555
</div>
56-
<span class="text-xs text-zinc-400 leading-4 mt-1">{{
56+
<span class="text-xs text-zinc-500 leading-4 mt-1">{{
5757
field.description
5858
}}</span>
5959
</ng-container>
6060

6161
<ng-container *ngIf="field.type === 'select'">
62-
<label [for]="field.name" class="leading-4 text-xs text-zinc-200">{{
62+
<label [for]="field.name" class="leading-4 text-xs text-white">{{
6363
field.label
6464
}}</label>
6565
<select
6666
[id]="field.name"
6767
[formControlName]="field.name"
68-
class="h-8 text-xs w-full bg-zinc-900 rounded border border-zinc-800 focus:border-zinc-500 focus:ring-2 focus:ring-zinc-200 outline-none text-zinc-200 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
68+
class="h-8 text-xs w-full bg-zinc-900 rounded border border-zinc-800 focus:border-zinc-500 focus:ring-2 focus:ring-white outline-none text-white py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
6969
>
7070
<option
7171
*ngFor="let option of field.options"
@@ -74,7 +74,7 @@ <h1 class="mb-4 md:mb-8 text-sm leading-4 text-zinc-300">
7474
{{ option.value }}
7575
</option>
7676
</select>
77-
<span class="text-xs text-zinc-400 leading-4 mt-1">{{
77+
<span class="text-xs text-zinc-500 leading-4 mt-1">{{
7878
field.description
7979
}}</span>
8080
</ng-container>
@@ -86,7 +86,7 @@ <h1 class="mb-4 md:mb-8 text-sm leading-4 text-zinc-300">
8686
</div>
8787

8888
<div
89-
class="resize-none md:resize-x w-full md:w-[33.3333%] flex-grow mx-auto flex flex-col h-full md:h-[calc(100vh-56px)] overflow-hidden border-r border-zinc-800"
89+
class="resize-none md:resize-x w-full md:w-[33.3333%] flex-grow mx-auto flex flex-col h-full md:h-[calc(100vh-56px)] overflow-hidden border-r border-zinc-800 p-4 md:p-0"
9090
>
9191
<app-code-result [code]="code" class="h-full" />
9292
</div>
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
<div class="relative h-full">
2-
<div class="absolute top-2 right-6 flex justify-center items-center z-10">
2+
<div class="absolute top-2 right-2 md:right-6 flex justify-center items-center z-10">
33
<button
44
(click)="copy()"
5-
class="h-6 bg-zinc-800 hover:bg-zinc-700 text-zinc-200 hover:text-zinc-50 rounded text-xs px-2 py-2 flex justify-center items-center">
5+
class="h-6 bg-zinc-800 hover:bg-zinc-700 text-white hover:text-zinc-50 rounded text-xs px-2 py-2 flex justify-center items-center">
66
Copy
77
</button>
88
</div>
99
<pre class="w-full h-full appearance-none !m-0 !p-0 flex relative">
10-
<code class="w-full h-full appearance-none !m-0 !p-4 !bg-zinc-950 text-xs overflow-x-auto overflow-y-auto md:overflow-y-scroll" [highlight]="code" [language]="'html'"></code>
10+
<code class="w-full h-full appearance-none !m-0 !p-4 !bg-zinc-900 md:!bg-zinc-950 rounded md:rounded-none text-xs overflow-x-auto overflow-y-auto md:overflow-y-scroll" [highlight]="code" [language]="'html'"></code>
1111
</pre>
1212

1313
</div>

src/app/components/footer/footer.component.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -6,14 +6,14 @@
66
<a
77
href="https://github.com/gustavoquinalha"
88
target="_blank"
9-
class="text-zinc-400 hover:text-zinc-200 hover:underline underline-offset-1"
9+
class="text-zinc-400 hover:text-white hover:underline underline-offset-1"
1010
>Gustavo Quinalha</a
1111
>
1212
&
1313
<a
1414
href="https://github.com/userjapa"
1515
target="_blank"
16-
class="text-zinc-400 hover:text-zinc-200 hover:underline underline-offset-1"
16+
class="text-zinc-400 hover:text-white hover:underline underline-offset-1"
1717
>Japa</a
1818
>
1919
— All rights reserved.

src/app/components/menu/menu.component.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -19,11 +19,11 @@
1919
[(ngModel)]="url"
2020
(keydown.enter)="fetchMetadata()"
2121
placeholder="https://gus.vision"
22-
class="w-full pr-14 h-8 text-xs bg-zinc-900 rounded border border-zinc-800 focus:border-zinc-200 focus:ring-2 focus:ring-zinc-200 outline-none text-zinc-200 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
22+
class="w-full pr-14 h-8 text-xs bg-zinc-900 rounded border border-zinc-800 focus:border-white focus:ring-2 focus:ring-white outline-none text-white py-1 px-3 leading-8 transition-colors duration-200 ease-in-out"
2323
/>
2424
<button
2525
(click)="fetchMetadata()"
26-
class="absolute top-1 right-1 h-6 bg-zinc-800 hover:bg-zinc-700 text-zinc-200 hover:text-zinc-50 rounded text-xs px-2 py-2 flex items-center justify-center"
26+
class="absolute top-1 right-1 h-6 bg-zinc-800 hover:bg-zinc-700 text-white hover:text-zinc-50 rounded text-xs px-2 py-2 flex items-center justify-center"
2727
>
2828
Fetch
2929
</button>

src/app/components/preview/preview.component.html

+9-9
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
<div
2-
class="text-zinc-200 gap-4 md:gap-8 h-full flex flex-col mb-4 md:mb-8 lg:mb-10 pb-4 md:pb-8 lg:pb-10"
2+
class="text-white gap-4 md:gap-8 h-full flex flex-col mb-4 md:mb-8 lg:mb-10 pb-4 md:pb-8 lg:pb-10"
33
>
44
<div class="w-full max-w-xl">
5-
<div class="text-xs text-zinc-200 uppercase mb-2">Google</div>
5+
<div class="text-xs text-white uppercase mb-2">Google</div>
66
<div class="w-full p-4 border border-zinc-800 rounded overflow-hidden bg-zinc-900">
77
<div class="text-base text-[#99c3ff]">
88
{{ content?.title || "Page title" }}
@@ -17,7 +17,7 @@
1717
</div>
1818

1919
<div class="w-full max-w-lg">
20-
<div class="text-xs text-zinc-200 uppercase mb-2">Twitter</div>
20+
<div class="text-xs text-white uppercase mb-2">Twitter</div>
2121
<div class="w-full border border-zinc-800 rounded overflow-hidden bg-zinc-900">
2222
<div class="bg-zinc-800 w-full h-64 min-h-64 overflow-hidden border-b border-zinc-800">
2323
<img
@@ -29,7 +29,7 @@
2929
/>
3030
</div>
3131
<div class="w-full flex flex-col gap-1 p-4">
32-
<div class="text-base text-zinc-200 font-medium">
32+
<div class="text-base text-white font-medium">
3333
{{ content?.title || "Page title" }}
3434
</div>
3535
<div class="text-xs text-zinc-400">
@@ -43,7 +43,7 @@
4343
</div>
4444

4545
<div class="w-full max-w-lg">
46-
<div class="text-xs text-zinc-200 uppercase mb-2">Facebook</div>
46+
<div class="text-xs text-white uppercase mb-2">Facebook</div>
4747
<div class="w-full border border-zinc-800 rounded overflow-hidden bg-zinc-900">
4848
<div class="bg-zinc-800 w-full h-52 min-h-52 overflow-hidden border-b border-zinc-800">
4949
<img
@@ -58,7 +58,7 @@
5858
<div class="text-xs text-zinc-400 uppercase">
5959
{{ content?.canonical || "https://pageurl.com" }}
6060
</div>
61-
<div class="text-base text-zinc-200 font-medium">
61+
<div class="text-base text-white font-medium">
6262
{{ content?.title || "Page title" }}
6363
</div>
6464
<div class="text-xs text-zinc-400">
@@ -69,7 +69,7 @@
6969
</div>
7070

7171
<div class="w-full max-w-xl">
72-
<div class="text-xs text-zinc-200 uppercase mb-2">Linkedin</div>
72+
<div class="text-xs text-white uppercase mb-2">Linkedin</div>
7373
<div class="w-full border border-zinc-800 rounded overflow-hidden bg-zinc-900">
7474
<div class="bg-zinc-800 w-full h-64 min-h-64 overflow-hidden border-b border-zinc-800">
7575
<img
@@ -81,7 +81,7 @@
8181
/>
8282
</div>
8383
<div class="w-full flex flex-col gap-1 p-4">
84-
<div class="text-xs text-zinc-200 font-medium">
84+
<div class="text-xs text-white font-medium">
8585
{{ content?.title || "Page title" }}
8686
</div>
8787
<div class="text-xs text-zinc-400">
@@ -91,5 +91,5 @@
9191
</div>
9292
</div>
9393

94-
<div class="min-h-4 md:min-h-8"></div>
94+
<div class="hidden md:flex min-h-4 md:min-h-8"></div>
9595
</div>

src/assets/dracula.css

-81
This file was deleted.

src/assets/intro.webp

-59.7 KB
Binary file not shown.

src/assets/logo.svg

-1
Loading

src/index.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@
4646

4747
<!-- Meta Tags Generated via https://seotopper.netlify.app/ -->
4848
</head>
49-
<body class="bg-zinc-950 min-h-screen text-zinc-200 text-base">
49+
<body class="bg-zinc-950 min-h-screen text-white text-base">
5050
<!-- Google Tag Manager (noscript) -->
5151
<noscript
5252
><iframe

src/styles.scss

-3
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,6 @@
22
@import "tailwindcss/components";
33
@import "tailwindcss/utilities";
44

5-
@import "~assets/dracula.css";
6-
// @import 'highlight.js/styles/dark.css';
7-
85
:root {
96
color-scheme: dark;
107
}

0 commit comments

Comments
 (0)