# Search & Discovery / Service Detail Detailed service information page with tabbed navigation, document checklist, and application steps. **Category:** Patterns **Storybook:** https://doc.ux4g.gov.in/web/?path=/story/ux4g-patterns-search-discovery-service-detail--full-screen ## Pattern variants - Full Screen: https://doc.ux4g.gov.in/web/?path=/story/ux4g-patterns-search-discovery-service-detail--full-screen - Column: https://doc.ux4g.gov.in/web/?path=/story/ux4g-patterns-search-discovery-service-detail--column - Desktop Workspace: https://doc.ux4g.gov.in/web/?path=/story/ux4g-patterns-search-discovery-service-detail--desktop-workspace ## When to use this pattern Use Search & Discovery / Service Detail when building citizen-facing flows that match the described government journey. Combine components such as cards, forms, tables, buttons, and status indicators as shown in Storybook. ## Framework setup ### HTML / CDN ```html ``` ### React ```bash npm install ux4g-web-components ``` ```jsx import 'ux4g-web-components/styles.css'; import 'ux4g-web-components/design-system'; ``` ### Angular Update `angular.json`: ```json { "styles": [ "node_modules/ux4g-web-components/styles/ux4g.css", "src/styles.css" ], "scripts": [ "node_modules/ux4g-web-components/dist/runtime/design-system.js" ] } ``` ## Code examples The snippets below are extracted from the Storybook canvas for Search & Discovery / Service Detail. Each example shows the rendered HTML, the equivalent React JSX, and the Angular template markup. ### 1. Column — Service Detail - Full Page HTML: ```html
health_and_safety

Birth Certificate

Municipal Corporation · Registration of Births & Deaths

Free | 20 mins (online) | check Government verified

About this service

A Birth Certificate is the official record of a child's birth, issued by the local municipal body. It is required for school admission, passport, Aadhaar enrolment and accessing welfare schemes. Apply online with hospital records, or visit your nearest municipal office.

Eligibility

Child born within municipal limits. Apply within 21 days of birth; late registration allowed with an affidavit.

Required documents

Hospital discharge summary, both parents’ Aadhaar, and proof of address.

Fee

Free within 21 days of birth. ₹20 late fee applies thereafter.

Processing time

20 minutes online · up to 7 working days if applied offline.

Eligibility

Child born within municipal limits. Apply within 21 days of birth; late registration allowed with an affidavit.

Required documents

Hospital discharge summary, both parents’ Aadhaar, and proof of address.

Process

Apply online with hospital records, or visit your nearest municipal office. Processing time is 20 minutes online and up to 7 working days if applied offline.

Related services

``` React: ```jsx import React from 'react'; const SearchDiscoveryServiceDetailExample1Demo = () => ( <>
{/* Breadcrumbs */}
{/* Hero Info Card */}
health_and_safety

Birth Certificate

Municipal Corporation · Registration of Births & Deaths

Free | 20 mins (online) | check Government verified
{/* Underline Tabs */}
{/* Overview Panel */}
{/* About section */}

About this service

A Birth Certificate is the official record of a child's birth, issued by the local municipal body. It is required for school admission, passport, Aadhaar enrolment and accessing welfare schemes. Apply online with hospital records, or visit your nearest municipal office.

{/* 2x2 Info Grid */}
{/* Eligibility Card */}

Eligibility

Child born within municipal limits. Apply within 21 days of birth; late registration allowed with an affidavit.

{/* required Documents Card */}

Required documents

Hospital discharge summary, both parents’ Aadhaar, and proof of address.

{/* Fee Card */}

Fee

Free within 21 days of birth. ₹20 late fee applies thereafter.

{/* Processing Time Card */}

Processing time

20 minutes online · up to 7 working days if applied offline.

{/* Eligibility Panel */}

Eligibility

Child born within municipal limits. Apply within 21 days of birth; late registration allowed with an affidavit.

{/* Documents Panel */}

Required documents

Hospital discharge summary, both parents’ Aadhaar, and proof of address.

{/* Process Panel */}

Process

Apply online with hospital records, or visit your nearest municipal office. Processing time is 20 minutes online and up to 7 working days if applied offline.

{/* Related Services Section */}

Related services

{/* Death Certificate Card */}

Death Certificate

Municipal Corporation

Free · 20 mins
{/* Marriage Certificate Card */}

Marriage Certificate

Registrar of Marriages

₹100 · 15 days
{/* Aadhaar Enrolment Card */}

Aadhaar Enrolment

UIDAI

Free · 90 days
); export default SearchDiscoveryServiceDetailExample1Demo; ``` Angular: ```html
health_and_safety

