Skip to content

Ccsd 595 #3007

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 7 commits into
base: develop
Choose a base branch
from
Open

Ccsd 595 #3007

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
48af629
Update sandbox.scss
syedkaifegov Aug 14, 2025
b446e6a
Update CHANGELOG.md
syedkaifegov Aug 14, 2025
a74e9cd
Update package.json for sandbox login page
syedkaifegov Aug 14, 2025
d895ae3
Update index.html
syedkaifegov Aug 14, 2025
b36a24c
Merge branch 'egovernments:develop' into develop
syedkaifegov Aug 18, 2025
1b2202c
margin fixing in smnadbox for all pages
syedkaif866 Aug 18, 2025
1ea9458
removed core version change
syedkaif866 Aug 18, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions micro-ui/web/micro-ui-internals/packages/css/CHANGELOG.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,8 @@
# Changelog

## [1.8.39] - [18-Aug-2025]
-Employee app wrapper classname css added margin fixed for sandbox

Comment on lines +3 to +5
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🧹 Nitpick (assertive)

Fix hyphen/spacing and clarify entry

There’s a missing space after the bullet and double spacing in the sentence. Suggested clearer phrasing:

-## [1.8.39] - [18-Aug-2025]
--Employee app wrapper classname css added  margin fixed for sandbox
+## [1.8.39] - [18-Aug-2025]
+- Added CSS classname to Employee app wrapper; fixed Sandbox margin
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
## [1.8.39] - [18-Aug-2025]
-Employee app wrapper classname css added margin fixed for sandbox
## [1.8.39] - [18-Aug-2025]
- Added CSS classname to Employee app wrapper; fixed Sandbox margin
🧰 Tools
🪛 LanguageTool

[grammar] ~3-~3: Use hyphens correctly
Context: ...# Changelog ## [1.8.39] - [18-Aug-2025] -Employee app wrapper classname css added...

(QB_NEW_EN_OTHER_ERROR_IDS_29)

[grammar] ~4-~4: Use correct spacing
Context: ...mployee app wrapper classname css added margin fixed for sandbox ## [1.8.38] - ...

(QB_NEW_EN_OTHER_ERROR_IDS_5)

[grammar] ~4-~4: There might be a mistake here.
Context: ...name css added margin fixed for sandbox ## [1.8.38] - [14-Aug-2025] -Removed the lo...

(QB_NEW_EN_OTHER)

