Bangara Raju Kottedi
55b436c7d2
- Added DynamicField interface to define form field structure. - Created DynamicFormConfig interface for form configuration. - Developed DynamicFormComponent to handle dynamic form rendering and validation. - Implemented DynamicPopupComponent for displaying forms in a modal dialog. - Added HTML and SCSS for dynamic form and popup styling. - Integrated Material Design components for form inputs and buttons. - Implemented form submission logic with API integration. - Added tests for DynamicForm and DynamicPopup components. - Updated global styles for Material components in themed popups. - Included Material Icons in index.html for better UI representation.
41 lines
1.1 KiB
HTML
41 lines
1.1 KiB
HTML
@if (about$ | async; as model) {
|
|
<article class="about active" data-page="about">
|
|
<header>
|
|
<h2 class="h2 article-title">About Me</h2>
|
|
<button class="edit-btn" (click)="openEdit()" aria-label="Edit About">
|
|
<i class="fa-light fa-pencil"></i>
|
|
</button>
|
|
</header>
|
|
|
|
<section class="about-text">
|
|
<pre class="text-style">
|
|
{{model.about}}
|
|
</pre>
|
|
</section>
|
|
|
|
<section class="service">
|
|
|
|
<h3 class="h3 service-title">What i'm doing</h3>
|
|
|
|
<ul class="service-list">
|
|
|
|
@for (hobby of model.hobbies; track hobby.hobbyId) {
|
|
<li class="service-item">
|
|
<div class="service-icon-box">
|
|
<i class="fa-regular fa-2x " [ngClass]="hobby.icon"></i>
|
|
</div>
|
|
<div class="service-content-box">
|
|
<h4 class="h4 service-item-title">{{hobby.name}}</h4>
|
|
|
|
<p class="service-item-text">
|
|
{{hobby.description}}
|
|
</p>
|
|
</div>
|
|
</li>
|
|
}
|
|
</ul>
|
|
|
|
</section>
|
|
|
|
</article>
|
|
} |