Birth Certificate

Municipal Corporation · Registration of Births & Deaths

Free | 20 mins (online) | check Government verified

About this service

A Birth Certificate is the official record of a child's birth, issued by the local municipal body. It is required for school admission, passport, Aadhaar enrolment and accessing welfare schemes. Apply online with hospital records, or visit your nearest municipal office.

Eligibility

Child born within municipal limits. Apply within 21 days of birth; late registration allowed with an affidavit.

Required documents

Hospital discharge summary, both parents’ Aadhaar, and proof of address.

Fee

Free within 21 days of birth. ₹20 late fee applies thereafter.

Processing time

20 minutes online · up to 7 working days if applied offline.

Eligibility

Child born within municipal limits. Apply within 21 days of birth; late registration allowed with an affidavit.

Required documents

Hospital discharge summary, both parents’ Aadhaar, and proof of address.

Process

Apply online with hospital records, or visit your nearest municipal office. Processing time is 20 minutes online and up to 7 working days if applied offline.

Related services

``` ### 2. Desktop Workspace — Service Detail - Full Page HTML: ```html
health_and_safety

Birth Certificate

Municipal Corporation · Registration of Births & Deaths

Free | 20 mins (online) | check Government verified

About this service

A Birth Certificate is the official record of a child's birth, issued by the local municipal body. It is required for school admission, passport, Aadhaar enrolment and accessing welfare schemes. Apply online with hospital records, or visit your nearest municipal office.

Eligibility

Child born within municipal limits. Apply within 21 days of birth; late registration allowed with an affidavit.

Required documents

Hospital discharge summary, both parents’ Aadhaar, and proof of address.

Fee

Free within 21 days of birth. ₹20 late fee applies thereafter.

Processing time

20 minutes online · up to 7 working days if applied offline.

Eligibility

Child born within municipal limits. Apply within 21 days of birth; late registration allowed with an affidavit.

Required documents

Hospital discharge summary, both parents’ Aadhaar, and proof of address.

Process

Apply online with hospital records, or visit your nearest municipal office. Processing time is 20 minutes online and up to 7 working days if applied offline.

Related services

``` React: ```jsx import React from 'react'; const SearchDiscoveryServiceDetailExample2Demo = () => ( <>
{/* Breadcrumbs */}
{/* Hero Info Card */}
health_and_safety

Birth Certificate

Municipal Corporation · Registration of Births & Deaths

Free | 20 mins (online) | check Government verified
{/* Underline Tabs */}
{/* Overview Panel */}
{/* About section */}

About this service

A Birth Certificate is the official record of a child's birth, issued by the local municipal body. It is required for school admission, passport, Aadhaar enrolment and accessing welfare schemes. Apply online with hospital records, or visit your nearest municipal office.

{/* 2x2 Info Grid */}
{/* Eligibility Card */}

Eligibility

Child born within municipal limits. Apply within 21 days of birth; late registration allowed with an affidavit.

{/* required Documents Card */}

Required documents

Hospital discharge summary, both parents’ Aadhaar, and proof of address.

{/* Fee Card */}

Fee

Free within 21 days of birth. ₹20 late fee applies thereafter.

{/* Processing Time Card */}

Processing time

20 minutes online · up to 7 working days if applied offline.

{/* Eligibility Panel */}

Eligibility

Child born within municipal limits. Apply within 21 days of birth; late registration allowed with an affidavit.

{/* Documents Panel */}

Required documents

Hospital discharge summary, both parents’ Aadhaar, and proof of address.

{/* Process Panel */}

Process

Apply online with hospital records, or visit your nearest municipal office. Processing time is 20 minutes online and up to 7 working days if applied offline.

{/* Related Services Section */}

Related services

{/* Death Certificate Card */}

Death Certificate

Municipal Corporation

Free · 20 mins
{/* Marriage Certificate Card */}

Marriage Certificate

Registrar of Marriages

₹100 · 15 days
{/* Aadhaar Enrolment Card */}

Aadhaar Enrolment

UIDAI

Free · 90 days
); export default SearchDiscoveryServiceDetailExample2Demo; ``` Angular: ```html
health_and_safety

Birth Certificate

Municipal Corporation · Registration of Births & Deaths

Free | 20 mins (online) | check Government verified

About this service

A Birth Certificate is the official record of a child's birth, issued by the local municipal body. It is required for school admission, passport, Aadhaar enrolment and accessing welfare schemes. Apply online with hospital records, or visit your nearest municipal office.

Eligibility

Child born within municipal limits. Apply within 21 days of birth; late registration allowed with an affidavit.

Required documents

Hospital discharge summary, both parents’ Aadhaar, and proof of address.

Fee

Free within 21 days of birth. ₹20 late fee applies thereafter.

Processing time

20 minutes online · up to 7 working days if applied offline.

Eligibility

Child born within municipal limits. Apply within 21 days of birth; late registration allowed with an affidavit.

Required documents

Hospital discharge summary, both parents’ Aadhaar, and proof of address.

Process

Apply online with hospital records, or visit your nearest municipal office. Processing time is 20 minutes online and up to 7 working days if applied offline.

Related services

``` ### 3. Full Screen — Service Detail - Full Page HTML: ```html
health_and_safety

Birth Certificate

Municipal Corporation · Registration of Births & Deaths

Free | 20 mins (online) | check Government verified

About this service

A Birth Certificate is the official record of a child's birth, issued by the local municipal body. It is required for school admission, passport, Aadhaar enrolment and accessing welfare schemes. Apply online with hospital records, or visit your nearest municipal office.

Eligibility

Child born within municipal limits. Apply within 21 days of birth; late registration allowed with an affidavit.

Required documents

Hospital discharge summary, both parents’ Aadhaar, and proof of address.

Fee

Free within 21 days of birth. ₹20 late fee applies thereafter.

Processing time

20 minutes online · up to 7 working days if applied offline.

Eligibility

Child born within municipal limits. Apply within 21 days of birth; late registration allowed with an affidavit.

Required documents

Hospital discharge summary, both parents’ Aadhaar, and proof of address.

Process

Apply online with hospital records, or visit your nearest municipal office. Processing time is 20 minutes online and up to 7 working days if applied offline.

Related services

``` React: ```jsx import React from 'react'; const SearchDiscoveryServiceDetailExample3Demo = () => ( <>
{/* Breadcrumbs */}
{/* Hero Info Card */}
health_and_safety

Birth Certificate

Municipal Corporation · Registration of Births & Deaths

Free | 20 mins (online) | check Government verified
{/* Underline Tabs */}
{/* Overview Panel */}
{/* About section */}

About this service

A Birth Certificate is the official record of a child's birth, issued by the local municipal body. It is required for school admission, passport, Aadhaar enrolment and accessing welfare schemes. Apply online with hospital records, or visit your nearest municipal office.

{/* 2x2 Info Grid */}
{/* Eligibility Card */}

Eligibility

Child born within municipal limits. Apply within 21 days of birth; late registration allowed with an affidavit.

{/* required Documents Card */}

Required documents

Hospital discharge summary, both parents’ Aadhaar, and proof of address.

{/* Fee Card */}

Fee

Free within 21 days of birth. ₹20 late fee applies thereafter.

{/* Processing Time Card */}

Processing time

20 minutes online · up to 7 working days if applied offline.

{/* Eligibility Panel */}

Eligibility

Child born within municipal limits. Apply within 21 days of birth; late registration allowed with an affidavit.

{/* Documents Panel */}

Required documents

Hospital discharge summary, both parents’ Aadhaar, and proof of address.

{/* Process Panel */}

Process

Apply online with hospital records, or visit your nearest municipal office. Processing time is 20 minutes online and up to 7 working days if applied offline.

{/* Related Services Section */}

Related services

{/* Death Certificate Card */}

Death Certificate

Municipal Corporation

Free · 20 mins
{/* Marriage Certificate Card */}

Marriage Certificate

Registrar of Marriages

₹100 · 15 days
{/* Aadhaar Enrolment Card */}

Aadhaar Enrolment

UIDAI

Free · 90 days
); export default SearchDiscoveryServiceDetailExample3Demo; ``` Angular: ```html
health_and_safety

Birth Certificate

Municipal Corporation · Registration of Births & Deaths

Free | 20 mins (online) | check Government verified

About this service

A Birth Certificate is the official record of a child's birth, issued by the local municipal body. It is required for school admission, passport, Aadhaar enrolment and accessing welfare schemes. Apply online with hospital records, or visit your nearest municipal office.

Eligibility

Child born within municipal limits. Apply within 21 days of birth; late registration allowed with an affidavit.

Required documents

Hospital discharge summary, both parents’ Aadhaar, and proof of address.

Fee

Free within 21 days of birth. ₹20 late fee applies thereafter.

Processing time

20 minutes online · up to 7 working days if applied offline.

Eligibility

Child born within municipal limits. Apply within 21 days of birth; late registration allowed with an affidavit.

Required documents

Hospital discharge summary, both parents’ Aadhaar, and proof of address.

Process

Apply online with hospital records, or visit your nearest municipal office. Processing time is 20 minutes online and up to 7 working days if applied offline.

Related services

```