rajukottedi/portfolio-admin
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

develop #8

Merged
rajukottedi merged 22 commits from develop into master 2026-02-16 10:40:47 +05:30
Conversation 0 Commits 22 Files Changed 141 +61 -36
4 changed files with 61 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files
Showing only changes of commit e529f101b7 - Show all commits

2
src/app/admin/projects/project-detail-popup/project-detail-popup.html
View File

@ -88,7 +88,7 @@
</div>
}
@if (project.categories?.length) {
@if (project.categories.length) {
<div class="detail-section">
<h4>Categories</h4>
<div class="tag-list">

2
src/app/admin/projects/project-detail-popup/project-detail-popup.scss
View File

@ -4,7 +4,7 @@
max-height: 80vh;
overflow-y: auto;
background: var(--eerie-black-2, #1e1e1e);
border: 1px solid var(--jet, #383838);
border: 1.2px solid hsla(45, 100%, 72%, 0.45);
border-radius: 14px;
}

84
src/app/shared/dynamic-form/dynamic-form.scss
View File

@ -1,41 +1,65 @@
/* Dynamic form spacing and material tweaks to match popup theme */
.full-width { width: 100%; display: block; }
.full-width {
width: 100%;
display: block;
}
mat-form-field.full-width { margin-bottom: 12px; }
mat-form-field.full-width {
margin-bottom: 12px;
}
/* Reduce label size slightly to fit popup */
mat-form-field .mat-form-field-label { font-size: 0.95rem; color: var(--light-gray-70); }
mat-form-field .mat-form-field-label {
font-size: 0.95rem;
color: var(--light-gray-70);
}
/* Make input text contrast better */
.mat-input-element,
input.mat-mdc-input-element,
textarea.mat-mdc-input-element,
.mat-mdc-input-element {
color: var(--white-1) !important;
color: var(--white-1) !important;
}
/* Smaller helper/hint text */
.mat-hint { color: var(--light-gray-70); font-size: 0.85rem; }
.mat-hint {
color: var(--light-gray-70);
font-size: 0.85rem;
}
/* Error styling consistent with theme */
mat-error { color: #ff8a80; font-size: 0.9rem; }
mat-error {
color: #ff8a80;
font-size: 0.9rem;
}
/* Outline border always visible, highlight on focus */
::ng-deep .mdc-notched-outline__leading,
::ng-deep .mdc-notched-outline__notch,
::ng-deep .mdc-notched-outline__trailing {
border-color: var(--light-gray-70) !important;
border-color: var(--light-gray-70) !important;
}
::ng-deep .mat-mdc-form-field.mat-focused .mdc-notched-outline__leading,
::ng-deep .mat-mdc-form-field.mat-focused .mdc-notched-outline__notch,
::ng-deep .mat-mdc-form-field.mat-focused .mdc-notched-outline__trailing {
border-color: var(--orange-yellow-crayola) !important;
border-color: var(--orange-yellow-crayola) !important;
}
/* Make array item fields inline on larger screens */
.array-item-fields { display: flex; gap: 12px; align-items: baseline; flex-wrap: wrap; }
.array-item-fields mat-form-field { flex: 1 1 auto; margin-bottom: 0; min-width: 120px; }
.array-item-fields {
display: flex;
gap: 12px;
align-items: baseline;
flex-wrap: wrap;
}
.array-item-fields mat-form-field {
flex: 1 1 auto;
margin-bottom: 0;
min-width: 120px;
}
/* Stack array item fields vertically on small screens */
@media (max-width: 580px) {
@ -52,37 +76,38 @@ mat-error { color: #ff8a80; font-size: 0.9rem; }
/* Hide subscript wrapper inside array items so fields align */
.array-item ::ng-deep .mat-mdc-form-field-subscript-wrapper {
display: none;
display: none;
}
/* Remove link at bottom-right of each array card */
.array-item-actions {
display: flex;
justify-content: center;
margin-top: 4px;
display: flex;
justify-content: center;
margin-top: 4px;
}
.remove-link {
background: none;
border: none;
color: rgba(255, 255, 255, 0.35);
font-size: 0.8rem;
cursor: pointer;
display: inline-flex;
align-items: center;
gap: 5px;
padding: 4px 8px;
border-radius: 4px;
transition: color 0.2s ease, background 0.2s ease;
background: none;
border: none;
color: rgba(255, 255, 255, 0.35);
font-size: 0.8rem;
cursor: pointer;
display: inline-flex;
align-items: center;
gap: 5px;
padding: 4px 8px;
border-radius: 4px;
transition: color 0.2s ease, background 0.2s ease;
&:hover {
color: hsl(0deg 75% 60%);
background: rgba(255, 70, 70, 0.1);
}
&:hover {
color: hsl(0deg 75% 60%);
background: rgba(255, 70, 70, 0.1);
}
}
/* Force material label/input colors to match dark popup theme (covers MDC + legacy classes) */
.themed-popup {
::ng-deep .mat-form-field-label,
::ng-deep .mat-mdc-floating-label,
::ng-deep .mat-form-field .mat-form-field-label {
@ -107,6 +132,7 @@ mat-error { color: #ff8a80; font-size: 0.9rem; }
opacity: 1 !important;
}
}
.form-array {
margin-bottom: 20px;
padding: 10px 0;

9
src/styles.scss
View File

@ -507,9 +507,9 @@
.mat-mdc-text-field.mat-mdc-focused .mat-mdc-notched-outline .mat-mdc-notched-outline-path {
stroke: var(--orange-yellow-crayola) !important;
border-color: var(--orange-yellow-crayola) !important;
}
/* Additional overrides: set MDC theme variables and force a gold focus ring */
.themed-popup {
// .themed-popup {
/* Override MDC primary color used by many Material components */
--mdc-theme-primary: var(--orange-yellow-crayola);
--mdc-theme-on-primary: var(--smoky-black);
@ -529,10 +529,9 @@
.mat-mdc-text-field.mat-mdc-focused .mat-mdc-notched-outline-path {
stroke: var(--orange-yellow-crayola) !important;
}
}
box-shadow: 0 6px 18px rgba(36,26,18,0.12) !important;
// }
// box-shadow: 0 6px 18px rgba(36,26,18,0.12) !important;
}
}
.contacts-list {
display: grid;