🤖 Prompt for AI Agents 
In micro-ui/web/micro-ui-internals/packages/css/CHANGELOG.md around lines 3 to
5, the changelog entry uses inconsistent spacing and unclear wording; update the
bullet to include a space after the dash, remove the double spacing, and
rephrase for clarity (e.g., "Employee app wrapper classname CSS added; margin
fixed for sandbox" or "Added Employee app wrapper classname CSS and fixed
sandbox margin") so the entry is grammatically correct and concise.

## [1.8.38] - [14-Aug-2025]
-Removed the login extra space in the sandbox

Expand Down
2 changes: 1 addition & 1 deletion micro-ui/web/micro-ui-internals/packages/css/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@egovernments/digit-ui-css",
"version": "1.8.38",
"version": "1.8.39",
"license": "MIT",
"main": "dist/index.css",
"author": "Jagankumar <jagan.kumar@egov.org.in>",
Expand Down
5 changes: 5 additions & 0 deletions micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/sandbox.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -550,6 +550,11 @@ digit-card-text.center {
text-align: center;
}

.employee-app-wrapper .sandbox-module {
min-height: calc(100vh - 4em);
margin: -70px;
}
Comment on lines +553 to +556
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🧹 Nitpick (assertive)

Optional: consider a token/variable for header height instead of hardcoded 4em

If a design token or CSS variable exists for topbar height, prefer it to keep layouts consistent across themes.

Example:

min-height: calc(100vh - var(--digit-topbar-height, 4em));
🤖 Prompt for AI Agents 
In micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/sandbox.scss
around lines 553 to 556, the min-height uses a hardcoded "4em" for header/topbar
deduction which can diverge across themes; replace the literal with a design
token or CSS variable (e.g., use an existing topbar height token or define
--digit-topbar-height with a fallback) and update the calc to subtract that
variable so layouts stay consistent across themes and can be overridden by
consumers.

🛠️ Refactor suggestion

⚠️ Potential issue

Selector will never match with current DOM; also avoid sweeping negative margins

You add both classes to the same element in index.js, but the selector here uses a descendant combinator. .employee-app-wrapper .sandbox-module won’t match when both classes are on the same node. Also, margin: -70px applies negative margins on all sides and can cause horizontal overflow/scroll.

Fix the selector to target the same element and constrain the negative margin to the top only.

Apply this diff:

-.employee-app-wrapper .sandbox-module {
-  min-height: calc(100vh - 4em);
-  margin: -70px;
-}
+.employee-app-wrapper.sandbox-module {
+  min-height: calc(100vh - 4em);
+  margin-top: -70px;
+}

Note: This preserves the intended vertical offset while preventing unintended horizontal overflow. The earlier learning about intentional layout shifts in sandbox styling is respected; this change only scopes the effect correctly.

📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
.employee-app-wrapper .sandbox-module {
min-height: calc(100vh - 4em);
margin: -70px;
}
.employee-app-wrapper.sandbox-module {
min-height: calc(100vh - 4em);
margin-top: -70px;
}
🤖 Prompt for AI Agents 
In micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/sandbox.scss
around lines 553–556, the selector uses a descendant combinator but both classes
are applied to the same element; change the selector to target the same element
(e.g., .employee-app-wrapper.sandbox-module) and replace the sweeping negative
margin with a constrained top-only negative margin (e.g., margin-top: -70px;
leave left/right/bottom at their defaults or explicit 0 if needed) while
preserving the min-height calc(100vh - 4em).


.pgr-citizen-wrapper {
.applications-list-container {
.card {
Expand Down
2 changes: 1 addition & 1 deletion micro-ui/web/micro-ui-internals/packages/modules/core/CHANGELOG.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,8 +1,8 @@
# Changelog

## [1.8.44] [15-July-2025]
- Citizen login page continue button added


## [1.8.43] [26-June-2025]
- Login and SignUp Pages UI for Sandbox is updated
- Sandbox Product Details Page Updated
Expand Down
2 changes: 1 addition & 1 deletion micro-ui/web/micro-ui-internals/packages/modules/core/src/pages/employee/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -133,7 +133,7 @@ const EmployeeApp = ({
/>}
<div className={!noTopBar ? `${(isSuperUserWithMultipleRootTenant) ? "" : "main"} ${DSO ? "m-auto" : ""} digit-home-main` : ""}>

<div className={!noTopBar ? `${(isSuperUserWithMultipleRootTenant && hideClass) ? "" : "employee-app-wrapper"} digit-home-app-wrapper` : ""}>
<div className={!noTopBar ? `${(isSuperUserWithMultipleRootTenant && hideClass) ? "" : "employee-app-wrapper sandbox-module"} digit-home-app-wrapper` : ""}>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🧹 Nitpick (assertive)

Optional: simplify conditional class composition

Consider using a helper like clsx/classnames for readability and to avoid stray spaces.

Example with clsx:

import clsx from "clsx";
// ...
<div
  className={
    !noTopBar
      ? clsx(
          "digit-home-app-wrapper",
          "employee-app-wrapper",
          { "sandbox-module": !(isSuperUserWithMultipleRootTenant && hideClass) }
        )
      : ""
  }
>
🤖 Prompt for AI Agents 
In
micro-ui/web/micro-ui-internals/packages/modules/core/src/pages/employee/index.js
around line 136, the className expression with nested template strings is hard
to read and can produce stray spaces; replace it with a class composition helper
(e.g., import clsx or classnames at the top) and use it to build the classes:
when !noTopBar provide the base classes "digit-home-app-wrapper" and
"employee-app-wrapper" and include "sandbox-module" only when
!(isSuperUserWithMultipleRootTenant && hideClass), otherwise set className to an
empty string; add the necessary import and update the JSX to call the helper
instead of the current template literal.

💡 Verification agent

🧩 Analysis chain

Classes added on the same element; ensure CSS selector matches and keep base wrapper class when hiding sandbox modifier

You’re applying sandbox-module on the same element as employee-app-wrapper. The CSS introduced uses a descendant selector, so it won't match unless corrected (see SCSS review). Also, when (isSuperUserWithMultipleRootTenant && hideClass) is true, you drop employee-app-wrapper as well. If the intent is only to disable the sandbox-specific overrides, keep employee-app-wrapper and toggle only sandbox-module.

Apply this diff to keep the base class present:

-            <div className={!noTopBar ? `${(isSuperUserWithMultipleRootTenant && hideClass) ? "" : "employee-app-wrapper sandbox-module"} digit-home-app-wrapper` : ""}>
+            <div className={!noTopBar ? `${(isSuperUserWithMultipleRootTenant && hideClass) ? "employee-app-wrapper" : "employee-app-wrapper sandbox-module"} digit-home-app-wrapper` : ""}>

Action items to verify:

  • Confirm the intent: Should employee-app-wrapper be present on product details pages? If yes, the above change avoids unintended style regressions.
  • Ensure the SCSS selector is updated to .employee-app-wrapper.sandbox-module to match this DOM structure.

🏁 Script executed:

#!/bin/bash
# Display the relevant JSX snippet from the employee page index.js
sed -n '130,150p' micro-ui/web/micro-ui-internals/packages/modules/core/src/pages/employee/index.js || true

# Search SCSS/CSS for definitions of sandbox-module and employee-app-wrapper
rg -n "\.sandbox-module" -g '*.{scss,css}'
rg -n "\.employee-app-wrapper" -g '*.{scss,css}'

Length of output: 1829

Ensure base wrapper class is always present and update SCSS selector

The JSX currently drops employee-app-wrapper when disabling sandbox overrides, and the SCSS uses a descendant selector (.employee-app-wrapper .sandbox-module) that won’t match when both classes live on the same element. Adjust the markup to always include employee-app-wrapper and toggle only sandbox-module, and update the CSS selector to a class-combination.

• File:
micro-ui/web/micro-ui-internals/packages/modules/core/src/pages/employee/index.js
Line: 136

• SCSS:
micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/sandbox.scss
Update selector from:
.employee-app-wrapper .sandbox-module { … }
to:
.employee-app-wrapper.sandbox-module { … }

• JSX diff:

-            <div className={!noTopBar ? `${(isSuperUserWithMultipleRootTenant && hideClass) ? "" : "employee-app-wrapper sandbox-module"} digit-home-app-wrapper` : ""}>
+            <div className={!noTopBar ? `${(isSuperUserWithMultipleRootTenant && hideClass) ? "employee-app-wrapper" : "employee-app-wrapper sandbox-module"} digit-home-app-wrapper` : ""}>
📝 Committable suggestion

‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.

Suggested change
<div className={!noTopBar ? `${(isSuperUserWithMultipleRootTenant && hideClass) ? "" : "employee-app-wrapper sandbox-module"} digit-home-app-wrapper` : ""}>
<div
className={
!noTopBar
? `${(isSuperUserWithMultipleRootTenant && hideClass)
? "employee-app-wrapper"
: "employee-app-wrapper sandbox-module"
} digit-home-app-wrapper`
: ""
}
>
🤖 Prompt for AI Agents 
In
micro-ui/web/micro-ui-internals/packages/modules/core/src/pages/employee/index.js
around line 136, the JSX conditionally removes the base "employee-app-wrapper"
class when sandbox overrides are disabled; change the markup so
"employee-app-wrapper" is always present and only "sandbox-module" is toggled
(i.e., ensure the class list always includes "employee-app-wrapper" and
conditionally adds "sandbox-module" and any other classes). Also update the SCSS
file
micro-ui/web/micro-ui-internals/packages/css/src/pages/employee/sandbox.scss by
changing the selector from the descendant form ".employee-app-wrapper
.sandbox-module" to the combined-class form
".employee-app-wrapper.sandbox-module" so styles apply when both classes are on
the same element.

{/* <div className="employee-app-wrapper digit-home-app-wrapper"> */}
<ErrorBoundary initData={initData}>
<AppModules
Expand Down
Loading