Skip to content

Commit b1d1e97

Browse files
pimenovolegpimenovoleg
authored
feat: updated to tailwind 4 (#4)
1 parent 7b615f8 commit b1d1e97

34 files changed

+930
-695
lines changed

‎README.md

+72-47
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
> [!NOTE]
77
> This is a work in progress. For some components the necessary libraries are coming soon (e.g. [Radix NG](https://www.radix-ng.com/primitives/overview/introduction)).
88
9-
- Built with Angular and TailwindCSS
9+
- Built with Angular and TailwindCSS v4
1010
- RadixNG and Angular CDK
1111
- Zoneless enable!
1212

@@ -16,7 +16,7 @@
1616

1717
### Prerequisites
1818

19-
- [TailwindCSS v3](https://v3.tailwindcss.com/)
19+
- [TailwindCSS v4](https://tailwindcss.com/)
2020
- [Radix Angular](https://radix-ng.com)
2121
- [Angular CDK](https://material.angular.io/cdk/categories)
2222
- [Lucide Angular](https://lucide.dev/guide/packages/lucide-angular)
@@ -31,54 +31,79 @@
3131
npm install @origin-ui/components
3232
```
3333

34-
### CSS Variables
34+
### Tailwind v4 CSS Variables
3535
Import the CSS in your `style.css` file (the following is based on tailwindcss):
3636

3737
```css
38-
@layer base {
39-
:root {
40-
--background: 0 0% 100%;
41-
--foreground: 240 10% 3.9%;
42-
--card: 0 0% 100%;
43-
--card-foreground: 240 10% 3.9%;
44-
--popover: 0 0% 100%;
45-
--popover-foreground: 240 10% 3.9%;
46-
--primary: 240 5.9% 10%;
47-
--primary-foreground: 0 0% 98%;
48-
--secondary: 240 4.8% 95.9%;
49-
--secondary-foreground: 240 5.9% 10%;
50-
--muted: 240 4.8% 95.9%;
51-
--muted-foreground: 240 3.8% 46.1%;
52-
--accent: 240 4.8% 95.9%;
53-
--accent-foreground: 240 5.9% 10%;
54-
--destructive: 0 84.2% 60.2%;
55-
--destructive-foreground: 0 0% 100%;
56-
--border: 240 5.9% 90%;
57-
--input: 240 4.9% 83.9%;
58-
--ring: 240 5% 64.9%;
59-
--radius: 0.5rem;
60-
}
61-
.dark {
62-
--background: 240 10% 3.9%;
63-
--foreground: 0 0% 98%;
64-
--card: 240 10% 3.9%;
65-
--card-foreground: 0 0% 98%;
66-
--popover: 240 10% 3.9%;
67-
--popover-foreground: 0 0% 98%;
68-
--primary: 0 0% 98%;
69-
--primary-foreground: 240 5.9% 10%;
70-
--secondary: 240 3.7% 15.9%;
71-
--secondary-foreground: 0 0% 98%;
72-
--muted: 240 5.9% 10%;
73-
--muted-foreground: 240 4.4% 58%;
74-
--accent: 240 5.9% 10%;
75-
--accent-foreground: 0 0% 98%;
76-
--destructive: 0 84.2% 60.2%;
77-
--destructive-foreground: 0 0% 100%;
78-
--border: 240 3.7% 15.9%;
79-
--input: 240 3.7% 15.9%;
80-
--ring: 240 3.8% 46.1%;
81-
}
38+
:root {
39+
--background: oklch(1 0 0);
40+
--foreground: oklch(0.141 0.005 285.823);
41+
--card: oklch(1 0 0);
42+
--card-foreground: oklch(0.141 0.005 285.823);
43+
--popover: oklch(1 0 0);
44+
--popover-foreground: oklch(0.141 0.005 285.823);
45+
--primary: oklch(0.21 0.006 285.885);
46+
--primary-foreground: oklch(0.985 0 0);
47+
--secondary: oklch(0.967 0.001 286.375);
48+
--secondary-foreground: oklch(0.21 0.006 285.885);
49+
--muted: oklch(0.967 0.001 286.375);
50+
--muted-foreground: oklch(0.55 0.01 286);
51+
--accent: oklch(0.967 0.001 286.375);
52+
--accent-foreground: oklch(0.21 0.006 285.885);
53+
--destructive: oklch(0.637 0.237 25.331);
54+
--destructive-foreground: oklch(0.637 0.237 25.331);
55+
--border: oklch(0.92 0 286);
56+
--input: oklch(0.871 0.006 286.286);
57+
--ring: oklch(0.871 0.006 286.286);
58+
--chart-1: oklch(0.646 0.222 41.116);
59+
--chart-2: oklch(0.6 0.118 184.704);
60+
--chart-3: oklch(0.398 0.07 227.392);
61+
--chart-4: oklch(0.828 0.189 84.429);
62+
--chart-5: oklch(0.769 0.188 70.08);
63+
--radius: 0.625rem;
64+
--sidebar: oklch(0.985 0 0);
65+
--sidebar-foreground: oklch(0.141 0.005 285.823);
66+
--sidebar-primary: oklch(0.21 0.006 285.885);
67+
--sidebar-primary-foreground: oklch(0.985 0 0);
68+
--sidebar-accent: oklch(0.967 0.001 286.375);
69+
--sidebar-accent-foreground: oklch(0.21 0.006 285.885);
70+
--sidebar-border: oklch(0.92 0.004 286.32);
71+
--sidebar-ring: oklch(0.871 0.006 286.286);
72+
}
73+
74+
.dark {
75+
--background: oklch(0.141 0.005 285.823);
76+
--foreground: oklch(0.985 0 0);
77+
--card: oklch(0.141 0.005 285.823);
78+
--card-foreground: oklch(0.985 0 0);
79+
--popover: oklch(0.141 0.005 285.823);
80+
--popover-foreground: oklch(0.985 0 0);
81+
--primary: oklch(0.985 0 0);
82+
--primary-foreground: oklch(0.21 0.006 285.885);
83+
--secondary: oklch(0.274 0.006 286.033);
84+
--secondary-foreground: oklch(0.985 0 0);
85+
--muted: oklch(0.21 0.006 285.885);
86+
--muted-foreground: oklch(0.65 0.01 286);
87+
--accent: oklch(0.21 0.006 285.885);
88+
--accent-foreground: oklch(0.985 0 0);
89+
--destructive: oklch(0.396 0.141 25.723);
90+
--destructive-foreground: oklch(0.637 0.237 25.331);
91+
--border: oklch(0.274 0.006 286.033);
92+
--input: oklch(0.274 0.006 286.033);
93+
--ring: oklch(0.442 0.017 285.786);
94+
--chart-1: oklch(0.488 0.243 264.376);
95+
--chart-2: oklch(0.696 0.17 162.48);
96+
--chart-3: oklch(0.769 0.188 70.08);
97+
--chart-4: oklch(0.627 0.265 303.9);
98+
--chart-5: oklch(0.645 0.246 16.439);
99+
--sidebar: oklch(0.205 0 0);
100+
--sidebar-foreground: oklch(0.985 0 0);
101+
--sidebar-primary: oklch(0.488 0.243 264.376);
102+
--sidebar-primary-foreground: oklch(0.985 0 0);
103+
--sidebar-accent: oklch(0.269 0 0);
104+
--sidebar-accent-foreground: oklch(0.985 0 0);
105+
--sidebar-border: oklch(0.274 0.006 286.033);
106+
--sidebar-ring: oklch(0.442 0.017 285.786);
82107
}
83108
```
84109

‎apps/origin-ui/.postcssrc.json

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
{
2+
"plugins": {
3+
"@tailwindcss/postcss": {}
4+
}
5+
}

‎apps/origin-ui/project.json

+3-1
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,9 @@
2626
"output": "/demos"
2727
}
2828
],
29-
"styles": ["apps/origin-ui/src/styles.css"],
29+
"styles": [
30+
"apps/origin-ui/src/styles.css"
31+
],
3032
"scripts": [],
3133
"server": "apps/origin-ui/src/main.server.ts",
3234
"prerender": true,

‎apps/origin-ui/src/app/app.routes.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ import { Route } from '@angular/router';
33
export const appRoutes: Route[] = [
44
{
55
path: '',
6-
loadComponent: () => import('./page.component')
6+
loadComponent: () => import('./page')
77
},
88
{
99
path: ':category',

‎apps/origin-ui/src/app/components/header.component.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -8,10 +8,10 @@ import { TwitterButton } from './twitter-button';
88
imports: [AppThemeToggleComponent, GithubButtonComponent, TwitterButton],
99
template: `
1010
<header
11-
class="relative mb-14 before:absolute before:-inset-x-32 before:bottom-0 before:h-px before:bg-[linear-gradient(to_right,--theme(--color-border/.3),--theme(--color-border)_200px,--theme(--color-border)_calc(100%-200px),--theme(--color-border/.3))]"
11+
class="before:bg-[linear-gradient(to_right,--theme(--color-border/.3),--theme(--color-border)_200px,--theme(--color-border)_calc(100%-200px),--theme(--color-border/.3))] relative mb-14 before:absolute before:-inset-x-32 before:bottom-0 before:h-px"
1212
>
1313
<div
14-
class="before:bg-ring/50 after:bg-ring/50 before:absolute before:-bottom-px before:-left-12 before:z-10 before:-ml-px before:size-[3px] after:absolute after:-bottom-px after:-right-12 after:z-10 after:-mr-px after:size-[3px]"
14+
class="before:bg-ring/50 after:bg-ring/50 before:absolute before:-bottom-px before:-left-12 before:z-10 before:-ml-px before:size-[3px] after:absolute after:-right-12 after:-bottom-px after:z-10 after:-mr-px after:size-[3px]"
1515
aria-hidden="true"
1616
></div>
1717
<div class="mx-auto flex h-[72px] w-full max-w-6xl items-center justify-between gap-3">

‎apps/origin-ui/src/app/components/theme-toggle.component.ts

+31-34
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,7 @@
1-
import { NgIf } from '@angular/common';
21
import { Component, computed, effect, signal } from '@angular/core';
32

43
@Component({
54
selector: 'app-components-theme-toggle',
6-
imports: [NgIf],
75
template: `
86
<div class="flex flex-col justify-center">
97
<input
@@ -16,41 +14,40 @@ import { Component, computed, effect, signal } from '@angular/core';
1614
aria-label="Toggle dark mode"
1715
/>
1816
<label
19-
class="bg-background hover:bg-accent peer-focus-visible:outline-ring/70 relative inline-flex size-9 cursor-pointer items-center justify-center rounded-full transition-colors peer-focus-visible:outline peer-focus-visible:outline-2"
17+
class="text-muted-foreground peer-focus-visible:border-ring peer-focus-visible:ring-ring/50 relative inline-flex size-9 cursor-pointer items-center justify-center rounded-full transition-[color,box-shadow] outline-none peer-focus-visible:ring-[3px]"
2018
for="theme-toggle"
2119
aria-hidden="true"
2220
>
2321
<!-- Sun Icon -->
24-
<svg
25-
class="dark:hidden"
26-
*ngIf="isLightTheme()"
27-
width="16"
28-
height="16"
29-
xmlns="http://www.w3.org/2000/svg"
30-
>
31-
<path
32-
class="fill-zinc-400"
33-
d="M7 0h2v2H7zM12.88 1.637l1.414 1.415-1.415 1.413-1.413-1.414zM14 7h2v2h-2zM12.95 14.433l-1.414-1.413 1.413-1.415 1.415 1.414zM7 14h2v2H7zM2.98 14.364l-1.413-1.415 1.414-1.414 1.414 1.415zM0 7h2v2H0zM3.05 1.706 4.463 3.12 3.05 4.535 1.636 3.12z"
34-
/>
35-
<path class="fill-zinc-500" d="M8 4C5.8 4 4 5.8 4 8s1.8 4 4 4 4-1.8 4-4-1.8-4-4-4Z" />
36-
</svg>
22+
@if (isLightTheme()) {
23+
<svg
24+
viewBox="0 0 24 24"
25+
xmlns="http://www.w3.org/2000/svg"
26+
width="20"
27+
height="20"
28+
fill="currentColor"
29+
aria-hidden="true"
30+
>
31+
<path
32+
d="M12 18C8.68629 18 6 15.3137 6 12C6 8.68629 8.68629 6 12 6C15.3137 6 18 8.68629 18 12C18 15.3137 15.3137 18 12 18ZM12 16C14.2091 16 16 14.2091 16 12C16 9.79086 14.2091 8 12 8C9.79086 8 8 9.79086 8 12C8 14.2091 9.79086 16 12 16ZM11 1H13V4H11V1ZM11 20H13V23H11V20ZM3.51472 4.92893L4.92893 3.51472L7.05025 5.63604L5.63604 7.05025L3.51472 4.92893ZM16.9497 18.364L18.364 16.9497L20.4853 19.0711L19.0711 20.4853L16.9497 18.364ZM19.0711 3.51472L20.4853 4.92893L18.364 7.05025L16.9497 5.63604L19.0711 3.51472ZM5.63604 16.9497L7.05025 18.364L4.92893 20.4853L3.51472 19.0711L5.63604 16.9497ZM23 11V13H20V11H23ZM4 11V13H1V11H4Z"
33+
></path>
34+
</svg>
35+
}
3736
<!-- Moon Icon -->
38-
<svg
39-
class="hidden dark:block"
40-
*ngIf="!isLightTheme()"
41-
width="16"
42-
height="16"
43-
xmlns="http://www.w3.org/2000/svg"
44-
>
45-
<path
46-
class="fill-zinc-500"
47-
d="M6.2 1C3.2 1.8 1 4.6 1 7.9 1 11.8 4.2 15 8.1 15c3.3 0 6-2.2 6.9-5.2C9.7 11.2 4.8 6.3 6.2 1Z"
48-
/>
49-
<path
50-
class="fill-zinc-600"
51-
d="M12.5 5a.625.625 0 0 1-.625-.625 1.252 1.252 0 0 0-1.25-1.25.625.625 0 1 1 0-1.25 1.252 1.252 0 0 0 1.25-1.25.625.625 0 1 1 1.25 0c.001.69.56 1.249 1.25 1.25a.625.625 0 1 1 0 1.25c-.69.001-1.249.56-1.25 1.25A.625.625 0 0 1 12.5 5Z"
52-
/>
53-
</svg>
37+
@if (!isLightTheme()) {
38+
<svg
39+
viewBox="0 0 24 24"
40+
xmlns="http://www.w3.org/2000/svg"
41+
width="20"
42+
height="20"
43+
fill="currentColor"
44+
aria-hidden="true"
45+
>
46+
<path
47+
d="M10 6C10 10.4183 13.5817 14 18 14C19.4386 14 20.7885 13.6203 21.9549 12.9556C21.4738 18.0302 17.2005 22 12 22C6.47715 22 2 17.5228 2 12C2 6.79948 5.9698 2.52616 11.0444 2.04507C10.3797 3.21152 10 4.56142 10 6ZM4 12C4 16.4183 7.58172 20 12 20C14.9654 20 17.5757 18.3788 18.9571 15.9546C18.6407 15.9848 18.3214 16 18 16C12.4772 16 8 11.5228 8 6C8 5.67863 8.01524 5.35933 8.04536 5.04293C5.62119 6.42426 4 9.03458 4 12ZM18.1642 2.29104L19 2.5V3.5L18.1642 3.70896C17.4476 3.8881 16.8881 4.4476 16.709 5.16417L16.5 6H15.5L15.291 5.16417C15.1119 4.4476 14.5524 3.8881 13.8358 3.70896L13 3.5V2.5L13.8358 2.29104C14.5524 2.1119 15.1119 1.5524 15.291 0.835829L15.5 0H16.5L16.709 0.835829C16.8881 1.5524 17.4476 2.1119 18.1642 2.29104ZM23.1642 7.29104L24 7.5V8.5L23.1642 8.70896C22.4476 8.8881 21.8881 9.4476 21.709 10.1642L21.5 11H20.5L20.291 10.1642C20.1119 9.4476 19.5524 8.8881 18.8358 8.70896L18 8.5V7.5L18.8358 7.29104C19.5524 7.1119 20.1119 6.5524 20.291 5.83583L20.5 5H21.5L21.709 5.83583C21.8881 6.5524 22.4476 7.1119 23.1642 7.29104Z"
48+
></path>
49+
</svg>
50+
}
5451
<span class="sr-only">Switch to light / dark version</span>
5552
</label>
5653
</div>
@@ -68,9 +65,9 @@ export class AppThemeToggleComponent {
6865
localStorage.setItem('theme', currentTheme);
6966

7067
if (currentTheme === 'dark') {
71-
document.body.classList.add('dark');
68+
document.documentElement.classList.add('dark');
7269
} else {
73-
document.body.classList.remove('dark');
70+
document.documentElement.classList.remove('dark');
7471
}
7572
});
7673
}

‎apps/origin-ui/src/app/app.component.ts ‎apps/origin-ui/src/app/layout.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import AppHeaderComponent from './components/header.component';
99
template: `
1010
<div class="overflow-hidden px-4 supports-[overflow:clip]:overflow-clip sm:px-6">
1111
<div
12-
class="relative mx-auto w-full max-w-6xl before:absolute before:inset-y-0 before:-left-12 before:w-px before:bg-[linear-gradient(to_bottom,--theme(--color-border/.3),--theme(--color-border)_200px,--theme(--color-border)_calc(100%-200px),--theme(--color-border/.3))] after:absolute after:inset-y-0 after:-right-12 after:w-px after:bg-[linear-gradient(to_bottom,--theme(--color-border/.3),--theme(--color-border)_200px,--theme(--color-border)_calc(100%-200px),--theme(--color-border/.3))]"
12+
class="before:bg-[linear-gradient(to_bottom,--theme(--color-border/.3),--theme(--color-border)_200px,--theme(--color-border)_calc(100%-200px),--theme(--color-border/.3))] after:bg-[linear-gradient(to_bottom,--theme(--color-border/.3),--theme(--color-border)_200px,--theme(--color-border)_calc(100%-200px),--theme(--color-border/.3))] relative mx-auto w-full max-w-6xl before:absolute before:inset-y-0 before:-left-12 before:w-px after:absolute after:inset-y-0 after:-right-12 after:w-px"
1313
>
1414
<div class="relative flex min-h-screen flex-col">
1515
<app-component-header />
@@ -20,6 +20,6 @@ import AppHeaderComponent from './components/header.component';
2020
</div>
2121
`
2222
})
23-
export class AppComponent {
23+
export class Layout {
2424
title = 'origin-ui';
2525
}

‎apps/origin-ui/src/app/page.component.ts ‎apps/origin-ui/src/app/page.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -88,7 +88,7 @@ export class CategoryCard {
8888
A collection of copy-and-paste components for quickly build application UIs. It&lsquo;s free,
8989
open-source, and ready to drop into your projects.
9090
</p>
91-
<p class="text-accent-foreground w-fit max-w-prose text-pretty pt-4 text-sm">
91+
<p class="text-accent-foreground w-fit max-w-prose pt-4 text-sm text-pretty">
9292
This project is not affiliated with the original
9393
<a class="underline" href="https://originui.com/" rel="noreferrer">Origin UI</a>
9494
.

‎apps/origin-ui/src/fonts.css

+47
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
2+
@font-face {
3+
font-family: "Inter";
4+
font-style: normal;
5+
font-display: swap;
6+
font-weight: 100 900;
7+
src: url(@fontsource-variable/inter/files/inter-latin-wght-normal.woff2)
8+
format("woff2-variations");
9+
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304,
10+
U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF,
11+
U+FFFD;
12+
}
13+
14+
@font-face {
15+
font-family: "Outfit";
16+
font-style: normal;
17+
font-display: swap;
18+
font-weight: 100 900;
19+
src: url(@fontsource-variable/outfit/files/outfit-latin-wght-normal.woff2) format("woff2-variations");
20+
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329,
21+
U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
22+
}
23+
24+
/* outfit-latin-ext-wght-normal */
25+
@font-face {
26+
font-family: "Outfit";
27+
font-style: normal;
28+
font-display: swap;
29+
font-weight: 100 900;
30+
src: url(@fontsource-variable/outfit/files/outfit-latin-ext-wght-normal.woff2) format("woff2-variations");
31+
unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0,
32+
U+2113, U+2C60-2C7F, U+A720-A7FF;
33+
}
34+
35+
/* jetbrains-mono-latin-400-normal */
36+
@font-face {
37+
font-family: 'JetBrains Mono';
38+
font-style: normal;
39+
font-display: auto;
40+
font-weight: 400;
41+
src:
42+
url(@fontsource/jetbrains-mono/files/jetbrains-mono-latin-400-normal.woff2) format('woff2'),
43+
url(@fontsource/jetbrains-mono/files/jetbrains-mono-latin-400-normal.woff) format('woff');
44+
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304,
45+
U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF,
46+
U+FFFD;
47+
}

‎apps/origin-ui/src/index.html

+4-4
Original file line numberDiff line numberDiff line change
@@ -12,8 +12,6 @@
1212
<meta name="twitter:description" content="An extensive collection of copy-and-paste components for quickly building app UIs. Free, open-source, and ready to drop into your projects.">
1313
<base href="/" />
1414
<link href="favicon.ico" rel="icon" type="image/x-icon" />
15-
</head>
16-
<body class="font-sans antialiased has-not-data-home:before:absolute has-not-data-home:before:inset-x-0 has-not-data-home:before:h-100 has-not-data-home:before:bg-linear-to-b has-not-data-home:before:from-zinc-100 has-data-home:bg-zinc-50 dark:has-not-data-home:before:hidden dark:has-data-home:bg-zinc-950">
1715
<script>
1816
(function () {
1917
try {
@@ -22,15 +20,17 @@
2220
theme === 'dark' ||
2321
(theme === null && window.matchMedia('(prefers-color-scheme: dark)').matches);
2422
if (isDarkMode) {
25-
document.body.classList.add('dark');
23+
document.documentElement.classList.add('dark');
2624
} else {
27-
document.body.classList.remove('dark');
25+
document.documentElement.classList.remove('dark');
2826
}
2927
} catch (e) {
3028
console.error('Error initializing theme:', e);
3129
}
3230
})();
3331
</script>
32+
</head>
33+
<body class="font-sans antialiased has-not-data-home:before:absolute has-not-data-home:before:inset-x-0 has-not-data-home:before:h-100 has-not-data-home:before:bg-linear-to-b has-not-data-home:before:from-zinc-100 has-data-home:bg-zinc-50 dark:has-not-data-home:before:hidden dark:has-data-home:bg-zinc-950">
3434
<app-root></app-root>
3535
</body>
3636
</html>

‎apps/origin-ui/src/main.server.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import { bootstrapApplication } from '@angular/platform-browser';
2-
import { AppComponent } from './app/app.component';
32
import { config } from './app/app.config.server';
3+
import { Layout } from './app/layout';
44

5-
const bootstrap = () => bootstrapApplication(AppComponent, config);
5+
const bootstrap = () => bootstrapApplication(Layout, config);
66

77
export default bootstrap;

‎apps/origin-ui/src/main.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { bootstrapApplication } from '@angular/platform-browser';
2-
import { AppComponent } from './app/app.component';
32
import { appConfig } from './app/app.config';
3+
import { Layout } from './app/layout';
44

5-
bootstrapApplication(AppComponent, appConfig).catch((err) => console.error(err));
5+
bootstrapApplication(Layout, appConfig).catch((err) => console.error(err));

0 commit comments

Comments
 (0)