Skip to content

M
Meu-Template-Angular-CSR
Commit 8a5f3fad authored by vtduong0912's avatar vtduong0912
Browse files
Options

update: job detail

parent bf11e77c
Show whitespace changes
Inline Side-by-side
Showing with 50 additions and 21 deletions
src/app/+job/feature/+job_detail/job-detail.component.ts
View file @ 8a5f3fad
......@@ -9,15 +9,37 @@ import { Jobs } from '../../data-access/model/job.model';
selector: 'job-detail',
standalone: true,
template: `
<div class="tw-max-w-3xl tw-mx-auto">
<p> {{ job?.company }} </p>
<p> {{ job?.company_logo }} </p>
<p> {{ job?.id }} </p>
<p> {{ job?.company }} </p>
<p> {{ job?.company }} </p>
<p> {{ job?.company }} </p>
<p> {{ job?.company }} </p>
<p> {{ job?.company }} </p>
<div class="tw-max-w-4xl tw-mx-auto tw-my-3">
<div class="tw-w-full tw-gap-y-2 tw-flex tw-flex-col">
<p class="tw-text-2xl tw-font-bold tw-border-b">{{ job?.title }}</p>
<p> {{ job?.created_at }} by {{ job?.company }} </p>
<div class="tw-flex tw-gap-y-2 tw-gap-x-3">
<span class="tw-bg-black tw-p-2 tw-rounded-lg tw-text-white tw-my-auto">{{ job?.type }}</span>
<span class="tw-my-auto"><i class="fa-solid fa-location-dot"></i> {{ job?.location }} </span>
</div>
<div>
<div class="tw-bg-sky tw-rounded-lg tw-px-3 tw-py-2 tw-flex tw-gap-x-6 tw-shadow-xl">
<img class="tw-rounded-full tw-object-cover tw-h-20 tw-w-20" src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTAGvRhdg1vaZyhkn5zzE7p35e70SUgv0TVCw&s">
<div>
<div class="tw-border-b tw-flex tw-justify-between">
<p class="tw-text-lg tw-font-semibold"> {{ job?.company }}</p>
<span>
<a class="tw-text-link tw-font-semibold" href="{{job?.company_url}}">Website</a>
&nbsp;
<a class="tw-text-link tw-font-semibold" href="{{job?.company_url}}">How to apply</a>
</span>
</div>
<div>
<p class="tw-text-lg"> {{ job?.company }} is a company that we are creating values through bla bla bla bla
bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla</p>
</div>
</div>
</div>
<div class="tw-mt-6 tw-text-lg" [innerHTML]="job?.description">
</div>
</div>
</div>
</div>
`,
changeDetection: ChangeDetectionStrategy.OnPush,
......
src/app/+shell/ui/layout.component.ts
View file @ 8a5f3fad
......@@ -33,8 +33,10 @@ import { NzLayoutModule } from 'ng-zorro-antd/layout';
<nz-layout>
<meu-header></meu-header>
<div class="tw-relative tw-min-h-[92dvh]">
<div class="tw-max-w-5xl tw-bg-white tw-mx-auto">
<router-outlet></router-outlet>
</div>
</div>
<meu-footer></meu-footer>
</nz-layout>
</div>
......
src/index.html
View file @ 8a5f3fad
......@@ -6,6 +6,9 @@
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css"
integrity="sha512-Kc323vGBEqzTmouAECnVceyQqyqdsSiqLQISBL29aUW4U/M7pSPA/gEUZQqv1cwx4OnYxTxve5UMg5GT6L4JJg=="
crossorigin="anonymous" referrerpolicy="no-referrer"/>
</head>
<body>
<app-root></app-root>
......
tailwind.config.js
View file @ 8a5f3fad
......@@ -28,6 +28,8 @@ module.exports = {
colors: {
white: "#ffffff",
black: "#000000",
sky: "#a3e4ff",
link: "#1484b2"
},
fontFamily: {
"roboto-black": ["Roboto-Black", "sans-serif"],
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment