diff --git a/.github/ISSUE_TEMPLATE/bug_report.md b/.github/ISSUE_TEMPLATE/bug_report.md deleted file mode 100644 index b41b4958..00000000 --- a/.github/ISSUE_TEMPLATE/bug_report.md +++ /dev/null @@ -1,38 +0,0 @@ ---- -name: πŸͺ² Bug Report -about: Create a bug report to help us resolving the bug -title: 'πŸͺ²[Bug]: ' -labels: 'bug' -assignees: '' - ---- - -**Describe the bug** -A clear and concise description of what the bug is. - -**To Reproduce** -Steps to reproduce the behavior: -1. Go to '...' -2. Click on '....' -3. Scroll down to '....' -4. See error - -**Expected behavior** -A clear and concise description of what you expected to happen. - -**Screenshots** -If applicable, add screenshots to help explain your problem. - -**Desktop (please complete the following information):** - - OS: [e.g. iOS] - - Browser [e.g. chrome, safari] - - Version [e.g. 22] - -**Smartphone (please complete the following information):** - - Device: [e.g. iPhone6] - - OS: [e.g. iOS8.1] - - Browser [e.g. stock browser, safari] - - Version [e.g. 22] - -**Additional context** -Add any other context about the problem here. \ No newline at end of file diff --git a/.github/ISSUE_TEMPLATE/bug_report.yml b/.github/ISSUE_TEMPLATE/bug_report.yml new file mode 100644 index 00000000..01e1dc4c --- /dev/null +++ b/.github/ISSUE_TEMPLATE/bug_report.yml @@ -0,0 +1,53 @@ +name: Bug report 🐞 +description: File a bug report +title: "🐞[Bug]: " +body: + - type: checkboxes + id: existing-issue + attributes: + label: Is there an existing issue for this? + description: Please search to see if an issue already exists for the bug you encountered. + options: + - label: I have searched the existing issues + required: true + - type: textarea + id: what-happened + attributes: + label: Describe the bug + description: A concise description of what you are experiencing. + placeholder: Tell us what you see! + validations: + required: true + - type: textarea + id: expected-behaviour + attributes: + label: Expected behavior + description: A clear and concise description of what you expected to happen. + validations: + required: true + - type: textarea + id: screenshots + attributes: + label: Add ScreenShots + description: Add sufficient ScreenShots to explain your issue. + - type: dropdown + id: browsers + attributes: + label: What browsers are you seeing the problem on? + multiple: true + options: + - Firefox + - Chrome + - Safari + - Microsoft Edge + - type: checkboxes + id: terms + attributes: + label: Record + options: + - label: "I have read the Contributing Guidelines" + required: true + - label: "I'm a GSSOC'24 contributor" + required: true + - label: "I have starred the repository" + required: true diff --git a/.github/ISSUE_TEMPLATE/docs.md b/.github/ISSUE_TEMPLATE/docs.md deleted file mode 100644 index f50dec29..00000000 --- a/.github/ISSUE_TEMPLATE/docs.md +++ /dev/null @@ -1,22 +0,0 @@ ---- -name: πŸ“ Documentation -about: Propose changes and improvements to ScrapQuest Docs. -title: 'πŸ“[Docs]: ' -labels: 'enhancement' -assignees: '' ---- - -**What Docs changes are you proposing?** -Provide a clear description of the changes you're proposing for the documentation. Are you suggesting corrections, clarifications, additions, or updates? - -**Why do the Docs need this improvement? What is the motivation for this change? How will this change benefit the community?** -Explain the motivation behind the proposed changes and how they will benefit the community or users of the documentation. - -**Describe the solution you'd like** -Provide a clear and concise description of the changes you'd like to see implemented in the documentation. - -**Describe alternatives you've considered** -If you've thought about alternative approaches or solutions, briefly describe them here. - -**Additional context** -Add any additional context, examples, or screenshots related to the proposed documentation changes. diff --git a/.github/ISSUE_TEMPLATE/documentation_update.yml b/.github/ISSUE_TEMPLATE/documentation_update.yml new file mode 100644 index 00000000..697e898c --- /dev/null +++ b/.github/ISSUE_TEMPLATE/documentation_update.yml @@ -0,0 +1,59 @@ +name: πŸ“ Documentation Update +description: Improve Documentation +title: "πŸ“[Documentation Update]: " +body: + - type: checkboxes + id: existing-issue + attributes: + label: Is there an existing issue for this? + description: Please search to see if an issue already exists for the updates you want to make. + options: + - label: I have searched the existing issues + required: true + - type: textarea + id: issue-description + attributes: + label: Issue Description + description: Please provide a clear description of the documentation update you are suggesting. + placeholder: Describe the improvement or correction you'd like to see in the documentation. + validations: + required: true + - type: textarea + id: suggested-change + attributes: + label: Suggested Change + description: Provide details of the proposed change to the documentation. + placeholder: Explain how the documentation should be updated or corrected. + validations: + required: true + - type: textarea + id: rationale + attributes: + label: Rationale + description: Why is this documentation update necessary or beneficial? + placeholder: Explain the importance or reasoning behind the suggested change. + validations: + required: False + - type: dropdown + id: urgency + attributes: + label: Urgency + description: How urgently do you believe this documentation update is needed? + options: + - High + - Medium + - Low + default: 0 + validations: + required: true + - type: checkboxes + id: terms + attributes: + label: Record + options: + - label: "I have read the Contributing Guidelines" + required: true + - label: "I'm a GSSOC'24 contributor" + required: true + - label: "I have starred the repository" + required: true diff --git a/.github/ISSUE_TEMPLATE/feature_request.md b/.github/ISSUE_TEMPLATE/feature_request.md deleted file mode 100644 index 16775e13..00000000 --- a/.github/ISSUE_TEMPLATE/feature_request.md +++ /dev/null @@ -1,20 +0,0 @@ ---- -name: πŸ’‘ Feature Request -about: Suggest an interesting feature idea for this project -title: 'πŸ’‘[FEATURE]: ' -labels: 'enhancement' -assignees: '' - ---- - -**Is your feature request related to a problem? Please describe.** -A clear and concise description of what the problem is. Ex. I'm always frustrated when [...] - -**Describe the solution you'd like** -A clear and concise description of what you want to happen. - -**Describe alternatives you've considered** -A clear and concise description of any alternative solutions or features you've considered. - -**Additional context** -Add any other context or screenshots about the feature request here. \ No newline at end of file diff --git a/.github/ISSUE_TEMPLATE/feature_request.yml b/.github/ISSUE_TEMPLATE/feature_request.yml new file mode 100644 index 00000000..dee01640 --- /dev/null +++ b/.github/ISSUE_TEMPLATE/feature_request.yml @@ -0,0 +1,62 @@ +name: ✨ Feature Request +description: Suggest a feature +title: "✨[Feature Request]: " +body: + - type: checkboxes + id: existing-issue + attributes: + label: Is there an existing issue for this? + description: Please search to see if an issue already exists for this feature. + options: + - label: I have searched the existing issues + required: true + - type: textarea + id: feature-description + attributes: + label: Feature Description + description: Please provide a detailed description of the feature you are requesting. + placeholder: Describe the new feature or enhancement you'd like to see. + validations: + required: true + - type: textarea + id: use-case + attributes: + label: Use Case + description: How would this feature enhance your use of the project? + placeholder: Describe a specific use case or scenario where this feature would be beneficial. + validations: + required: true + - type: textarea + id: benefits + attributes: + label: Benefits + description: What benefits would this feature bring to the project or community? + placeholder: Explain the advantages of implementing this feature. + - type: textarea + id: screenShots + attributes: + label: Add ScreenShots + description: If any... + - type: dropdown + id: priority + attributes: + label: Priority + description: How important is this feature to you? + options: + - High + - Medium + - Low + default: 0 + validations: + required: true + - type: checkboxes + id: terms + attributes: + label: Record + options: + - label: "I have read the Contributing Guidelines" + required: true + - label: "I'm a GSSOC'24 contributor" + required: true + - label: "I have starred the repository" + required: true diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md index 92f18132..d80c2d98 100644 --- a/.github/PULL_REQUEST_TEMPLATE.md +++ b/.github/PULL_REQUEST_TEMPLATE.md @@ -1,50 +1,30 @@ -## PR Description + +## Description + -_Add your description_ -## Related Issues: Issue for which you are raising a PR for +## Related Issues + - Closes # -### Issue +## Type of PR + +- [ ] () -[Issue number or description] +## Screenshots / videos (if applicable) + -### Checklist - -- [ ] I have gone through the [contributing guide](## PR Description - -_Add your description_ - -## Related Issues: Issue for which you are raising a PR for - -- Closes # - -### Issue - -[Issue number or description] - -### Checklist +## Checklist + - [ ] I have gone through the [contributing guide](https://github.com/Anishkagupta04/RAPIDOC-HEALTHCARE-WEBSITE-/) - [ ] I have updated my branch and synced it with project `main` branch before making this PR -- [ ] Is this a bug fix/enhancement/documentation changes - - -## Undertaking - -I declare that: - -1. The content I am submitting is original and has not been plagiarized. -2. No portion of the work has been copied from any other source without proper attribution. -3. The work has been checked for plagiarism, and I assure its authenticity. -- [ ] I have updated my branch and synced it with project `main` branch before making this PR -- [ ] Is this a bug fix/enhancement/documentation changes -- [ ] Part of GSSOC -- [ ] Tested for any breaking changes -- [ ] Other relevant checks completed - +- [ ] I have performed a self-review of my code +- [ ] I have tested the changes thoroughly before submitting this pull request. +- [ ] I have provided relevant issue numbers, screenshots, and videos after making the changes. +- [ ] I have commented my code, particularly in hard-to-understand areas. -I understand that any violation of this undertaking may have legal consequences that I will bear and could result in the withdrawal of any recognition associated with the work. -- [ ] I Agree +## Additional context: + diff --git a/.github/workflows/Issue_template b/.github/workflows/Issue_template deleted file mode 100644 index 8b137891..00000000 --- a/.github/workflows/Issue_template +++ /dev/null @@ -1 +0,0 @@ - diff --git a/.github/workflows/assignlabel.yml b/.github/workflows/assignlabel.yml new file mode 100644 index 00000000..831dc8db --- /dev/null +++ b/.github/workflows/assignlabel.yml @@ -0,0 +1,55 @@ +name: Assign Issue to Creator + +on: + issue_comment: + types: [created] + +jobs: + assign-issue: + runs-on: ubuntu-latest + if: contains(github.event.comment.body, '/assign') + steps: + - name: Check commenter permissions + id: check-permissions + uses: actions/github-script@v6 + with: + github-token: ${{secrets.GITHUB_TOKEN}} + script: | + const { owner, repo } = context.repo; + const commenter = context.payload.comment.user.login; + + const { data: repoPermission } = await github.rest.repos.getCollaboratorPermissionLevel({ + owner, + repo, + username: commenter, + }); + + const allowedPermissions = ['admin', 'maintain', 'write']; + const hasPermission = allowedPermissions.includes(repoPermission.permission); + + return hasPermission; + - name: Assign issue to creator + if: steps.check-permissions.outputs.result == 'true' + uses: actions/github-script@v6 + with: + github-token: ${{secrets.GITHUB_TOKEN}} + script: | + const { owner, repo } = context.repo; + const issue_number = context.issue.number; + + const { data: issue } = await github.rest.issues.get({ + owner, + repo, + issue_number, + }); + + const creator = issue.user.login; + + await github.rest.issues.addAssignees({ + owner, + repo, + issue_number, + assignees: [creator], + }); + + console.log(`Assigned issue #${issue_number} to creator ${creator}`); \ No newline at end of file diff --git a/.github/workflows/auto-comment-on-pr-merge.yml b/.github/workflows/auto-comment-on-pr-merge.yml new file mode 100644 index 00000000..c88e9ccc --- /dev/null +++ b/.github/workflows/auto-comment-on-pr-merge.yml @@ -0,0 +1,37 @@ +name: Auto Comment on PR Merge + +on: + pull_request_target: + types: [closed] + +permissions: + issues: write + pull-requests: write + +jobs: + comment: + if: github.event.pull_request.merged == true + runs-on: ubuntu-latest + + steps: + - name: Add Comment to Merged PR + run: | + COMMENT=$(cat < { + await github.rest.issues.addLabels({ + owner: context.repo.owner, + repo: context.repo.repo, + issue_number: issue.number, + labels: [label] + }); + }; + if (issueTitle.includes('documentation')) { + await addLabel('documentation'); + } + + if (issueTitle.includes('feature')) { + await addLabel('enhancement'); + + } + if (issueTitle.includes('bug')) { + await addLabel('bug'); + } \ No newline at end of file diff --git a/.github/workflows/auto-label-pr.yml b/.github/workflows/auto-label-pr.yml new file mode 100644 index 00000000..c2297b74 --- /dev/null +++ b/.github/workflows/auto-label-pr.yml @@ -0,0 +1,38 @@ +name: Auto Label and Issue Check + +on: + pull_request: + types: [opened, edited, synchronize] + +jobs: + auto-label-and-check: + runs-on: ubuntu-latest + steps: + - name: Add GSSoC Label and Check Issue + uses: actions/github-script@v6 + with: + github-token: ${{secrets.GITHUB_TOKEN}} + script: | + const { owner, repo } = context.repo; + const pr = context.payload.pull_request; + + try { + await github.rest.issues.addLabels({ + issue_number: pr.number, + owner: owner, + repo: repo, + labels: ['gssoc'] + }); + console.log('Added gssoc label'); + } catch (error) { + console.error('Error adding gssoc label:', error); + } + + const body = pr.body || ''; + const issueMatch = body.match(/(?:close|closes|closed|fix|fixes|fixed|resolve|resolves|resolved)\s*:?\s*#(\d+)/i); + + if (!issueMatch) { + core.setFailed('No related issue mentioned in the PR description. Please use the PR template and mention the related issue.'); + } else { + console.log('Related issue found:', issueMatch[1]); + } \ No newline at end of file diff --git a/.github/workflows/close-old-issue.yml b/.github/workflows/close-old-issue.yml new file mode 100644 index 00000000..d3e0e348 --- /dev/null +++ b/.github/workflows/close-old-issue.yml @@ -0,0 +1,55 @@ +name: Close Old Issues +on: + schedule: + - cron: "0 0 * * *" # Runs daily at midnight + +jobs: + manage-issues: + runs-on: ubuntu-latest + + steps: + - name: Checkout Repository + uses: actions/checkout@v4 + + - name: Manage Issues + run: | + open_issues=$(curl -s -H "Authorization: token ${{ secrets.GITHUB_TOKEN }}" \ + "https://api.github.com/repos/${{ github.repository }}/issues?state=open" \ + | jq -r '.[] | .number') + for issue in $open_issues; do + # Get issue details + issue_details=$(curl -s -H "Authorization: token ${{ secrets.GITHUB_TOKEN }}" \ + "https://api.github.com/repos/${{ github.repository }}/issues/$issue") + last_updated=$(echo $issue_details | jq -r '.updated_at') + labels=$(echo $issue_details | jq -r '.labels[].name') + + days_since_update=$(( ( $(date +%s) - $(date -d "$last_updated" +%s) ) / 86400 )) + + if [ $days_since_update -gt 7 ]; then + if echo "$labels" | grep -q "stale"; then + # If stale for more than 10 days, close the issue + if [ $days_since_update -gt 17 ]; then + curl -s -X PATCH -H "Authorization: token ${{ secrets.GITHUB_TOKEN }}" \ + -H "Accept: application/vnd.github.v3+json" \ + -d '{"state":"closed"}' \ + "https://api.github.com/repos/${{ github.repository }}/issues/$issue" + + curl -s -X POST -H "Authorization: token ${{ secrets.GITHUB_TOKEN }}" \ + -H "Accept: application/vnd.github.v3+json" \ + -d '{"body":"This issue has been automatically closed because it has been inactive for more than 17 days (including 7 days marked as stale). If you believe this is still relevant, feel free to reopen it or create a new one. Thank you!"}' \ + "https://api.github.com/repos/${{ github.repository }}/issues/$issue/comments" + fi + else + # Mark as stale + curl -s -X POST -H "Authorization: token ${{ secrets.GITHUB_TOKEN }}" \ + -H "Accept: application/vnd.github.v3+json" \ + -d '{"labels":["stale"]}' \ + "https://api.github.com/repos/${{ github.repository }}/issues/$issue/labels" + + curl -s -X POST -H "Authorization: token ${{ secrets.GITHUB_TOKEN }}" \ + -H "Accept: application/vnd.github.v3+json" \ + -d '{"body":"This issue has been marked as stale because it has been inactive for more than 7 days. It will be closed if no further activity occurs in the next 10 days. Please update if you want to keep it open."}' \ + "https://api.github.com/repos/${{ github.repository }}/issues/$issue/comments" + fi + fi + done diff --git a/.github/workflows/codeql.yml b/.github/workflows/codeql.yml new file mode 100644 index 00000000..8f716e56 --- /dev/null +++ b/.github/workflows/codeql.yml @@ -0,0 +1,66 @@ +name: "CodeQL" + +on: + push: + branches: [ "main" ] + pull_request: + branches: [ "main" ] + schedule: + - cron: '20 12 * * 3' + +jobs: + analyze: + name: Analyze (${{ matrix.language }}) + # Runner size impacts CodeQL analysis time. To learn more, please see: + # - https://gh.io/recommended-hardware-resources-for-running-codeql + # - https://gh.io/supported-runners-and-hardware-resources + # - https://gh.io/using-larger-runners (GitHub.com only) + # Consider using larger runners or machines with greater resources for possible analysis time improvements. + runs-on: ${{ (matrix.language == 'swift' && 'macos-latest') || 'ubuntu-latest' }} + timeout-minutes: ${{ (matrix.language == 'swift' && 120) || 360 }} + permissions: + # required for all workflows + security-events: write + + # required to fetch internal or private CodeQL packs + packages: read + + # only required for workflows in private repositories + actions: read + contents: read + + strategy: + fail-fast: false + matrix: + include: + - language: javascript-typescript + build-mode: none + # CodeQL supports the following values keywords for 'language': 'c-cpp', 'csharp', 'go', 'java-kotlin', 'javascript-typescript', 'python', 'ruby', 'swift' + # Use `c-cpp` to analyze code written in C, C++ or both + # Use 'java-kotlin' to analyze code written in Java, Kotlin or both + # Use 'javascript-typescript' to analyze code written in JavaScript, TypeScript or both + # To learn more about changing the languages that are analyzed or customizing the build mode for your analysis, + # see https://docs.github.com/en/code-security/code-scanning/creating-an-advanced-setup-for-code-scanning/customizing-your-advanced-setup-for-code-scanning. + # If you are analyzing a compiled language, you can modify the 'build-mode' for that language to customize how + # your codebase is analyzed, see https://docs.github.com/en/code-security/code-scanning/creating-an-advanced-setup-for-code-scanning/codeql-code-scanning-for-compiled-languages + steps: + - name: Checkout repository + uses: actions/checkout@v4 + + # Initializes the CodeQL tools for scanning. + - name: Initialize CodeQL + uses: github/codeql-action/init@v3 + with: + languages: ${{ matrix.language }} + build-mode: ${{ matrix.build-mode }} + # If you wish to specify custom queries, you can do so here or in a config file. + # By default, queries listed here will override any specified in a config file. + # Prefix the list here with "+" to use these queries and those in the config file. + + # For more details on CodeQL's query packs, refer to: https://docs.github.com/en/code-security/code-scanning/automatically-scanning-your-code-for-vulnerabilities-and-errors/configuring-code-scanning#using-queries-in-ql-packs + # queries: security-extended,security-and-quality + + - name: Perform CodeQL Analysis + uses: github/codeql-action/analyze@v3 + with: + category: "/language:${{matrix.language}}" diff --git a/.github/workflows/greetings.yml b/.github/workflows/greetings.yml index 704db0e2..be872536 100644 --- a/.github/workflows/greetings.yml +++ b/.github/workflows/greetings.yml @@ -1,16 +1,22 @@ -name: Greetings +name: 'Greetings' -on: [pull_request_target, issues] +on: + issues: + types: [opened] + pull_request_target: + types: [opened] +permissions: + issues: write + pull-requests: write jobs: - greeting: + welcome: runs-on: ubuntu-latest - permissions: - issues: write - pull-requests: write steps: - - uses: actions/first-interaction@v1 - with: - repo-token: ${{ secrets.GITHUB_TOKEN }} - issue-message: "Hi there! Thanks for opening this issue. We appreciate your contribution to this open-source project. We aim to respond or assign your issue as soon as possible." - pr-message: "Welcome to Our repository.🎊 Thank you so much for taking the time to point this out." + - uses: actions/checkout@v1 + - uses: EddieHubCommunity/gh-action-community/src/welcome@main + with: + github-token: ${{ secrets.GITHUB_TOKEN }} + issue-message: "Hi there! Thanks for opening this issue. We appreciate your contribution to this open-source project. We aim to respond or assign your issue as soon as possible." + pr-message: "Great job, @${{ github.actor }}! πŸŽ‰ Thank you for submitting your pull request. Your contribution is valuable and we appreciate your efforts to improve our project.We will promptly review your changes and offer feedback. Keep up the excellent work! Kindly remember to check our [contributing guidelines](https://github.com/Anshika14528/RAPIDOC-HEALTHCARE-WEBSITE-/blob/main/CONTRIBUTING.md)" + \ No newline at end of file diff --git a/.github/workflows/mkdocs.yaml b/.github/workflows/mkdocs.yaml new file mode 100644 index 00000000..bb8e8815 --- /dev/null +++ b/.github/workflows/mkdocs.yaml @@ -0,0 +1,27 @@ +# name: Build site nightly + +# on: +# schedule: +# - cron: "0 0 * * *" + +# jobs: +# dot-release: +# name: dot-release +# runs-on: ubuntu-latest + +# steps: +# - name: curl +# env: +# NETLIFY_BUILD_HOOK: ${{ secrets.NETLIFY_BUILD_HOOK }} +# uses: wei/curl@v1 +# with: +# args: -X POST -d '{}' "$NETLIFY_BUILD_HOOK" + +# - name: Check response status +# run: | +# response=$(curl -s -o response.txt -w "%{http_code}" -X POST -d '{}' "$NETLIFY_BUILD_HOOK") +# if [ "$response" -ne 200 ]; then +# echo "Build trigger failed with status: $response" +# cat response.txt +# exit 1 +# fi diff --git a/.vscode/settings.json b/.vscode/settings.json index 6f3a2913..4e845fa4 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -1,3 +1,4 @@ { - "liveServer.settings.port": 5501 -} \ No newline at end of file + "liveServer.settings.port": 5502, + "livePreview.defaultPreviewPath": "/about.html" +} diff --git a/Css-Files/Rateus.css b/Css-Files/Rateus.css new file mode 100644 index 00000000..3c3b28ba --- /dev/null +++ b/Css-Files/Rateus.css @@ -0,0 +1,274 @@ +/* Reset styles */ +* { + margin: 0; + padding: 0; + box-sizing: border-box; + } + + /* Viewport meta tag for responsive design */ + /* Ensure this meta tag is in your HTML section */ + /* */ + + /* General styles */ + .feedback-wrapper { + display: flex; + align-items: center; + justify-content: center; + min-height: 100vh; + padding: 20px; + box-sizing: border-box; + width: 60%; + } + + .popup { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: rgba(0, 0, 0, 0.5); + display: flex; + align-items: center; + justify-content: center; + z-index: 1000; + } + + .popup-content { + background-color: #113435; + padding: 20px; + border-radius: 10px; + text-align: center; + max-width: 100%; + width: 80%; + box-sizing: border-box; + } + + .popup-content a { + text-decoration: none; + color: white; + } + + .popup-close { + position: absolute; + top: 10px; + right: 10px; + color: #01494b; + font-size: 24px; + cursor: pointer; + } + + .popup h2 { + color: white; + font-size: 24px; + } + + .popup p { + margin: 16px 0; + color: #ececec; + } + + .popup img { + margin-top: 20px; + } + + .popup-button { + background-color: #005253; + color: white; + border: none; + padding: 10px 20px; + border-radius: 5px; + cursor: pointer; + font-size: 16px; + } + + .popup-button:hover { + background-color: #206b6c; + color: white; + } + + /* Feedback form styles */ + .feedback-form { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + padding: 40px; + animation: slideInFromBottom 1s cubic-bezier(0.68, -0.55, 0.27, 1.55) forwards; + transition: opacity 0.3s ease-in-out; + background-color: #3fbcc051; + border-radius: 10px; + box-shadow: 0 0 10px rgba(6, 130, 130, 0.1); + max-width: 200%; + width: 200%; + /* height: 400px; */ + box-sizing: border-box; + opacity: 0; + } + + .feedback-form h2 { + font-size: 27px; + margin-bottom: 8px; + text-align: center; + font-weight: 1000 !important; + } + + .feedback-form p { + color: #d7d4d4; + font-size: 16px; + margin-bottom: 20px; + text-align: center; + } + + .feedback-form .rating-container { + display: flex; + justify-content: center; + margin-bottom: 2px; + } + + .rating-container button { + font-size: 24px; + border: none; + background: none; + cursor: pointer; + color: grey; + transition: transform 0.3s ease, color 0.3s ease; + } + + .rating-container button.filled { + color: yellow; + transform: scale(1.2); + } + + .rating-container button:hover, + .rating-container button:hover ~ button { + transform: scale(1.1); + } + + .feedback-form .rate-us { + text-align: center !important; + display: block; + margin-top: 0px; + width: 100%; + color: rgb(251, 250, 250); + margin-bottom: 10px; + } + + .feedback-form button { + background: none; + border: none; + font-size: 25px; + cursor: pointer; + z-index: 1; + padding: 12px; + transition: transform 0.2s ease; + } + + .feedback-form form { + display: flex; + flex-direction: column; + width: 100%; + position: relative; + bottom: 7px; + } + + .feedback-form label { + width: 100%; + text-align: left; + font-size: 14px; + margin-top: 9px; + font-weight: 600; + color: #fff; + } + + .feedback-form input, + .feedback-form textarea { + margin-top: 10px; + padding: 12px; + border: 1px solid #ccc; + border-radius: 5px; + font-size: 16px; + margin-bottom: 15px; + width: 100%; + box-sizing: border-box; + transition: all 0.3s ease; + box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1); + } + + .feedback-form input:focus, + .feedback-form textarea:focus { + outline: none; + border-color: #29888a; + box-shadow: 0 0 5px rgba(41, 136, 138, 0.5); + } + + .feedback-form textarea { + resize: vertical; + min-height: 100px; + max-height: 300px; + } + + .feedback-form button[type="submit"] { + background-color: hwb(181 16% 46%); + color: white; + border: none; + padding: 12px 20px; + border-radius: 5px; + margin-left:190px; + cursor: pointer; + font-size: 16px; + transition: background-color 0.3s ease, transform 0.2s ease; + } + + .feedback-form button[type="submit"]:hover { + background-color: #1c5f5e; + transform: translateY(-2px); + } + + .feedback-form button[type="submit"]:active { + transform: translateY(0); + background-color: #1c5f5e; + } + + .feedback-form .form-group { + display: flex; + flex-direction: column; + width: 100%; + margin-bottom: 15px; + } + + /* Keyframes for animation */ + @keyframes slideInFromBottom { + 0% { + transform: translateY(50px); + opacity: 0; + } + 60% { + transform: translateY(-10px); + opacity: 0.8; + } + 80% { + transform: translateY(5px); + opacity: 0.9; + } + 100% { + transform: translateY(0); + opacity: 1; + } + } + + /* Responsive adjustments for mobile screens */ + @media (max-width: 768px) { + .feedback-form { + width: 100%; + padding: 15px; + } + + .popup-content { + width: 100%; + padding: 15px; + } + .close-btn{ + top: 10px; + } + } + \ No newline at end of file diff --git a/Css-Files/aboutus.css b/Css-Files/aboutus.css new file mode 100644 index 00000000..848bcc18 --- /dev/null +++ b/Css-Files/aboutus.css @@ -0,0 +1,94 @@ +.about-us { + display: block; + margin: auto; + width: 100%; + max-width: 52.5rem; + height: 100%; +} +.about-us-heading { + text-align: center; + font-size: 40px; + margin-bottom: 5rem; + margin-top: 5rem; +} +.about-service { + height: auto; + width: 100%; + max-width: 1200px; + margin: -40px auto 0; + display: flex; + justify-content: center; + align-items: center; + flex-wrap: wrap; +} +.sec-1, .sec-2 { + height: auto; + width: 100%; + max-width: 600px; +} +.sec-2 { + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + gap: 8px; +} +.a-1, .a-2, .a-3 { + height: auto; + min-height: 94px; + width: 100%; + max-width: 500px; + display: flex; + align-items: center; + justify-content: left; + background-color: #111111; + border-radius: 11px; margin-bottom: 10px; + transition: transform 0.3s ease; +} +.a-1:hover,.a-2:hover,.a-3:hover { + box-shadow: 0 8px 16px rgba(47, 80, 247, 0.2); + cursor: pointer; + transform: scale(1.05); +} +.a-l, .b-l, .c-l { + height: 58px; + width: 58px; + border-radius: 50%; + margin: 17px 15px; + border: 2px solid #2f7f81; + flex-shrink: 0; +} +.a-r, .b-r, .c-r { + flex-grow: 1; + margin: 19px 20px; +} +.head-1, .head-2 { + width: 100%; +} +.head-1 { + font-size: 18px; +} +.head-2 { + font-size: 10px; + margin-top: 7px; +} +.h-icon { + margin-left: 10px; + margin-top: 11px; +} +.q-icon { + margin-left: 7px; + margin-top: 7px; +} +.a-icon { + margin-left: 14px; + margin-top: 15px; +} +.about-img { + height: auto; + max-height: 300px; + width: 100%; + max-width: 520px; + margin: 30px auto; + display: block; +} \ No newline at end of file diff --git a/Css-Files/appointment.css b/Css-Files/appointment.css new file mode 100644 index 00000000..cb40e605 --- /dev/null +++ b/Css-Files/appointment.css @@ -0,0 +1,166 @@ +#appointment { + display: flex; + align-items: center; + justify-content: center; +} + +.appointment-container { + width: 90%; + max-width: 900px; + margin: 0 auto; + padding: 20px; + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); + background-color: #3fbcc051; + text-align: center; + margin-bottom: 7%; + border-radius: 20px; +} + +.section-title h2 { + font-size: 1.6rem; + margin: 15px 0 0 0; + color: #fff; + font-weight: bold; +} + +.section-title p { + font-size: 0.8rem; + color: #666; + font-weight: normal; + margin: 20px 0 0 0; +} + +.php-email-form { + display: flex; + flex-direction: column; + align-items: center; + border-radius: 8px; + padding: 10px; + box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1); +} + +.form-group { + margin-bottom: 15px; + width: 100%; + max-width: 400px; +} + +.form-group label { + display: block; + text-align: start; + text-transform: capitalize; + font-weight: 600; + margin-bottom: 15px; +} + +.form-control { + width: 100%; + padding: 8px; + font-size: 1rem; + border: 1px solid #ccc; + border-radius: 4px; + background-color: #fff; + color: #000; +} + +.form-select { + width: 100%; + padding: 6px; + font-size: 0.9rem; + border: 1px solid #ccc; + border-radius: 4px; + background-color: #fff; + color: #000; + box-sizing: border-box; + appearance: none; + -webkit-appearance: none; + -moz-appearance: none; + background-image: url('data:image/svg+xml;charset=US-ASCII,'); /* Custom dropdown arrow */ + background-repeat: no-repeat; + background-position: right 10px center; + background-size: 16px 16px; +} + +.form-select::placeholder { + color: #999; + opacity: 1; +} + +.btn-primary { + text-align: center; + justify-content: center; + background-color: #29888A; + color: #fff; + font-size: 1.2rem; + border: none; + border-radius: 4px; + cursor: pointer; + text-decoration: none; + margin: 20px 0 30px 0; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); + transition: background-color 0.3s, box-shadow 0.3s; +} + +.btn-primary:hover { + background-color: #30a3a5; + box-shadow: 0 6px 8px rgba(0, 0, 0, 0.2); +} + +/* Responsive adjustments */ +/* For tablets and smaller screens */ +@media (max-width: 768px) { + .appointment-container { + padding: 15px; + } + + .section-title h2 { + font-size: 2rem; + } + + .section-title p { + font-size: 1rem; + } + + .php-email-form { + padding: 15px; + } + + .btn-primary { + width: 100%; + max-width: none; + } +} + +/* For larger smartphones and smaller tablets */ +@media (max-width: 576px) { + .appointment-container { + padding: 10px; + } + + .section-title h2 { + font-size: 1.8rem; + } + + .section-title p { + font-size: 0.9rem; + } +} + +/* For extra-large screens (desktops) */ +@media (min-width: 1200px) { + .appointment-container { + padding: 30px; + } + + .section-title h2 { + font-size: 3rem; + } + + .section-title p { + font-size: 1.2rem; + } + + .php-email-form { + padding: 30px; + } +} diff --git a/Css-Files/bloodstyle.css b/Css-Files/bloodstyle.css index e645409f..028bccb9 100644 --- a/Css-Files/bloodstyle.css +++ b/Css-Files/bloodstyle.css @@ -4,8 +4,23 @@ box-sizing: border-box; font-family: 'poppins',sans-serif; } -bodY{ + + +@media screen and (max-width: 768px) { + #ss { + font-size: 12px; + } +} + +@media screen and (max-width: 480px) { + #ss { + font-size: 10px; + } +} + +body{ display: flex; + flex-direction: column; justify-content: center; align-items: center; min-height: 100vh; @@ -16,7 +31,7 @@ bodY{ text-decoration: none; margin-top: -18px; position: absolute; - left: 50%; + left: 45%; font-size: 30px; justify-content: center; align-items: center; @@ -28,7 +43,7 @@ margin-top: -18px; color: #fff; } #topbar1 { - background: #022a2d; + margin-top: 50px; height: 50px; font-size: 14px; transition: all 0.5s; @@ -39,27 +54,6 @@ margin-top: -18px; top: -40px; } - #topbar1 .contact-info a { - margin-top: -40px; - line-height: 1; - color: #fff; - transition: 0.3s; - } - - #topbar1 .contact-info a:hover { - color: #3fbbc0; - } - #topbar1 .contact-info i { - color: #3fbbc0; - margin-top: -40px; - padding-right: 4px; - margin-left: 15px; - line-height: 0; - } - #topbar1 .contact-info i:first-child { - margin-left: 0; - } - #topbar1 .social-links a { margin-top: -40px; color: #3fbbc0; @@ -67,6 +61,8 @@ margin-top: -18px; display: inline-block; line-height: 1px; transition: 0.3s; + transform: translateY(-100px); + } #topbar1 .social-links a:hover { @@ -225,7 +221,8 @@ justify-content: center; align-items: center; flex-direction: column; text-align: center; -gap: 15px +gap: 15px; +padding-top: 3rem; } .container .drop .content h2{ @@ -243,6 +240,7 @@ gap: 15px align-items: center; font-size: 2em; color: var(--clr); + padding-left: 1em; } .container .drop .content a{ position: relative; @@ -256,10 +254,10 @@ gap: 15px opacity: 0.75; transition: 0.5s; } -container .drop .content a:hover{ +.container .drop .content a:hover{ opacity: 1; } -container .drop .content a::before{ +.container .drop .content a::before{ content: ''; position: absolute; width: 65%; @@ -271,8 +269,6 @@ container .drop .content a::before{ } @media (max-width: 992px){ #topbar1 { - background: #022a2d; - height: 100px; font-size: 14px; transition: all 0.5s; z-index: 996; @@ -281,4 +277,456 @@ container .drop .content a::before{ font-size: 28px; line-height: 36px; } +} +.ltr{ + color: black !important; +} + + a { + color: #55a5ea; + text-decoration: none; + cursor: pointer; + } + + a:hover { + color: #55a5ea; + text-decoration: none; + } + + h1, + h2, + h3, + h4, + h5, + h6 { + font-family: "Raleway", sans-serif; + } + + .nav_link li { + padding: 5px 10px; + display: inline-block; + color: white; + } + + .nav_link li a { + transition: all 0.3s ease 0s; + color: white; + } + button { + position: relative; + border-radius: 10px; + border: 1px solid #4bb6b7; + background-color: #4bb6b7; + color: #fff; + font-size: 15px; + font-weight: 700; + margin: 8px; + padding: 8px 50px; + letter-spacing: 1px; + text-transform: capitalize; + transition: 0.3s ease-in-out; + cursor: pointer; + } + + .nav_link li a:hover { + color: #55a5ea; + + /* text-decoration: underline 2.5px rgb(3, 3, 94); */ + } + + .header_container { + /* background-color: #d9d9d9; */ + background-color: #022a2d ; + opacity: 0.9; + display: flex; + flex-direction: row; + /* justify-content: space-evenly; */ + justify-content: space-between; + align-items: center; + height: 70px; + margin: auto; + width: 100%; + } + + :root { + --text-color: #959DA5; + --footer-bg: #022a2d; + --footer-bottom-bg: #3fbcc051s; + --white: white; + --link-color: #959DA5; + --link-hover: #2F81CF; + --button-border: #848D97; + } + footer { + position: relative; + padding: 50px 0; + } + + #back-to-top-container { + position: fixed; + bottom: 25px; + right: 30px; + cursor: pointer; + z-index: 1000; + } + + .circle { + background-color: #00093d; + border-radius: 50%; + width: 35px; + height: 35px; + display: flex; + justify-content: center; + align-items: center; + transition: background-color 0.3s; + } + + #back-to-top { + width: 40px; + height: 40px; + fill: #4178c0; + color: #00093d; + transition: fill 0.3s; + } + + #back-to-top:hover { + fill: hsl(214, 50%, 60%); + } + + .back-to-top:hover { + background: #3fbcc0cd; + color: #fff; + } + + .back-to-top.active { + visibility: visible; + opacity: 1; + } + + .subscribebtn:hover { + border: 3px solid var(--white); + background-color: var(--footer-bg); + } + #footer { + background: #000; + padding: 0 0 20px 0; + color: #fff; + font-size: 14px; + width: 100%; + padding: 50px; + } + + #footer .footer-top { + background: #000; + padding: 20px 0 20px 0; + } + + #footer .footer-top .footer-info { + margin-bottom: 20px; + } + + #footer .footer-top .footer-info h3 { + font-size: 50px; + margin: 0 0 20px 0; + color: #57a6ea; + padding: 2px 0 2px 0; + line-height: 1; + } + + #footer .footer-top .footer-info p { + font-size: 14px; + line-height: 24px; + margin-bottom: 0; + font-family: "Roboto", sans-serif; + } + + #footer .footer-top .social-links a { + font-size: 18px; + display: inline-block; + background: #57a6ea; + color: #fff; + line-height: 1; + padding: 8px 0; + margin-right: 4px; + border-radius: 4px; + text-align: center; + width: 36px; + height: 36px; + transition: 0.3s; + } + footer { + bottom: 0; + background-color: #03393d; + width: 100%; + min-width: 20re; + bottom: 0; + display: flex; + align-items: center; + flex-direction: column; + } + + + .footer-wrapper { + display: flex; + flex-direction: column; + max-width: 80rem; + width: 100%; + margin: 0 auto; + padding: 1rem; + } + + .footer-logo-columns { + list-style-type: none; + display: flex; + flex-direction: row; + flex-wrap: wrap; + flex-grow: 4; + gap: 3rem 1rem; + } + + .footer-logo { + margin-bottom: 2rem; + width: 3rem; + } + + .footer-logo-column { + display: flex; + grid-area: footer-logo; + flex-direction: column; + min-width: 16rem; + flex-grow: 1; + padding-right: 0.5rem; + } + + .footer-logo-column p { + color: var(--text-color); + font-size: 0.95rem; + margin-bottom: 1.5rem; + } + + .footer-logo-column h3 { + color: var(--white); + margin-top: 0.25rem; + margin-bottom: 0.25rem; + } + + /* other columns */ + + .other-columns { + display: inline-grid; + grid-template-columns: repeat(2, 1fr); + width: 100%; + gap: 2rem 1rem; + padding-top: 2rem; + } + + .other-columns ul { + display: flex; + gap: 0.75rem; + list-style-type: none; + padding: 0; + margin: 0; + flex-direction: column; + font-weight: 600; + } + + .other-columns ul a { + color: var(--text-color); + text-decoration: none; + font-size: 0.85rem; + } + + .other-columns ul a:hover { + text-decoration: underline; + } + + .other-columns h3 { + color: var(--link-color); + margin-bottom: 1rem; + font-size: 1rem; + font-family: ui-monospace, monospace; + } + + .footer-logo svg { + fill: var(--white); + } + + /*? Footer bottom */ + .footer-bottom { + width: 100%; + color: var(--text-color); + background-color: var(--footer-bottom-bg); + } + + .footer-bottom-wrapper { + display: flex; + max-width: 80rem; + margin: 0 auto; + gap: 1rem; + width: 100%; + flex-wrap: wrap; + justify-content: space-between; + align-items: center; + align-content: center; + padding: 1rem; + } + + .footer-bottom small { + font-size: 1rem; + display: inline; + white-space: nowrap; + } + + .footer-bottom-links { + list-style-type: none; + display: inline-flex; + flex-wrap: wrap; + justify-content: center; + gap: 1rem; + } + + .footer-bottom-links a { + color: var(--link-color); + text-decoration: none; + white-space: nowrap; + } + + .footer-bottom-links a:hover { + color: var(--link-hover); + text-decoration: underline; + } + + .footer-bottom>small { + font-size: 1rem; + margin: 0 auto; + width: 100% + } + + /*? socials */ + .social-wrapper { + display: flex; + gap: 0.5rem; + margin: 0 auto; + } + + .social-links { + display: inline-flex; + gap: 0.5rem; + align-items: center; + } + + .social-links img { + width: 1.5rem; + height: 1.5rem; + transition: all 0.2s ease-in-out; + } + + .social-links img:hover { + transform: scale(1.1); + } + + .social-links ul { + display: flex; + flex-wrap: wrap; + gap: 0.75rem; + list-style-type: none; + } + + .footer-bottom-wrapper { + display: flex; + flex-direction: column; + justify-content: center; + } + + .subscribe-form{ + margin-top: 10px; + display: flex; + flex-direction: column; + gap: 10px; + } + .subscribe-form input{ + padding: 10px; + } + + @media (min-width: 600px) { + .other-columns { + display: grid; + grid-template-columns: repeat(4, 1fr); + } + + .footer-bottom-wrapper { + flex-direction: row; + } + .footer-bottom-wrapper small{ + font-size: smaller; + } + .footer-bottom-links { + margin-left: 1.5rem; + } + } + + @media (max-width: 800px) { + .footer-top { + display: flex; + flex-direction: column; + align-items: center; + text-align: center; + padding: 1rem 0.5rem 2rem 0.5rem; + } + } + /*Popup Blood list*/ + .popup { + display: none; + position: fixed; + z-index: 1000; + left: 0; + top: 0; + width: 100%; + height: 100%; + overflow: auto; + background-color: rgba(0,0,0,0.4); +} + +.popup-content { + background-color: #fefefe; + margin: 15% auto; + padding: 20px; + border: 1px solid #888; + width: 80%; + max-width: 600px; +} + +.close { + color: #aaa; + float: right; + font-size: 28px; + font-weight: bold; + cursor: pointer; +} + +.close:hover, +.close:focus { + color: black; + text-decoration: none; + cursor: pointer; +} + +.popup-content h2, .popup-content h3 { + color: #4bb6b7; + padding: 10px 0; + margin: 0; +} + +.popup-content .list { + padding-left: 20px; +} + +.popup-content .list p { + margin: 5px 0; +} + +.popup-content strong { + display: block; + margin-top: 10px; + margin-bottom: 20px; } \ No newline at end of file diff --git a/Css-Files/caduceus.css b/Css-Files/caduceus.css new file mode 100644 index 00000000..2371619b --- /dev/null +++ b/Css-Files/caduceus.css @@ -0,0 +1,184 @@ +#caduceus-container { + position: fixed; + top: 85px; + right: 30px; + z-index: 998; + transform-origin: top center; + animation: swing 3s ease-in-out infinite; +} + +.rope { + width: 2px; + height: 100px; + margin: 0 auto; + background: linear-gradient( + 45deg, + #3bfcc0 0%, + #ffffff 50%, + #000000 100% + ); + background-size: 400% 400%; + animation: + gradientBackground 15s ease infinite, + waveMotion 3s ease-in-out infinite; + position: relative; +} + +.rope::before { + content: ''; + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + background: inherit; + filter: blur(1px); +} + +@keyframes gradientBackground { + 0% { background-position: 0% 50%; } + 50% { background-position: 100% 50%; } + 100% { background-position: 0% 50%; } +} + +@keyframes waveMotion { + 0%, 100% { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); } + 25% { clip-path: polygon(0 0, 100% 0, 95% 100%, 5% 100%); } + 50% { clip-path: polygon(0 0, 100% 0, 90% 100%, 10% 100%); } + 75% { clip-path: polygon(0 0, 100% 0, 95% 100%, 5% 100%); } +} +#caduceus { + width: 100px; + height: auto; + display: block; + margin: 0 auto; +} + +@keyframes swing { + 0% { transform: rotate(0deg); } + 25% { transform: rotate(5deg); } + 50% { transform: rotate(0deg); } + 75% { transform: rotate(-5deg); } + 100% { transform: rotate(0deg); } +} + + +/* Responsive styles */ +@media screen and (max-width: 768px) { + #caduceus-container { + top: 120px; + right: 30px; + } +} + +@media screen and (max-width: 320px) { + #caduceus-container { + top: 120px; + right: 60px; + } +} + +/* Tablet-specific styles *//*COrrect*/ +@media screen and (min-width: 768px) and (max-width: 1024px) { + #caduceus-container { + top: 120px; + right: 30px; + } +.rope { + height: 100px; +} + +#caduceus { + width: 100px; +} +} + +/*Correect*/ /* iPhone SE, 5, 5S, 5C, iPod Touch 5g and up */ +@media only screen +and (min-device-width: 320px) +and (max-device-width: 568px) +and (-webkit-min-device-pixel-ratio: 2) { +#caduceus-container { +top: 120px; +right: 60px; +} + +.rope { +height: 100px; +} + +#caduceus { +width: 100px; +} +} + +/* iPhone 6, 6S, 7, 8 */ +@media only screen +and (min-device-width: 375px) +and (max-device-width: 667px) +and (-webkit-min-device-pixel-ratio: 2) { +#caduceus-container { +right: 8px; +} + +.rope { +height: 100px; +} + +#caduceus { +width: 100px; +} +} + +/* iPhone 6+, 7+, 8+ */ +@media only screen +and (min-device-width: 414px) +and (max-device-width: 736px) +and (-webkit-min-device-pixel-ratio: 3) { +#caduceus-container { +top: 35px; +right: 10px; +} + +.rope { +height: 70px; +} + +#caduceus { +width: 35px; +} +} + +/* iPhone X, XS, 11 Pro */ +@media only screen +and (min-device-width: 375px) +and (max-device-width: 812px) +and (-webkit-min-device-pixel-ratio: 3) { +#caduceus-container { +top: 40px; +right: 12px; +} + +.rope { +height: 75px; +} + +#caduceus { +width: 38px; +} +} + +/* iPhone XR, XS Max, 11, 11 Pro Max */ +@media only screen +and (min-device-width: 414px) +and (max-device-width: 896px) +and (-webkit-min-device-pixel-ratio: 2) { + +.rope { +height: 100px; +} + +#caduceus { +width: 100px; +} +} \ No newline at end of file diff --git a/Css-Files/doctor.css b/Css-Files/doctor.css index d81e3925..c8db308b 100644 --- a/Css-Files/doctor.css +++ b/Css-Files/doctor.css @@ -1,3 +1,26 @@ +/*Cardio , Derma , ent ,gynaco & doc HTML CSS*/ +.home-button { + position: fixed; + top: 10px; + right: 10px; + z-index: 1000; + background-color: #007074d5; + cursor: pointer; +} +.home-button:hover { + background-color: #02969bd5; +} +#progressBar { + position: fixed; + top: 0; + left: 0; + width: 0%; + height: 8px; + background-color: #3fbcc0; + z-index: 9999; + + } + /*End*/ *{ margin: 0; padding: 0; @@ -11,6 +34,9 @@ body{ justify-content: center; background-color: #000; } +.logo { + cursor: pointer; +} .slide-content{ margin: 0 40px; overflow: hidden; @@ -24,6 +50,108 @@ body{ padding: 40px 0; border-radius: 20px; } +header { + display: flex; + justify-content: space-between; + align-items: center; + padding: 10px; + background-color: #f8f8f8; +} + +.logo { + height: 40px; +} + +.header-buttons button { + margin-left: 10px; + padding: 5px 10px; +} + +.calendar { + display: flex; + justify-content: space-between; + align-items: center; + background-color: #f3f3f3; + padding: 10px; + border-bottom: 1px solid #ccc; +} + +.nav-button { + background-color: #007bff; + color: #fff; + border: none; + padding: 5px 10px; + cursor: pointer; +} + +.month { + font-size: 20px; + font-weight: bold; +} + +.dates { + display: flex; + flex-wrap: wrap; /* allow wrapping to next line */ + font-size: 0.8em; /* reduce font size */ + gap: 10px; +} +@media (min-width: 700px) { + .dates { + flex-wrap: nowrap; /* don't wrap to next line */ + } + } +.date1, .date2, .date3, .date4, .date5, .date6, .date7, .date8, .date9, .date10, .date11, .date12 { + background-color: #fff; + padding: 10px; + cursor: pointer; + border: 1px solid #ccc; +} + +.date:hover { + background-color: #007bff; + color: #fff; +} + +.schedule { + padding: 20px; +} + +.consultation { + margin-top: 20px; + padding: 20px; + border: 1px solid #ccc; + border-radius: 5px; + background-color: #f9f9f9; +} + +.consultation h3 { + margin: 0; +} + +.consultation p { + margin: 5px 0; +} + +.consult-button { + background-color: #007bff; + color: #fff; + border: none; + padding: 5px 10px; + cursor: pointer; + margin-top: 10px; + display: inline-block; +} + +.consult-button:hover { + background-color: #0056b3; +} + +footer { + display: flex; + justify-content: space-around; + padding: 10px; + background-color: #f8f8f8; +} .card{ border-radius: 25px; background-color: #FFf; @@ -101,6 +229,7 @@ transition: all 0.3s ease; .button:hover{ background: #02969bd5; } + .swiper-navBtn{ color: white; } @@ -110,3 +239,6 @@ transition: all 0.3s ease; .swiper-pagination-bullet{ opacity: 0; } +.btns{ + width: 200px; +} diff --git a/Css-Files/input.css b/Css-Files/input.css new file mode 100644 index 00000000..9013ae98 --- /dev/null +++ b/Css-Files/input.css @@ -0,0 +1,149 @@ +body { + background-color: black; + overflow-x: hidden; + overflow-y: auto; + height: 100vh; + width: 100vw; + margin: 0; +} + +.container { + display: flex; + flex-wrap: wrap; + justify-content: center; + align-items: center; + gap: 2rem; + background: #0f0c29; + background: -webkit-linear-gradient(to right, #24243e, #302b63, #0f0c29); + background: linear-gradient(to right, #24243e, #302b63, #0f0c29); + color: white; + font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif; + padding: 20px; +} + +.items { + width: 25vw; + height: 100%; + display: flex; + height: 100vh; + flex-direction: column; + justify-content: space-around; + align-items: center; + z-index: 10; +} + +.item1, +.item2, +.item3 { + display: flex; + flex-direction: column; + width: 50%; + height: 20vh; + background-color: #39365b; + backdrop-filter: blur(20px); + border: 1px solid #332e5e; + align-items: center; + justify-content: center; + border-radius: 5%; + font-weight: bold; +} + +.doc { + flex: 1 1 300px; + max-width: 100%; + height: auto; + display: flex; + justify-content: center; + align-items: center; +} + +.docimg { + max-width: 100%; + height: auto; + border-radius: 10px; +} + +.text { + flex: 1 1 300px; + max-width: 100%; + padding: 20px; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + text-align: center; +} + +.head1 { + color: white; + font-size: 2.5rem; + font-weight: 500; + margin-bottom: 10px; +} + +.head2 { + color: wheat; + font-size: 1rem; + font-weight: 500; + line-height: 1.5; +} + +.input { + display: flex; + flex-direction: column; + gap: 1rem; + max-width: 400px; +} + +.text input { + width: 100%; + padding: 10px; + border: none; + border-radius: 5px; + background-color: #f5f5f5; + font-size: 1rem; +} + +.text button { + width: 100%; + padding: 10px; + border: none; + border-radius: 5px; + background-color: #ADA996; + font-size: 1rem; + cursor: pointer; +} + +/* Media Query for Small Screens (up to 768px) */ +@media (max-width: 768px) { + .container { + padding: 10px; + } + + + .item1, .item2, .item3 { + display: flex; + flex-wrap: wrap; + max-width: 100%; /* Maximum width of each item */ + height: 20px; /* Allow height to adjust based on content */ + padding: 1rem; /* Padding for spacing */ + text-align: center; /* Center text content */ + color: white; + background-color: #39365b; + border: 1px solid #332e5e; + border-radius: 10px; + margin-bottom: 1rem; /* Margin bottom for spacing */ + } + + .items { + + width: 90vw; /* 25% of the viewport width */ + height: 20vh; /* Full viewport height */ + z-index: 20; /* Optional: Set z-index if needed */ + } + + .doc, .text { + flex: 1 1 100%; + max-width: 100%; + } +} \ No newline at end of file diff --git a/Css-Files/map.css b/Css-Files/map.css new file mode 100644 index 00000000..c7799c3e --- /dev/null +++ b/Css-Files/map.css @@ -0,0 +1,23 @@ +body { + overflow-x: hidden; + overflow-y: hidden; + height: 100vh; + width: 100vw; + margin: 0; + font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif; +} + +#map { + height: 90%; + width: 100%; +} + +.tag { + height: 10%; + width: 100%; + display: flex; + justify-content: center; + align-items: center; + font-size: 30px; + font-weight: bold; +} diff --git a/Css-Files/news.css b/Css-Files/news.css new file mode 100644 index 00000000..7ee4efae --- /dev/null +++ b/Css-Files/news.css @@ -0,0 +1,1133 @@ +*{ + margin: 0; + padding: 0; + box-sizing: border-box; + font-family: 'Poppins',sans-serif; +} + + +body{ + /* font-family: "Open Sans", sans-serif; */ + color: #fff; + background-color: #000; + } + + a { + color: white; + text-decoration: none; + } + + a:hover { + color: #55a5ea; + text-decoration: none; + } + + + .head { + display: flex; + justify-content: center; + align-items: center; + flex-direction: column; + padding: 12px; + margin: 12px auto; +} + + + +#newsBox { + display: flex; + justify-content: center; + align-items: center; + gap: 2rem; + flex-wrap: wrap; + +} + + +footer { + width: 100%; + background: #3fbcc051; + color: #ffff; + line-height: 20px; + } + + .footer-title { + font-weight: 700; + font-size: 26px; + margin-bottom: 22px; + } + + .row { + width: 90%; + margin: auto; + display: flex; + flex-wrap: wrap; + align-items: flex-start; + } + + .col { + padding: 20px 0; + } + + .col h3 { + font-size: 25px; + } + + #col1 { + flex-basis: 40%; + margin-right: 40px; + } + + #col2 { + flex-basis: 20%; + margin-right: 10px; + font-size: 15px; + } + + #col3 { + flex-basis: 15%; + } + + #col4 { + flex-basis: 15%; + } + + .logo { + margin-bottom: 30px; + } + + .col h3 { + width: fit-content; + margin-bottom: 40px; + position: relative; + } + + #col2 p { + margin-bottom: 18px; + } + + #col2 p a { + font-size: 15px; + padding-top: 10px; + color: #fff; + } + + .email-id { + width: fit-content; + margin: 20px 0; + border-bottom: 1px solid #ccc; + } + + .quick-links-info div { + margin-bottom: 20px; + } + + .quick-links-info div a { + color: #fff; + font-size: 15px; + } + + .underline { + width: 100%; + height: 5px; + background: #767676; + border-radius: 3px; + position: absolute; + top: 25px; + left: 0; + overflow: hidden; + } + + .underline span { + width: 15px; + height: 100%; + background: #fff; + border-radius: 3px; + position: absolute; + top: 0; + left: 10px; + /* animation: moving 1s linear infinite; */ + } + + .news{ + border-radius: 1rem; + background-color: #fff; + padding: 2rem 4rem; + box-shadow: rgba(50,50,93,0.25) 0px 2px 5px -1px,rgba(0, 0,0,0.3) 0px 1px 3px -1px; + margin: 50px; + width: 60%; + margin-left: 250px; + padding: 20px; + } + .news h1{ + color: black; + font-size: 2.0rem; + margin-bottom: 0.3rem; + font-family: "Poppins", sans-serif; + } + .news p{ + color: black; + font-size: 1.1rem; + font-family: "Poppins", sans-serif; + } + .emoji{ + padding: 1rem 0; + width: 20%; + display: flex; + justify-content: space-between; + } + + /*Appointment section Styling's to align it to center*/ + .appointment .container { + display: flex; + flex-direction: column; + align-items: center; + } + + .appointment form { + display: flex; + flex-direction: column; + align-items: center; + width: 100%; + max-width: 600px; + } + + .appointment .form-group { + width: 100%; + display: flex; + justify-content: center; + } + + .appointment input, + .appointment select, + .appointment button { + width: 100%; + max-width: 400px; + } + + .appointment .text-center { + width: 100%; + display: flex; + justify-content: center; + } + + .appointment button[type="submit"] { + width: auto; + padding: 10px 20px; + display: block; + margin: 0 auto; + } + .php-email-form .form-group { + margin-bottom: 0; + } + + .php-email-form .form-control, + .php-email-form .form-select { + margin: 0 0 0 0; + } + + .php-email-form .row { + margin: 0 0 0 0; + } + + .php-email-form .col-md-4, + .php-email-form .col-md-12 { + padding-left: 0; + padding-right: 0; + padding-top: 0; + padding-bottom: 0; + } + .php-email-form input{ + margin: 0 0 0 0; + padding: 0 0 0 0; + } + /* Remove bottom margin from name and email inputs */ + #name, #email { + margin-bottom: 0; + } + + /* Remove top margin from email and location inputs */ + #email, #location { + margin-top: -50px; + } + + /* Remove
tags if present in HTML */ + #name + br, #email + br { + display: none; + } + + /* Optional: Add a small border or visual separator if desired */ + #name, #email { + border-bottom: none; + } + #email, #location { + border-top: 1px solid #ccc; /* Adjust color as needed */ + } + .news-section { + width: 100%; + padding: 70px 40px; + } + + .news-section h2 { + text-align: center; + margin-bottom: 30px; + color: #ffffff; + } + + .news-container { + display: flex; + justify-content: space-between; + flex-wrap: wrap; + } + + .news-item { + width: calc(33.33% - 20px); + margin-bottom: 30px; + background-color: #022a2d ; + border-radius: 8px; + overflow: hidden; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); + transition: transform 0.3s ease; + } + + .news-item:hover { + transform: translateY(-5px); + background-color: #55a5ea; + } + + .news-item img { + width: 100%; + height: 200px; + object-fit: cover; + } + + .news-item h3 { + padding: 15px; + margin: 0; + font-size: 18px; + color: #ffffff; + } + + .news-item p { + padding: 0 15px 15px; + margin: 0; + font-size: 14px; + color: #ffffff; + } + + .read-more { + display: inline-block; + align-items: center; + align-self: center; + background-color: #55a5ea; + color: #fff; + text-decoration: none; + border-radius: 4px; + transition: background-color 0.3s ease; + } + + .read-more:hover { + background-color: #07192b; + color: white; + border: 1px solid greenyellow; + } + .button-icon { + display: flex; + width: 400px; + height: 100px; + cursor: pointer; + margin-left: 50px; + } + + .icon { + background-color: #fff; + padding: 10px 10px 5px 10px; + } + + .icon svg { + width: 25px; + height: 25px; + } + + .cube { + transition: all 0.4s; + transform-style: preserve-3d; + width: 200px; + height: 20px; + } + + .button-icon:hover { + border-color: #264923; + } + + .button-icon:hover .cube { + transform: rotateX(90deg); + } + + .side { + position: absolute; + height: 47px; + width: 200px; + display: flex; + font-size: 0.8em; + justify-content: center; + align-items: center; + text-transform: uppercase; + letter-spacing: 0.5px; + font-weight: bold; + } + + .top { + background: hwb(181 16% 46%); + color: #fff; + transform: rotateX(-90deg) translate3d(0, 13.5px, 2em); + width: 170px; + } + + .front { + background: #55a5ea; + color: #fff; + transform: translate3d(0, 0, 1em); + width: 170px; + } + + @media (max-width: 768px) { + .news-item { + width: calc(50% - 15px); + } + } + + @media (max-width: 480px) { + .news-item { + width: 100%; + } + } + .iti--allow-dropdown input { + padding-left: 50px; + background-color: black; /* Adjust padding to prevent overlap */ +} + +.iti.iti--allow-dropdown { + margin-left: 250px; +} + +.container { + display:unset; + align-items: center; + justify-content: space-between; + flex-wrap: nowrap; + width: 100%; + margin: 0; + padding: 0; +} + +.content { + text-align: left; + flex: 1; + padding: 20px; +} + +.sec-img { + max-width: 50%; + width: 600px; + height: 600px; + margin-left: auto; +} + +.btn-get-started { + display: inline-block; + background-color: #55a5ea; + color: #fff; + padding: 10px 20px; + text-decoration: none; + border-radius: 5px; + margin-top: 20px; +} +select{ + padding: 1px; + background-color: #55a5ea; + color: white; + height: 5vh; + width: 17vh; +} +option{ + background-color: #55a5ea; + color: white; +} + +@media screen and (max-width: 992px) { + .container { + flex-wrap: wrap; + justify-content: center; + } + + .sec-img { + max-width: 100%; + margin: 20px 0; + position: relative; + top: 0; + right: 0; + + } + + .content { + text-align: center; + padding: 10px; + } +} + +@media screen and (max-width: 768px) { + .content { + text-align: center; + padding: 10px; + } + + .sec-img { + max-width: 100%; + margin: 20px 0; + position: relative; + top: 0; + right: 0; + } +} +/*Preloader CSS*/ +.pre{ + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + display: flex; + justify-content: center; + align-items: center; + transition: opacity 2s ease-out, visibility 2s ease-out; + opacity: 1; + visibility: visible; + z-index: 9999; +} + +.pre--hidden { + opacity: 0; + visibility: hidden; +} + +.loader { + display: block; + position: relative; + width: 150px; + height: 150px; + border-radius: 50%; + border: 3px solid transparent; + border-top-color: #55a5ea; + animation: spin 3s linear infinite; +} + +.loader:before { + content: ""; + position: absolute; + top: 5px; + left: 5px; + right: 5px; + bottom: 5px; + border-radius: 50%; + border: 3px solid transparent; + border-top-color: #3fbcc0c6; + animation: spin 3s linear infinite; +} + +.loader:after { + content: ""; + position: absolute; + top: 15px; + left: 15px; + right: 15px; + bottom: 15px; + border-radius: 50%; + border: 3px solid transparent; + border-top-color: #fff; + animation: spin 1.5s linear infinite; +} + +@keyframes spin { + 0% { + transform: rotate(0deg); + } + 100% { + transform: rotate(360deg); + } +} +.avatar{ + margin: 20px 100px; +} +.textbox input{ + width:200px; + height: 40px; +} +.btn{ + margin-left: 50px; + width:240px; + height: 40px; + background-color: #00C896; + border: none; + font-size: 1rem; + border-radius: 20px; + margin-bottom: 20px; +} +#appointment.appointment.section-bg{ + margin: 0px 280px 100px; +} +#appointment.appointment.section-bg h2{ + margin: 0px 115px ; +} +form.php-email-form{ + width: 300px; + margin-right: 250px; + display: flex; + flex-direction: column; + flex-wrap: wrap; + align-content: flex-start +} +.loader--hidden{ + opacity: 0; + visibility: hidden; +} + + +@media screen and (max-width: 768px) { + .social-wrapper { + font-size: 14px; + } + + .social-links i { + font-size: 18px; + } +} + +@media screen and (max-width: 480px) { + .social-wrapper { + font-size: 12px; + } + + .social-links i { + font-size: 16px; + } +} +.iti--allow-dropdown input { + padding-left: 50px; + background-color: black; /* Adjust padding to prevent overlap */ +} + +.iti.iti--allow-dropdown { + margin-left: 250px; +} + +.container { + display:unset; + align-items: center; + justify-content: space-between; + flex-wrap: nowrap; + width: 100%; + margin: 0; + padding: 0; +} + +.content { + text-align: left; + flex: 1; + padding: 20px; +} + +.sec-img { + max-width: 50%; + width: 600px; + height: 600px; + margin-left: auto; +} + +.btn-get-started { + display: inline-block; + background-color: #55a5ea; + color: #fff; + padding: 10px 20px; + text-decoration: none; + border-radius: 5px; + margin-top: 20px; +} +select{ + padding: 1px; + background-color: #55a5ea; + color: white; + height: 5vh; + width: 17vh; +} +option{ + background-color: #55a5ea; + color: white; +} + +@media screen and (max-width: 992px) { + .container { + flex-wrap: wrap; + justify-content: center; + } + + .sec-img { + max-width: 100%; + margin: 20px 0; + position: relative; + top: 0; + right: 0; + + } + + .content { + text-align: center; + padding: 10px; + } +} + +@media screen and (max-width: 768px) { + .content { + text-align: center; + padding: 10px; + } + + .sec-img { + max-width: 100%; + margin: 20px 0; + position: relative; + top: 0; + right: 0; + } +} +/*Preloader CSS*/ +.pre{ + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + display: flex; + justify-content: center; + align-items: center; + transition: opacity 2s ease-out, visibility 2s ease-out; + opacity: 1; + visibility: visible; + z-index: 9999; +} + +.pre--hidden { + opacity: 0; + visibility: hidden; +} + +.loader { + display: block; + position: relative; + width: 150px; + height: 150px; + border-radius: 50%; + border: 3px solid transparent; + border-top-color: #55a5ea; + animation: spin 3s linear infinite; +} + +.loader:before { + content: ""; + position: absolute; + top: 5px; + left: 5px; + right: 5px; + bottom: 5px; + border-radius: 50%; + border: 3px solid transparent; + border-top-color: #3fbcc0c6; + animation: spin 3s linear infinite; +} + +.loader:after { + content: ""; + position: absolute; + top: 15px; + left: 15px; + right: 15px; + bottom: 15px; + border-radius: 50%; + border: 3px solid transparent; + border-top-color: #fff; + animation: spin 1.5s linear infinite; +} + +@keyframes spin { + 0% { + transform: rotate(0deg); + } + 100% { + transform: rotate(360deg); + } +} +.avatar{ + margin: 20px 100px; +} +.textbox input{ + width:200px; + height: 40px; +} +.btn{ + margin-left: 50px; + width:240px; + height: 40px; + background-color: #00C896; + border: none; + font-size: 1rem; + border-radius: 20px; + margin-bottom: 20px; +} +#appointment.appointment.section-bg{ + margin: 0px 280px 100px; +} +#appointment.appointment.section-bg h2{ + margin: 0px 115px ; +} +form.php-email-form{ + width: 300px; + margin-right: 250px; + display: flex; + flex-direction: column; + flex-wrap: wrap; + align-content: flex-start +} +.loader--hidden{ + opacity: 0; + visibility: hidden; +} + + + + +
+
+
+ + +
+

Find a Doctor

+
+ + + + + + 1000 + + +
+
+ +
+ +
+ + +
+
+ + + +
+
+
+ + + + + + + + \ No newline at end of file diff --git a/Html-Files/Doctor-Experience.html b/Html-Files/Doctor-Experience.html new file mode 100644 index 00000000..47101c96 --- /dev/null +++ b/Html-Files/Doctor-Experience.html @@ -0,0 +1,589 @@ + + + + + + Find a Doctor + + + + + + + + + + + + + +
+
+
+ + + +
+

Find a Doctor

+
+ + + + + + 1000 + + +
+
+ +
+ +
+ + +
+
+ + + +
+
+ + + + + + + \ No newline at end of file diff --git a/Html-Files/appointScript.js b/Html-Files/appointScript.js index 2d8ee089..21158076 100644 --- a/Html-Files/appointScript.js +++ b/Html-Files/appointScript.js @@ -7,7 +7,6 @@ document.addEventListener("DOMContentLoaded", function() { const doctorSelect = document.getElementById('doctor-select'); const appointmentDate = document.getElementById('appointment-date'); const timeSlotsDiv = document.getElementById('time-slots'); - existingPatientCheckbox.addEventListener('change', function() { if (this.checked) { patientIdInput.style.display = 'block'; @@ -17,23 +16,28 @@ document.addEventListener("DOMContentLoaded", function() { }); window.previewAppointment = function() { - const formData = new FormData(appointmentForm); - - let details = ` - Doctor: ${formData.get('doctor')}
- Date: ${formData.get('date')}
- Time: ${formData.get('time-slot')}
- Name: ${formData.get('full-name')}
- Date of Birth: ${formData.get('dob')}
- Email: ${formData.get('email')}
- Phone: ${formData.get('phone')}
- Reason for Visit: ${formData.get('reason')}
- Existing Patient: ${formData.get('existing-patient') ? 'Yes' : 'No'}
- Patient ID: ${formData.get('patient-id')} - `; - previewDetails.innerHTML = details; - previewSection.style.display = 'block'; - appointmentForm.style.display = 'none'; + if (appointmentForm.checkValidity()) { + const formData = new FormData(appointmentForm); + + let details = ` + + Name: ${formData.get('full-name')}
+ Date of Birth: ${formData.get('dob')}
+ Email: ${formData.get('email')}
+ Phone: ${formData.get('phone')}

+ Doctor: ${formData.get('doctor')}
+ Appointment Date: ${formData.get('date')}
+ Time: ${formData.get('time-slot')}
+ Reason for Visit: ${formData.get('reason')}

+ Existing Patient: ${formData.get('existing-patient') ? 'Yes' : 'No'}
+ Patient ID: ${formData.get('patient-id')} + `; + previewDetails.innerHTML = details; + previewSection.style.display = 'block'; + appointmentForm.style.display = 'none'; + } else { + appointmentForm.reportValidity(); + } }; window.confirmAppointment = function() { @@ -47,4 +51,14 @@ document.addEventListener("DOMContentLoaded", function() { previewSection.style.display = 'none'; appointmentForm.style.display = 'block'; }; + function togglePatientID() { + const patientID = document.getElementById('patient-id'); + const existingPatient = document.getElementById('existing-patient'); + if (existingPatient.checked) { + patientID.style.display = 'block'; + } else { + patientID.style.display = 'none'; + } + }; }); + diff --git a/Html-Files/appointment.html b/Html-Files/appointment.html index 139c3eb5..77acf83b 100644 --- a/Html-Files/appointment.html +++ b/Html-Files/appointment.html @@ -1,94 +1,1247 @@ - - - - Book an Appointment - - - -
- -
+ + + + RapiDoc + + + + + + + + + -
-

Book an Appointment

-

Schedule your visit with our expert doctors easily.

+ -
-
- - -
+ + + RapiDoc + -
- - -
+ + -
- - -
+ + + + + + + + + -
- - + + + + + + + + + + + + + + + + + +
+ + +
+ + -
-

Doctor's Contact Information

-

123 Clinic Street, MediCity

-

Phone: +91 1234567890

-

Email: contact@clinic.com

+ +
+

Book an Appointment

+

Conveniently Connect with the Healthcare Experts!

+ + +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+
+ + +
+ +
+ + + + + +
+
+ + + + + + + +





- - + + + diff --git a/Html-Files/blood.html b/Html-Files/blood.html index bb82c507..c2289762 100644 --- a/Html-Files/blood.html +++ b/Html-Files/blood.html @@ -2,6 +2,7 @@ + @@ -10,29 +11,40 @@ - - - -Blood Bank - + + + + + +RapiDoc + -
- -
- - -
-
+
+
+ + + + +
+ + + +
@@ -40,7 +52,7 @@

RapiDoc

A+

liters

- Get List + Get List
@@ -49,7 +61,7 @@

O+

liters

- Get List + Get List
@@ -58,7 +70,7 @@

B+

liters

- Get List + Get List
@@ -67,7 +79,7 @@

AB+

liters

- Get List + Get List
@@ -76,7 +88,7 @@

A-

liters

- Get List + Get List
@@ -85,7 +97,7 @@

O-

liters

- Get List + Get List
@@ -94,7 +106,7 @@

B-

liters

- Get List + Get List
@@ -103,10 +115,104 @@

AB-

liters

- Get List + Get List
+ + +
+
+ + + +
+
+ + + @@ -114,5 +220,9 @@

AB-

+ + + + \ No newline at end of file diff --git a/Html-Files/bloodtest.html b/Html-Files/bloodtest.html new file mode 100644 index 00000000..dfcefa53 --- /dev/null +++ b/Html-Files/bloodtest.html @@ -0,0 +1,216 @@ + + + + + + + + + + RapiDoc + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+
+

Blood Test Analysis

+
+ + + + + + + + + + + + + +
+
+ +
+ +
+
+
+ + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/Html-Files/bloodtest.js b/Html-Files/bloodtest.js new file mode 100644 index 00000000..c7a128b5 --- /dev/null +++ b/Html-Files/bloodtest.js @@ -0,0 +1,105 @@ +document.addEventListener('DOMContentLoaded', function() { + const bloodTestForm = document.getElementById('bloodTestForm'); + const popupOverlay = document.getElementById('popupOverlay'); + const closeBtn = document.querySelector('.close-btn'); + + bloodTestForm.addEventListener('submit', function(e) { + e.preventDefault(); + + const bloodGroup = document.getElementById('bloodGroup').value; + const wbc = parseFloat(document.getElementById('wbcPercentage').value); + const rbc = parseFloat(document.getElementById('rbcPercentage').value); + const platelets = parseFloat(document.getElementById('plateletPercentage').value); + + let resultText = ''; + let skinDiseaseChance = ''; + let cure = ''; + + if (wbc < 4.5 || wbc > 11) { + resultText += 'Abnormal white blood cell count. '; + } + + if (rbc < 4.2 || rbc > 5.4) { + resultText += 'Abnormal red blood cell count. '; + } + + if (platelets < 150 || platelets > 450) { + resultText += 'Abnormal platelet count. '; + } + + if (resultText === '') { + resultText = 'All blood cell counts are within normal range.'; + } + + // Simple logic for skin disease chance (for demonstration purposes) + if (wbc > 11) { + skinDiseaseChance = 'There is an increased chance of skin disease due to elevated white blood cell count.'; + cure = 'Consult a dermatologist for a proper diagnosis and treatment plan. It may include anti-inflammatory medications or topical treatments.'; + } else { + skinDiseaseChance = 'No increased chance of skin disease detected based on these results.'; + cure = 'No specific treatment needed. Maintain a healthy lifestyle and good skincare routine.'; + } + + document.getElementById('resultText').textContent = resultText; + document.getElementById('skinDiseaseChance').textContent = skinDiseaseChance; + document.getElementById('cure').textContent = cure; + + // Show popup + popupOverlay.classList.remove('hidden'); + document.body.classList.add('popup-open'); + }); + + function closePopup() { + popupOverlay.classList.add('hidden'); + document.body.classList.remove('popup-open'); + } + + closeBtn.addEventListener('click', closePopup); + + popupOverlay.addEventListener('click', function(e) { + if (e.target === popupOverlay) { + closePopup(); + } + }); + + document.addEventListener('keydown', function(e) { + if (e.key === 'Escape') { + closePopup(); + } + }); + }); + + /*Phone JS*/ + document.addEventListener("DOMContentLoaded", function() { + const phoneInputField = document.getElementById('phone'); + const iti = window.intlTelInput(phoneInputField, { + initialCountry: "auto", + geoIpLookup: function(callback) { + fetch('https://ipinfo.io/json?token=YOUR_TOKEN') + .then(response => response.json()) + .then(data => callback(data.country)) + .catch(() => callback('us')); + }, + utilsScript: "https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.8/js/utils.js" + }); + + document.getElementById('phone-form').addEventListener('submit', function(event) { + event.preventDefault(); + const phoneNumber = iti.getNumber(); + console.log('Full Phone Number:', phoneNumber); + + // You can now send this phone number to your server or process it as needed + }); +}); + +/*Read More JS*/ +document.addEventListener('DOMContentLoaded', function() { + const newsItems = document.querySelectorAll('.news-item'); + + newsItems.forEach(item => { + item.addEventListener('click', function() { + const link = this.querySelector('.read-more').getAttribute('href'); + window.location.href = link; + }); + }); +}); \ No newline at end of file diff --git a/Html-Files/cardio.html b/Html-Files/cardio.html new file mode 100644 index 00000000..480a4c6f --- /dev/null +++ b/Html-Files/cardio.html @@ -0,0 +1,1139 @@ + + + + + + + + + + + + + + + + + + + + + Doctors + + + + RapiDoc + + +
+ + +
+
+ + +
+
+
+
+
+
+ +
+ +
+
+
+
+
+
+ + +
+
+
+ +
+ +
+
+
+

Dr. Vikas Chopra

+

Cardiologist

+ + +
+
+
+ MAY + +
+
+ 1 + 2 + 3 + 4 + 5 + 6 + 7 +
+
+ +
+ +
+
+ + + + + +
+
+
+
+
+ + +
+
+
+ +
+ +
+
+
+

Dr. Ajay Aggarwal

+

Cardiologist

+ + +
+
+
+ MAY + +
+
+ 11 + 12 + 13 + 14 + 15 + 16 + 17 +
+
+ +
+ +
+
+ + + + + +
+
+
+
+
+ + +
+
+
+ +
+ +
+
+
+

Dr. Rajeev Kumar Rajput

+

Cardiologist

+ + +
+
+
+ MAY + +
+
+ 18 + 19 + 20 + 21 + 22 + 23 + 24 +
+
+ +
+ +
+
+ + + + + +
+
+
+
+
+ + +
+
+
+ +
+ +
+
+
+

Dr. Nityanand Tripathi

+

Cardiologist

+ + +
+
+
+ MAY + +
+
+ 1 + 2 + 3 + 4 + 5 + 6 + 7 +
+
+ +
+ +
+
+ + + + + +
+
+
+
+
+
+
+
+ + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/Html-Files/cardio.js b/Html-Files/cardio.js new file mode 100644 index 00000000..cc1a2eb8 --- /dev/null +++ b/Html-Files/cardio.js @@ -0,0 +1,1300 @@ + +function showSchedule2(date2) { + const scheduleDiv2 = document.getElementById('schedule2'); + let scheduleHtml2 = ''; + + switch(date2) { + case '1': + scheduleHtml2 = ` +
+

Max Smart Hospital, Saket

+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 1-May-2024 11:40AM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 1-May-2024 2:40PM

+ +
+ `; + break; + case '2': + scheduleHtml2 = ` +
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 2-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 2-May-2024 2:00PM

+ +
+
+

Consultation Fee: β‚Ή 3500

+

Doctor is available on 2-May-2024 11:40PM

+ +
+ `; + break; + // Add more cases for other dates + default: + scheduleHtml2 = '

No schedule available for this date.

'; + } + + scheduleDiv2.innerHTML = scheduleHtml2; + } + + + + + + + + + + + + function showSchedule3(date3) { + const scheduleDiv3 = document.getElementById('schedule3'); + let scheduleHtml3 = ''; + + switch(date3) { + case '11': + scheduleHtml3 = ` +
+

Max Smart Hospital, Saket

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 11-May-2024 12:50PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 11-May-2024 2:45PM

+ +
+ `; + break; + case '12': + scheduleHtml3 = ` +
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 12-May-2024 12:50PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 12-May-2024 2:45PM

+ +
+
+

Consultation Fee: β‚Ή 3000

+

Doctor is available on 12-May-2024 4:40AM

+ +
+ `; + break; + // Add more cases for other dates + default: + scheduleHtml3 = '

No schedule available for this date.

'; + } + + scheduleDiv3.innerHTML = scheduleHtml3; + } + + + + + + + + + + + function showSchedule4(date4) { + const scheduleDiv4 = document.getElementById('schedule4'); + let scheduleHtml4 = ''; + + switch(date4) { + case '18': + scheduleHtml4 = ` +
+

Max Smart Hospital, Saket

+

Consultation Fee: β‚Ή 4000

+

Doctor is available on 18-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 4000

+

Doctor is available on 18-May-2024 3:40PM

+ +
+ `; + break; + case '19': + scheduleHtml4 = ` +
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 3500

+

Doctor is available on 19-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 3500

+

Doctor is available on 19-May-2024 3:40PM

+ +
+
+

Consultation Fee: β‚Ή 3550

+

Doctor is available on 19-May-2024 5:40AM

+ +
+ `; + break; + // Add more cases for other dates + default: + scheduleHtml4 = '

No schedule available for this date.

'; + } + + scheduleDiv4.innerHTML = scheduleHtml4; + } + + /*Date 5*/ + function showSchedule5(date5) { + const scheduleDiv5 = document.getElementById('schedule5'); + let scheduleHtml3 = ''; + + switch(date5) { + case '1': + scheduleHtml5 = ` +
+

Max Smart Hospital, Saket

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 1-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 1-May-2024 4:40PM

+ +
+ `; + break; + case '2': + scheduleHtml5 = ` +
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 2-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 2-May-2024 2:15PM

+ +
+
+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 2-May-2024 8:15PM

+ +
+ `; + break; + // Add more cases for other dates + default: + scheduleHtml5 = '

No schedule available for this date.

'; + } + + scheduleDiv5.innerHTML = scheduleHtml5; + } + + + + function showSchedule5(date5) { + const scheduleDiv5 = document.getElementById('schedule5'); + let scheduleHtml3 = ''; + + switch(date5) { + case '1': + scheduleHtml5 = ` +
+

Max Smart Hospital, Saket

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 1-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 1-May-2024 4:40PM

+ +
+ `; + break; + case '2': + scheduleHtml5 = ` +
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 2-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 2-May-2024 2:15PM

+ +
+
+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 2-May-2024 8:15PM

+ +
+ `; + break; + // Add more cases for other dates + default: + scheduleHtml5 = '

No schedule available for this date.

'; + } + + scheduleDiv5.innerHTML = scheduleHtml5; + } + + + + function showSchedule6(date6) { + const scheduleDiv6 = document.getElementById('schedule6'); + let scheduleHtml6 = ''; + + switch(date6) { + case '26': + scheduleHtml6 = ` +
+

Max Smart Hospital, Saket

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 26-May-2024 2:00PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 26-May-2024 5:00PM

+ +
+ `; + break; + case '27': + scheduleHtml6 = ` +
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 27-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 27-May-2024 2:00PM

+ +
+
+

Consultation Fee: β‚Ή 3000

+

Doctor is available on 27-May-2024 6:00PM

+ +
+ `; + break; + // Add more cases for other dates + default: + scheduleHtml6 = '

No schedule available for this date.

'; + } + + scheduleDiv6.innerHTML = scheduleHtml6; + } + + + + + + + function showSchedule8(date8) { + const scheduleDiv8 = document.getElementById('schedule8'); + let scheduleHtml8 = ''; + + switch(date8) { + case '9': + scheduleHtml8 = ` +
+

Max Smart Hospital, Saket

+

Consultation Fee: β‚Ή 3500

+

Doctor is available on 9-May-2024 2:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 3500

+

Doctor is available on 9-May-2024 11:40PM

+ +
+ `; + break; + case '10': + scheduleHtml8 = ` +
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 3500

+

Doctor is available on 10-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 3500

+

Doctor is available on 10-May-2024 2:00PM

+ +
+
+

Consultation Fee: β‚Ή 3500

+

Doctor is available on 10-May-2024 7:00PM

+ +
+ `; + break; + // Add more cases for other dates + default: + scheduleHtml8 = '

No schedule available for this date.

'; + } + + scheduleDiv8.innerHTML = scheduleHtml8; + } + + + + + + function showSchedule9(date9) { + const scheduleDiv9 = document.getElementById('schedule9'); + let scheduleHtml9 = ''; + + switch(date9) { + case '10': + scheduleHtml9 = ` +
+

Max Smart Hospital, Saket

+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 10-May-2024 10:40AM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 10-May-2024 12:40PM

+ +
+ `; + break; + case '12': + scheduleHtml9 = ` +
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 12-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 12-May-2024 2:00PM

+ +
+
+

Consultation Fee: β‚Ή 1500

+

Doctor is available on 12-May-2024 3:00PM

+ +
+ `; + break; + // Add more cases for other dates + default: + scheduleHtml9 = '

No schedule available for this date.

'; + } + + scheduleDiv9.innerHTML = scheduleHtml9; + } + + + + function showSchedule10(date10) { + const scheduleDiv10 = document.getElementById('schedule10'); + let scheduleHtml10 = ''; + + switch(date10) { + case '17': + scheduleHtml10 = ` +
+

Max Smart Hospital, Saket

+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 17-May-2024 2:00PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 17-May-2024 5:00PM

+ +
+ `; + break; + case '18': + scheduleHtml10 = ` +
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 18-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 18-May-2024 2:00PM

+ +
+
+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 18-May-2024 8:00PM

+ +
+ `; + break; + // Add more cases for other dates + default: + scheduleHtml10 = '

No schedule available for this date.

'; + } + + scheduleDiv10.innerHTML = scheduleHtml10; + } + + + + + function showSchedule1(date1) { + const scheduleDiv1 = document.getElementById('schedule1'); + let scheduleHtml1 = ''; + + switch(date1) { + case '20': + scheduleHtml1 = ` +
+

Max Smart Hospital, Saket

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 20-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 20-May-2024 2:00PM

+ +
+ `; + break; + case '21': + scheduleHtml1 = ` +
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 21-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 21-May-2024 2:00PM

+ +
+
+

Consultation Fee: β‚Ή 3000

+

Doctor is available on 21-May-2024 4:40PM

+ +
+ `; + break; + // Add more cases for other dates + default: + scheduleHtml1 = '

No schedule available for this date.

'; + } + + scheduleDiv1.innerHTML = scheduleHtml1; + } + + + function showSchedule2(date2) { + const scheduleDiv2 = document.getElementById('schedule2'); + let scheduleHtml2 = ''; + + switch(date2) { + case '1': + scheduleHtml2 = ` +
+

Max Smart Hospital, Saket

+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 1-May-2024 11:40AM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 1-May-2024 2:40PM

+ +
+ `; + break; + case '2': + scheduleHtml2 = ` +
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 2-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 2-May-2024 2:00PM

+ +
+
+

Consultation Fee: β‚Ή 3500

+

Doctor is available on 2-May-2024 11:40PM

+ +
+ `; + break; + // Add more cases for other dates + default: + scheduleHtml2 = '

No schedule available for this date.

'; + } + + scheduleDiv2.innerHTML = scheduleHtml2; + } + + + + function showSchedule3(date3) { + const scheduleDiv3 = document.getElementById('schedule3'); + let scheduleHtml3 = ''; + + switch(date3) { + case '11': + scheduleHtml3 = ` +
+

Max Smart Hospital, Saket

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 11-May-2024 12:50PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 11-May-2024 2:45PM

+ +
+ `; + break; + case '12': + scheduleHtml3 = ` +
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 12-May-2024 12:50PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 12-May-2024 2:45PM

+ +
+
+

Consultation Fee: β‚Ή 3000

+

Doctor is available on 12-May-2024 4:40AM

+ +
+ `; + break; + // Add more cases for other dates + default: + scheduleHtml3 = '

No schedule available for this date.

'; + } + + scheduleDiv3.innerHTML = scheduleHtml3; + } + + + function showSchedule4(date4) { + const scheduleDiv4 = document.getElementById('schedule4'); + let scheduleHtml4 = ''; + + switch(date4) { + case '18': + scheduleHtml4 = ` +
+

Max Smart Hospital, Saket

+

Consultation Fee: β‚Ή 4000

+

Doctor is available on 18-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 4000

+

Doctor is available on 18-May-2024 3:40PM

+ +
+ `; + break; + case '19': + scheduleHtml4 = ` +
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 3500

+

Doctor is available on 19-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 3500

+

Doctor is available on 19-May-2024 3:40PM

+ +
+
+

Consultation Fee: β‚Ή 3550

+

Doctor is available on 19-May-2024 5:40AM

+ +
+ `; + break; + // Add more cases for other dates + default: + scheduleHtml4 = '

No schedule available for this date.

'; + } + + scheduleDiv4.innerHTML = scheduleHtml4; + } + + + function showSchedule5(date5) { + const scheduleDiv5 = document.getElementById('schedule5'); + let scheduleHtml3 = ''; + + switch(date5) { + case '1': + scheduleHtml5 = ` +
+

Max Smart Hospital, Saket

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 1-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 1-May-2024 4:40PM

+ +
+ `; + break; + case '2': + scheduleHtml5 = ` +
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 2-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 2-May-2024 2:15PM

+ +
+
+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 2-May-2024 8:15PM

+ +
+ `; + break; + // Add more cases for other dates + default: + scheduleHtml5 = '

No schedule available for this date.

'; + } + + scheduleDiv5.innerHTML = scheduleHtml5; + } + + + function showSchedule6(date6) { + const scheduleDiv6 = document.getElementById('schedule6'); + let scheduleHtml6 = ''; + + switch(date6) { + case '26': + scheduleHtml6 = ` +
+

Max Smart Hospital, Saket

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 26-May-2024 2:00PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 26-May-2024 5:00PM

+ +
+ `; + break; + case '27': + scheduleHtml6 = ` +
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 27-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 27-May-2024 2:00PM

+ +
+
+

Consultation Fee: β‚Ή 3000

+

Doctor is available on 27-May-2024 6:00PM

+ +
+ `; + break; + // Add more cases for other dates + default: + scheduleHtml6 = '

No schedule available for this date.

'; + } + + scheduleDiv6.innerHTML = scheduleHtml6; + } + + + function showSchedule7(date7) { + const scheduleDiv7 = document.getElementById('schedule7'); + let scheduleHtml7 = ''; + + switch(date7) { + case '4': + scheduleHtml7 = ` +
+

Max Smart Hospital, Saket

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 4-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 4-May-2024 2:40PM

+ +
+ `; + break; + case '15': + scheduleHtml7 = ` +
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 15-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 15-May-2024 2:00PM

+ +
+
+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 15-May-2024 2:00AM

+ +
+ `; + break; + // Add more cases for other dates + default: + scheduleHtml7 = '

No schedule available for this date.

'; + } + + scheduleDiv7.innerHTML = scheduleHtml7; + } + + + function showSchedule8(date8) { + const scheduleDiv8 = document.getElementById('schedule8'); + let scheduleHtml8 = ''; + + switch(date8) { + case '9': + scheduleHtml8 = ` +
+

Max Smart Hospital, Saket

+

Consultation Fee: β‚Ή 3500

+

Doctor is available on 9-May-2024 2:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 3500

+

Doctor is available on 9-May-2024 11:40PM

+ +
+ `; + break; + case '10': + scheduleHtml8 = ` +
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 3500

+

Doctor is available on 10-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 3500

+

Doctor is available on 10-May-2024 2:00PM

+ +
+
+

Consultation Fee: β‚Ή 3500

+

Doctor is available on 10-May-2024 7:00PM

+ +
+ `; + break; + // Add more cases for other dates + default: + scheduleHtml8 = '

No schedule available for this date.

'; + } + + scheduleDiv8.innerHTML = scheduleHtml8; + } + + + function showSchedule9(date9) { + const scheduleDiv9 = document.getElementById('schedule9'); + let scheduleHtml9 = ''; + + switch(date9) { + case '10': + scheduleHtml9 = ` +
+

Max Smart Hospital, Saket

+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 10-May-2024 10:40AM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 10-May-2024 12:40PM

+ +
+ `; + break; + case '12': + scheduleHtml9 = ` +
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 12-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 12-May-2024 2:00PM

+ +
+
+

Consultation Fee: β‚Ή 1500

+

Doctor is available on 12-May-2024 3:00PM

+ +
+ `; + break; + // Add more cases for other dates + default: + scheduleHtml9 = '

No schedule available for this date.

'; + } + + scheduleDiv9.innerHTML = scheduleHtml9; + } + + + function showSchedule10(date10) { + const scheduleDiv10 = document.getElementById('schedule10'); + let scheduleHtml10 = ''; + + switch(date10) { + case '17': + scheduleHtml10 = ` +
+

Max Smart Hospital, Saket

+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 17-May-2024 2:00PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 17-May-2024 5:00PM

+ +
+ `; + break; + case '18': + scheduleHtml10 = ` +
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 18-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 18-May-2024 2:00PM

+ +
+
+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 18-May-2024 8:00PM

+ +
+ `; + break; + // Add more cases for other dates + default: + scheduleHtml10 = '

No schedule available for this date.

'; + } + + scheduleDiv10.innerHTML = scheduleHtml10; + } + + + + function showSchedule11(date11) { + const scheduleDiv11 = document.getElementById('schedule11'); + let scheduleHtml11 = ''; + + switch(date11) { + case '1': + scheduleHtml11 = ` +
+

Max Smart Hospital, Saket

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 1-May-2024 11:40AM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 1-May-2024 1:40PM

+ +
+ `; + break; + case '2': + scheduleHtml11 = ` +
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 2-May-2024 11:40AM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 2-May-2024 2:00PM

+ +
+
+

Consultation Fee: β‚Ή 3000

+

Doctor is available on 2-May-2024 9:00PM

+ +
+ `; + break; + // Add more cases for other dates + default: + scheduleHtml11 = '

No schedule available for this date.

'; + } + + scheduleDiv11.innerHTML = scheduleHtml11; + } + function showSchedule12(date12) { + const scheduleDiv12 = document.getElementById('schedule12'); + let scheduleHtml12 = ''; + + switch(date12) { + case '21': + scheduleHtml12 = ` +
+

Max Smart Hospital, Saket

+

Consultation Fee: β‚Ή 2400

+

Doctor is available on 21-May-2024 9:00AM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2400

+

Doctor is available on 21-May-2024 9:00AM

+ +
+ `; + break; + case '22': + scheduleHtml12 = ` +
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2400

+

Doctor is available on 22-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2400

+

Doctor is available on 22-May-2024 2:00PM

+ +
+
+

Consultation Fee: β‚Ή 3400

+

Doctor is available on 22-May-2024 4:00PM

+ +
+ `; + break; + // Add more cases for other dates + default: + scheduleHtml12 = '

No schedule available for this date.

'; + } + + scheduleDiv12.innerHTML = scheduleHtml12; + } + + + + function showSchedule11(date11) { + const scheduleDiv11 = document.getElementById('schedule11'); + let scheduleHtml11 = ''; + + switch(date11) { + case '1': + scheduleHtml11 = ` +
+

Max Smart Hospital, Saket

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 1-May-2024 11:40AM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 1-May-2024 1:40PM

+ +
+ `; + break; + case '2': + scheduleHtml11 = ` +
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 2-May-2024 11:40AM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 2-May-2024 2:00PM

+ +
+
+

Consultation Fee: β‚Ή 3000

+

Doctor is available on 2-May-2024 9:00PM

+ +
+ `; + break; + // Add more cases for other dates + default: + scheduleHtml11 = '

No schedule available for this date.

'; + } + + scheduleDiv11.innerHTML = scheduleHtml11; + } + function showSchedule12(date12) { + const scheduleDiv12 = document.getElementById('schedule12'); + let scheduleHtml12 = ''; + + switch(date12) { + case '21': + scheduleHtml12 = ` +
+

Max Smart Hospital, Saket

+

Consultation Fee: β‚Ή 2400

+

Doctor is available on 21-May-2024 9:00AM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2400

+

Doctor is available on 21-May-2024 9:00AM

+ +
+ `; + break; + case '22': + scheduleHtml12 = ` +
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2400

+

Doctor is available on 22-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2400

+

Doctor is available on 22-May-2024 2:00PM

+ +
+
+

Consultation Fee: β‚Ή 3400

+

Doctor is available on 22-May-2024 4:00PM

+ +
+ `; + break; + // Add more cases for other dates + default: + scheduleHtml12 = '

No schedule available for this date.

'; + } + + scheduleDiv12.innerHTML = scheduleHtml12; + } + + function showSchedule1(date1) { + const scheduleDiv1 = document.getElementById('schedule1'); + let scheduleHtml1 = ''; + + switch(date1) { + case '20': + scheduleHtml1 = ` +
+

Max Smart Hospital, Saket

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 20-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 20-May-2024 2:00PM

+ +
+ `; + break; + case '21': + scheduleHtml1 = ` +
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 21-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 21-May-2024 2:00PM

+ +
+
+

Consultation Fee: β‚Ή 3000

+

Doctor is available on 21-May-2024 4:40PM

+ +
+ `; + break; + // Add more cases for other dates + default: + scheduleHtml1 = '

No schedule available for this date.

'; + } + + scheduleDiv1.innerHTML = scheduleHtml1; + } + +function showSchedule7(date7) { + const scheduleDiv7 = document.getElementById('schedule7'); + let scheduleHtml7 = ''; + + switch(date7) { + case '4': + scheduleHtml7 = ` +
+

Max Smart Hospital, Saket

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 4-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 4-May-2024 2:40PM

+ +
+ `; + break; + case '15': + scheduleHtml7 = ` +
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 15-May-2024 12:40PM

+ +
+
+

Max Hospital, Lajpat Nagar

+

Consultation Fee: β‚Ή 2000

+

Doctor is available on 15-May-2024 2:00PM

+ +
+
+

Consultation Fee: β‚Ή 2500

+

Doctor is available on 15-May-2024 2:00AM

+ +
+ `; + break; + // Add more cases for other dates + default: + scheduleHtml7 = '

No schedule available for this date.

'; + } + + scheduleDiv7.innerHTML = scheduleHtml7; + } \ No newline at end of file diff --git a/Html-Files/contact.html b/Html-Files/contact.html deleted file mode 100644 index 17b71d05..00000000 --- a/Html-Files/contact.html +++ /dev/null @@ -1,114 +0,0 @@ - - - - - - Contact Us - - - - - - -
-
- -
-
- -

RapiDoc

-
- - - -
- - -
-
-
-
-

Contact Info

-
    - -
  • - - IGDTUW, Delhi - -
  • -
  • - - - rapidoc@mail.com -
  • -
  • - - +91 1234567890 -
  • - -
-
-
    -
  • -
  • - -
  • - -
-
- -
-

RapiDoc Query

-
-
- - First Name -
-
- - Last Name -
-
- - Email Address -
-
- - Mobile Number -
-
- - Write your message here... -
-
- -
- -
-
- - - -
- - diff --git a/Html-Files/customer_agreement.html b/Html-Files/customer_agreement.html new file mode 100644 index 00000000..aef5ee56 --- /dev/null +++ b/Html-Files/customer_agreement.html @@ -0,0 +1,1136 @@ + + + + + + RapiDoc + + + + + + + + + + + + + + + RapiDoc + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + + +
+
+ +
+
+

Customer Agreement

+
+
+
+

Introduction

+

+ Welcome to RAPIDOC Healthcare Website. This Customer Agreement + outlines the terms and conditions under which you may use our online + platform to access healthcare information and services. By using our + website, you agree to comply with and be bound by the terms of this + agreement. +

+
+
+

Services Provided

+
    +
  • + Information Access: RAPIDOC provides information + about the nearest hospitals and healthcare facilities, including + blood availability in emergencies, OPDs, and bed availability. +
  • +
  • + Appointment Booking: Users can prebook + appointments for OPDs at desired hospitals. +
  • +
  • + Emergency Services: Information on emergency + services and blood group availability. +
  • +
  • + Healthcare Facilities: Detailed information on + healthcare services provided by various hospitals. +
  • +
+
+
+

User Responsibilities

+
    +
  • + Accuracy of Information: Users must provide + accurate and up-to-date information when using our services. +
  • +
  • + Compliance: Users must comply with all applicable + laws and regulations when using our platform. +
  • +
  • + Account Security: Users are responsible for + maintaining the confidentiality of their account information and + password. +
  • +
+
+
+

Terms of Use

+
    +
  • + Acceptance of Terms: By accessing and using our + website, you accept and agree to be bound by the terms of this + Customer Agreement. +
  • +
  • + Modification of Terms: RAPIDOC reserves the right + to modify these terms at any time. Any changes will be posted on + this page, and your continued use of the website will constitute + acceptance of the new terms. +
  • +
  • + Termination: RAPIDOC may terminate your access to + the website at any time, without notice, for conduct that it + believes violates this agreement or is harmful to other users of + the website, RAPIDOC, or third parties, or for any other reason. +
  • +
+
+
+

Contact Information

+

+ For any questions or concerns about this Customer Agreement, please + contact us at rapidoc@mail.com. +

+
+
+
+
+ + + + + + + + +





+ + + + + + diff --git a/Html-Files/derma.html b/Html-Files/derma.html new file mode 100644 index 00000000..4804580a --- /dev/null +++ b/Html-Files/derma.html @@ -0,0 +1,868 @@ + + + + + + + + + + + + + + + + + + + + + + + RapiDoc + + + +
+ + + +
+
+ + +
+
+
+
+
+
+ +
+ + +
+
+
+
+
+
+ + +
+
+
+ +
+ +
+
+
+

Dr. Soni Gupta

+

Dermatologist

+ + +
+
+
+ MAY + +
+
+ 21 + 22 + 23 + 24 + 25 + 26 + 27 +
+
+ +
+ +
+
+ + + + + +
+
+ +
+
+
+ + +
+
+
+ +
+ +
+
+
+

Dr. Deepti Shrivastava

+

Dermatologist

+ + +
+
+
+ MAY + +
+
+ 8 + 9 + 10 + 11 + 12 + 13 + 14 +
+
+ +
+ +
+
+ + + + + +
+
+
+
+
+ + +
+
+
+ +
+ +
+
+
+

Dr. Manisha Chopra

+

Dermatologist

+ + +
+
+ MAY + +
+ 10 + 12 + 23 + 24 + 25 + 26 + 27 +
+
+ +
+ +
+
+ + + + + +
+
+
+
+
+ + +
+
+
+ +
+ +
+
+
+

Dr. Pradeep Bansal

+

Dermatologist

+ + +
+
+ MAY + +
+ 13 + 14 + 15 + 16 + 17 + 18 + 19 +
+
+ +
+ +
+
+ + + + + +
+
+
+
+
+
+
+
+ + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/Html-Files/doc.html b/Html-Files/doc.html index 65b9cc20..33651140 100644 --- a/Html-Files/doc.html +++ b/Html-Files/doc.html @@ -1,6 +1,5 @@ - @@ -8,30 +7,14 @@ - - - Doctors - - + + RapiDoc + - -
@@ -45,187 +28,817 @@

RapiDoc

- - - -
-
+ +
+
+
+ +
+ + +
+
- +

Dr. Satbir Singh

Cardiologist

+
+
+ MAY + +
+ 20 + 21 + 22 + 23 + 24 + 25 + 26 +
+
+ +
+ +
+
+ + + + + +
+
+
+ +
+ + +
+
- +

Dr. Vikas Chopra

Cardiologist

+
+
+ MAY + +
+ 1 + 2 + 3 + 4 + 5 + 6 + 7 +
+
+ +
+ +
+
+ + + + + +
+
+ +
+ + +
+
- +

Dr. Ajay Aggarwal

Cardiologist

+
+
+ MAY + +
+ 11 + 12 + 13 + 14 + 15 + 16 + 17 +
+
+ +
+ +
+
+ + + + + +
+
+ +
+ + +
+
- +

Dr. Rajeev Kumar Rajput

Cardiologist

+
+
+ MAY + +
+ 18 + 19 + 20 + 21 + 22 + 23 + 24 +
+
+ +
+ +
+
+ + + + + +
+
+ +
+ + +
+
- +

Dr. Nityanand Tripathi

Cardiologist

+ +
+
+ MAY + +
+ 1 + 2 + 3 + 4 + 5 + 6 + 7 +
+ +
+ +
+
+ + + + + +
+
+ +
+ + +
+
- +

Dr. Soni Gupta

Dermatologist

+ +
+
+ MAY + +
+ 21 + 22 + 23 + 24 + 25 + 26 + 27 +
+
+ +
+
+
+ + + + + +
+
+ +
+ + +
+
- +

Dr. Ranjan Upadhyay

Dermatologist

+ +
+
+ MAY + +
+ 1 + 2 + 3 + 4 + 15 + 26 + 27 +
+
+ +
+
+
+ + + + + +
+
+ +
+ + +
+
- +

Dr. Deepti Shrivastava

Dermatologist

+ +
+
+ MAY + +
+ 8 + 9 + 10 + 11 + 12 + 13 + 14 +
+ +
+ +
+
+ + + + + +
+
+ +
+ + +
+
- +

Dr. Manisha Chopra

Dermatologist

+ +
+
+ MAY + +
+ 10 + 12 + 23 + 24 + 25 + 26 + 27 +
+ +
+ +
+
+ + + + + +
+
+ +
+ + +
+
- +

Dr. Pradeep Bansal

Dermatologist

+ +
+
+ MAY + +
+ 13 + 14 + 15 + 16 + 17 + 18 + 19 +
+
+ +
+
+
+ + + + + +
+
+ +
+ + +
+
- +

Dr. Jayant Jaswal

Ear-nose-throat (ENT)

+
+
+ MAY + +
+ 1 + 2 + 3 + 4 + 5 + 6 + 7 +
+
+ +
+ +
+
+ + + + + +
+
+ +
+ + +
+
- +

Dr. Vibhuti

Ear-nose-throat (ENT)

+
+
+ MAY + +
+ 21 + 22 + 23 + 24 + 29 + 30 + 31 +
+
+ +
+ +
+
+ + + + + +
+
- +
-
- - - - - - - - + + + \ No newline at end of file diff --git a/Html-Files/ent.html b/Html-Files/ent.html new file mode 100644 index 00000000..bf327749 --- /dev/null +++ b/Html-Files/ent.html @@ -0,0 +1,740 @@ + + + + + + + + + + + + + + + + + + + + + + + + RapiDoc + + + + + + + + + +
+
+
+
+
+
+ + +
+
+
+ +
+ +
+
+
+

Dr. Jayant Jaswal

+

Ear-nose-throat (ENT)

+ + +
+
+
+ MAY + +
+
+ 1 + 2 + 3 + 4 + 5 + 6 + 7 +
+
+ +
+ +
+
+ + + + + +
+
+
+
+
+ + +
+
+
+ +
+ +
+
+
+

Dr. Vibhuti

+

Ear-nose-throat (ENT)

+ + +
+
+
+ MAY + +
+
+ 21 + 22 + 23 + 24 + 29 + 30 + 31 +
+
+ +
+ +
+
+ + + + + +
+
+ +
+
+
+
+
+
+ + + + + + + + + + + + + + + + + + diff --git a/Html-Files/error.css b/Html-Files/error.css new file mode 100644 index 00000000..4302c6d3 --- /dev/null +++ b/Html-Files/error.css @@ -0,0 +1,118 @@ +/* Baseline styles */ +body { + font-family: sans-serif; + margin: 0; + padding: 0; + background-color: #f2f2f2; + } + +header { + text-align: center; + } + + .container { + max-width: 1000px; + margin: 0 auto; + padding: 20px; + } + + /* Header styles */ + header { + background-color: #fff; + padding: 10px 0; + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); + } + + .logo { + font-size: 24px; + font-weight: bold; + color: #095a55; + } + + /* Main content styles */ + main { + padding-top: 100px; + padding-bottom: 50px; + } + + .error { + text-align: center; + padding: 40px; + border-radius: 5px; + background-color: #fff; + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); + animation: entrance 0.5s ease-in-out forwards; + border: 1px solid #ddd; /* Remove border for two-color scheme */ + } + + .error h1 { + font-size: 100px; + color: #095a55; + margin-bottom: 20px; + } + + .error h2 { + font-size: 24px; + color: #333; /* Can be adjusted to black for stronger contrast */ + margin-bottom: 15px; + } + + .error p { + font-size: 16px; + color: #444; /* Can be adjusted to black for stronger contrast */ + line-height: 1.5; + } + + .btn { + display: inline-block; + padding: 10px 20px; + background-color: #095a55; + color: #fff; + font-size: 16px; + border: none; + border-radius: 5px; + cursor: pointer; + transition: all 0.2s ease-in-out; + } + + .btn:hover { + background-color: #00474a; + } + + /* Image hover effect (replace with a healthcare-related image) */ + .image-container { + position: relative; + margin: 20px auto; + width: 200px; /* Adjust image size */ + height: 200px; /* Adjust image size */ + } + + .image-container img { + width: 100%; + height: 100%; + transition: opacity 0.5s ease-in-out; + } + + .image-container:hover img { + opacity: 0.5; + } + + .image-container:hover .overlay { + opacity: 1; + background-color: rgba(0, 0, 0, 0.7); /* Semi-transparent black */ + color: #fff; /* White text */ + padding: 10px; /* Add padding for text */ + text-align: center; /* Center text alignment */ + } + + /* Footer styles */ + footer { + background-color: #f2f2f2; + padding: 10px 0; + text-align: center; + } + + footer p { + color: #333; /* Can be adjusted to black for stronger contrast */ + } + diff --git a/Html-Files/error.js b/Html-Files/error.js new file mode 100644 index 00000000..38ace50e --- /dev/null +++ b/Html-Files/error.js @@ -0,0 +1,30 @@ +// Function to adjust navigation based on screen size +function adjustNav() { + const nav = document.querySelector('nav'); + const windowWidth = window.innerWidth; + + if (windowWidth <= 768) { + nav.classList.add('responsive'); + } else { + nav.classList.remove('responsive'); + } + } + + // Call the adjustNav function on initial load and window resize + adjustNav(); + window.addEventListener('resize', adjustNav); + + // Responsive navigation functionality (optional) + if (document.querySelector('nav.responsive')) { + const navToggle = document.createElement('button'); + navToggle.classList.add('nav-toggle'); + navToggle.innerHTML = ''; // Font Awesome icon for menu (replace with your preferred method) + + navToggle.addEventListener('click', () => { + const nav = document.querySelector('nav'); + nav.classList.toggle('active'); + }); + + document.querySelector('header').appendChild(navToggle); + } + \ No newline at end of file diff --git a/Html-Files/error404.html b/Html-Files/error404.html new file mode 100644 index 00000000..3f182b95 --- /dev/null +++ b/Html-Files/error404.html @@ -0,0 +1,35 @@ + + + + + + 404 - Page Not Found |RapiDoc + + + + + +
+ +
+ +
+
+
+

404

+

Ooops! Page Not Found

+

We're sorry, but the page you requested was not found. Perhaps you mistyped the URL or the page has been removed.

+ Go Back to Home +
+
+
+ +
+
+

© RapiDoc - 2024

+
+
+ + diff --git a/Html-Files/experience.js b/Html-Files/experience.js new file mode 100644 index 00000000..7a0e64b3 --- /dev/null +++ b/Html-Files/experience.js @@ -0,0 +1,299 @@ + +document.getElementById('subscribeForm').addEventListener('submit', function(event) { + event.preventDefault(); // Prevent default form submission + + // Get the email input value + var email = document.getElementById('emailInput').value; + + // You can add further validation of the email input here if needed + + // Show the subscribe banner + document.getElementById('subscribeBanner').style.display = 'block'; + + // Optionally, you can reset the form + document.getElementById('subscribeForm').reset(); + + // Simulate a delay and hide the banner after 5 seconds + setTimeout(function() { + document.getElementById('subscribeBanner').style.display = 'none'; + }, 5000); + }); + + const doctorList = [ + { + name: "Dr. Ram", + specialization: "Cardiology", + experience: 12, + fee: 300, + image: "./images/doctor19.jpeg" + }, + { + name: "Dr. Rina", + specialization: "Gaynocologist", + experience: 8, + fee: 400, + image: "./images/doctor.png" + }, + { + name: "Dr. Ganesh", + specialization: "Dermatologist", + experience: 10, + fee: 500, + image: "./images/doctor8.jpeg" + }, + { + name: "Dr. Appa", + specialization: "ENT", + experience: 9, + fee: 600, + image: "./images/doctor19.jpeg" + }, + { + name: "Dr. Sanket", + specialization: "Pediatrics", + experience: 8, + fee: 700, + image: "./images/doctor.png" + }, + { + name: "Dr. Ashwin", + specialization: "Cardiology", + experience: 5, + fee: 800, + image: "./images/doctor17.jpeg" + }, + { + name: "Dr. Tushar", + specialization: "Dermatologist", + experience: 13, + fee: 900, + image: "./images/doctor18.jpeg" + }, + { + name: "Dr. Shivani", + specialization: "Gynacologist", + experience: 14, + fee: 1000, + image: "./images/doctor8.jpeg" + }, + { + name: "Dr. Piyush", + specialization: "ENT", + experience: 15, + fee: 150, + image: "./images/doctor17.jpeg" + }, + { + name: "Dr. Dhanraj", + specialization: "Pediatrics", + experience: 11, + fee: 250, + image: "./images/doctor18.jpeg" + }, + { + name: "Dr. Rani", + specialization: "Cardiology", + experience: 5, + fee: 100, + image: "./images/doctor19.jpeg" + }, + { + name: "Dr. Dhanshree", + specialization: "Pediatrics", + experience: 6, + fee: 350, + image: "./images/doctor8.jpeg" + }, + { + name: "Dr. Radheshyam", + specialization: "Dermatologist", + experience: 7, + fee: 450, + image: "./images/doctor.png" + }, + { + name: "Dr. Abhishek", + specialization: "Gynacologist", + experience: 8, + fee: 550, + image: "./images/doctor17.jpeg" + }, + { + name: "Dr. Kalyani", + specialization: "ENT", + experience: 9, + fee: 650, + image: "./images/doctor8.jpeg" + }, + { + name: "Dr. Priya", + specialization: "Pediatrics", + experience: 10, + fee: 750, + image: "./images/doctor.png" + }, + { + name: "Dr. Sunita", + specialization: "Cardiology", + experience: 11, + fee: 850, + image: "./images/doctor17.jpeg" + }, + { + name: "Dr. Rajesh", + specialization: "Gynacologist", + experience: 12, + fee: 950, + image: "./images/doctor18.jpeg" + }, + { + name: "Dr. Namrata", + specialization: "ENT", + experience: 13, + fee: 200, + image:"./images/doctor19.jpeg" + }, + { + name: "Dr. Divyansh", + specialization: "Dermatologist", + experience: 14, + fee: 300, + image: "./images/doctor17.jpeg" + }, + { + name: "Dr. Samiksha", + specialization: "Pediatrics", + experience: 16, + fee: 400, + image: "./images/doctor.png" + }, + { + name: "Dr. Ramesh", + specialization: "Cardiologist", + experience: 10, + fee: 200, + image: "./images/doctor8.jpeg" + }, + { + name: "Dr. Madhuri", + specialization: "Pediatrics", + experience: 9, + fee: 500, + image: "./images/doctor17.jpeg" + }, + { + name: "Dr. Kanchan", + specialization: "Dermatologist", + experience: 8, + fee: 600, + image: "./images/doctor18.jpeg" + }, + { + name: "Dr. Suresh", + specialization: "Pediatrics", + experience: 7, + fee: 700, + image: "./images/doctor19.jpeg" + }, + { + name: "Dr. Dipali", + specialization: "ENT", + experience: 6, + fee: 800, + image: "./images/doctor.png" + }, + { + name: "Dr. Nikita", + specialization: "Dermatologist", + experience: 5, + fee: 900, + image: "./images/doctor17.jpeg" + }, + { + name: "Dr. Sangeeta", + specialization: "Cardiologist", + experience: 5, + fee: 1000, + image:"./images/doctor8.jpeg" + }, + { + name: "Dr. Vanshika", + specialization: "ENT", + experience: 10, + fee: 100, + image: "./images/doctor19.jpeg" + }, + { + name: "Dr. Prabhakar", + specialization: "Gynacologist", + experience: 11, + fee: 300, + image: "./images/doctor18.jpeg" + }, + ]; + + function renderDoctorList(doctors) { + const doctorListElement = document.getElementById("doctor-list"); + doctorListElement.innerHTML = ""; + + doctors.forEach(doctor => { + const doctorItem = document.createElement("li"); + doctorItem.innerHTML = ` +
+

${doctor.name}

+

Specialization: ${doctor.specialization}

+

Experience: ${doctor.experience} years

+

Fee: $${doctor.fee}

+
+ ${doctor.image ? `${doctor.name}` : ""} + `; + doctorListElement.appendChild(doctorItem); + }); + } + + function filterDoctors() { + const experienceFilter = document.getElementById("experience-filter").value; + const feeFilter = document.getElementById("fee-filter").value; + + let filteredDoctors = doctorList.filter(doctor => { + return ( + (experienceFilter === "" || doctor.experience >= experienceFilter) && + doctor.fee >= feeFilter + ); + }); + + renderDoctorList(filteredDoctors); + } + + function sortDoctorsByFee() { + doctorList.sort((a, b) => a.fee - b.fee); + renderDoctorList(doctorList); + } + + document.getElementById("experience-filter").addEventListener("change", filterDoctors); + document.getElementById("fee-filter").addEventListener("input", () => { + document.getElementById("fee-value").textContent = document.getElementById("fee-filter").value; + filterDoctors(); + }); + + document.getElementById("sort-btn").addEventListener("click", sortDoctorsByFee); + + renderDoctorList(doctorList); + + window.addEventListener("load", () => { + const loader = document.querySelector(".pre"); + loader.classList.add("pre--hidden"); + loader.addEventListener("transitionend", () => { + document.body.removeChild(loader); + }); + }); + + window.addEventListener("load", () => { + const loader = document.querySelector(".loader"); + loader.classList.add("loader--hidden"); + loader.addEventListener("transitionend", () => { + document.body.removeChild(loader); + }); + }); + var currentYear = new Date().getFullYear(); + document.getElementById('year').textContent = currentYear; \ No newline at end of file diff --git a/Html-Files/gynaco.html b/Html-Files/gynaco.html new file mode 100644 index 00000000..45eee302 --- /dev/null +++ b/Html-Files/gynaco.html @@ -0,0 +1,100 @@ + + + + + + + + + + + RapiDoc + + + +
+
+
+
+
+ +
+ + +
+
+
+ +
+ +
+
+
+

Dr. Satbir Singh

+

Gynacologist

+ + +
+
+ MAY + +
+ 20 + 21 + 22 + 23 + 24 + 25 + 26 +
+
+ +
+ +
+
+ + + + + +
+ +
+
+
+
+
+
+
+ + + + + + + + + + diff --git a/Html-Files/images/doctor.png b/Html-Files/images/doctor.png new file mode 100644 index 00000000..074ca25e Binary files /dev/null and b/Html-Files/images/doctor.png differ diff --git a/Html-Files/images/doctor17.jpeg b/Html-Files/images/doctor17.jpeg new file mode 100644 index 00000000..f5509f57 Binary files /dev/null and b/Html-Files/images/doctor17.jpeg differ diff --git a/Html-Files/images/doctor18.jpeg b/Html-Files/images/doctor18.jpeg new file mode 100644 index 00000000..004805b9 Binary files /dev/null and b/Html-Files/images/doctor18.jpeg differ diff --git a/Html-Files/images/doctor19.jpeg b/Html-Files/images/doctor19.jpeg new file mode 100644 index 00000000..98782bb2 Binary files /dev/null and b/Html-Files/images/doctor19.jpeg differ diff --git a/Html-Files/images/doctor8.jpeg b/Html-Files/images/doctor8.jpeg new file mode 100644 index 00000000..518d2626 Binary files /dev/null and b/Html-Files/images/doctor8.jpeg differ diff --git a/Html-Files/images/github.png b/Html-Files/images/github.png new file mode 100644 index 00000000..95cdc93f Binary files /dev/null and b/Html-Files/images/github.png differ diff --git a/Html-Files/images/logo.png b/Html-Files/images/logo.png new file mode 100644 index 00000000..2af321b2 Binary files /dev/null and b/Html-Files/images/logo.png differ diff --git a/Html-Files/images/mail2.png b/Html-Files/images/mail2.png new file mode 100644 index 00000000..aefdf535 Binary files /dev/null and b/Html-Files/images/mail2.png differ diff --git a/Html-Files/images/phone.png b/Html-Files/images/phone.png new file mode 100644 index 00000000..f2c79b7d Binary files /dev/null and b/Html-Files/images/phone.png differ diff --git a/Html-Files/images/twitter.png b/Html-Files/images/twitter.png new file mode 100644 index 00000000..e3247ffb Binary files /dev/null and b/Html-Files/images/twitter.png differ diff --git a/Html-Files/images/twitters.png b/Html-Files/images/twitters.png new file mode 100644 index 00000000..8ec9337a Binary files /dev/null and b/Html-Files/images/twitters.png differ diff --git a/Html-Files/input.html b/Html-Files/input.html new file mode 100644 index 00000000..5919dbf5 --- /dev/null +++ b/Html-Files/input.html @@ -0,0 +1,53 @@ + + + + + + + RapiDoc + + +
+
+
+
6+
+
Years of Experience
+
+
+
5K
+
Doctor Specialist
+
+
+
100%
+
Patient Satisfication
+
+
+
+ doc +
+
+
Find a doctor for you now!
+
We take the guesswork out of locating a doctor,hospital or other medical facility in your area for you and your family
+
+ + +
+
+
+ + + + \ No newline at end of file diff --git a/Html-Files/map.html b/Html-Files/map.html new file mode 100644 index 00000000..523a95be --- /dev/null +++ b/Html-Files/map.html @@ -0,0 +1,68 @@ + + + + + + + + + + RapiDoc + + +
Healthcares Nearby
+
+ + + \ No newline at end of file diff --git a/Html-Files/news.html b/Html-Files/news.html index 741a2052..f6f69874 100644 --- a/Html-Files/news.html +++ b/Html-Files/news.html @@ -1,77 +1,396 @@ - - - - News RapiDoc - - - - - - - - + + + + + + + + + + + + RapiDoc + + + + + + + + + + + + + + + + + + + + + + + + + - - - -
-

- Top News by RapiDoc -

- +
- -
-
- - + +
+
+ + + +
+
+ + + +
+ + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/Html-Files/pediatrition.html b/Html-Files/pediatrition.html new file mode 100644 index 00000000..18f5e9e6 --- /dev/null +++ b/Html-Files/pediatrition.html @@ -0,0 +1,104 @@ + + + + + + + + + + + + RapiDoc + + + + + +
+
+
+
+
+ +
+ + +
+
+
+ +
+ +
+
+
+

Dr. Ranjan Upadhyay

+

Pediatrician

+ + +
+
+ MAY + +
+ 1 + 2 + 3 + 4 + 15 + 26 + 27 +
+
+ +
+ +
+
+ + + + + +
+
+ + + +
+
+
+
+
+
+ + + + + + + + + \ No newline at end of file diff --git a/Html-Files/privacy_policy_page.html b/Html-Files/privacy_policy_page.html new file mode 100644 index 00000000..0f0acb70 --- /dev/null +++ b/Html-Files/privacy_policy_page.html @@ -0,0 +1,1174 @@ + + + + + + RapiDoc + + + + + + + + + + + + + + + + RapiDoc + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + + +
+
+

Privacy Policy

+
+
Last updated:
+
+
+

Introduction

+

+ Welcome to RAPIDOC Healthcare. We value your privacy and are + committed to protecting your personal information. This Privacy + Policy outlines how we collect, use, and protect your data when you + use our website and services. +

+
+ +
+

Data Collection

+

+ We collect various types of information in connection with the + services we provide, including Personal Identification Information + (Name, email address, phone number, etc.), Usage Data (IP address, + browser type, pages visited, etc.), and Cookies and Tracking + Technologies. +

+
+ +
+

Data Use

+

+ The information we collect is used for various purposes, including + providing and maintaining our services, notifying you about changes + to our services, providing customer support, gathering analysis or + valuable information to improve our services, and monitoring the + usage of our services. +

+
+ +
+

Data Sharing

+

+ We may share your personal information with third parties in certain + circumstances, such as with service providers to monitor and analyze + the use of our service, with business partners to offer you certain + products, services, or promotions, or with your consent for any + other purpose. +

+
+ +
+

Data Protection

+

+ We implement a variety of security measures to maintain the safety + of your personal information. However, please note that no method of + transmission over the Internet or method of electronic storage is + 100% secure. +

+
+ +
+

Your Rights

+

+ You have the right to access, correct, or delete your personal + information. You can do this by contacting us using the contact + information provided below. +

+
+ +
+

Changes to This Privacy Policy

+

+ We may update our Privacy Policy from time to time. We will notify + you of any changes by posting the new Privacy Policy on this page. +

+
+ +
+

Contact Us

+ +

+ If you have any questions about this Privacy Policy, please contact + us: +

+

By email: rapidoc@mail.com

+
+ + +
+
+ + + + + + + + +





+ + + + + + + diff --git a/Html-Files/terms_and_conditions.html b/Html-Files/terms_and_conditions.html new file mode 100644 index 00000000..3aac6a64 --- /dev/null +++ b/Html-Files/terms_and_conditions.html @@ -0,0 +1,1369 @@ + + + + + + RapiDoc + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + + + + +
+
+

Terms and Conditions

+
+
Last updated:
+
+
+

Introduction

+

+ These terms and conditions outline the rules and regulations for the + use of RAPIDOC Healthcare Website. By accessing this website we + assume you accept these terms and conditions. Do not continue to use + RAPIDOC Healthcare if you do not agree to take all of the terms and + conditions stated on this page. +

+
+ +
+

Privacy

+

+ We are committed to protecting your privacy. Please refer to our + Privacy Policy for information on how we collect, use, and disclose + your personal information. +

+
+
+

License

+

+ Unless otherwise stated, RAPIDOC Healthcare and/or its licensors own + the intellectual property rights for all material on RAPIDOC + Healthcare. All intellectual property rights are reserved. You may + access this from RAPIDOC Healthcare for your own personal use + subjected to restrictions set in these terms and conditions. +

+
+
+

User Conduct

+
    +
  • + You must not use this website in any way that causes, or may + cause, damage to the website or impairment of the availability or + accessibility of the website. +
  • +
  • + You must not use this website in any way which is unlawful, + illegal, fraudulent or harmful, or in connection with any + unlawful, illegal, fraudulent or harmful purpose or activity. +
  • +
  • + You must not use this website to copy, store, host, transmit, + send, use, publish or distribute any material which consists of + (or is linked to) any spyware, computer virus, Trojan horse, worm, + keystroke logger, rootkit or other malicious computer software. +
  • +
+
+
+

Changes to These Terms

+

+ We may update our Terms and Conditions from time to time. We will + notify you of any changes by posting the new Terms and Conditions on + this page. You are advised to review this Terms and Conditions + periodically for any changes. Changes to this Terms and Conditions + are effective when they are posted on this page. +

+
+
+

Contact Information

+

+ If you have any questions about these Terms and Conditions, please + contact us at rapidoc@mail.com. +

+
+
+
+ +
+ + + + + \ No newline at end of file diff --git a/Introduction/Advantages.md b/Introduction/Advantages.md new file mode 100644 index 00000000..7472eb47 --- /dev/null +++ b/Introduction/Advantages.md @@ -0,0 +1,8 @@ +# **9. ADVANTAGES:** +Here are the advantages of Rapidoc healthcare service +- Convenient access to healthcare services and medical information anytime, anywhere. +- User-friendly interface for easy navigation and quick appointment bookings. +- Timely updates on bed availability at emergency centers for informed decision-making during emergencies. +- Ability to book appointments with top-rated doctors across various specialties. +- Access to regular health updates and informative newsletters for staying informed. +- Streamlined emergency services to ensure prompt assistance when needed. diff --git a/Introduction/Architecture.md b/Introduction/Architecture.md new file mode 100644 index 00000000..2a10b2ea --- /dev/null +++ b/Introduction/Architecture.md @@ -0,0 +1,12 @@ +# **6. ARCHITECTURE** +Here is the architecture diagram of Rapidoc healthcare application. + + + +![Architecture diagram](https://github.com/TejaswiKandunuri/RAPIDOC-HEALTHCARE-WEBSITE-/assets/110902627/5184e0e4-f430-4348-95f5-afe7855a9ef1) + +This is the flow of operations , which can be done through the rapidoc application. +The provided architecture diagram outlines the flow of operations within the RapiDoc application, +illustrating how data and control move through the various components. + +![rapidoc flow diagram](https://github.com/TejaswiKandunuri/RAPIDOC-HEALTHCARE-WEBSITE-/assets/110902627/df749559-19a6-4f84-b082-692eed63fd67) diff --git a/Introduction/Conclusion.md b/Introduction/Conclusion.md new file mode 100644 index 00000000..f96e39a0 --- /dev/null +++ b/Introduction/Conclusion.md @@ -0,0 +1,12 @@ +# **12. CONCLUSION** +The RapiDoc healthcare website stands as a very useful digital platform dedicated to transforming healthcare accessibility. +By providing comprehensive and user-friendly services, RapiDoc revolutionizes how users access medical care, ensuring +convenience and efficiency. With features ranging from appointment booking with top-rated doctors to real-time updates on +emergency bed availability, RapiDoc addresses diverse healthcare needs. Moreover, its commitment to accessibility ensures +no one is left behind in receiving timely medical care. + +While the platform offers numerous advantages such as easy access to healthcare services and informative updates, +it also faces challenges such as potential privacy concerns and dependency on internet connectivity. Looking ahead, +RapiDoc has promising future scope areas, including the expansion of services, integration of AI-driven virtual health +assistants, and geographical expansion. In essence, RapiDoc emerges as a reliable partner in promoting well-being and +enhancing the healthcare experience for all users. diff --git a/Introduction/Disadvantages.md b/Introduction/Disadvantages.md new file mode 100644 index 00000000..93a3b03f --- /dev/null +++ b/Introduction/Disadvantages.md @@ -0,0 +1,4 @@ +# **10. DISADVANTAGES** +These are the disadvantages of Rapidoc healthcare service +- Potential privacy concerns related to storing personal health information online. +- limiting usage in areas with poor connectivity. diff --git a/Introduction/Future Scope.md b/Introduction/Future Scope.md new file mode 100644 index 00000000..fb27a04a --- /dev/null +++ b/Introduction/Future Scope.md @@ -0,0 +1,4 @@ +# **11. FUTURE SCOPE** +- Expansion of Services: Introduce additional healthcare services like telemedicine consultations and home healthcare. +- AI-powered Virtual Health Assistants, Develop AI-driven assistants for round-the-clock support and health advice. +- Geographical Expansion: Expand services globally by partnering with healthcare providers worldwide. diff --git a/Introduction/Installation.md b/Introduction/Installation.md new file mode 100644 index 00000000..8b17f6ea --- /dev/null +++ b/Introduction/Installation.md @@ -0,0 +1,10 @@ +# **7. INSTALLATION** +To run the project locally in your System +1. Fork the Repository: Click on the "Fork" button on the repository's GitHub page to create a copy of the repository in your GitHub account. +2. Clone the repository: Clone the forked repository to your local machine using the following command in your terminal. +git clone + ```bash + https://github.com//RAPIDOC-HEALTHCARE-WEBSITE + ``` +4. You can make changes in code using the VS code text editor. +5. Find the Index.html file: Right click the file mentioned and click on "Open with Live Server" This will redirect to the web-browser and load the landing pageΒ ofΒ theΒ project diff --git a/Introduction/Objectives.md b/Introduction/Objectives.md new file mode 100644 index 00000000..4f3080b3 --- /dev/null +++ b/Introduction/Objectives.md @@ -0,0 +1,12 @@ +# **2. OBJECTIVES:** +- Provide a comprehensive online destination for essential healthcare services. +- Enable users to easily locate nearby clinics, labs, and pharmacies for their medical needs. +- Keep users informed about blood bank statuses and provide regular health updates through a daily feed. +- Cater to the accessibility needs of disabled individuals by listing wheelchair-accessible hospitals and clinics. +- Offer booking services for appointments with top-rated doctors across various specialties. +- Facilitate normal checkups, and blood tests, and provide crucial information about body temperature ranges and medicine usage. +- Extend health benefits like boot camps, vaccination drives, and personalized check-ups. +- Streamline emergency services to help users avoid the rush and get immediate assistance, with real-time updates on bed availability at emergency centers. +- Provide users with the latest medical insights and health tips through newsletters. +- Ensure seamless integration of digital solutions for a reliable healthcare experience. +- Commit to providing a seamless and efficient healthcare experience for all users. diff --git a/Introduction/Project Overview.md b/Introduction/Project Overview.md new file mode 100644 index 00000000..f26bc9b4 --- /dev/null +++ b/Introduction/Project Overview.md @@ -0,0 +1,14 @@ +# **1. PROJECT OVERVIEW** + + RapiDoc is a pioneering digital healthcare platform designed to transform the way users access medical services. As a comprehensive and user-friendly online destination, +RapiDoc provides a wide range of essential healthcare services aimed at improving the overall healthcare experience. The platform ensures users can easily locate nearby +clinics and labs, access pharmacy deliveries, stay informed about blood bank statuses, and receive regular health updates through our daily feed. With a focus on accessibility, + RapiDoc also caters to disabled individuals by listing wheelchair-accessible hospitals and clinics, ensuring no one is left behind in receiving timely and efficient medicalcare. + + The services offered by RapiDoc are meticulously designed to cater to various health needs. Users can book appointments with top-rated doctors specializing in dermatology, +gynecology, cardiology, and ENT, ensuring they receive expert medical attention. The platform facilitates normal checkups, blood tests, and provides crucial information about +body temperature ranges and medicine usage. Our commitment to health extends beyond immediate medical needs, offering health benefits like bootcamps, vaccination drives, and +personalized check-ups. Emergency services are streamlined to help users avoid rush and get immediate assistance, with real-time updates on bed availability at emergency +centers. Additionally, RapiDoc's subscription to newsletters keeps users informed with the latest medical insights and health tips. Through our seamless integration of digital +solutions, RapiDoc stands as a reliable partner in maintaining and enhancing your health, bringing you the best facilities and ensuring you are well-supported at every digital +step. diff --git a/Introduction/Technology stack.md b/Introduction/Technology stack.md new file mode 100644 index 00000000..e06bc869 --- /dev/null +++ b/Introduction/Technology stack.md @@ -0,0 +1,4 @@ +# **5. TECHNOLOGY STACK** +- Frontend: HTML5, CSS, JavaScript, BootStrap +- Integrated Development Environment (IDE): VS Code/Google IDX +- Version Control: Git and GitHub diff --git a/Introduction/Usage.md b/Introduction/Usage.md new file mode 100644 index 00000000..b59361b1 --- /dev/null +++ b/Introduction/Usage.md @@ -0,0 +1,40 @@ + +# **8. USAGE** + +**Accessing the Website:** + +Users start by accessing the RapiDoc website through their web browser on any internet-enabled device. + +**Exploring Healthcare Services:** + +Upon landing on the homepage, users can explore the various healthcare services offered by RapiDoc. This includes services such as locating nearby clinics, labs, and pharmacies, booking appointments with doctors across different specialties, accessing blood bank statuses, and receiving regular health updates. + +**Locating Nearby Healthcare Facilities:** + +If a user is in need of immediate medical assistance or wants to schedule an appointment, they can use the website to locate nearby healthcare facilities such as clinics, labs, and pharmacies. The website provides information on the location, services offered, and contact details of these facilities. + +**Booking Appointments:** + + +Users can book appointments with top-rated doctors specializing in various fields like dermatology, gynecology, cardiology, and ENT. They can browse through available appointment slots, select a convenient time, and provide necessary details to confirm the booking. + +**Accessing Medical Information:** + + +RapiDoc provides users with access to crucial medical information such as body temperature ranges, medicine usage guidelines, and general health tips. Users can stay informed about various health topics through the website's daily feed and newsletter subscriptions. + +**Emergency Services:** + +In case of emergencies, users can use the website to access streamlined emergency services. Real-time updates on bed availability at emergency centers help users make informed decisions and get immediate assistance when needed. + +**Staying Updated:** + +Users can stay updated with the latest medical insights and health tips by subscribing to RapiDoc's newsletters. This ensures that they receive timely information about healthcare developments and best practices. + +**Navigating the Website:** + +Throughout their interaction with the website, users can easily navigate between different pages using intuitive navigation menus and links. The website's user-friendly interface ensures a smooth and seamless browsing experience. + +**Contacting RapiDoc:** + +For further inquiries or assistance, users can easily get in touch with RapiDoc through the provided contact information, including email and phone number. diff --git a/Introduction/features And Services.md b/Introduction/features And Services.md new file mode 100644 index 00000000..5c71b725 --- /dev/null +++ b/Introduction/features And Services.md @@ -0,0 +1,33 @@ +# **4. FEATURES AND SERVICES** +**Homepage:** + +Welcome Section: Introduces RapiDoc as a digital healthcare destination, emphasizing the ease and convenience of accessing healthcare services through the platform. +Download App Button: Encourages users to download the RapiDoc app for a more integrated experience. + +**Services:** + +Clinics/Labs: Helps users locate the best healthcare facilities around them without hassle. +Pharmacy: Allows users to get prescribed medicines delivered to their doorstep. +Daily Feed: Provides access to health benefits such as bootcamps, vaccination drives, and more. +Blood Bank: Offers information about nearby blood banks and available blood groups to ensure no one suffers in emergencies. +Disabled Person Services: Lists wheelchair-accessible hospitals and clinics to ensure convenient medical care. +Health Post: Delivers health-related content weekly, monthly, yearly, or daily, based on user preference. + +**Appointments:** + +Make an Appointment: A form where users can book appointments with doctors. It includes fields for the user's name, email, phone, appointment date, age, location, and an optional message. + +**Doctors:** + +Specialist Listings: Lists doctors across various specializations such as Dermatology, Gynecology, Cardiology, and ENT, with options to appoint a doctor directly from the website. + +**Contact:** + +Feedback Form: Allows users to provide feedback and suggestions to help improve digital medical care. +Contact Information: Provides the platform's contact details, including location, email, and phone number. +Address: Lists the address as Delhi, India. +Links: Includes quick links to important sections of the website such as Home, About Us, Services, Doctors, and Contact. + +**Newsletter Subscription:** + +Daily Newsletter: Encourages users to subscribe to receive medical insights and updates via email. diff --git a/Introduction/purpose.md b/Introduction/purpose.md new file mode 100644 index 00000000..40877b80 --- /dev/null +++ b/Introduction/purpose.md @@ -0,0 +1,7 @@ +# **3. PURPOSE** +The purpose of the RapiDoc project is to revolutionize the accessibility and delivery of healthcare services through a comprehensive digital platform. +It aims to address various needs and challenges faced by individuals seeking medical assistance by providing a user-friendly interface to access a wide range +of healthcare services. By leveraging digital solutions, RapiDoc intends to streamline the process of locating nearby clinics, labs, and pharmacies, booking +appointments with top-rated doctors, receiving health updates, and accessing emergency services. Additionally, the project aims to cater to the accessibility +needs of disabled individuals and keep users informed with the latest medical insights and health tips. Overall, the purpose of RapiDoc is to provide a seamless +and efficient healthcare experience for all users, enhancing their well-being and ensuring they receive timely and expert medical attention. diff --git a/Learn.md b/Learn.md new file mode 100644 index 00000000..96c9a7a9 --- /dev/null +++ b/Learn.md @@ -0,0 +1,160 @@ +# **Contributing Guidelines** πŸ“„ + +This documentation contains a set of guidelines to help you during the contribution process. +We are happy to welcome all the contributions from anyone willing to improve/add new scripts to this project. +Thank you for helping out and remember, **no contribution is too small.** +
+Please note we have a [code of conduct](CODE_OF_CONDUCT.md) please follow it in all your interactions with the project. + +
+ +## How to Contribute ? + +## **Getting Started** +1. Clone the repo + +```sh + git clone https://github.com/Anishkagupta04/RAPIDOC-HEALTHCARE-WEBSITE-.git +``` + +2. Run index.html with any browser (example: chrome etc). + +
+ +## Contribution + +Contributions are what make the open-source community such an amazing place to learn, inspire, and create. Any contributions you make are **greatly appreciated**. + +- If you have any suggestions for the project, such as reporting a bug, improving the UI, or enhancing the README.md file, feel free to **open an issue** to discuss it or directly create a pull request with the necessary changes. +- Please make sure to check your spelling and grammar. +- Create individual pull requests for each suggestion to keep changes focused and manageable. + +Your involvement helps to improve the project and make it better for everyone. Thank you for your contributions! + +## Creating Pull Request +1. **Fork the Project:** + - Click on the "Fork" button at the top right corner of the repository's page on GitHub to create your own copy of the project. + +2. **Clone Your Forked Repository:** + - Clone the forked repository to your local machine using the following command: + ```sh + git clone https://github.com//RAPIDOC-HEALTHCARE-WEBSITE- + ``` + - Navigate to project folder: + ```sh + cd RAPIDOC-HEALTHCARE-WEBSITE + ``` + +3. **Add a reference(remote) to the original repository:** + + ``` + git remote add upstream https://github.com/Anishkagupta04/RAPIDOC-HEALTHCARE-WEBSITE- + ``` +4. **Check the remotes for this repository.** + ``` + git remote -v + ``` + +5. **Always take a pull from the upstream repository to your master branch to keep it at par with the main project (updated repository).** + ``` + git pull upstream main + ``` + +6. **Create a New Branch and Move to the Branch:** + - Create a new branch for your changes and move to that branch using the following commands: + ```sh + git checkout -b + ``` + +7. **Add Your Changes:** + - After you have made your changes, check the status of the changed files using the following command: + ```sh + git status -s + ``` + - Add all the files to the staging area using the following command: + ```sh + git add . + ``` + or add specific files using: + ```sh + git add + ``` +8. **Commit Your Changes:** + - Commit your changes with a descriptive message using the following command: + ```sh + git commit -m "" + ``` + +9. **Push Your Changes:** + - Push your changes to your forked repository on GitHub using the following command: + ```sh + git push origin + ``` + +10. **Open a Pull Request:** + - Go to the GitHub page of your forked repository, and you should see an option to create a pull request. Click on it, provide a descriptive title and description for your pull request, and then submit it. + +### Alternatively contribute using GitHub Desktop + +1. **Open GitHub Desktop:** + Launch GitHub Desktop and log in to your GitHub account if you haven't already. + +2. **Clone the Repository:** + - If you haven't cloned the RAPIDOC-HEALTHCARE-WEBSITE- repository yet, you can do so by clicking on the "File" menu and selecting "Clone Repository." + - Choose the RAPIDOC-HEALTHCARE-WEBSITE- repository from the list of repositories on GitHub and clone it to your local machine. + +3. **Switch to the Correct Branch:** + - Ensure you are on the branch that you want to submit a pull request for. + - If you need to switch branches, you can do so by clicking on the "Current Branch" dropdown menu and selecting the desired branch. + +4. **Make Changes:** + Make your changes to the code or files in the repository using your preferred code editor. + +5. **Commit Changes:** + - In GitHub Desktop, you'll see a list of the files you've changed. Check the box next to each file you want to include in the commit. + - Enter a summary and description for your changes in the "Summary" and "Description" fields, respectively. Click the "Commit to " button to commit your changes to the local branch. + +6. **Push Changes to GitHub:** + After committing your changes, click the "Push origin" button in the top right corner of GitHub Desktop to push your changes to your forked repository on GitHub. + +7. **Create a Pull Request:** + - Go to the GitHub website and navigate to your fork of the RAPIDOC-HEALTHCARE-WEBSITE- repository. + - You should see a button to "Compare & pull request" between your fork and the original repository. Click on it. + +8. **Review and Submit:** + - On the pull request page, review your changes and add any additional information, such as a title and description, that you want to include with your pull request. + - Once you're satisfied, click the "Create pull request" button to submit your pull request. + +9. **Wait for Review:** + Your pull request will now be available for review by the project maintainers. They may provide feedback or ask for changes before merging your pull request into the main branch of the RAPIDOC-HEALTHCARE-WEBSITE- repository. + +## **Issue Report Process πŸ“Œ** + +1. Go to the project's issues. +2. Give proper description for the issues. +3. Don't spam to get the assignment of the issue πŸ˜€. +4. Wait for till someone is looking into it !. +5. Start working on issue only after you got assigned that issue πŸš€. + +## **Pull Request Process πŸš€** + +1. Ensure that you have self reviewed your code πŸ˜€ +2. Make sure you have added the proper description for the functionality of the code +3. I have commented my code, particularly in hard-to-understand areas. +4. Add screenshot it help in review. +5. Submit your PR by giving the necesarry information in PR template and hang tight we will review it really soon πŸš€ + +
+ +## **Need some help regarding the basics?πŸ€”** + +You can refer to the following articles on basics of Git and Github and also contact the Project Mentors, +in case you are stuck: + +- [Forking a Repo](https://help.github.com/en/github/getting-started-with-github/fork-a-repo) +- [Cloning a Repo](https://help.github.com/en/desktop/contributing-to-projects/creating-an-issue-or-pull-request) +- [How to create a Pull Request](https://opensource.com/article/19/7/create-pull-request-github) +- [Getting started with Git and GitHub](https://towardsdatascience.com/getting-started-with-git-and-github-6fcd0f2d4ac6) +- [Learn GitHub from Scratch](https://docs.github.com/en/get-started/start-your-journey/git-and-github-learning-resources) + +# **Thank you for contributingπŸ’—** diff --git a/README.md b/README.md index 1a73b202..06344444 100644 --- a/README.md +++ b/README.md @@ -1,31 +1,30 @@ + +
![RapidDoc](https://camo.githubusercontent.com/dd5e3080a7adc2ead8f86cbbd6577cee0a38439c0ebf195021ce41587b0a405f/68747470733a2f2f6d69726f2e6d656469756d2e636f6d2f6d61782f313430302f312a633459675258595161794f5657785633376f757272772e706e67) +
- -## RapiDoc -[πŸ’¬ Join the community on Slack](https://join.slack.com/t/newworkspace-ley5153/shared_invite/zt-2isvflg78-tMexsn50mxdwY4BEJ_W11g)
-# RapiDoc.com +#

RapiDoc.com

+[πŸ’¬ Join the community on Slack](https://join.slack.com/t/newworkspace-ley5153/shared_invite/zt-2isvflg78-tMexsn50mxdwY4BEJ_W11g)
-An online platform providing comprehensive information on nearby hospitals and healthcare facilities! +

An online platform providing comprehensive information on nearby hospitals and healthcare facilities!

- - [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT) - + - - - + + + @@ -39,153 +38,181 @@
🌟 Stars Stars 🍴 ForksπŸ› IssuesπŸ”” Open PRsπŸ”• Closed PRs Issues Open PRs Closed PRs
-

Featured In

- +

RocketFeatured In

+
+

Open Source Programs

+
- + + -
Event Logo Event Name Event Description
GSSoC 24 GirlScript Summer of Code 2024 GirlScript Summer of Code is a three-month-long Open Source Program conducted every summer by GirlScript Foundation. It is an initiative to bring more beginners to Open-Source Software Development.
-

Project Overview

-It is an online platform which enables you to get information about your nearest hospitals and healthcare facilities including important information like blood availablity in emergency, Opds and beds availability in your nearest/desired hospitals. It aims to address health-related issues. It is a one-stop destination for all your medical needs. +
+

RocketProject Overview

+

+It is an online platform which enables you to get information about your nearest hospitals and healthcare facilities including important information like blood availablity in emergency, Opds and beds availability in your nearest/desired hospitals. It aims to address health-related issues. It is a one-stop destination for all your medical needs.

-## Technology Stack +##

High VoltageTech Stack

+
+ + +
-- **Frontend**: HTML5, CSS, JavaScript, BootStrap -- **IDE**: VS Code/Google IDX -- **Version Control**: Git and GitHub +
-## Get Started +##

RocketGet Started

### Setup and Installation -To contribute to the RAPIDOC-HEALTHCARE-WEBSITE repository, follow these steps: -1. **Fork the Repository** +

To contribute to the RAPIDOC-HEALTHCARE-WEBSITE repository, follow these steps:

+ +1. **Fork the Repository:** Click on the "Fork" button on the repository's GitHub page to create a copy of the repository in your GitHub account. -2. **Clone the repository** - Clone the forked repository to your local machine using the following command in your terminal: +2. **Clone the repository:** + Clone the forked repository to your local machine using the following command in your terminal. ```bash git clone https://github.com//RAPIDOC-HEALTHCARE-WEBSITE ``` -3. **Add a remote upstream** +3. **Add a remote upstream:** ```bash git remote add upstream https://github.com/original-owner-username/RAPIDOC-HEALTHCARE-WEBSITE ``` -4. **Create a new branch** - Create a new branch for your changes. Run the following command in your terminal: +4. **Create a new branch:** + Create a new branch for your changes. Run the following command in your terminal. ```bash git checkout -b ``` - -5. **Make the desired changes** +5. **Make the desired changes:** Make the desired changes to the source code. -6. **Add your changes** - Add your changes to the staging area. Run the following command in your terminal: +6. **Add your changes:** + Add your changes to the staging area. Run the following command in your terminal. ```bash git add ... ``` - -7. **Commit your changes** - Commit your changes with a meaningful commit message. Run the following command in your terminal: +7. **Commit your changes:** + Commit your changes with a meaningful commit message. Run the following command in your terminal. ```bash git commit -m "" ``` - -8. **Push your changes** - Push your changes to your forked repository. Run the following command in your terminal: +8. **Push your changes:** + Push your changes to your forked repository. Run the following command in your terminal ```bash git push origin ``` - -9. **Create a Pull Request:-** +9. **Create a Pull Request:** Go to the GitHub page of your forked repository. You should see a prompt to create a pull request (PR). Click on it, compare the changes, and create the PR. +
+ +
+

To run the project locally in your System

+
- -To run the project locally in your System -1. *Fork the Repository* +1. _Fork the Repository:_ Click on the "Fork" button on the repository's GitHub page to create a copy of the repository in your GitHub account. ![Screenshot (127)](https://github.com/Anishkagupta04/RAPIDOC-HEALTHCARE-WEBSITE-/assets/105973197/164ba1a7-d42e-4e4d-acbd-4bc81cf387d5) ![Screenshot (128)](https://github.com/Anishkagupta04/RAPIDOC-HEALTHCARE-WEBSITE-/assets/105973197/21a47905-69ee-448f-a5c0-71ceb3c694d5) -2. *Clone the repository* - Clone the forked repository to your local machine using the following command in your terminal: +2. _Clone the repository:_ + Clone the forked repository to your local machine using the following command in your terminal. + ```bash git clone https://github.com//RAPIDOC-HEALTHCARE-WEBSITE - + ``` ![Screenshot (129)](https://github.com/Anishkagupta04/RAPIDOC-HEALTHCARE-WEBSITE-/assets/105973197/88249cc4-5849-4472-b190-9d9bad2bb236) -3. *Open the project in VS Code* - click on the open with vs code button , to make changes to the code using the text editor +3. _Open the project in VS Code:_ + Click on the open with vs code button , to make changes to the code using the text editor. ![Screenshot (130)](https://github.com/Anishkagupta04/RAPIDOC-HEALTHCARE-WEBSITE-/assets/105973197/10644887-eb4b-4471-98bb-26e0b1bb4f07) -4. *Clearly read the contribution guidelines* - Make sure to follow the guidelines to contribute to this project - - ![Screenshot (131)](https://github.com/Anishkagupta04/RAPIDOC-HEALTHCARE-WEBSITE-/assets/105973197/342c364a-d908-48a4-9d12-2552298d87bd) - - -5. *Find the Index.html file* +4. _Find the Index.html file:_ Right click the file mentioned and click on "Open with Live Server" This will redirect to the web-browser and load the landing page of the project ![Screenshot (133)](https://github.com/Anishkagupta04/RAPIDOC-HEALTHCARE-WEBSITE-/assets/105973197/62044e1a-a644-467d-98ac-eabfac970ed9) +
+
+ +
+

:sparkles:Contribution Guidelines:

+ + + * **Checkout and make your changes for the develop branch only:** When working on your contributions, switch to the **develop** branch in your local repository. This ensures that you are working on the latest version of the codebase. -To contribute to the RAPIDOC-HEALTHCARE-WEBSITE repository using GitHub Desktop, follow these steps: -1. **Clone the repository** - Open GitHub Desktop and log in to your GitHub account. Go to the "File" menu and select "Clone Repository." Select the RAPIDOC-HEALTHCARE-WEBSITE repository from the list and choose a local path to clone the repository. +* **Create pull requests only for the develop branch:** When you are ready to submit your changes, create a pull request (PR) targeting the **develop** branch. This allows the maintainers to review and merge your code into the main development branch. -2. **Switch to the correct branch** - Once the repository is cloned, make sure you are on the correct branch where you want to make your changes. You can switch branches using the "Branch" menu in GitHub Desktop. +* **Maintain contribution guidelines:** Each project may have its specific contribution guidelines. It's important to familiarize yourself with these guidelines before submitting your contributions. Adhering to these guidelines ensures consistency and helps maintain the quality of the codebase. -3. **Make and commit changes** - Make the desired changes to the code in your local repository. After making changes, stage them by clicking the "+" button next to the changed files. Enter a commit message describing your changes and click the "Commit" button. +* **Format your commit message with the issue number:** When making commits related to an issue, follow the format **Fixes: #32 in your commit message. Replace 32 with the issue number you are addressing.** This helps track and manage issues more efficiently. -4. **Push changes to GitHub** - After committing your changes, push them to your fork of the repository on GitHub. Click the "Push origin" button in GitHub Desktop to push your changes. +* **Attach a Postman response screenshot for backend tasks:** For tasks related to the backend, it is recommended to include a screenshot of the Postman response along with your pull request. This provides additional context and helps reviewers understand the changes made and their impact on the backend functionality. -5. **Create a pull request** - Go to your fork of the RAPIDOC-HEALTHCARE-WEBSITE repository on the GitHub website. You should see a notification that your branch is ahead of the original repository. Click on the "Compare & pull request" button to create a pull request for your changes. +* **Make your pull request descriptive and include examples:** When creating a pull request, provide a clear and descriptive explanation of the changes you made. This helps reviewers understand the purpose and significance of your contribution. Additionally, including at least one example that demonstrates the intended usage or effect of your changes can be beneficial. -6. **Review and submit the pull request** - On the pull request page, review your changes and add a title and description for your pull request. Once you're satisfied with your changes, click the "Create pull request" button to submit your pull request. +* **Rebase your commits and optimize file changes:** When submitting your pull request, consider rebasing your commits into one commit and optimizing your file changes. This helps keep the commit history clean and makes it easier for reviewers to understand your changes. -If you find this project helpful, please consider giving it a star! ⭐️ +Remember, following these guidelines will help ensure a smooth and efficient contribution process. Happy coding! -### Contributing +
-We love your input! We want to make contributing to this project as easy and transparent as possible, whether it's: -- Reporting a bug -- Discussing the current state of the code -- Submitting a fix -- Proposing new features +
+
- -

Our Contributors ❀️

-
-

Thank you for contributing to our repository

+

Code of Conduct:

+
+ +Please note that this project is released with a [Contributor Code of Conduct](./CODE_OF_CONDUCT.md). By participating in this project you agree to abide by its terms. +
+ +## ✍️ Feedback and Support: + +

We love your input! We want to make contributing to this project as easy and transparent as possible, whether it's. + +To contribute to the RAPIDOC-HEALTHCARE-WEBSITE repository using GitHub Desktop, follow these steps: + + Reporting a bug
+Discussing the current state of the code
+Submitting a fix
+Proposing new features + +


+ +
+

Our Contributors Red Heart

+

Thank you for contributing to our repository

-![Contributors](https://contrib.rocks/image?repo=Anishkagupta04/RAPIDOC-HEALTHCARE-WEBSITE-) + + -### Show some ❀️ by starring this awesome repository! + + +

Show some Red Heart by starring this awesome repository!

- +
+
+

Support

+
+ +
+ Don't forget to leave a star for this project! +

+Go to Top diff --git a/ReadMe.txt b/ReadMe.txt deleted file mode 100644 index 6b2126bd..00000000 --- a/ReadMe.txt +++ /dev/null @@ -1,2 +0,0 @@ -This project is a Front End representation prototype of RapiDoc. -Some features might not work without internet while testing. \ No newline at end of file diff --git a/about.html b/about.html new file mode 100644 index 00000000..664abd7c --- /dev/null +++ b/about.html @@ -0,0 +1,757 @@ + + + + + + + + + + + + + + + + + + + + + + + + + RapiDoc + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

+

p + +

p + +

p + +

+

+

+

+

+
+ + +

About SwapReads

+

+ + +

About RapiDoc

+

+ RapiDoc is an innovative healthcare platform designed to streamline and enhance the medical experience for both patients and healthcare providers. + Our mission is to make quality healthcare more accessible, efficient, and user-friendly through the power of technology. + RapiDoc offers a range of services including online appointment booking, telemedicine consultations, digital health records management, and a comprehensive patient portal. + We connect patients with a network of qualified healthcare professionals across various specialties, ensuring timely and appropriate care. + Our platform also features educational resources, health tracking tools, and personalized health recommendations to empower users in managing their well-being. + By leveraging cutting-edge technology and a user-centric approach, RapiDoc aims to revolutionize healthcare delivery, making it more responsive to the needs of modern patients while supporting healthcare providers in delivering optimal care.

+
+
+
+

Our Stats

+
+
+

0

+

Checkups Available

+
+
+

0

+

Genres Covered

+
+
+

0

+

Happy Patients

+
+
+
+ +
+
+

Meet Our Team

+ +
+ +
+

Our Contributors

+
+ +
+ +
+ + +
+ + + +
+ + +
+ + + + \ No newline at end of file diff --git a/appointment.html b/appointment.html new file mode 100644 index 00000000..9bd6440b --- /dev/null +++ b/appointment.html @@ -0,0 +1,190 @@ + + + + + + RapiDoc + + + + +
+
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ + +
+ + + + + diff --git a/aptmnt.html b/aptmnt.html new file mode 100644 index 00000000..ecdf4b42 --- /dev/null +++ b/aptmnt.html @@ -0,0 +1,178 @@ + + + + + + RapiDoc + + + + +
+
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+ + +
+ + + diff --git a/assets/DbSchema101.png b/assets/DbSchema101.png new file mode 100644 index 00000000..058942de Binary files /dev/null and b/assets/DbSchema101.png differ diff --git a/assets/css/styles.css b/assets/css/styles.css new file mode 100644 index 00000000..d496a529 --- /dev/null +++ b/assets/css/styles.css @@ -0,0 +1,916 @@ +/*=============== GOOGLE FONTS ===============*/ +@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap"); +/*=============== VARIABLES CSS ===============*/ +:root { + --header-height: 3rem; + /*========== Colors ==========*/ + --hue: 45; + --sat: 98%; + --first-color: #4bb6b7; + --first-color-light: hsl(var(--hue), var(--sat), 85%); + --first-color-lighten: #4bb6b7; + --first-color-alt: hsl(var(--hue), var(--sat), 53%); + --title-color: hsl(var(--hue), 4%, 65%); + --text-color: hsl(var(--hue), 4%, 65%); + --text-color-light: hsl(var(--hue), 4%, 65%); + --body-color: hsl(var(--hue), 0%, 100%); + --container-color: #FFF; + --scroll-bar-color: hsl(var(--hue), 4%, 85%); + --scroll-thumb-color: hsl(var(--hue), 4%, 75%); + /*========== Font and typography ==========*/ + --body-font: 'Poppins', sans-serif; + --biggest-font-size: 2rem; + --h2-font-size: 1.25rem; + --h3-font-size: 1.125rem; + --normal-font-size: .938rem; + --small-font-size: .813rem; + --smaller-font-size: .75rem; + /*========== Font weight ==========*/ + --font-semi-bold: 600; + --font-bold: 700; + /*========== Margenes ==========*/ + --mb-0-5: .5rem; + --mb-0-75: .75rem; + --mb-1: 1rem; + --mb-1-5: 1.5rem; + --mb-2: 2rem; + /*========== z index ==========*/ + --z-tooltip: 10; + --z-fixed: 100; +} + +@media screen and (min-width: 968px) { + :root { + --biggest-font-size: 3rem; + --h2-font-size: 1.75rem; + --h3-font-size: 1.25rem; + --normal-font-size: 1rem; + --small-font-size: .875rem; + --smaller-font-size: .813rem; + } +} + +/*=============== BASE ===============*/ +*, ::before, ::after { + box-sizing: border-box; + padding: 0; + margin: 0; +} + +html { + scroll-behavior: smooth; +} + +body { + margin: var(--header-height) 0 0 0; + font-family: var(--body-font); + font-size: var(--normal-font-size); + background-color: var(--body-color); + color: var(--text-color); + transition: .5s; +} + +h1, h2, h3 { + font-weight: var(--font-semi-bold); + color: white; + line-height: 1.5; + +} + +ul { + list-style: none; +} + +a { + text-decoration: none; +} + +img { + max-width: 100%; + height: auto; + padding: 0px; + padding-top: 100px; + padding-bottom: 100px; +} + +/*=============== THEME ===============*/ +/*========== Variables Dark theme ==========*/ +body.dark-theme { + --first-color-light: hsl(var(--hue), var(--sat), 75%); + --title-color: hsl(var(--hue), 4%, 95%); + --text-color: hsl(var(--hue), 4%, 80%); + --body-color: hsl(var(--hue), 8%, 13%); + --container-color: hsl(var(--hue), 8%, 16%); + --scroll-bar-color: hsl(var(--hue), 4%, 32%); + --scroll-thumb-color: hsl(var(--hue), 4%, 24%); +} + +/*========== Button Dark/Light ==========*/ +.change-theme { + position: absolute; + right: 1.5rem; + top: 2.2rem; + color: var(--title-color); + font-size: 1.8rem; + cursor: pointer; +} + +.dark-theme .footer { + background-color: var(--container-color); +} + +/*=============== REUSABLE CSS CLASSES ===============*/ +.section { + padding: 4.5rem 0 1rem; +} + +.section__title, .section__title-center { + font-size: var(--h2-font-size); + color: rgb(255, 255, 255); + text-align: center; + margin-bottom: var(--mb-1); + padding-left: 0px; +} + +.svg__color { + fill: var(--first-color); +} + +.svg__blob { + fill: var(--first-color-light); +} + +.svg__img { + width: 300px; + justify-self: center; +} + +/*=============== LAYOUT ===============*/ +.container { + max-width: 968px; + margin-left: var(--mb-1-5); + margin-right: var(--mb-1-5); +} + +.grid { + display: grid; + gap: 1.5rem; +} + +/*=============== HEADER ===============*/ +.header { + width: 100%; + background-color: var(--body-color); + + top: 0; + left: 0; + z-index: var(--z-fixed); + transition: .5s; +} +.header img { + width: 100px; /* Adjust the width as needed */ + height: 100px; + margin-left: 1px; /* Adjust the margin as needed */ +} + +/*=============== NAV ===============*/ +.nav { + height: var(--header-height); + display: flex; + justify-content: space-between; + align-items: center; + padding-bottom: 200px; +} + +@media screen and (max-width: 767px) { + .nav__menu { + position: fixed; + background-color: var(--container-color); + box-shadow: 0 0 4px rgba(0, 0, 0, 0.1); + padding: 2.5rem 0; + width: 90%; + top: -100%; + left: 0; + right: 0; + margin: 0 auto; + transition: .4s; + border-radius: 2rem; + z-index: var(--z-fixed); + padding-bottom: 100px; + } +} + +.nav__list { + display: flex; + flex-direction: column; + align-items: center; + row-gap: 1.5rem; +} + +.nav__link, .nav__logo, .nav__toggle { + color: var(--title-color); + font-weight: var(--font-semi-bold); +} + +.nav__toggle { + font-size: 1.3rem; + cursor: pointer; +} + +/* Show menu */ +.show-menu { + top: calc(var(--header-height) + 1rem); +} + +/* Active link */ +.active-link { + position: relative; +} + +.active-link::before { + content: ''; + position: absolute; + bottom: -.75rem; + left: 45%; + width: 5px; + height: 5px; + background-color: var(--title-color); + border-radius: 50%; +} + +/* Change background header */ +.scroll-header { + box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1); +} + +/*=============== HOME ===============*/ +.home__container { + row-gap: 3rem; +} + +.home__title { + font-size: var(--biggest-font-size); + font-weight: var(--font-bold); + margin-bottom: var(--mb-0-75); + padding-left: 100px; +} + +.home__description { + margin-bottom: var(--mb-2); + padding-left: 100px; + +} +.home img { + max-width: 100%; + height: auto; + margin-left: 500px; + margin-top: -350px; + padding-top: 100px; + display: flex; + padding-left: 250px; +} +/*=============== BUTTONS ===============*/ +.button { + display: inline-block; + background-color: var(--first-color); + color: #1A1A1A; + padding: .75rem 1.5rem; + border-radius: 3rem; + font-weight: var(--font-semi-bold); + transition: .3s; + margin-top: 50px; + margin-left: 300px; + +} + +.button:hover { + background-color: #55a5ea; + color:black; +} + +.button__header { + display: none; +} + +.button-link { + background: none; + padding: 0; + color: white; +} + +.button-link:hover { + color:#022a2d; ; +} + +.button-flex { + display: inline-flex; + align-items: center; + column-gap: .25rem; + padding: .75rem 1rem; +} + +.button__icon { + font-size: 1.5rem; +} + +/*=============== ABOUT ===============*/ +.about__container { + gap: 2.5rem; +} + +.about__data { + text-align: justify; + padding-left: 100px; +} +.about img { + max-width: 100%; + height: auto; + margin-left: 0px; + margin-top: 100px; + padding-left: 0px; +} + +/*=============== SECURITY ===============*/ +.security__container { + gap: 2.5rem; +} + +.security__data { + text-align: justify; + padding-left: 100px; + + +} +.security img{ + padding-left: 0px; +} + +/*=============== SERVICES ===============*/ +.services__container { + padding-top: 1rem; +} +.service__container grid:hover{ + background-color: rgb(0, 98, 255); + +} + +.services__data { + display: flex; + flex-direction: column; + align-items: center; + row-gap: 1rem; + background-color: #022a2d; + box-shadow: 0px 2px 6px hsla(var(--hue), 100%, 15%, 0.15); + padding: 2rem 1.5rem; + border-radius: 1rem; + position:relative; + width: 100%; + height: auto; + text-align: justify; + +} +.services__data img { + max-width: 100%; + height: auto; +} +.services__data:hover{ + background-color: #55a5ea +} + +.services__img { + width: 100%; + height: 100%; + justify-self: center; + margin-bottom: var(--mb-0-5); + object-fit: cover; + display: block; + padding-top: 100px; +} + + + + + +/*=============== APP ===============*/ +.app__container { + gap: 2.5rem; +} + +.app__data { + text-align: center; +} + +.app__description { + margin-bottom: var(--mb-1-5); + padding-left: 100px; +} + +.app__buttons { + display: grid; + grid-template-columns: repeat(2, max-content); + justify-content: center; + gap: .5rem; + padding-left: 100px; +} +.section__title-center{ + padding-left: 100px; +} + +/*=============== CONTACT ===============*/ +.contact__container { + padding-bottom: 3rem; +} + +.contact__description { + text-align: center; +} + +.contact__content { + row-gap: .75rem; +} + +.contact__address { + font-size: var(--small-font-size); + font-weight: var(--font-semi-bold); + color: var(--title-color); +} + +.contact__information { + font-weight: initial; + color: var(--text-color); +} + +/*=============== FOOTER ===============*/ +.footer { + background-color: var(--first-color-lighten); + padding-bottom: 2rem; + padding-top: 100px; +} + +.footer__container { + row-gap: 2rem; + padding-top: 100px; +} + +.footer__logo, .footer__title { + font-size: var(--h3-font-size); + margin-bottom: var(--mb-0-75); +} + +.footer__logo { + display: inline-block; + font-weight: var(--font-semi-bold); + color: var(--title-color); +} + +.footer__description, .footer__link { + font-size: var(--small-font-size); +} + +.footer__links { + display: grid; + row-gap: .5rem; +} +.footer__link:hover{ + text-decoration: underline; + color: #0a71f7; +} +.footer__link { + color: var(--title-color); +} + +.footer__social { + display: flex; + column-gap: 1.5rem; +} + +.footer__social-link { + font-size: 1.25rem; + color: var(--title-color); +} + +.footer__copy { + margin-top: 6rem; + text-align: center; + font-size: var(--smaller-font-size); + color: var(--text-color); +} + +/*=============== SCROLL UP ===============*/ +.scrollup { + position: fixed; + background: var(--first-color); + right: 1rem; + bottom: -20%; + display: inline-flex; + padding: .3rem; + border-radius: .25rem; + z-index: var(--z-tooltip); + opacity: .8; + transition: .4s; +} + +.scrollup:hover { + background-color: var(--first-color); + opacity: 1; +} + +.scrollup__icon { + font-size: 1.25rem; + color: var(--title-color); +} + +/* Show Scroll Up*/ +.show-scroll { + bottom: 3rem; +} + +/*=============== SCROLL BAR ===============*/ +::-webkit-scrollbar { + width: .6rem; + border-radius: .5rem; + background-color: var(--scroll-bar-color); +} + +::-webkit-scrollbar-thumb { + background-color: var(--scroll-thumb-color); + border-radius: .5rem; +} + +::-webkit-scrollbar-thumb:hover { + background-color: var(--text-color-light); +} + +/*=============== MEDIA QUERIES ===============*/ +/* For small devices */ +@media screen and (max-width: 360px) { + .svg__img { + width: 100%; + } + .section { + padding: 3.5rem 0 1rem; + } + .services__img { + width: 100px; + } + .app__buttons { + grid-template-columns: max-content; + } +} + +/* For medium devices */ +@media screen and (min-width: 576px) { + .svg__img { + width: 100%; + } + .section__title-center { + text-align: initial; + } + .home__container, + .about__container, + .security__container, + .services__container, + .app__container, + .contact__container, + .footer__container { + grid-template-columns: repeat(2, 1fr); + } + .home__img { + order: 1; + } + .home__container, + .about__container, + .security__container, + .app__container, + .contact__container { + align-items: center; + } + .about__data, + .security__data, + .app__data, + .contact__description { + text-align: initial; + } + .about__img, + .app__img { + order: -1; + } +} + +@media screen and (min-width: 767px) { + body { + margin: 0; + } + .section { + padding: 6rem 0 2rem; + } + .nav { + height: calc(var(--header-height) + 1.5rem); + } + .nav__list { + flex-direction: row; + column-gap: 2.5rem; + } + .nav__toggle { + display: none; + } + .change-theme { + position: initial; + } + .home__container { + padding: 6rem 0 2rem; + } + .app__buttons { + justify-content: initial; + } +} + +/* For large devices */ +@media screen and (min-width: 968px) { + .button__header { + display: block; + } + .svg__img { + width: 470px; + } + .about__container, + .security__container, + .app__container, + .contact__container { + column-gap: 6rem; + } + .services__container { + grid-template-columns: repeat(3, 1fr); + } + .contact__container { + grid-template-columns: 3fr 1.5fr 1.25fr; + } + .footer__container { + grid-template-columns: repeat(5, 1fr); + } + .footer__social { + align-items: flex-start; + } + .footer__social-link { + font-size: 1.45rem; + } +} + +@media screen and (min-width: 1024px) { + .container { + margin-left: auto; + margin-right: auto; + } + .home__img { + width: 540px; + } + .home__description { + padding-right: 5rem; + } + .footer__container { + column-gap: 3rem; + } + .scrollup { + right: 2rem; + } +} +body { + font-family: "Open Sans", sans-serif; + color: #fff; + background-color: #000; +} + +a { + color: #ffffff; + text-decoration: none; +} + +a:hover { + color: #55a5ea; + text-decoration: none; +} + +h1, +h2, +h3, +h4, +h5, +h6 { + font-family: "Raleway", sans-serif; +} + +.nav_link li { + margin-right: 1px; + /* Add space between items */ + padding: 5px 10px; + display: inline-block; + color: white; +} + +.nav_link li a { + transition: all 0.3s ease 0s; + color: white; +} + +.nav_link li a:hover { + color: #55a5ea; +} + +#header { + position: relative; + top: 12px; +} + +.header_container { + background-color: #022a2d; + display: flex; + flex-direction: row; + justify-content: space-between; + align-items: center; + position: fixed; + width: 100%; + height: 85px; + margin: auto; + margin-top: 0px; + /* Adjust this value to move the header down */ + padding-top: 15px; + z-index: 555; +} +.footer { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + max-width: 1280px; + width: 95%; + background: #3fbcc051; + border-radius: 6px; +} + +.footer .footer-row { + display: flex; + flex-wrap: wrap; + justify-content: space-between; + gap: 3.5rem; + padding: 60px; +} + +.footer-row .footer-col h4 { + color: #f0f0f0; + font-size: 1.2rem; + font-weight: 400; +} + +.footer-col .links { + margin-top: 20px; +} + +.footer-col .links li { + list-style: none; + margin-bottom: 10px; +} + +.footer-col .links li a { + text-decoration: none; + color: #bfbfbf; +} + +.footer-col .links li a:hover { + color: #fff; +} + +.footer-col p { + margin: 20px 0; + color: #bfbfbf; + max-width: 300px; +} + +.footer-col form { + display: flex; + gap: 5px; +} + +.footer-col input { + height: 40px; + border-radius: 6px; + background: none; + width: 100%; + outline: none; + border: 1px solid #7489c6; + caret-color: #fff; + color: #fff; + padding-left: 10px; +} + +.footer-col input::placeholder { + color: #ccc; +} + +.footer-col form button { + background: #fff; + border: none; + color: #08434551; + padding: 10px 15px; + border-radius: 6px; + cursor: pointer; + font-weight: 1000; + transition: 0.2s ease; +} + +.footer-col form button:hover { + background: #cecccc; +} + +@media (max-width: 768px) { + .footer { + position: relative; + bottom: 0; + left: 0; + transform: none; + width: 100%; + border-radius: 0; + } + + .footer .footer-row { + padding: 20px; + gap: 1rem; + } + + .footer-col form { + display: block; + } + + .footer-col form :where(input, button) { + width: 100%; + } + + .footer-col form button { + margin: 10px 0 0 0; + } +} + +/*################----Back to top----################*/ +footer { + position: relative; + padding: 50px 0; +} + +#back-to-top-container { + position: fixed; + bottom: 15px; + right: 77px; + cursor: pointer; + z-index: 1000; +} + +.circle { + border-radius: 50%; + background-color: #fff; + display: flex; + justify-content: center; + align-items: center; + transition: background-color 0.3s; +} + +#back-to-top { + width: 55px; + height: 55px; + fill: hwb(181 16% 46%); + color: hwb(181 11% 13%); + transition: fill 0.3s; +} + +#back-to-top:hover { + transform: scale(1.1); +} + + +@media (max-width: 768px) { + #back-to-top-container { + right: 15px; + } + .app__container{ + display: flex !important; + flex-direction: column !important; + align-items: center !important; + justify-content: center !important; + + } + .app__buttons{ + display: flex !important; + flex-direction: column !important; + align-items: center !important; + + + } + + .app__buttons button{ + margin: 10px 0 !important; + } + .app__buttons button:hover{ + background-color: #55a5ea !important; + color: black !important; + } + + +} \ No newline at end of file diff --git a/assets/css/visitors.css b/assets/css/visitors.css new file mode 100644 index 00000000..d72f85cd --- /dev/null +++ b/assets/css/visitors.css @@ -0,0 +1,52 @@ +.visitor-counter { + position: fixed; + top: 580px; + left: 100px; + background-color: #3fbcc0; + height: 100px; + width: 100px; + color: white; + font-weight: 700; + font-size: 18px; + text-align: center; + display: flex; + flex-direction: column; + justify-content: center; + border-radius: 200px; + backdrop-filter: blur(5px); + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1), + 0 1px 3px rgba(0, 0, 0, 0.08); + z-index: 998; +} + +.visitor-counter div:first-child { + margin-bottom: 5px; +} + +.website-counter { + font-size: 24px; +} + +@media screen and (max-width: 768px) { + .visitor-counter { + height: 100px; + width: 100px; + font-size: 16px; + } + + .website-counter { + font-size: 20px; + } +} + +@media screen and (max-width: 480px) { + .visitor-counter { + height: 80px; + width: 80px; + font-size: 14px; + } + + .website-counter { + font-size: 18px; + } +} \ No newline at end of file diff --git a/assets/img/1m.jpg b/assets/img/1m.jpg new file mode 100644 index 00000000..156a2030 Binary files /dev/null and b/assets/img/1m.jpg differ diff --git a/assets/img/AI.jpg b/assets/img/AI.jpg new file mode 100644 index 00000000..c543106e Binary files /dev/null and b/assets/img/AI.jpg differ diff --git a/assets/img/AI2.jpg b/assets/img/AI2.jpg new file mode 100644 index 00000000..9d300fa6 Binary files /dev/null and b/assets/img/AI2.jpg differ diff --git a/assets/img/about.png b/assets/img/about.png new file mode 100644 index 00000000..49154b60 Binary files /dev/null and b/assets/img/about.png differ diff --git a/assets/img/consul.jpg b/assets/img/consul.jpg new file mode 100644 index 00000000..94034b67 Binary files /dev/null and b/assets/img/consul.jpg differ diff --git a/assets/img/delivery.jpg b/assets/img/delivery.jpg new file mode 100644 index 00000000..ec0d6fe5 Binary files /dev/null and b/assets/img/delivery.jpg differ diff --git a/assets/img/doc.jpg b/assets/img/doc.jpg new file mode 100644 index 00000000..991a9a0f Binary files /dev/null and b/assets/img/doc.jpg differ diff --git a/assets/img/doctor.jpg b/assets/img/doctor.jpg new file mode 100644 index 00000000..1fe85909 Binary files /dev/null and b/assets/img/doctor.jpg differ diff --git a/assets/img/favi-Appoint.png b/assets/img/favi-Appoint.png new file mode 100644 index 00000000..0e6f5a68 Binary files /dev/null and b/assets/img/favi-Appoint.png differ diff --git a/assets/img/general.jpg b/assets/img/general.jpg new file mode 100644 index 00000000..11fdea17 Binary files /dev/null and b/assets/img/general.jpg differ diff --git a/assets/img/mentalc.jpg b/assets/img/mentalc.jpg new file mode 100644 index 00000000..250264ef Binary files /dev/null and b/assets/img/mentalc.jpg differ diff --git a/assets/img/partner.jpeg b/assets/img/partner.jpeg new file mode 100644 index 00000000..8b78abce Binary files /dev/null and b/assets/img/partner.jpeg differ diff --git a/assets/img/pediatric.jpg b/assets/img/pediatric.jpg new file mode 100644 index 00000000..7c18ef7f Binary files /dev/null and b/assets/img/pediatric.jpg differ diff --git a/assets/img/personalised.webp b/assets/img/personalised.webp new file mode 100644 index 00000000..5007700d Binary files /dev/null and b/assets/img/personalised.webp differ diff --git a/assets/img/pill1.jpg b/assets/img/pill1.jpg new file mode 100644 index 00000000..5fe97588 Binary files /dev/null and b/assets/img/pill1.jpg differ diff --git a/assets/img/pill2.jpg b/assets/img/pill2.jpg new file mode 100644 index 00000000..42a0e1e9 Binary files /dev/null and b/assets/img/pill2.jpg differ diff --git a/assets/img/pill3.jpg b/assets/img/pill3.jpg new file mode 100644 index 00000000..1a5bf98f Binary files /dev/null and b/assets/img/pill3.jpg differ diff --git a/assets/img/pill4.jpg b/assets/img/pill4.jpg new file mode 100644 index 00000000..d8006db1 Binary files /dev/null and b/assets/img/pill4.jpg differ diff --git a/assets/img/pill5.jpg b/assets/img/pill5.jpg new file mode 100644 index 00000000..2c269bf4 Binary files /dev/null and b/assets/img/pill5.jpg differ diff --git a/assets/img/pill6.jpg b/assets/img/pill6.jpg new file mode 100644 index 00000000..a330bebd Binary files /dev/null and b/assets/img/pill6.jpg differ diff --git a/assets/img/rd.png b/assets/img/rd.png new file mode 100644 index 00000000..885be48c Binary files /dev/null and b/assets/img/rd.png differ diff --git a/assets/img/rd1.png b/assets/img/rd1.png new file mode 100644 index 00000000..b504bf24 Binary files /dev/null and b/assets/img/rd1.png differ diff --git a/assets/img/researcher.webp b/assets/img/researcher.webp new file mode 100644 index 00000000..19217f91 Binary files /dev/null and b/assets/img/researcher.webp differ diff --git a/assets/img/s1.jpg b/assets/img/s1.jpg new file mode 100644 index 00000000..25e2914f Binary files /dev/null and b/assets/img/s1.jpg differ diff --git a/assets/img/s2.jpg b/assets/img/s2.jpg new file mode 100644 index 00000000..3aa07e95 Binary files /dev/null and b/assets/img/s2.jpg differ diff --git a/assets/img/s3.jpg b/assets/img/s3.jpg new file mode 100644 index 00000000..83680b42 Binary files /dev/null and b/assets/img/s3.jpg differ diff --git a/assets/img/sec.png b/assets/img/sec.png new file mode 100644 index 00000000..fd83ea5d Binary files /dev/null and b/assets/img/sec.png differ diff --git a/assets/img/senior.jpg b/assets/img/senior.jpg new file mode 100644 index 00000000..1e3aa1e7 Binary files /dev/null and b/assets/img/senior.jpg differ diff --git a/assets/img/tele.jpg b/assets/img/tele.jpg new file mode 100644 index 00000000..1c30788d Binary files /dev/null and b/assets/img/tele.jpg differ diff --git a/assets/img/telemedicine.jpg b/assets/img/telemedicine.jpg new file mode 100644 index 00000000..a087b61f Binary files /dev/null and b/assets/img/telemedicine.jpg differ diff --git a/assets/img/test.jpg b/assets/img/test.jpg new file mode 100644 index 00000000..94e1d769 Binary files /dev/null and b/assets/img/test.jpg differ diff --git a/assets/img/women.jpg b/assets/img/women.jpg new file mode 100644 index 00000000..fb712a0f Binary files /dev/null and b/assets/img/women.jpg differ diff --git a/assets/js/main.js b/assets/js/main.js new file mode 100644 index 00000000..3557fec5 --- /dev/null +++ b/assets/js/main.js @@ -0,0 +1,90 @@ +/*=============== SHOW MENU ===============*/ +const showMenu = (toggleId, navId) =>{ + const toggle = document.getElementById(toggleId), + nav = document.getElementById(navId) + + // Validate that variables exist + if(toggle && nav){ + toggle.addEventListener('click', ()=>{ + // We add the show-menu class to the div tag with the nav__menu class + nav.classList.toggle('show-menu') + }) + } +} +showMenu('nav-toggle','nav-menu') + +/*=============== REMOVE MENU MOBILE ===============*/ +const navLink = document.querySelectorAll('.nav__link') + +function linkAction(){ + const navMenu = document.getElementById('nav-menu') + // When we click on each nav__link, we remove the show-menu class + navMenu.classList.remove('show-menu') +} +navLink.forEach(n => n.addEventListener('click', linkAction)) + +/*=============== SCROLL SECTIONS ACTIVE LINK ===============*/ +const sections = document.querySelectorAll('section[id]') + +function scrollActive(){ + const scrollY = window.pageYOffset + + sections.forEach(current =>{ + const sectionHeight = current.offsetHeight, + sectionTop = current.offsetTop - 50, + sectionId = current.getAttribute('id') + + if(scrollY > sectionTop && scrollY <= sectionTop + sectionHeight){ + document.querySelector('.nav__menu a[href*=' + sectionId + ']').classList.add('active-link') + }else{ + document.querySelector('.nav__menu a[href*=' + sectionId + ']').classList.remove('active-link') + } + }) +} +window.addEventListener('scroll', scrollActive) + +/*=============== CHANGE BACKGROUND HEADER ===============*/ +function scrollHeader(){ + const nav = document.getElementById('header') + // When the scroll is greater than 80 viewport height, add the scroll-header class to the header tag + if(this.scrollY >= 80) nav.classList.add('scroll-header'); else nav.classList.remove('scroll-header') +} +window.addEventListener('scroll', scrollHeader) + +/*=============== SHOW SCROLL UP ===============*/ +function scrollUp(){ + const scrollUp = document.getElementById('scroll-up'); + // When the scroll is higher than 560 viewport height, add the show-scroll class to the a tag with the scroll-top class + if(this.scrollY >= 560) scrollUp.classList.add('show-scroll'); else scrollUp.classList.remove('show-scroll') +} +window.addEventListener('scroll', scrollUp) + +/*=============== DARK LIGHT THEME ===============*/ +const themeButton = document.getElementById('theme-button') +const darkTheme = 'dark-theme' +const iconTheme = 'bx-toggle-right' + +// Previously selected topic (if user selected) +const selectedTheme = localStorage.getItem('selected-theme') +const selectedIcon = localStorage.getItem('selected-icon') + +// We obtain the current theme that the interface has by validating the dark-theme class +const getCurrentTheme = () => document.body.classList.contains(darkTheme) ? 'dark' : 'light' +const getCurrentIcon = () => themeButton.classList.contains(iconTheme) ? 'bx-toggle-left' : 'bx-toggle-right' + +// We validate if the user previously chose a topic +if (selectedTheme) { + // If the validation is fulfilled, we ask what the issue was to know if we activated or deactivated the dark + document.body.classList[selectedTheme === 'dark' ? 'add' : 'remove'](darkTheme) + themeButton.classList[selectedIcon === 'bx-toggle-left' ? 'add' : 'remove'](iconTheme) +} + +// Activate / deactivate the theme manually with the button +themeButton.addEventListener('click', () => { + // Add or remove the dark / icon theme + document.body.classList.toggle(darkTheme) + themeButton.classList.toggle(iconTheme) + // We save the theme and the current icon that the user chose + localStorage.setItem('selected-theme', getCurrentTheme()) + localStorage.setItem('selected-icon', getCurrentIcon()) +}) diff --git a/assets/js/visitors.js b/assets/js/visitors.js new file mode 100644 index 00000000..821abf86 --- /dev/null +++ b/assets/js/visitors.js @@ -0,0 +1,17 @@ +function getVisitorCount() { + return localStorage.getItem('visitorCount') || 0; +} + +function incrementVisitorCount() { + let count = parseInt(getVisitorCount()) + 1; + localStorage.setItem('visitorCount', count); + return count; +} + +function displayVisitorCount() { + const counterElement = document.querySelector('.website-counter'); + const count = incrementVisitorCount(); + counterElement.textContent = count; +} + +document.addEventListener('DOMContentLoaded', displayVisitorCount); \ No newline at end of file diff --git a/assets/scss/base/_base.scss b/assets/scss/base/_base.scss new file mode 100644 index 00000000..86458bf7 --- /dev/null +++ b/assets/scss/base/_base.scss @@ -0,0 +1,36 @@ +/*=============== BASE ===============*/ +*,::before,::after{ + box-sizing: border-box; + padding: 0; + margin: 0; +} + +html{ + scroll-behavior: smooth; +} + +body{ + margin: var(--header-height) 0 0 0; + font-family: var(--body-font); + font-size: var(--normal-font-size); + background-color: var(--body-color); + color: var(--text-color); + transition: .5s; // For animation dark mode +} + +h1,h2,h3{ + font-weight: var(--font-semi-bold); + color: var(--title-color); + line-height: 1.5; +} + +ul{ + list-style: none; +} +a{ + text-decoration: none; +} +img{ + max-width: 100%; + height: auto; +} diff --git a/assets/scss/components/_about.scss b/assets/scss/components/_about.scss new file mode 100644 index 00000000..061603ef --- /dev/null +++ b/assets/scss/components/_about.scss @@ -0,0 +1,9 @@ +/*=============== ABOUT ===============*/ +.about{ + &__container{ + gap: 2.5rem; + } + &__data{ + text-align: center; + } +} diff --git a/assets/scss/components/_app.scss b/assets/scss/components/_app.scss new file mode 100644 index 00000000..c43abe37 --- /dev/null +++ b/assets/scss/components/_app.scss @@ -0,0 +1,18 @@ +/*=============== APP ===============*/ +.app{ + &__container{ + gap: 2.5rem; + } + &__data{ + text-align: center; + } + &__description{ + margin-bottom: var(--mb-1-5); + } + &__buttons{ + display: grid; + grid-template-columns: repeat(2, max-content); + justify-content: center; + gap: .5rem + } +} diff --git a/assets/scss/components/_buttons.scss b/assets/scss/components/_buttons.scss new file mode 100644 index 00000000..f5a721da --- /dev/null +++ b/assets/scss/components/_buttons.scss @@ -0,0 +1,39 @@ +/*=============== BUTTONS ===============*/ +.button{ + display: inline-block; + background-color: var(--first-color); + color: #1A1A1A; // Use color black for yellow + padding: .75rem 1.5rem; + border-radius: 3rem; + font-weight: var(--font-semi-bold); + transition: .3s; + + &:hover{ + background-color: var(--first-color-alt); + } + + &__header{ + display: none; + } + + &-link{ + background: none; + padding: 0; + color: var(--title-color); + + &:hover{ + background-color: transparent; + } + } + + &-flex{ + display: inline-flex; + align-items: center; + column-gap: .25rem; + padding: .75rem 1rem; + } + + &__icon{ + font-size: 1.5rem; + } +} diff --git a/assets/scss/components/_contact.scss b/assets/scss/components/_contact.scss new file mode 100644 index 00000000..4567fd94 --- /dev/null +++ b/assets/scss/components/_contact.scss @@ -0,0 +1,21 @@ +/*=============== CONTACT ===============*/ +.contact{ + &__container{ + padding-bottom: 3rem; + } + &__description{ + text-align: center; + } + &__content{ + row-gap: .75rem; + } + &__address{ + font-size: var(--small-font-size); + font-weight: var(--font-semi-bold); + color: var(--title-color); + } + &__information{ + font-weight: initial; + color: var(--text-color); + } +} diff --git a/assets/scss/components/_footer.scss b/assets/scss/components/_footer.scss new file mode 100644 index 00000000..8a4e36d9 --- /dev/null +++ b/assets/scss/components/_footer.scss @@ -0,0 +1,46 @@ +/*=============== FOOTER ===============*/ +.footer{ + background-color: var(--first-color-lighten); + padding-bottom: 2rem; + + &__container{ + row-gap: 2rem; + } + + &__logo, + &__title{ + font-size: var(--h3-font-size); + margin-bottom: var(--mb-0-75); + } + &__logo{ + display: inline-block; + font-weight: var(--font-semi-bold); + color: var(--title-color); + } + &__description, + &__link{ + font-size: var(--small-font-size); + } + &__links{ + display: grid; + row-gap: .5rem; + } + &__link{ + color: var(--title-color); + } + &__social{ + display: flex; + column-gap: 1.5rem; + + &-link{ + font-size: 1.25rem; + color: var(--title-color); + } + } + &__copy{ + margin-top: 6rem; + text-align: center; + font-size: var(--smaller-font-size); + color: var(--text-color); + } +} diff --git a/assets/scss/components/_header.scss b/assets/scss/components/_header.scss new file mode 100644 index 00000000..ebdcaeaf --- /dev/null +++ b/assets/scss/components/_header.scss @@ -0,0 +1,77 @@ +/*=============== HEADER ===============*/ +.header{ + width: 100%; + background-color: var(--body-color); + position: fixed; + top: 0; + left: 0; + z-index: var(--z-fixed); + transition: .5s; // For animation dark mode +} + +/*=============== NAV ===============*/ +.nav{ + height: var(--header-height); + display: flex; + justify-content: space-between; + align-items: center; + + &__menu{ + @media screen and (max-width: 767px){ + position: fixed; + background-color: var(--container-color); + box-shadow: 0 0 4px rgba(0,0,0,.1); + padding: 2.5rem 0; + width: 90%; + top: -100%; + left: 0; + right: 0; + margin: 0 auto; + transition: .4s; + border-radius: 2rem; + z-index: var(--z-fixed); + } + } + &__list{ + display: flex; + flex-direction: column; + align-items: center; + row-gap: 1.5rem; + } + &__link, + &__logo, + &__toggle{ + color: var(--title-color); + font-weight: var(--font-semi-bold); + } + &__toggle{ + font-size: 1.3rem; + cursor: pointer; + } +} + +/* Show menu */ +.show-menu{ + top: calc(var(--header-height) + 1rem); +} + +/* Active link */ +.active-link{ + position: relative; + + &::before{ + content: ''; + position: absolute; + bottom: -.75rem; + left: 45%; + width: 5px; + height: 5px; + background-color: var(--title-color); + border-radius: 50%; + } +} + +/* Change background header */ +.scroll-header{ + box-shadow: 0 1px 4px rgba(0,0,0,.1); +} diff --git a/assets/scss/components/_home.scss b/assets/scss/components/_home.scss new file mode 100644 index 00000000..b936872f --- /dev/null +++ b/assets/scss/components/_home.scss @@ -0,0 +1,14 @@ +/*=============== HOME ===============*/ +.home{ + &__container{ + row-gap: 3rem; + } + &__title{ + font-size: var(--biggest-font-size); + font-weight: var(--font-bold); + margin-bottom: var(--mb-0-75); + } + &__description{ + margin-bottom: var(--mb-2); + } +} diff --git a/assets/scss/components/_mediaqueries.scss b/assets/scss/components/_mediaqueries.scss new file mode 100644 index 00000000..8a9349b2 --- /dev/null +++ b/assets/scss/components/_mediaqueries.scss @@ -0,0 +1,161 @@ +/*=============== MEDIA QUERIES ===============*/ +/* For small devices */ +@media screen and (max-width: 360px){ + .svg__img{ + width: 100%; + } + + .section{ + padding: 3.5rem 0 1rem; + } + + .services__img{ + width: 100px; + } + + .app__buttons{ + grid-template-columns: max-content; + } +} + +/* For medium devices */ +@media screen and (min-width: 576px){ + .svg__img{ + width: 100%; + } + + .section__title-center{ + text-align: initial; + } + + .home__container, + .about__container, + .security__container, + .services__container, + .app__container, + .contact__container, + .footer__container{ + grid-template-columns: repeat(2, 1fr); + } + + .home__img{ + order: 1; + } + + .home__container, + .about__container, + .security__container, + .app__container, + .contact__container{ + align-items: center; + } + + .about__data, + .security__data, + .app__data, + .contact__description{ + text-align: initial; + } + + .about__img, + .app__img{ + order: -1; + } +} + +@media screen and (min-width: 767px){ + body{ + margin: 0; + } + + .section{ + padding: 6rem 0 2rem; + } + + .nav{ + height: calc(var(--header-height) + 1.5rem); + + &__list{ + flex-direction: row; + column-gap: 2.5rem; + } + &__toggle{ + display: none; + } + } + + .change-theme{ + position: initial; + } + + .home__container{ + padding: 6rem 0 2rem; + } + + .app__buttons{ + justify-content: initial; + } +} + +/* For large devices */ +@media screen and (min-width: 968px){ + .button__header{ + display: block; + } + + .svg__img{ + width: 470px; + } + + .about__container, + .security__container, + .app__container, + .contact__container{ + column-gap: 6rem; + } + + .services__container{ + grid-template-columns: repeat(3, 1fr); + } + + .contact__container{ + grid-template-columns: 3fr 1.5fr 1.25fr; + } + + .footer{ + &__container{ + grid-template-columns: repeat(5, 1fr); + } + &__social{ + align-items: flex-start; + + &-link{ + font-size: 1.45rem; + } + } + } +} + +@media screen and (min-width: 1024px){ + .container{ + margin-left: auto; + margin-right: auto; + } + + .home{ + &__img{ + width: 540px; + } + &__description{ + padding-right: 5rem; + } + } + + .footer__container{ + column-gap: 3rem; + } + + .scrollup{ + right: 2rem; + } +} diff --git a/assets/scss/components/_scroll.scss b/assets/scss/components/_scroll.scss new file mode 100644 index 00000000..ec88467e --- /dev/null +++ b/assets/scss/components/_scroll.scss @@ -0,0 +1,44 @@ +/*=============== SCROLL UP ===============*/ +.scrollup{ + position: fixed; + background: var(--first-color); + right: 1rem; + bottom: -20%; + display: inline-flex; + padding: .3rem; + border-radius: .25rem; + z-index: var(--z-tooltip); + opacity: .8; + transition: .4s; + + &:hover{ + background-color: var(--first-color); + opacity: 1; + } + + &__icon{ + font-size: 1.25rem; + color: var(--title-color); + } +} + +/* Show Scroll Up*/ +.show-scroll{ + bottom: 3rem; +} + +/*=============== SCROLL BAR ===============*/ +::-webkit-scrollbar{ + width: .6rem; + border-radius: .5rem; + background-color: var(--scroll-bar-color); + + &-thumb{ + background-color: var(--scroll-thumb-color); + border-radius: .5rem; + + &:hover{ + background-color: var(--text-color-light); + } + } +} diff --git a/assets/scss/components/_security.scss b/assets/scss/components/_security.scss new file mode 100644 index 00000000..1364b8fe --- /dev/null +++ b/assets/scss/components/_security.scss @@ -0,0 +1,9 @@ +/*=============== SECURITY ===============*/ +.security{ + &__container{ + gap: 2.5rem; + } + &__data{ + text-align: center; + } +} diff --git a/assets/scss/components/_services.scss b/assets/scss/components/_services.scss new file mode 100644 index 00000000..74cc90c3 --- /dev/null +++ b/assets/scss/components/_services.scss @@ -0,0 +1,20 @@ +/*=============== SERVICES ===============*/ +.services{ + &__container{ + padding-top: 1rem; + } + &__data{ + display: grid; + row-gap: 1rem; + background-color: var(--container-color); + box-shadow: 0px 2px 6px hsla(var(--hue), 100%, 15%, 0.15); + padding: 2rem 1.5rem; + border-radius: 1rem; + text-align: center; + } + &__img{ + width: 135px; + justify-self: center; + margin-bottom: var(--mb-0-5); + } +} diff --git a/assets/scss/config/_variables.scss b/assets/scss/config/_variables.scss new file mode 100644 index 00000000..669201e1 --- /dev/null +++ b/assets/scss/config/_variables.scss @@ -0,0 +1,58 @@ +/*=============== GOOGLE FONTS ===============*/ +@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap'); + +/*=============== VARIABLES CSS ===============*/ +:root{ + --header-height: 3rem; + + /*========== Colors ==========*/ + --hue: 45; // Yellow: 45 | Red: 4 | Orange: 18 | Green: 118 + --sat: 98%; // Yellow: 98% | Red: 90% | Orange: 85% | Green: 50% + --first-color: hsl(var(--hue), var(--sat), 60%); + --first-color-light: hsl(var(--hue), var(--sat), 85%); + --first-color-lighten: hsl(var(--hue), var(--sat), 80%); + --first-color-alt: hsl(var(--hue), var(--sat), 53%); + --title-color: hsl(var(--hue), 4%, 15%); + --text-color: hsl(var(--hue), 4%, 35%); + --text-color-light: hsl(var(--hue), 4%, 65%); + --body-color: hsl(var(--hue), 0%, 100%); + --container-color: #FFF; + --scroll-bar-color: hsl(var(--hue), 4%, 85%); + --scroll-thumb-color: hsl(var(--hue), 4%, 75%); + + + /*========== Font and typography ==========*/ + --body-font: 'Poppins', sans-serif; + + --biggest-font-size: 2rem; + --h2-font-size: 1.25rem; + --h3-font-size: 1.125rem; + --normal-font-size: .938rem; + --small-font-size: .813rem; + --smaller-font-size: .75rem; + + // Responsive typography + @media screen and (min-width: 968px){ + --biggest-font-size: 3rem; + --h2-font-size: 1.75rem; + --h3-font-size: 1.25rem; + --normal-font-size: 1rem; + --small-font-size: .875rem; + --smaller-font-size: .813rem; + } + + /*========== Font weight ==========*/ + --font-semi-bold: 600; + --font-bold: 700; + + /*========== Margenes ==========*/ + --mb-0-5: .5rem; + --mb-0-75: .75rem; + --mb-1: 1rem; + --mb-1-5: 1.5rem; + --mb-2: 2rem; + + /*========== z index ==========*/ + --z-tooltip: 10; + --z-fixed: 100; +} diff --git a/assets/scss/layout/_layout.scss b/assets/scss/layout/_layout.scss new file mode 100644 index 00000000..b12442fa --- /dev/null +++ b/assets/scss/layout/_layout.scss @@ -0,0 +1,36 @@ +/*=============== REUSABLE CSS CLASSES ===============*/ +.section{ + padding: 4.5rem 0 1rem; + + &__title, &__title-center{ + font-size: var(--h2-font-size); + color: var(--title-color); + text-align: center; + margin-bottom: var(--mb-1); + } +} + +.svg{ + &__color{ + fill: var(--first-color); + } + &__blob{ + fill: var(--first-color-light); + } + &__img{ + width: 300px; + justify-self: center; + } +} + +/*=============== LAYOUT ===============*/ +.container{ + max-width: 968px; + margin-left: var(--mb-1-5); + margin-right: var(--mb-1-5); +} + +.grid{ + display: grid; + gap: 1.5rem; +} diff --git a/assets/scss/styles.scss b/assets/scss/styles.scss new file mode 100644 index 00000000..4919af13 --- /dev/null +++ b/assets/scss/styles.scss @@ -0,0 +1,16 @@ +// Import of partial files +@import 'config/variables'; +@import 'base/base'; +@import 'theme/theme'; +@import 'layout/layout'; +@import 'components/header'; +@import 'components/home'; +@import 'components/buttons'; +@import 'components/about'; +@import 'components/security'; +@import 'components/services'; +@import 'components/app'; +@import 'components/contact'; +@import 'components/footer'; +@import 'components/scroll'; +@import 'components/mediaqueries'; diff --git a/assets/scss/theme/_theme.scss b/assets/scss/theme/_theme.scss new file mode 100644 index 00000000..85540d41 --- /dev/null +++ b/assets/scss/theme/_theme.scss @@ -0,0 +1,25 @@ +/*=============== THEME ===============*/ +/*========== Variables Dark theme ==========*/ +body.dark-theme{ + --first-color-light: hsl(var(--hue), var(--sat), 75%); + --title-color: hsl(var(--hue), 4%, 95%); + --text-color: hsl(var(--hue), 4%, 80%); + --body-color: hsl(var(--hue), 8%, 13%); + --container-color: hsl(var(--hue), 8%, 16%); + --scroll-bar-color: hsl(var(--hue), 4%, 32%); + --scroll-thumb-color: hsl(var(--hue), 4%, 24%); +} + +/*========== Button Dark/Light ==========*/ +.change-theme { + position: absolute; + right: 1.5rem; + top: 2.2rem; + color: var(--title-color); + font-size: 1.8rem; + cursor: pointer; +} + +.dark-theme .footer{ + background-color: var(--container-color); +} diff --git a/checkup.css b/checkup.css new file mode 100644 index 00000000..1067672b --- /dev/null +++ b/checkup.css @@ -0,0 +1,469 @@ +body { + margin: 0; + font-family: Arial, sans-serif; + } + + .nav_menu { + display: flex; + justify-content: space-between; + align-items: center; + padding: 10px; + position: relative; + + } + + .nav_link { + list-style-type: none; + display: flex; + gap: 5px; + align-items: center; + } + + .nav_link li { + display: flex; + align-items: center; + } + + .nav_link a { + color: white; + text-decoration: none; + display: flex; + align-items: center; + padding: 5px 10px; + } + + .nav_link a:hover { + + border-radius: 5px; + } + + .btn1 { + background-color: #3fbcc0a6; + color: white; + border: none; + padding: 10px 15px; + border-radius: 5px; + cursor: pointer; + } + + .btn1:hover { + background-color: #4a90e2; + } + + .hamburger { + display: none; + flex-direction: column; + cursor: pointer; + } + + .hamburger .line { + width: 25px; + height: 3px; + background-color: white; + margin-right: 1000px; + } + + @media (max-width: 768px) { + .header_container{ + height: 60px; + } + .nav_link { + display: none; + flex-direction: column; + gap: 0; + position: fixed; + top: 60px; + right: 0; + background-color: #022a2d; + width: 50%; + padding: 20px; + z-index: 0; + margin-right: 230px; + } + + .nav_link.active { + display: flex; + } + + .nav_link li { + margin: 10px 0; + } + + .nav_link a { + padding: 10px; + color: #4a90e2; + } + + .hamburger { + display: flex; + margin-bottom: 10px; + } + + } + + +.h1{ + font-size: 64px; +} +#expect h1{ + font-size: 40px; +} +#tips h2{ + font-size: 40px; +} +#services { + text-align: center; + display: flex; + max-width: 100%; + justify-content: center; + +} +.service-btn { + background-color: #3fbcc0a6; + color: #fff; + border: none; + padding: 12px 20px; + border-radius: 8px; + font-size: 16px; + font-weight: bold; + cursor: pointer; + transition: background-color 0.3s ease, transform 0.2s ease; + text-align: center; + text-decoration: none; + display: inline-block; + } + + .service-btn:hover { + background: linear-gradient(#4a90e2,#022a2d); + transform: scale(1.05); + } + + .service-btn:focus { + outline: none; + box-shadow: 0 0 0 2px rgba(85, 165, 234, 0.5); + } +.services-grid { + display: grid; + grid-template-columns: repeat(2, 1fr); + gap: 20px; + margin: 20px 20px; + +} + +.services-item { + background-color: #022a2d; + padding: 20px; + border-radius: 8px; + color: white; + +} +.services-item:hover{ + background-color:#55a5ea; + ; +} + + +.services-item h2 { + margin-top: 0; +} + +.content { + display: flex; + flex-direction: row; + justify-content: space-between; +} + +.content img { + align-self: flex-start; + width: 40%; + height: 40%; +} + +.content p { + flex: 1; +} +#expect{ + text-align: center; + display: flex; + justify-content: justify; + flex-direction: column; +} +.expect-item{ + display: flex; + flex-direction: row; + justify-content: center; + gap: 1rem; + padding: 10px; +} +.expect-item:hover { + transform: scale(1.1); +} +.expect-item p{ + align-self: flex-end; + background-color:hwb(181 16% 46%); + width: 1000px; + height: 60px; + gap: 30px; + border-radius: 20px; + display: flex; + align-items: center; + justify-content: center; + margin: 0; + text-align: center; +} +.expect-item h2 { + background-color: #55a5ea; + border-radius: 50%; + height: 80px; + width: 80px; + display: flex; + align-items: center; + justify-content: center; + margin: 0; + text-align: center; + +} +.expect-item p:hover{ + background-color: #55a5ea; + +} +.expect-item h2:hover{ + background-color: #022a2d; +} +#tip { + text-align: center; + display: flex; + justify-content: center; + flex-direction: row; + align-items: center; + padding: 20px; +} +#tips h2 { + margin: 0; + font-size: 2em; + color: #ffffff; + margin-left: 650px; + padding-top: 50px; +} +.tip-item { + background-color:hwb(181 16% 46%); + padding: 20px; + border-radius: 8px; + color: white; + width: 70%; + align-items: center; + justify-content: center; + margin-left: 100px; +} + +.tip-grid { + display: grid; + grid-template-columns: repeat(2, 1fr); + gap: 20px; + margin: 20px; + background-color: #022a2d; + height:auto; + padding-top: 50px; + padding-bottom: 50px; + border-radius: 30PX; +} +.tip-item:hover{ + transform: scale(1.1); + background-color: #55a5ea; +} +@media (max-width: 768px) { + footer { + width: 100vw !important; + padding: 10px !important; + margin: 0px !important; + } + + .other-columns { + width: 100%; + display: flex; + flex-wrap: wrap; + justify-content: space-between; + + } + body { + margin: 0; + } + + + + + + .footer-col { + flex-basis: 100%; + padding: 10px; + margin-right: 50px; + margin-top: 20px; + max-width: 470px; + + } + .footer-col h4{ + margin-left: 10px; + margin-right: 300px; + } + .footer-col p{ + display: flex; + } + + .footer-col form button { + margin-left:0px; + display: flexbox; + text-align: center; + align-items: center; + width: 50%; + } + + + .footer-bottom-wrapper { + flex-direction: column; + align-items: center; + + } + + .footer-bottom-wrapper small { + margin-bottom: 10px; + margin-right: 0px; + + } + .social-links { + + gap: 10px; + margin-left: 0px; + padding: 0px; + } + + + .social-wrapper { + margin-top: 10px; + margin-right: 10px; + } + } + +@media (max-width: 768px) { + .body{ + width: 100vw !important; + } + .content{ + padding-top:0px; + } + .content h1{ + font-size: 27px; + display: block; + } + + .sec-img{ + margin-top:10px; + width: 230px; + height: 230px; + } + .services-grid { + grid-template-columns: 1fr; + gap: 10px; + width: 100%; + margin-right: 10px; + } + + .content { + flex-direction: column; + align-items: center; + margin-right: 50px; + } + + .content img { + margin-left: 30px; + width: 100%; + height: auto; + } + #tips h2{ + font-size:40px; + padding-left: 150px; + } + + .expect-item { + flex-direction: row; + align-items: center; + width: 70%; + margin-left: 70px; + } + + .expect-item p { + width: 100%; + height: auto; + } + + + #tips{ + width: 100%; + + } + + #tips h2 { + font-size: 1.2em; + } + + .tip-item { + width: 50%; + + } + + .tip-grid { + grid-template-columns: 1fr; + gap: 10px; + margin-left: 15px; + + } +} +@media (max-width: 1024px) { + .services-grid { + grid-template-columns: 1fr; + gap: 10px; + } + + .content { + flex-direction: column; + align-items: center; + } + + .content img { + width: 80%; + height: auto; + } + #expect h1{ + font-size:30px ; + margin-right: 30px; + } + .expect-item { + flex-direction: column; + align-items: center; + } + + .expect-item p { + width: 100%; + height: auto; + } + + .expect-item h2 { + margin-bottom: 10px; + } + + #tips h2 { + font-size: 1.5em; + margin-left: 0; + padding-top: 20px; + } + + .tip-item { + width: 100%; + margin-left: 0; + } + + .tip-grid { + grid-template-columns: 1fr; + gap: 10px; + } + +} \ No newline at end of file diff --git a/checkup.html b/checkup.html new file mode 100644 index 00000000..82d551d1 --- /dev/null +++ b/checkup.html @@ -0,0 +1,399 @@ + + + + + + Health Checkup + + + + + + + + + + + + + RapiDoc + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+ +

+ Welcome to RapiDoc! Your one-stop digital healthcare + destination +

+ +
+ + +
+ +
+
+
+

General Health Checkup

+
+

Our general health checkup provides a thorough evaluation of your overall health. It includes a physical examination, blood tests, cholesterol checks, and assessments for common conditions such as diabetes and hypertension.

+ General Health Checkup +
+ + +
+
+

Women's Health Checkup

+
+

Our women's health checkup is designed to address the unique health needs of women at every stage of life. It includes breast exams, pelvic exams, Pap smears, and screenings for osteoporosis and heart health.

+ Women's Health Checkup +
+ + +
+
+

Senior Citizen Health Checkup

+
+

Our senior citizen's health checkup aims to maintain health and quality of life in older adults. It includes comprehensive physical exams, screenings for chronic conditions, medication reviews, and assessments for mobility and cognitive function.

+ Senior Citizen Health Checkup +
+ + +
+
+

Pediatric Health Checkup

+
+

Our Pediatric Health Checkup focuses on monitoring your child's growth and development. It includes physical exams, vaccinations, and developmental screenings to ensure your baby is healthy and meeting milestones.

+ Pediatric Health Checkup +
+ + +
+
+
+ + +
+

What to Expect?

+
+
+

1

+

Initial consultation with a healthcare provider.

+
+
+
+
+

2

+

Personalized health advice and recommendations.

+
+
+
+
+

3

+

Physical examination and vital signs measurement.

+
+
+
+
+

4

+

Review of medical history and lifestyle factors.

+
+
+
+
+

5

+

Laboratory tests and diagnostic screenings.

+
+
+ +
+ + +
+

+ Health Tips + +

+ +
+
+

Maintain a balanced diet rich in fruits, vegetables, and whole grains.

+
+
+

Stay physically active with regular exercise.

+
+
+

Get enough sleep and manage stress effectively.

+
+
+

Stay hydrated by drinking plenty of water.

+
+
+

Avoid smoking and limit alcohol consumption.

+
+
+

Practice relaxation techniques such as deep breathing, meditation, or yoga.

+
+ + + + +
+
+ + + +
+ + + + +
+ + + + diff --git a/checkup.js b/checkup.js new file mode 100644 index 00000000..4b734a09 --- /dev/null +++ b/checkup.js @@ -0,0 +1,10 @@ +document.addEventListener('DOMContentLoaded', function() { + const hamburger = document.querySelector('.hamburger'); + const navLinks = document.querySelector('.nav_link'); + + hamburger.addEventListener('click', function() { + navLinks.classList.toggle('active'); + }); + }); + + \ No newline at end of file diff --git a/dex.html b/dex.html new file mode 100644 index 00000000..4d3a6424 --- /dev/null +++ b/dex.html @@ -0,0 +1,872 @@ + + + + + + + + + + + + + + + + + + + + + + + + + RapiDoc + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+
+ + + + + + + +
+ +
+
+
+

RAPIDOC|Delivery
Order Medicines

+

+ Order your Medicine at any time and we will deliver them + right to where you are. +

+ + Get Started + home +
+
+
+ + +
+
+
+

+ Find Out A Little More About Us +

+

+ We are a company dedicated to the distribution of products by + delivery to your home or to the place where you are, with the best + quality of delivery. +

+ about +
+
+
+ + +
+
+
+

+ Your Safety Is Important +

+

+ When your order reaches you, we have the health safety protocols, + so that you are protected from any disease. Watch the video of how + the delivery is made. +

+
+ about +
+
+ + +
+

+ Some Services We
+ Offer +

+
+
+

Payment Done

+ imog +

+ Pay with a Visa or PayPal card and without much ado. +

+ +
+ +
+

Find Your Product

+ imog +

+ We offer sale of products through the Internet. +

+ +
+ +
+

Product Received

+ imog +

+ In our app you can see the delay time of your order. +

+ +
+
+
+ + +
+
+
+

+ Watch Your Delivery At Any Time +

+

+ With our app you can view the route of your order, from our local + headquarters to the place where you are. Look for the app now! +

+ +
+ home1 +
+
+ + +
+
+
+

+ Contact Us From Here +

+

+ You can contact us from here, you can write to us, call us or + visit our service center, we will gladly assist you. +

+
+ +

Email: delivery@email.com

+
+
+ +

Location: New Delhi

+
+ +
+
+ +
+
+
+
+ +
+ + + +
+ +
+
+ + + +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + diff --git a/emoji1.gif b/emoji1.gif new file mode 100644 index 00000000..a047d32e Binary files /dev/null and b/emoji1.gif differ diff --git a/emoji2.gif b/emoji2.gif new file mode 100644 index 00000000..b3732f15 Binary files /dev/null and b/emoji2.gif differ diff --git a/emoji3.gif b/emoji3.gif new file mode 100644 index 00000000..2b315a28 Binary files /dev/null and b/emoji3.gif differ diff --git a/emoji4.gif b/emoji4.gif new file mode 100644 index 00000000..53878edc Binary files /dev/null and b/emoji4.gif differ diff --git a/emoji5.gif b/emoji5.gif new file mode 100644 index 00000000..305a5827 Binary files /dev/null and b/emoji5.gif differ diff --git a/faq.html b/faq.html new file mode 100644 index 00000000..096fd3fa --- /dev/null +++ b/faq.html @@ -0,0 +1,1473 @@ + + + + FAQ - RapiDoc + + + + + + + + + + + RapiDoc + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + + + + + + + +
+ + +
+ + +
+
+

βž•

+

What services does the platform offer?

+
+

Our platform provides a range of healthcare services, including real-time information on hospital bed availability, patient statistics, OPD appointment booking, blood group availability, and much more.

+ +
+

βž•

+

How can I check the availability of hospital beds?

+
+

To check hospital bed availability, log in to your account, navigate to the "Hospital Services" section, and select "Bed Availability." You will be able to see real-time updates on the availability of beds in your preferred hospitals.

+ +
+

βž•

+

Can I book an OPD appointment through the platform?

+
+

Yes, you can easily prebook OPD appointments. Visit the "Appointments" section, choose your preferred doctor and hospital, and select a convenient time slot to book your appointment.

+ +
+

βž•

+

How do I find the availability of specific blood groups in hospitals?

+
+

Go to the "Blood Bank" section, select the required blood group, and the platform will display the current availability status in various hospitals and blood banks.

+ +
+

βž•

+

Is there a mobile app for this platform?

+
+

Yes, our platform is accessible via a mobile app available for both Android and iOS devices. You can download it from the respective app stores.

+ +
+

βž•

+

How do I register on the platform?

+
+

To register, click on the "Sign Up" button on the homepage, fill in the required details, and verify your email address. Once registered, you can log in to access all the services.

+ +
+

βž•

+

Can I cancel or reschedule my OPD appointment?

+
+

Yes, you can cancel or reschedule your OPD appointment through the "Appointments" section. Please note that some hospitals may have specific policies regarding cancellations and rescheduling, so check the terms during the booking process.

+ +
+

βž•

+

Can I access my medical records through the platform?

+
+

Yes, you can access your medical records under the "My Health Records" section. Ensure that your hospital is integrated with our platform to view your records.

+ +
+

βž•

+

How can I contact customer support?

+
+

You can contact our customer support team by clicking on the "Contact Us" link at the bottom of the homepage. We offer support via email, phone, and live chat.

+ +
+

βž•

+

Is my personal information secure on the platform?

+
+

Yes, we prioritize your privacy and security. Our platform uses advanced encryption technologies to ensure that your personal and medical information is securely stored and transmitted.

+ +
+

βž•

+

Are there any fees for using the platform?

+
+

Basic services such as browsing hospital information and checking bed availability are free. However, there may be fees for certain premium services like detailed health analytics and advanced appointment features. These fees will be clearly indicated before any charges are applied.

+ +
+

βž•

+

How do I find the nearest hospitals through the platform?/h3> +

+

To find the nearest hospitals, simply enter your location in the search bar or use the location services feature. The platform will provide a list of hospitals in your vicinity along with essential information such as bed availability and emergency blood supply.

+ +
+

βž•

+

Can I view the total number of patients currently in a hospital?

+
+

Yes, the platform provides real-time data on the total number of patients in various hospitals. You can access this information by selecting the "Hospital Statistics" section and choosing the desired hospital to view detailed patient statistics.

+ +
+

βž•

+

Is there a feature to track the status of my OPD appointment?

+
+

Yes, you can track the status of your OPD appointment through the "Appointments" section of the platform. This feature allows you to view upcoming appointments, check their status, and receive notifications about any changes or updates.

+ +
+

βž•

+

I have many more questions for you!

+
+

Contact us! We will be there for support at rapidoc@gmail.com.

+
+
+ + + + + +
+ + + + + + + +
+
+ + + +
+
+ + + + + + + + diff --git a/favicon.png b/favicon.png new file mode 100644 index 00000000..09cbadfe Binary files /dev/null and b/favicon.png differ diff --git a/googletranslate.css b/googletranslate.css new file mode 100644 index 00000000..12bf8de6 --- /dev/null +++ b/googletranslate.css @@ -0,0 +1,129 @@ +#translateButton { + position: fixed; + bottom: 20px; + right: 20px; + z-index: 1000; + width: 60px; + height: 60px; + border-radius: 50%; + border: none; + background-color: hwb(181 16% 46%); + color: white; + text-align: center; + display: inline-block; + font-size: 16px; + cursor: pointer; + display: flex; + justify-content: center; + align-items: center; + font-size: 12px; + line-height: 1; + text-align: center; + white-space: nowrap; + transition: transform 0.3s ease; + margin-right: 1350px; +} +#translateButton:hover { + transform: scale(1.2); +} + +/* The popup modal */ +.popup { + display: none; + position: fixed; + z-index: 1000; + left: 0; + top: 0; + width: 100%; + height: 100%; + overflow: auto; + background-color: rgb(0,0,0); + background-color: rgba(0,0,0,0.4); + +} + +/* Popup content */ +.popup-content { + background-color: hwb(181 16% 46%); + margin-top: 600px; + padding-left: 20px; + border: 1px solid #888; + width: 300px; + border-radius: 10px; + position: relative; + margin-right: 1350px; + +} + +/* Close button */ +.close { + color: #073725; + float: right; + font-size: 28px; + font-weight: bold; + cursor: pointer; +} + +.close:hover, +.close:focus { + color: black; + text-decoration: none; +} + +/* Hide the default Google Translate widget */ +.goog-te-banner-frame.skiptranslate, .goog-te-gadget-icon { + display: none !important; +} + +body { + top: 0px !important; +} + +/* Hide the "Powered by Google" branding */ +.goog-logo-link { + display: none !important; +} + +.goog-te-gadget { + height: 28px !important; + overflow: hidden; +} + +/* Hide Google Translate notifications */ +.goog-te-spinner-pos, +.goog-te-spinner, +.goog-te-balloon-frame, +.goog-te-banner-frame, +.goog-te-banner, +.goog-te-balloon { + display: none !important; +} + +/* Custom styles for the Google Translate dropdown */ +#google_translate_element select { + background: #ffffff; + border: 1px solid #ccc; + color: #55a5ea; + padding-left:20px; + font-size: 14px; + border-radius: 5px; + display: flex; + align-items: center; + justify-content: center; + height: 30px; +} + +/* Hide the Google Translate bar */ +body > .skiptranslate { + display: none !important; +} + +.goog-te-banner-frame.skiptranslate { + display: none !important; +} +.goog-te-banner-frame { + display: none !important; +} +.goog-te-banner { + display: none !important; +} \ No newline at end of file diff --git a/googletranslate.js b/googletranslate.js new file mode 100644 index 00000000..9d227de3 --- /dev/null +++ b/googletranslate.js @@ -0,0 +1,19 @@ +document.addEventListener('DOMContentLoaded', function() { + var popup = document.getElementById('translatePopup'); + var btn = document.getElementById('translateButton'); + var span = document.getElementsByClassName('close')[0]; + + btn.onclick = function() { + popup.style.display = 'block'; + } + + span.onclick = function() { + popup.style.display = 'none'; + } + + window.onclick = function(event) { + if (event.target == popup) { + popup.style.display = 'none'; + } + } +}); \ No newline at end of file diff --git a/images/Delivery.png b/images/Delivery.png new file mode 100644 index 00000000..4c06d56a Binary files /dev/null and b/images/Delivery.png differ diff --git a/images/WhatsApp Image 2024-07-23 at 18.59.53_ca6faccb.jpg b/images/WhatsApp Image 2024-07-23 at 18.59.53_ca6faccb.jpg new file mode 100644 index 00000000..a90cd76a Binary files /dev/null and b/images/WhatsApp Image 2024-07-23 at 18.59.53_ca6faccb.jpg differ diff --git a/images/appointment.png b/images/appointment.png new file mode 100644 index 00000000..38e49da3 Binary files /dev/null and b/images/appointment.png differ diff --git a/images/appointmenthover.png b/images/appointmenthover.png new file mode 100644 index 00000000..744fca62 Binary files /dev/null and b/images/appointmenthover.png differ diff --git a/images/checkup.png b/images/checkup.png new file mode 100644 index 00000000..6d369557 Binary files /dev/null and b/images/checkup.png differ diff --git a/images/checkuphover.png b/images/checkuphover.png new file mode 100644 index 00000000..9bab7350 Binary files /dev/null and b/images/checkuphover.png differ diff --git a/images/hospital.png b/images/hospital.png new file mode 100644 index 00000000..780afa32 Binary files /dev/null and b/images/hospital.png differ diff --git a/images/newdoc.png b/images/newdoc.png new file mode 100644 index 00000000..0ef0d65b Binary files /dev/null and b/images/newdoc.png differ diff --git a/images/profile1.webp b/images/profile1.webp new file mode 100644 index 00000000..afc33b63 Binary files /dev/null and b/images/profile1.webp differ diff --git a/images/profile2.webp b/images/profile2.webp new file mode 100644 index 00000000..8a7b5cff Binary files /dev/null and b/images/profile2.webp differ diff --git a/images/profile3.webp b/images/profile3.webp new file mode 100644 index 00000000..6b10c550 Binary files /dev/null and b/images/profile3.webp differ diff --git a/images/profile4.webp b/images/profile4.webp new file mode 100644 index 00000000..96b8f4f6 Binary files /dev/null and b/images/profile4.webp differ diff --git a/images/profile5.webp b/images/profile5.webp new file mode 100644 index 00000000..ce73ebf0 Binary files /dev/null and b/images/profile5.webp differ diff --git a/images/services.png b/images/services.png new file mode 100644 index 00000000..0f17c380 Binary files /dev/null and b/images/services.png differ diff --git a/images/serviceshover.png b/images/serviceshover.png new file mode 100644 index 00000000..b9c45ff8 Binary files /dev/null and b/images/serviceshover.png differ diff --git a/images/ward.png b/images/ward.png new file mode 100644 index 00000000..2e057258 Binary files /dev/null and b/images/ward.png differ diff --git a/images/wardhover.png b/images/wardhover.png new file mode 100644 index 00000000..f3e0ac5f Binary files /dev/null and b/images/wardhover.png differ diff --git a/img/2jghCPWR6g8S6w5Nv6bF6WCSHzJ.svg b/img/2jghCPWR6g8S6w5Nv6bF6WCSHzJ.svg new file mode 100644 index 00000000..8a198c39 --- /dev/null +++ b/img/2jghCPWR6g8S6w5Nv6bF6WCSHzJ.svg @@ -0,0 +1,15 @@ + + + + + + + + + diff --git a/img/Caduceus.svg.png b/img/Caduceus.svg.png new file mode 100644 index 00000000..98a275bc Binary files /dev/null and b/img/Caduceus.svg.png differ diff --git a/img/WhatsApp Image 2024-07-23 at 18.59.41_52314e5b.jpg b/img/WhatsApp Image 2024-07-23 at 18.59.41_52314e5b.jpg new file mode 100644 index 00000000..9f263367 Binary files /dev/null and b/img/WhatsApp Image 2024-07-23 at 18.59.41_52314e5b.jpg differ diff --git a/img/asterisk.svg b/img/asterisk.svg new file mode 100644 index 00000000..80cd0388 --- /dev/null +++ b/img/asterisk.svg @@ -0,0 +1,15 @@ + + + + + + + + + + \ No newline at end of file diff --git a/img/avatar.png b/img/avatar.png new file mode 100644 index 00000000..bdd06384 Binary files /dev/null and b/img/avatar.png differ diff --git a/img/doctors/Image(13).png b/img/doctors/Image(13).png new file mode 100644 index 00000000..4a11c638 Binary files /dev/null and b/img/doctors/Image(13).png differ diff --git a/img/heart.svg b/img/heart.svg new file mode 100644 index 00000000..7b293ca4 --- /dev/null +++ b/img/heart.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/img/question.svg b/img/question.svg new file mode 100644 index 00000000..d73f9362 --- /dev/null +++ b/img/question.svg @@ -0,0 +1,12 @@ + + + + question + + + + + + + + \ No newline at end of file diff --git a/index.css b/index.css new file mode 100644 index 00000000..b0021b54 --- /dev/null +++ b/index.css @@ -0,0 +1,1154 @@ +html { + scroll-behavior: smooth; +} + +.emoji input { + display: none; +} + +.emoji label { + font-size: 2rem; + cursor: pointer; + padding: 5px; +} + +.emoji input:checked+label { + background-color: rgb(41, 136, 138); +} +@media screen and (max-width: 768px) { + #ss { + font-size: 12px; + } + } + + @media screen and (max-width: 480px) { + #ss { + font-size: 10px; + } + } +.nav_menu { + display: flex; +} + +.nav_link { + display: flex; +} + +.iti--allow-dropdown input { + padding-left: 50px; + background-color: black; + /* Adjust padding to prevent overlap */ +} + +.iti.iti--allow-dropdown { + margin-left: 250px; +} + +.container { + display: unset; + align-items: center; + /* justify-content: space-between; */ + flex-wrap: nowrap; + width: 100%; + margin: 0; + padding: 0; + justify-content: space-evenly; + gap: 25px; +} +.services .icon-box{ + height: 400px; + width: 300px; +} +.content { + text-align: left; + flex: 1; + padding: 20px; +} + +.sec-img { + max-width: 50%; + width: 600px; + height: 600px; + margin-left: auto; +} + +.btn-get-started { + display: inline-block; + background-color: #3fbcc0; + color: #fff; + padding: 10px 20px; + text-decoration: none; + border-radius: 5px; + margin-top: 20px; +} + +.btn-get-started::before{ + content: ''; + position: absolute; + top: 0; + left: 0; + width: 0; + height: 100%; + color: #000; + background-color: #55a5ea; + transition: width 0.3s ease; + z-index: -1; +} +select { + padding: 1px; + background-color: #55a5ea; + color: white; + height: 5vh; + width: 17vh; +} + +option { + background-color: #55a5ea; + color: white; +} + +.hamburger { + display: none; + cursor: pointer; + position: absolute; + top: 29px; + left: 1.5%; +} + +.line { + width: 30px; + height: 5px; + margin: 4px 4px; + background-color: white; +} +.img p{ + display: none; +} +@media (max-width: 820px) { + .nav_menu { + flex-direction: column; + } + + .hamburger { + display: flex; + } + + .mobile-logo-text { + display: block; + } + + .nav_link { + display: none; + flex-direction: column; + position: fixed; + top: 60px; + right: 0; + background-color: #022a2d; + width: 40% !important; + padding: 20px; + z-index: 10; + box-shadow: -2px 0 5px rgba(0, 0, 0, 0.2); + } + + .nav_link.active { + display: flex; + } + + .nav_link li { + margin: 10px 0; + } + + .nav_link a { + font-size: 1.2em; + } + + .nav_link .btn1 { + width: 100%; + text-align: center; + } + } + +@media (max-width: 880px) { + .nav_menu { + flex-direction: column; + } + + .hamburger { + display: flex; + } + + .mobile-logo-text { + display: inline-block; + color: white; + font-weight: bold; + margin-left: 50px; + margin-right: 23rem; + font-size: 40px; + } + #rd-logo { + margin-left: 21rem; + margin-right: -6rem; + } + + .nav_link { + display: none; + flex-direction: column; + position: fixed; + top: 60px; + left: 20px; + margin-top: 37px !important; + background-color: #022a2d; + width: 40% !important; + padding: 20px; + z-index: 10; + box-shadow: -2px 0 5px rgba(0, 0, 0, 0.2); + } + + .nav_link.active { + display: flex; + } + + .nav_link li { + margin: 10px 0; + } + + .nav_link a { + font-size: 1.2em; + } + + .nav_link .btn1 { + width: 100%; + text-align: center; + } + } + +@media (max-width: 768px) { + .nav_menu { + flex-direction: column; + } + + .hamburger { + display: flex; + } + + .mobile-logo-text { + display: block; + } + + .nav_link { + display: none; + flex-direction: column; + position: fixed; + top: 60px; + left: 20px; + background-color: #022a2d; + width: 45% !important; + margin-top: 30px; + padding: 20px; + z-index: 10; + box-shadow: -2px 0 5px rgba(0, 0, 0, 0.2); + } + + .nav_link.active { + display: flex; + } + + .nav_link li { + margin: 10px 0; + font-size: 18px; + } + + .nav_link a { + font-size: 1.2em; + } + + .nav_link .btn1 { + width: 100%; + text-align: center; + } + } + +/*Preloader CSS*/ +.pre { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + display: flex; + justify-content: center; + align-items: center; + transition: opacity 2s ease-out, visibility 2s ease-out; + opacity: 1; + visibility: visible; + z-index: 9999; +} + +.pre--hidden { + opacity: 0; + visibility: hidden; +} + +.loader { + display: block; + position: relative; + width: 150px; + height: 150px; + border-radius: 50%; + border: 3px solid transparent; + border-top-color: #55a5ea; + animation: spin 3s linear infinite; +} + +.loader:before { + content: ""; + position: absolute; + top: 5px; + left: 5px; + right: 5px; + bottom: 5px; + border-radius: 50%; + border: 3px solid transparent; + border-top-color: #3fbcc0c6; + animation: spin 3s linear infinite; +} + +.loader:after { + content: ""; + position: absolute; + top: 15px; + left: 15px; + right: 15px; + bottom: 15px; + border-radius: 50%; + border: 3px solid transparent; + border-top-color: #fff; + animation: spin 1.5s linear infinite; +} + +@keyframes spin { + 0% { + transform: rotate(0deg); + } + + 100% { + transform: rotate(360deg); + } +} + +.avatar { + margin: 20px 100px; + padding-left: 50px; + padding-right: 60px; +} + +.textbox input { + width: 240px; + height: 40px; + border-radius: 10px; + padding: 10px; + border: none; + align-items: center; + margin-left: 10px; + margin-right: 20px; +} + +.btn { + margin-left: 4px; + width: 240px; + height: 40px; + background-color: #00C896; + border: none; + font-size: 1rem; + border-radius: 10px; + margin-bottom: 20px; +} +.btn:hover{ + background-color: #36b0b3; +} +.btn::before{ + content: ''; + position: absolute; + top: 0; + left: 0; + width: 0; + height: 100%; + color: #000; + background-color: #55a5ea; + transition: width 0.3s ease; + z-index: -1; +} +#appointment.appointment.section-bg { + margin: 0px 280px 100px; +} + +#appointment.appointment.section-bg h2 { + margin: 0px 115px; +} + +form.php-email-form { + width: 300px; + display: flex; + flex-direction: column; + flex-wrap: wrap; + align-content: flex-start +} + +.loader--hidden { + opacity: 0; + visibility: hidden; +} + + + +/* Appointment section Styling to align it to center */ +.appointment .container { + display: flex; + flex-direction: column; + align-items: center; + /* Center container contents */ + border-radius: 10px; + margin: auto; +} + +.appointment form { + display: flex; + flex-direction: column; + align-items: center; + /* Center form contents */ + width: 100%; + max-width: 500px; +} + +.appointment .form-group { + width: 100%; + display: flex; + justify-content: center; + margin-bottom: 15px; +} + +.appointment input, +.appointment select, +.appointment button { + width: 100%; + max-width: 500px; + border-radius: 10px; +} + +.appointment .text-center { + width: 100%; + display: flex; + justify-content: center; + margin-top: 20px; +} + +.appointment button[type="submit"] { + width: auto; + padding: 10px 20px; + display: block; + margin: 0 auto; +} + +.php-email-form .form-control, +.php-email-form .form-select { + border: none; + margin: 0; + padding: 10px; +} + +.php-email-form .form-group, +.php-email-form .row { + margin: 0; + padding: 10px; +} + +#name, +#email { + margin-bottom: 10px; + border-bottom: none; + width: 100%; +} + +#email, +#location { + border-top: 1px solid #ccc; + /* Adjust color as needed */ + margin-top: 0; +} + +/* Remove
tags if present in HTML */ +#name+br, +#email+br { + display: none; +} + +.section-bg { + background-color: #1c413b; + width: 700px; + padding: 40px; +} + +#appointment.appointment.section-bg { + margin: auto; +} + +select { + padding: 1px; + background-color: #f8f8f8; + color: #374151; + height: 7vh; + width: 17vh; +} + + + +#progressBar { + position: fixed; + top: 0; + left: 0; + width: 0%; + height: 6px; + background-color: #3fbcc0; + z-index: 9999; +} + +.contact .php-email-form { + width: 200%; +} + +.contact .php-email-form .form-group { + width: 600px; +} + +@media (max-width: 768px) { + body { + + width: 163vw !important; + } + + .header_container { + width: 163vw; + height: 6rem !important; + width: -webkit-fill-available !important; + justify-content: center; + flex-direction: row; + align-items: center; + } + .nav-h .nav_link{ + display:none !important; + } + + .nav_menu { + height: auto; + } + + #rd-logo { + display: table-row; + margin-right: -4rem !important; + margin-left: 25rem !important; + } + + .container { + flex-wrap: wrap; + justify-content: center; + flex-direction: column-reverse; + padding: 10px; + } + + .about-service { + height: auto !important; + width: auto !important; + margin-left: 0px !important; + margin-top: 0px !important; + flex-direction: column; + } + + .count-box { + padding: 76px; + font-size: 24px; + } + + .appointment .container { + display: flex !important; + justify-content: center !important; + align-content: center !important; + } + + .mt-2 { + display: flex; + align-items: stretch !important; + justify-content: space-around !important; + align-content: center !important; + gap: 40px !important; + margin-top: 70px !important; + } + + .appointment form { + display: flex !important; + flex-direction: column !important; + align-items: center !important; + width: 100% !important; + max-width: 500px !important; + } + + .appointment .form-group { + width: 100% !important; + display: flex !important; + justify-content: center !important; + margin-bottom: 15px !important; + } + + footer { + width: 168vw !important; + padding: 40px !important; + margin: auto !important; + } + + #appointment.appointment.section-bg { + margin: 15px; + } + + .testimonial-contains { + padding: 10px !important; + } + + .swiper-slide .testimonals-item { + width: 476px !important; + } + + .other-columns { + grid-template-columns: repeat(3, 3fr); + + } + + .form.php-email-form { + align-content: flex-start; + } + + .social-wrapper { + margin-right: 50%; + } + + #slide-item { + width: 510px !important; + } + + .footer-col { + padding: 15px; + text-align: center; + } +} + + +.mapouter { + position: relative; + text-align: right; + width: 100%; + height: 363px; +} + +.gmap_canvas { + overflow: hidden; + background: none !important; + width: 100%; + height: 363px; +} + +.gmap_iframe { + height: 363px !important; +} + +@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300&display=swap'); + +body { + font-family: 'Poppins', sans-serif; +} + +.section-title h2 { + font-size: 32px; + text-transform: uppercase; + position: relative; + font-weight: 700; + margin-bottom: 20px; +} + +.section-title p { + margin-top: 20px; + font-size: 16px; + margin-bottom: 40px; +} + +.section-black-text p, .section-black-text h2 { + color: white; +} + +.enhanced-input, +.enhanced-textarea { + border: 2px solid #ccc; + border-radius: 5px; + margin-bottom: 15px; + font-size: 1rem; + color: #000; + background-color: #f9f9f9; + transition: border-color 0.3s, background-color 0.3s; + margin: 0 auto; + padding: 0 20px; +} + +.enhanced-input:focus, +.enhanced-textarea:focus { + border-color: #4cae4c; + background-color: #fff; + color: #000; +} + +.btn-submit { + padding: 10px 20px; + background-color: #000; + border: none; + border-radius: 5px; + color: white; + cursor: pointer; + transition: background-color 0.3s, transform 0.3s; +} + + + +@keyframes fadeIn { + 0% { + opacity: 0; + } + + 100% { + opacity: 1; + } +} + +.confirmation-message { + display: none; + margin-top: 10px; + padding: 30px; + background-color: #e0f7fa; + color: #00796b; + border: 1px solid #00796b; + border-radius: 10px; + font-size: 1.2rem; + text-align: center; + animation: slideDown 1s forwards; +} + +.modal { + display: none; + position: fixed; + z-index: 1; + left: 0; + top: 0; + width: 100%; + height: 100%; + overflow: auto; + background-color: rgba(0, 0, 0, 0.4); + /* Black w/ opacity */ +} + +.modal-content { + background-color: teal; + margin: 20% auto; + padding: 20px; + border: 1px solid #888; + width: 50%; + max-width: 300px; + color: white; + text-align: center; +} + +.close { + color: white; + float: right; + font-size: 28px; + font-weight: bold; +} + +.close:hover, +.close:focus { + color: #000; + text-decoration: none; + cursor: pointer; +} + + +@media (max-width:768px) { + .other-columns { + display: flex; + flex-wrap: wrap; + justify-content: space-between; + } + + .footer-col { + display: flex; + flex-direction: row; + align-items: center; + flex-wrap: nowrap; + gap: 90px; + } + + .subscribe-form { + display: flex; + gap: 10px; + } +} + +.social-wrapper a div i { + color: #afb6c7; +} + +.social-wrapper a div i:hover { + color: #fff; +} +.confirmation-message { + display: none; + color: green; + margin-top: 10px; +} +.nav_link{ + display: flex; + gap: 10px; +} +.btn1{ + margin-right: 15px; +} +.btn2:hover{ + background-color: #36b0b3; +} +.sec-img { + filter: drop-shadow(2px 2px 10px grey); + } + +.btn1 { + position: relative; + background-color: #3fbcc0a6; + color: white; + /* border: 2px solid #000; */ + border-radius: 10px; + overflow: hidden; + transition: color 0.3s ease; + z-index: 1; + } + + .btn1::before { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 0; + height: 100%; + background-color: #55a5ea; + transition: width 0.3s ease; + z-index: -1; + } + + .btn1:hover { + color: #fff; + } + + .btn1:hover::before { + width: 100%; + } + + #btn { + position: relative; + background-color: #3fbcc0a6; + color: white; + border-radius: 10px; + overflow: hidden; + transition: color 0.3s ease; + z-index: 1; + } + + #btn::before { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 0; + height: 100%; + background-color: #55a5ea; + transition: width 0.3s ease; + z-index: -1; + } + + #btn:hover { + color: #fff; + } + + #btn:hover::before { + width: 100%; + } + + .btn { + position: relative; + background-color: #3fbcc0a6; + color: white; + border-radius: 10px; + overflow: hidden; + transition: color 0.3s ease; + z-index: 1; + } + + .btn::before { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 0; + height: 100%; + background-color: #55a5ea; + transition: width 0.3s ease; + z-index: -1; + } + + .btn:hover { + color: #fff; + } + + .btn:hover::before { + width: 100%; + } + + .btn-submit { + position: relative; + background-color: #3fbcc0a6; + color: white; + border: 2px solid #000; + border-radius: 10px; + overflow: hidden; + transition: color 0.3s ease; + z-index: 1; + } + + .btn-submit::before { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 0; + height: 100%; + background-color: #55a5ea; + transition: width 0.3s ease; + z-index: -1; + } + + .btn-submit:hover { + color: #fff; + } + + .btn-submit:hover::before { + width: 100%; + } + + + .b { + position: relative; + background-color: #3fbcc0a6; + color: white; + border: 2px solid #000; + border-radius: 10px; + transition: color 0.3s ease; + z-index: 1; + } + + .b::before { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 0; + height: 100%; + border-radius: 6px; + background-color: #55a5ea; + transition: width 0.3s ease; + z-index: -1; + } + + .b:hover { + color: #fff; + } + + .b:hover::before { + width: 100%; + } + + .btn1{ + padding:10px; + } +.about-card { + perspective: 1000px; +} +.card-inner { + position: relative; + width: 100%; + height: 100%; + transition: transform 0.6s; + transform-style: preserve-3d; +} +.about-card:hover .card-inner { + transform: rotateY(180deg); +} +.card-front, .card-back { + position: absolute; + width: 100%; + height: 100%; + backface-visibility: hidden; +} +.card-back { + transform: rotateY(180deg); + background-color: black; + backface-visibility: hidden !important; +} +.card-front { + backface-visibility: hidden !important; +} +.card-back img { + width: 100%; + height: auto; + max-width: 300px; + max-height: 300px; + display: block; + margin: 0 auto; +} + +@media screen and (min-width: 768px) { + .feedback-form button[type="submit"] { + margin-left: 190px; + margin-right: auto; + } + } + + @media screen and (min-width: 480px) and (max-width: 767px) { + .feedback-form button[type="submit"] { + margin-left: auto; + margin-right: auto; + } + } + + @media screen and (max-width: 479px) { + .feedback-form button[type="submit"] { + margin-left: auto; + margin-right: auto; + width: 100%; + max-width: 10rem; + } + } + @media screen and (min-width: 592px) and (max-width:933px) { + .feedback-form button[type="submit"] { + margin-left: 100px; + } + } + @media screen and (min-width: 592px) and (max-width:941px) { + .feedback-form button[type="submit"] { + margin-left: 50px; + width: 5rem; + } + } + /*Appointment*/ + @media (width: 382px) and (height:592px){ + + #appointment { + width: 500px; + } + } + /*Patient Portal*/ + + @media screen and (min-width: 768px) and (max-width: 991px) { + .section-title h2 { + font-size: 30px; + } + + .section-title p { + font-size: 16px; + } + + .login-box { + max-width: 400px; + } + + .avatar img { + max-width: 80%; + } + + .avatar { + margin: 30px -62px; + } + .visitor-counter{ + bottom: 1%; + left: 4%; + } + } + + @media screen and (max-width: 767px) { + .section-title h2 { + font-size: 24px; + } + + .section-title p { + font-size: 14px; + } + + .login-box { + max-width: 100%; + padding: 15px; + } + + .avatar img { + max-width: 60%; + } + + .textbox input { + padding: 8px 8px 8px 25px; + } + + .btn { + padding: 8px; + } + + .register-link p, .forgot-password a { + font-size: 12px; + } + .avatar { + margin: 30px -62px; + } + .visitor-counter{ + bottom: 1%; + left: 4%; + } + } + @media screen and (width: 463px) and (height: 592px) { + .section-title h2 { + font-size: 30px; + } + + .section-title p { + font-size: 16px; + } + + .login-box { + max-width: 400px; + } + + .avatar img { + max-width: 30%; + } + + .avatar { + margin: 46px 15px; + } + .visitor-counter{ + bottom: 1%; + left: 4%; + } + + } + .doc-app:hover{ + background-color: teal !important; + font-size: 15px; + + } \ No newline at end of file diff --git a/index.html b/index.html index f2f859b4..52a1071b 100644 --- a/index.html +++ b/index.html @@ -1,20 +1,34 @@ - - + + + + + + + + - + RapiDoc - + + + @@ -23,80 +37,111 @@ - - - + + + + + + + + + + + + + + + - - - -
-
- -
-
- -

RapiDoc

-
- + +
+
+
+
+
+ Caduceus +
+ + - - -
+ + +
-

+ +

Welcome to RapiDoc!
Your one-stop digital
healthcare destination -

-

- -

-
- + +
+ +
-




- - - - - - - - -
-
-
-

About Us

-

RapiDoc is an online platform which enables you to get information about your nearest hospitals and - healthcare facilities. It aims to address health-related issues. It is a one-stop destination for all your - medical needs.

-
- -
-
- +
+

About Us

+
+
+
-
- -
-
-

HEALTH CHECKUPS

-

Bootcamps, personalised check-ups, newsletters, it’s all here.

+
+
+
+
+ +
+
+
+
HEALTH CHECKUPS
+
Bootcamps, personalised check-ups,newsletter, it's all here
+
- -
-
-

EMERGENCY WARDS

-

Avoid rush and get immediate medical assistance, know the - wards and vacancies. -

+
+
+
+ + + + + +
+
+
+
EMERGENCY WARDS
+
Avoid rush and get immediate medical assistance, the wards and vacancies.
+
- -
-
-

SERVICES

-

An apple a day won’t keep RapiDoc away. We are always here at your service, - bringing to you the bestΒ facilities.

+
+
+
+ + question + + + + + + + +
+
+
+
SERVICES
+
An apple a day won't keep Rapidoc away. We are always here at your service, bringing + to you the best facilities.
+
-
- +
-
- - + + + - -
-
- -
+

Doctors Available

Doctors listed on our website.


- Find out more » + Find out more »
- -
+
-

Beds Available

Beds available at your nearest emergency centers.


- Find out more » +

Beds Available

Nearby emergency beds available.


+ Find out more »
- -
+
- +

Nearest Labs

Test labs and clinics near you.


- Find out more » + Find out more »
- -
+

User Reviews

Over 1K positive reviews.


- Find out more » + Find out more »
-
- - - - +
-
- -
-

Services

-

Our services are for your good health. We are with you at everyΒ digitalΒ step.

-
- -
-
-
-
-

Clinics/Labs

-

Locate the best healthcare facilities around you hassle-free.

-
-
- -
-
-
-

Pharmacy

-

Get your prescribed medicines delivered at your doorstep.

-
-
- -
-
-
-

Daily Feed

-

Access to heath benefits like bootcamps, vaccination drives and much more - .

-
+
+

Services

+

Our services are for your good health. We are with you at everyΒ digitalΒ step.

+
+
+
+
+
+

Clinics/Labs

+

Locate the best healthcare facilities around you hassle-free.From routine check-ups to specialized + treatments, find the right clinic or lab that meets your needs. Our database is updated regularly to + ensure you have the most accurate information.

- -
-
-
-

Blood Bank

-

Know the blood banks and blood groups available around you. No one should suffer ỉn emergencies.

-
+
+
+
+
+

Pharmacy

+

Get your prescribed medicines delivered at your doorstep.Our pharmacy service ensures you never miss a + dose with timely reminders and easy refill options. Enjoy the convenience of home delivery and exclusive + discounts on a wide range of medicines.

- -
-
-
-

Disabled Person

-

Convenient medical care is here. Wheelchair accessible hospitals and clinics, find all in one go.

-
+
+
+
+
+

Daily Feed

+

Access to heath benefits like bootcamps, vaccination drives and much more.Stay informed about the latest + health trends, wellness tips, and upcoming events in your area. Participate in community health + initiatives and boost your wellbeing. +

- -
-
-
-

Health Post

-

Weekly, monthly, yearly or each day, however you like it!

-
+
+
+
+
+

Blood Bank

+

Know the blood banks and blood groups available around you. No one should suffer ỉn emergencies.Find the + nearest blood donation centers, check blood availability, and get information on how to donate or request + blood in urgent situations.

-
- -
-
- - -
-
- -
-

Patient Portal

-

Access your medical records, lab results, and prescription history securely.

-
- - -
- - - - -
-
- -
-

Make an Appointment

-

We listed the docs, we made you a form. You make us an appointment.



+
+
+ + + +
+
+
+

Patient Portal

+

Access your medical records, lab results, and prescription history securely.

-
-
-
-
- -
-
- -
-
- -
-
-
-
- -
-
- -
-
- -
-
- - -
-
- - -
-
- - -
-
- - -
-
- - -
-
- - -
-
- -
- -
- -
- +
+ + + +
-
-
- - - + + - -
+
+

Doctors

+

Don't compromise your health when we have listed the best doctors for you!

+
- -
-

Doctors

-

Don’t compromise your health when we have listed the best doctorsΒ forΒ you!

-
-
-
-
+
- -
-
+
- +
+
+
+
+

Pediatrician

+
+
-
- - - - - -
-
- -
-

Contact

-

Located your appointment. Feel free to give us feedback and help us improve our digitalΒ medΒ care.

-
-
- +
+ + + +
+
+

Contact

+

Located your appointment. Feel free to give us feedback and help us improve our digital med care.

+
+
- - -

- -
-
- +
+ + FNF Mods +
+
+
+
-
-
- -

Location:

-

IGDTUW, Delhi

+
+
+ +

Location:

+

IGDTUW, Delhi

+
+ +
+ +

Call:

+

+91 1234567890

+
- - +
+
+
+ +
+
+ +
+
+ +
+
+ +
+
+
+
+ Thank you for your message. We will get back to you shortly. +
+
+
+
+
+ + + +
+

+ What our Patients Say +

+
+
+
+
+
+ +
+

Dinesh

+ Bangalore +
- -
- -

Call:

-

+91 1234567890

+

This website is an excellent platform for providing healthcare facilities to users. It offers information about hospital availability, including bed availability, the total number of patients, and more.

+
+ + + + +
-


- -
-
-
-
- +
+
+ +
+

Virat

+ Delhi
-
- +
+

Using this platform, I could easily prebook my OPD appointments. It saved me a lot of time and effort. Highly recommended!

+
+ + + + +
+
+
+
+ +
+

Smrithi

+ Mumbai
-
- +

The website's feature to check the availability of blood groups in hospitals is very helpful. It made my search much easier and quicker.

+
+ + + +
-
- +
+
+
+ +
+

John

+ Chennai +
-
- - +

The detailed information about hospital facilities and patient management is commendable. This platform is a must-use for everyone.

+
+ + + + +
+
+
+
+ +
+

Shikha

+ Kolkata +
+
+

Excellent service and very user-friendly interface. It helped me find the right hospital and prebook my appointment without any hassle.

+
+ + + + +
+
-
- +
+
+
-
- + + + + + + +
+ +
- - - - - + +
+
+ + + +
+
+ + + + + + + + + + + + @@ -699,8 +805,15 @@

Daily Newsletter

- + + + + + + +
+ + - - \ No newline at end of file diff --git a/js/backtotopjs.js b/js/backtotopjs.js new file mode 100644 index 00000000..6e1a54e4 --- /dev/null +++ b/js/backtotopjs.js @@ -0,0 +1,24 @@ +/* Back to top up JS */ + +document.addEventListener("DOMContentLoaded", function () { + const backToTopButton = document.getElementById('back-to-top-container'); + + function checkButtonVisibility() { + if (window.innerWidth > 100 && window.scrollY > 100) { + backToTopButton.style.display = 'block'; + } else { + backToTopButton.style.display = 'none'; + } + } + + window.addEventListener('scroll', checkButtonVisibility); + window.addEventListener('resize', checkButtonVisibility); + + backToTopButton.addEventListener('click', function () { + window.scrollTo({ + top: 0, + behavior: 'smooth' + }); + }); + checkButtonVisibility(); + }); \ No newline at end of file diff --git a/js/caduceus.js b/js/caduceus.js new file mode 100644 index 00000000..85927d70 --- /dev/null +++ b/js/caduceus.js @@ -0,0 +1,7 @@ +document.addEventListener('DOMContentLoaded', function() { + const caduceus = document.getElementById('caduceus'); + + caduceus.addEventListener('mouseover', function() { + location.reload(); + }); +}); \ No newline at end of file diff --git a/js/chatbotjs.js b/js/chatbotjs.js new file mode 100644 index 00000000..27e5430a --- /dev/null +++ b/js/chatbotjs.js @@ -0,0 +1,5 @@ + +window.embeddedChatbotConfig = { + chatbotId: "xjRGZgxJziSoHQ1T1twl6", + domain: "www.chatbase.co" + } diff --git a/js/contactpopupmessage.js b/js/contactpopupmessage.js new file mode 100644 index 00000000..60910193 --- /dev/null +++ b/js/contactpopupmessage.js @@ -0,0 +1,13 @@ +/* Contact Form Popup Msg*/ +document.getElementById('contactForm').addEventListener('submit', function(event) { + event.preventDefault(); // Prevent form submission + // Display confirmation message + var confirmationMessage = document.getElementById('confirmationMessage'); + confirmationMessage.style.display = 'block'; + // Reset the form + event.target.reset(); + + setTimeout(function() { + confirmationMessage.style.display = 'none'; + }, 5000); //msg disappears after 5s + }); \ No newline at end of file diff --git a/js/date.js b/js/date.js new file mode 100644 index 00000000..313dad34 --- /dev/null +++ b/js/date.js @@ -0,0 +1,12 @@ +/* Date in Appointment Section */ +// To set value of minimum date in calendar +var currentDate = new Date(); +var year = currentDate.getFullYear(); +var month = (currentDate.getMonth() + 1).toString().padStart(2, '0'); +var day = currentDate.getDate().toString().padStart(2, '0'); +var formattedDate = `${year}-${month}-${day}`; +document.getElementById('date').setAttribute('min', formattedDate); + + +var currentYear = new Date().getFullYear(); + document.getElementById('year').textContent = currentYear; \ No newline at end of file diff --git a/js/emailvalidation.js b/js/emailvalidation.js new file mode 100644 index 00000000..572216a3 --- /dev/null +++ b/js/emailvalidation.js @@ -0,0 +1,47 @@ +emailjs.init("Your_User_ID"); // Replace with your actual EmailJS User ID + + // Function to validate email address + export function isValidEmail(email) { + // Simple email validation regex + const regex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; + if (!regex.test(email)) { + return false; + } + + // Extract domain + const domain = email.split('@')[1].toLowerCase(); + const validDomains = ['gmail.com', 'outlook.com', 'yahoo.com']; + + return validDomains.includes(domain); + } + + document.addEventListener('DOMContentLoaded', function() { + document.getElementById('subscribeForm').addEventListener('submit', function(event) { + event.preventDefault(); + + var email = document.getElementById('emailInput').value; + + if (!isValidEmail(email)) { + alert('Please enter a valid email address from Gmail, Outlook, or Yahoo.'); + return; + } + + // Prepare the parameters to send + var templateParams = { + to_email: email, // Set the recipient's email + from_name: 'Rapidoc', // Replace with your company or your name + to_name: 'Subscriber', + message: 'Thank you for subscribing to our newsletter!' + }; + + // Send email + emailjs.send('Your_Service_ID', 'Your_Template_ID', templateParams) + .then(function(response) { + console.log('Email sent successfully:', response); + alert('Successfully subscribed to our newsletter!'); + }, function(error) { + console.error('Error sending email:', error); + alert('Failed to send email. Please try again later.'); + }); + }); + }); \ No newline at end of file diff --git a/js/feedbackmessage.js b/js/feedbackmessage.js new file mode 100644 index 00000000..b3b6e28a --- /dev/null +++ b/js/feedbackmessage.js @@ -0,0 +1,102 @@ +/* Feedback Message */ + function handleSubmit(event) { + event.preventDefault(); + const feedbackMessage = document.getElementById('feedback-message'); + feedbackMessage.style.display = 'inline'; + setTimeout(() => { + feedbackMessage.style.display = 'none'; + }, 3000); + } + +// /* Rating */ +let rating = null; + +function handleRatingChange(value) { + rating = value; + updateStars(); +} + function handleRatingChange(newRating) { + rating = newRating; + updateEmojis(); + console.log("Rating selected:", rating); + } + + function updateEmojis() { + const buttons = document.querySelectorAll('.rating-container button'); + buttons.forEach((button, index) => { + button.textContent = getEmoji(index + 1); + }); + } + +// script.js +const emojiGifs = document.querySelectorAll('.emoji-gif'); +const selectedEmojiElement = document.getElementById('selected-emoji'); +const selectedGifElement = document.getElementById('selected-gif'); + +emojiGifs.forEach(gif => { + gif.addEventListener('click', () => { + const emoji = gif.getAttribute('data-emoji'); + const gifSrc = gif.getAttribute('data-gif-src'); + selectedEmojiElement.textContent = emoji; + selectedGifElement.src = gifSrc; + }); +}); + +// function getEmoji(rating) { +// switch(rating) { +// case 1: return '😑'; +// case 2: return '☹️'; +// case 3: return '😐'; +// case 4: return 'πŸ™‚'; +// case 5: return 'πŸ˜„'; +// default: return '😐'; +// } +// } + +function handleSubmit(event) { + event.preventDefault(); + + const name = document.getElementById('name').value; + const email = document.getElementById('email').value; + const feedback = document.getElementById('feedback').value; + + // For now, we will just simulate email sending success + console.log('Feedback submitted:', { name, email, rating, feedback }); + + // Reset the form fields + document.getElementById('feedback-form').reset(); + rating = null; + updateStars(); + + // Show the popup + document.getElementById('popup').style.display = 'flex'; +} + +function closePopup() { + document.getElementById('popup').style.display = 'none'; +} + +const feedbackForm = document.querySelector('.feedback-form'); + +function isElementInViewport(el) { + const rect = el.getBoundingClientRect(); + return ( + rect.top >= 0 && + rect.left >= 0 && + rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) && + rect.right <= (window.innerWidth || document.documentElement.clientWidth) + ); +} + +function handleScroll() { + if (isElementInViewport(feedbackForm)) { + feedbackForm.classList.add('animate-feedback'); + window.removeEventListener('scroll', handleScroll); + } +} + +window.addEventListener('scroll', handleScroll); + +updateStars(); + + diff --git a/js/footersubcribejs.js b/js/footersubcribejs.js new file mode 100644 index 00000000..35cbdf09 --- /dev/null +++ b/js/footersubcribejs.js @@ -0,0 +1,66 @@ +/* Footer Subscribe JS */ +document.querySelector('.subscribe-form').addEventListener('submit', function (event) { + event.preventDefault(); // Prevent the form from submitting in the traditional way + + // Here you would normally send the form data to the server using fetch or XMLHttpRequest + // For demonstration purposes, we'll just show the confirmation message + + const confirmationMessage = document.querySelector('.confirmation-message'); + confirmationMessage.style.display = 'block'; // Show the confirmation message + + // Clear the input field + this.querySelector('input[type="email"]').value = ''; + + // Optionally, you can hide the confirmation message after a few seconds + setTimeout(() => { + confirmationMessage.style.display = 'none'; + }, 5000); // Hide after 5 seconds + }); + + /* popup msg*/ + + document.querySelector('.subscribe-form').addEventListener('submit', function(event) { + event.preventDefault(); // Prevent the form from submitting in the traditional way + + // Show the modal popup + const modal = document.getElementById('popupModal'); + modal.style.display = 'block'; + + // Clear the input field + this.querySelector('input[type="email"]').value = ''; + + // Hide the modal when the close button is clicked + const closeModal = document.querySelector('.modal .close'); + closeModal.onclick = function() { + modal.style.display = 'none'; + } + }); + + // Hide the modal when clicking outside of it + window.onclick = function(event) { + const modal = document.getElementById('popupModal'); + if (event.target == modal) { + modal.style.display = 'none'; + } + } + + /* Subscribe Banner*/ + document.getElementById('subscribeForm').addEventListener('submit', function(event) { + event.preventDefault(); // Prevent default form submission + + // Get the email input value + var email = document.getElementById('emailInput').value; + + // You can add further validation of the email input here if needed + + // Show the subscribe banner + document.getElementById('subscribeBanner').style.display = 'block'; + + // Optionally, you can reset the form + document.getElementById('subscribeForm').reset(); + + // Simulate a delay and hide the banner after 5 seconds + setTimeout(function() { + document.getElementById('subscribeBanner').style.display = 'none'; + }, 5000); + }); \ No newline at end of file diff --git a/js/googletranslatejs.js b/js/googletranslatejs.js new file mode 100644 index 00000000..cb28661e --- /dev/null +++ b/js/googletranslatejs.js @@ -0,0 +1,10 @@ +/* Google Translate JS*/ + function googleTranslateElementInit() { + new google.translate.TranslateElement({ + pageLanguage: 'en', + }, 'google_translate_element'); + } + + function loadGoogleTranslate() { + new google.translate.TranslateElement("google_element"); + } \ No newline at end of file diff --git a/js/imageswap.js b/js/imageswap.js new file mode 100644 index 00000000..527e6a15 --- /dev/null +++ b/js/imageswap.js @@ -0,0 +1,36 @@ +/*About Section*/ +document.querySelectorAll('.about-us-community').forEach(function (element) { + element.addEventListener('mouseover', function () { + element.querySelector('img').src = './images/checkuphover.png'; + }); + element.addEventListener('mouseleave', function () { + element.querySelector('img').src = './images/checkup.png'; + }); + }); + + document.querySelectorAll('.about-us-event').forEach(function (element) { + element.addEventListener('mouseover', function () { + element.querySelector('img').src = './images/serviceshover.png'; + }); + element.addEventListener('mouseleave', function () { + element.querySelector('img').src = './images/services.png'; + }); + }); + + document.querySelectorAll('.about-us-product').forEach(function (element) { + element.addEventListener('mouseover', function () { + element.querySelector('img').src = './images/wardhover.png'; + }); + element.addEventListener('mouseleave', function () { + element.querySelector('img').src = './images/ward.png'; + }); + }); + + document.querySelectorAll('.about-us-location').forEach(function (element) { + element.addEventListener('mouseover', function () { + element.querySelector('img').src = './images/appointmenthover.png'; + }); + element.addEventListener('mouseleave', function () { + element.querySelector('img').src = './images/appointment.png'; + }); + }); \ No newline at end of file diff --git a/js/loaderjs.js b/js/loaderjs.js new file mode 100644 index 00000000..e633ed0b --- /dev/null +++ b/js/loaderjs.js @@ -0,0 +1,18 @@ +window.addEventListener("load", () => { + const loader = document.querySelector(".pre"); + + loader.classList.add("pre--hidden"); + + loader.addEventListener("transitionend", () => { + document.body.removeChild(loader); + }); + }); + window.addEventListener("load", () => { + const loader = document.querySelector(".loader"); + + loader.classList.add("loader--hidden"); + + loader.addEventListener("transitionend", () => { + document.body.removeChild(loader); + }); + }); \ No newline at end of file diff --git a/js/login.js b/js/login.js new file mode 100644 index 00000000..270bd7f6 --- /dev/null +++ b/js/login.js @@ -0,0 +1,113 @@ +const signUpButton = document.getElementById("signUp"); +const signInButton = document.getElementById("signIn"); +const container = document.getElementById("container"); +let uppass = []; +let inpass = []; +let userImgPassInput = []; +signUpButton.addEventListener("click", () => { + container.classList.add("right-panel-active"); + inpass = []; + uppass = []; +}); + +signInButton.addEventListener("click", () => { + container.classList.remove("right-panel-active"); + inpass = []; + uppass = []; +}); +// adding and removing border +function upimg(element) { + var Image = element.querySelector("img"); + if (Image) { + if (Image.classList.contains("clicked")) { + Image.classList.remove("clicked"); + uppass.splice(uppass.indexOf(element.id), 1); + } else { + Image.classList.add("clicked"); + uppass.push(element.id); + } + } +} + +function inimg(element) { + var Image = element.querySelector("img"); + if (Image) { + if (Image.classList.contains("clicked")) { + Image.classList.remove("clicked"); + } else { + Image.classList.add("clicked"); + } + } +} +// element image recognition +function signup() { + sessionStorage.setItem("upname", document.getElementById("upmail").value); + sessionStorage.setItem("uppass", uppass); + sessionStorage.setItem("userpass", document.getElementById("s-pass").value); + var myText = "Account Created Succesfully"; + alert(myText); +} +// image pattern authentication +var v2 = new Boolean(false); +function signin() { + userImgPassInput = []; + const userEmailInput = document.getElementById("inmail").value; + const userPassInput = document.getElementById("l-pass").value; + const userImgPass = sessionStorage.getItem("uppass"); + const userEmail = sessionStorage.getItem("upname"); + const userPass = sessionStorage.getItem("userpass"); + const clickedImage = document.getElementsByClassName("clicked"); + for (let index = 0; index < clickedImage.length; index++) { + userImgPassInput.push(clickedImage[index].parentElement.id); + } + console.log(userPass, userPassInput); + if (!graphicMode) { + if ( + userImgPass === userImgPassInput.toString() && + userEmailInput === userEmail + ) { + var myText = "Login is successful"; + alert(myText); + NewTab(); + } else { + var myText = "Login Failed"; + alert(myText); + } + } else { + if ( + userImgPass === userImgPassInput.toString() && + userEmailInput === userEmail && + userPassInput.toString() == userPass.toString() + ) { + var myText = "Login is successful"; + alert(myText); + NewTab(); + } else { + var myText = "Login Failed"; + alert(myText); + } + } +} + +function NewTab() { + window.open("index.html", "_blank"); +} + +// TIMEPASS KA CODE // +// const inpassBtn = document.getElementsByClassName("inpass"); +// const timepassBtn = document.getElementsByClassName("timepass"); +// graphicMode = true; +// for (let index = 0; index < timepassBtn.length; index++) { +// timepassBtn[index].addEventListener("click", function (event) { +// console.log(event.target); +// if (graphicMode) { +// graphicMode = false; +// inpassBtn[0].style.display = "none"; +// inpassBtn[1].style.display = "none"; +// } else { +// graphicMode = true; +// inpassBtn[0].style.display = "block"; +// inpassBtn[1].style.display = "block"; +// } +// }); +// } \ No newline at end of file diff --git a/js/main.js b/js/main.js index 1ab4f709..e2dd1c99 100644 --- a/js/main.js +++ b/js/main.js @@ -6,14 +6,20 @@ * Easy selector helper function */ const select = (el, all = false) => { - el = el.trim() + // Check if el is a string + if (typeof el !== 'string') { + console.error('The selector must be a string.'); + return; + } + + el = el.trim(); + if (all) { - return [...document.querySelectorAll(el)] + return [...document.querySelectorAll(el)]; } else { - return document.querySelector(el) + return document.querySelector(el); } } - /** * Easy event listener function */ @@ -163,7 +169,4 @@ const typed = new Typed('.multiple-text',{ backSpeed: 100, backDelay: 1000, loop:true, -}) - - - +}) \ No newline at end of file diff --git a/js/news.js b/js/news.js new file mode 100644 index 00000000..d94f55a0 --- /dev/null +++ b/js/news.js @@ -0,0 +1,22 @@ +let slideIndex = 0; +showSlides(); + +function showSlides() { + let slides = document.getElementsByClassName("mySlides"); + + + for (let i = 0; i < slides.length; i++) { + slides[i].style.opacity = 0; + } + + + slideIndex++; + if (slideIndex > slides.length) { + slideIndex = 1; + } + + slides[slideIndex - 1].style.opacity = 1; + + + setTimeout(showSlides, 4000); +} diff --git a/js/patientportal_loginjs.js b/js/patientportal_loginjs.js new file mode 100644 index 00000000..532f9619 --- /dev/null +++ b/js/patientportal_loginjs.js @@ -0,0 +1,12 @@ +document.getElementById('loginForm').addEventListener('submit', function(event) { + event.preventDefault(); + // Here you can add actual login logic, for now, we'll just show the message + var loginMessage = document.getElementById('loginMessage'); + loginMessage.textContent = 'Login Successful'; + loginMessage.style.display = 'block'; + + // Set a timeout to hide the message after 3 seconds + setTimeout(function() { + loginMessage.style.display = 'none'; + }, 3000); + }); \ No newline at end of file diff --git a/js/phonejs.js b/js/phonejs.js new file mode 100644 index 00000000..6f4c502f --- /dev/null +++ b/js/phonejs.js @@ -0,0 +1,21 @@ + +document.addEventListener("DOMContentLoaded", function () { + const phoneInputField = document.getElementById('phone'); + const iti = window.intlTelInput(phoneInputField, { + initialCountry: "auto", + geoIpLookup: function (callback) { + fetch('https://ipinfo.io/json?token=YOUR_TOKEN') + .then(response => response.json()) + .then(data => callback(data.country)) + .catch(() => callback('us')); + }, + utilsScript: "https://cdnjs.cloudflare.com/ajax/libs/intl-tel-input/17.0.8/js/utils.js" + }); + document.getElementById('phone-form').addEventListener('submit', function (event) { + event.preventDefault(); + const phoneNumber = iti.getNumber(); + console.log('Full Phone Number:', phoneNumber); + + // You can now send this phone number to your server or process it as needed + }); + }); diff --git a/js/popupbloodlist.js b/js/popupbloodlist.js new file mode 100644 index 00000000..da0005cb --- /dev/null +++ b/js/popupbloodlist.js @@ -0,0 +1,135 @@ +document.addEventListener('DOMContentLoaded', function() { + const popup = document.getElementById('popup'); + const closeBtn = document.querySelector('.close'); + const popupContent = document.getElementById('popupContent'); + + // Blood type data + const bloodTypeData = { + 'A+': { + donors: [ + { name: 'John Doe', amount: 0.5 }, + { name: 'Jane Smith', amount: 0.7 } + ], + recipients: [ + { name: 'Alice Johnson', amount: 0.6 }, + { name: 'Bob Williams', amount: 0.8 } + ] + }, + 'O+': { + donors: [ + { name: 'Emily Brown', amount: 0.6 }, + { name: 'Michael Davis', amount: 0.5 } + ], + recipients: [ + { name: 'Sarah Miller', amount: 0.7 }, + { name: 'David Wilson', amount: 0.4 } + ] + }, + 'B+': { + donors: [ + { name: 'Jennifer Lee', amount: 0.4 }, + { name: 'Robert Taylor', amount: 0.8 } + ], + recipients: [ + { name: 'William Anderson', amount: 0.5 }, + { name: 'Lisa Martinez', amount: 0.6 } + ] + }, + 'AB+': { + donors: [ + { name: 'Jessica Brown', amount: 0.7 }, + { name: 'Thomas Moore', amount: 0.5 } + ], + recipients: [ + { name: 'Karen White', amount: 0.4 }, + { name: 'Daniel Clark', amount: 0.8 } + ] + }, + 'A': { + donors: [ + { name: 'Patricia Garcia', amount: 0.6 }, + { name: 'James Rodriguez', amount: 0.5 } + ], + recipients: [ + { name: 'Nancy Lewis', amount: 0.7 }, + { name: 'Christopher Lee', amount: 0.3 } + ] + }, + 'O': { + donors: [ + { name: 'Margaret Wilson', amount: 0.5 }, + { name: 'Joseph Thompson', amount: 0.6 } + ], + recipients: [ + { name: 'Barbara Martin', amount: 0.4 }, + { name: 'Richard Harris', amount: 0.7 } + ] + }, + 'B': { + donors: [ + { name: 'Elizabeth Hall', amount: 0.7 }, + { name: 'Charles Young', amount: 0.4 } + ], + recipients: [ + { name: 'Susan Allen', amount: 0.6 }, + { name: 'Kevin Scott', amount: 0.5 } + ] + }, + 'AB': { + donors: [ + { name: 'Dorothy King', amount: 0.5 }, + { name: 'Mark Baker', amount: 0.6 } + ], + recipients: [ + { name: 'Linda Green', amount: 0.4 }, + { name: 'Paul Adams', amount: 0.7 } + ] + } + }; + + // Function to generate popup content + function generatePopupContent(bloodType) { + const data = bloodTypeData[bloodType]; + let content = `

${bloodType} Blood

`; + + content += `

Donors

`; + let totalDonation = 0; + data.donors.forEach(donor => { + content += `

${donor.name}: ${donor.amount} L

`; + totalDonation += donor.amount; + }); + content += `

Total Donation: ${totalDonation.toFixed(2)} L

`; + + content += `

Recipients

`; + let totalNeeded = 0; + data.recipients.forEach(recipient => { + content += `

${recipient.name}: ${recipient.amount} L

`; + totalNeeded += recipient.amount; + }); + content += `

Total Needed: ${totalNeeded.toFixed(2)} L

`; + + return content; + } + + // Add click event listeners to all "Get List" buttons + document.querySelectorAll('.get-list-btn').forEach(btn => { + btn.addEventListener('click', function(e) { + e.preventDefault(); + const bloodType = this.id.split('-')[1]; + popupContent.innerHTML = generatePopupContent(bloodType); + popup.style.display = 'block'; + }); + }); + + // Close popup when clicking the close button + closeBtn.addEventListener('click', function() { + popup.style.display = 'none'; + }); + + // Close popup when clicking outside the popup content + window.addEventListener('click', function(e) { + if (e.target == popup) { + popup.style.display = 'none'; + } + }); +}); \ No newline at end of file diff --git a/js/popupfeedback.js b/js/popupfeedback.js new file mode 100644 index 00000000..6a8e2e35 --- /dev/null +++ b/js/popupfeedback.js @@ -0,0 +1,36 @@ +function toggleMenu() { + const navLinks = document.querySelector('.nav_link'); + navLinks.classList.toggle('vis-h'); + } + + function openFeedback() { + document.getElementById('overlay').style.display = 'block'; + document.getElementById('feedback-wrapper').style.display = 'block'; + } + + function closeFeedback() { + document.getElementById('overlay').style.display = 'none'; + document.getElementById('feedback-wrapper').style.display = 'none'; + } + + function handleRatingChange(rating) { + console.log('Rating:', rating); + } + + function handleSubmit(event) { + event.preventDefault(); + const name = document.getElementById('name').value; + const email = document.getElementById('email').value; + const feedback = document.getElementById('feedback').value; + console.log('Feedback submitted:', { name, email, feedback }); + closeFeedback(); + } + + // popup will be displayed when placed cursor pointer on rateus in navbar + document.addEventListener('DOMContentLoaded', function() { + const rateUsLink = document.querySelector('a[href="#feedback"]'); + rateUsLink.addEventListener('click', function(e) { + e.preventDefault(); + openFeedback(); + }); + }); \ No newline at end of file diff --git a/js/progressbar_and_header.js b/js/progressbar_and_header.js new file mode 100644 index 00000000..43ab02a4 --- /dev/null +++ b/js/progressbar_and_header.js @@ -0,0 +1,16 @@ + +const hamburger = document.querySelector('.hamburger'); +const navbar = document.querySelector('.header_container'); +const nav = document.querySelector('.nav_link'); +hamburger.addEventListener('click', () => { + navbar.classList.toggle('nav-h'); + nav.classList.toggle('vis-h'); +}) + + +window.onscroll = function () { + var winScroll = document.body.scrollTop || document.documentElement.scrollTop; + var height = document.documentElement.scrollHeight - document.documentElement.clientHeight; + var scrolled = (winScroll / height) * 100; + document.getElementById("progressBar").style.width = scrolled + "%"; +}; \ No newline at end of file diff --git a/js/revealelementsonscrolljsfor_index_html.js b/js/revealelementsonscrolljsfor_index_html.js new file mode 100644 index 00000000..50964c20 --- /dev/null +++ b/js/revealelementsonscrolljsfor_index_html.js @@ -0,0 +1,14 @@ + +ScrollReveal({ + //reset: true , + distance: '60px', + duration: 2500, + delay: 400 + }); + ScrollReveal().reveal('.d-flex,#home', { delay: 500, origin: 'top' }); + ScrollReveal().reveal('.logo , .navbar,.content', { delay: 500, origin: 'left' }); + ScrollReveal().reveal('.sec-img', { delay: 500, origin: 'right' }); + ScrollReveal().reveal('.col-md-6,.about', { delay: 600, origin: 'left' }); + ScrollReveal().reveal('.col-lg-3', { delay: 500, origin: 'left' }); + ScrollReveal().reveal('.feedback', { delay: 400, origin: 'left' }); + ScrollReveal().reveal('.footer', { delay: 400, origin: 'bottom' }); diff --git a/js/script.js b/js/script.js index 655833c0..7268f21e 100644 --- a/js/script.js +++ b/js/script.js @@ -1,28 +1,7 @@ -var swiper = new Swiper(".slide-content", { - slidesPerView: 3, - spaceBetween: 25, - loop: true, - centerSlide: true, - fade: true, - grabCursor: 'true', - pagination: { - el: ".swiper-pagination", - clickable: true, - dynamicBullets: true, - }, - navigation:{ - nextEl: ".swiper-button-next", - prevEl: ".swiper-button-prev", - }, - breakpoints:{ - 0:{ - slidesPerView: 1, - }, - 520:{ - slidesPerView: 2, - }, - 950:{ - slidesPerView: 3, - }, - }, - }); \ No newline at end of file +document.getElementById('login').addEventListener('click', () => { + document.getElementById('container').classList.remove('right-panel-active'); +}); + +document.getElementById('register').addEventListener('click', () => { + document.getElementById('container').classList.add('right-panel-active'); +}); diff --git a/js/testimonalslider.js b/js/testimonalslider.js new file mode 100644 index 00000000..af6b5ec2 --- /dev/null +++ b/js/testimonalslider.js @@ -0,0 +1,28 @@ +const swiper = new Swiper('.js-testimonals-slider', { + grabCursor: true, + spaceBetween: 30, + loop: true, // Added loop for continuous sliding + pagination: { + el: '.js-testimonals-pagination', + clickable: true + }, + navigation: { + nextEl: '.swiper-button-next', + prevEl: '.swiper-button-prev', + }, + breakpoints: { + // Maintain single view on mobile + 320: { + slidesPerView: 1, + }, + // Two slides on tablets and larger + 768: { + slidesPerView: 2, + } + }, + // Optional: Add autoplay + autoplay: { + delay: 5000, + disableOnInteraction: false, + }, +}); diff --git a/js/tilt.js b/js/tilt.js new file mode 100644 index 00000000..9b8262cb --- /dev/null +++ b/js/tilt.js @@ -0,0 +1,32 @@ +document.addEventListener("DOMContentLoaded", function() { + const images = document.getElementsByTagName('img'); + + Array.from(images).forEach(img => { + img.addEventListener("mousemove", function(event) { + const rect = img.getBoundingClientRect(); + const imgX = rect.left + rect.width / 2; + const imgY = rect.top + rect.height / 2; + const mouseX = event.clientX - imgX; + const mouseY = event.clientY - imgY; + + const rotateX = mouseY * 0.05; + const rotateY = mouseX * -0.05; + + gsap.to(img, { + rotationX: rotateX, + rotationY: rotateY, + ease: "power2.out", + duration: 0.3 + }); + }); + + img.addEventListener("mouseleave", function() { + gsap.to(img, { + rotationX: 0, + rotationY: 0, + ease: "power2.out", + duration: 0.5 + }); + }); + }); + }); \ No newline at end of file diff --git a/log/favicon.ico b/log/favicon.ico new file mode 100644 index 00000000..09cbadfe Binary files /dev/null and b/log/favicon.ico differ diff --git a/log/forgetpass.css b/log/forgetpass.css new file mode 100644 index 00000000..e1171089 --- /dev/null +++ b/log/forgetpass.css @@ -0,0 +1,97 @@ + +.popup { + display: none; + position: fixed; + z-index: 1000; + left: 0; + top: 0; + width: 100%; + height: 100%; + overflow: hidden; + background-color: rgb(52, 49, 49); + } + + .popup-content { + background-color: #fefefe; + margin: 9% auto; + padding: 20px; + border: 1px solid #888; + width: 80%; + max-width: 400px; + border-radius: 10px; + position: relative; + } + + .popup-content h2 { + margin-top: 0; + } + + .popup-content input { + width: 100%; + padding: 10px; + margin: 10px 0; + border: 1px solid #ddd; + border-radius: 4px; + box-sizing: border-box; + } + + .popup-content button { + width: 100%; + padding: 10px; + background-color: #022a2d; + color: white; + border: none; + border-radius: 4px; + cursor: pointer; + } + + .popup-content button:hover { + background-color: linear-gradient(270deg, #06bdc0, #05d3e2); + } + + #passwordRequirements { + font-size: 12px; + color: #666; + margin-bottom: 10px; + } + + .close { + color: #aaa; + float: right; + font-size: 28px; + font-weight: bold; + cursor: pointer; + position: absolute; + top: 10px; + right: 15px; + } + + .close:hover, + .close:focus { + color: #06bdc0; + text-decoration: none; + cursor: pointer; + } + /* Passwrod visibility css*/ +.password-input-container { +position: relative; +} + +.password-toggle { +position: absolute; +right: 10px; +top: 10%; +transform: translateY(-50%); +cursor: pointer; +} + +.password-toggle i { +font-size: 18px; +color: #888; +} + +.password-input-container input[type="password"], +.password-input-container input[type="text"] { +padding-right: 30px; +} +@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css'); \ No newline at end of file diff --git a/log/forgetpass.js b/log/forgetpass.js new file mode 100644 index 00000000..c993d4d5 --- /dev/null +++ b/log/forgetpass.js @@ -0,0 +1,122 @@ +document.addEventListener('DOMContentLoaded', function() { + const forgotPasswordLink = document.querySelector('.pass-link a'); + const popup = document.getElementById('forgotPasswordPopup'); + const closeBtn = popup.querySelector('.close'); + const resetForm = document.getElementById('resetPasswordForm'); + + forgotPasswordLink.addEventListener('click', function(e) { + e.preventDefault(); + popup.style.display = 'block'; + }); + + closeBtn.addEventListener('click', function() { + popup.style.display = 'none'; + }); + + window.addEventListener('click', function(e) { + if (e.target == popup) { + popup.style.display = 'none'; + } + }); + + resetForm.addEventListener('submit', function(e) { + e.preventDefault(); + const email = document.getElementById('resetEmail').value; + const newPassword = document.getElementById('newPassword').value; + const confirmPassword = document.getElementById('confirmPassword').value; + + if (validatePassword(newPassword, confirmPassword)) { + // Here you would typically send a request to your server to reset the password + alert('Password successfully changed!'); + popup.style.display = 'none'; + } + }); + + function validatePassword(password, confirmPassword) { + const passwordRegex = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[!@#$%^&*])[A-Za-z\d!@#$%^&*]{8,}$/; + + if (!passwordRegex.test(password)) { + alert('Password must be at least 8 characters long and contain at least one uppercase letter, one lowercase letter, one number, and one special character.'); + return false; + } + + if (password !== confirmPassword) { + alert('Passwords do not match.'); + return false; + } + + return true; + } + }); + + + /*Password Visibility*/ + document.addEventListener('DOMContentLoaded', function() { + const forgotPasswordLink = document.querySelector('.pass-link a'); + const popup = document.getElementById('forgotPasswordPopup'); + const closeBtn = popup.querySelector('.close'); + const resetForm = document.getElementById('resetPasswordForm'); + const passwordToggles = document.querySelectorAll('.password-toggle'); + + forgotPasswordLink.addEventListener('click', function(e) { + e.preventDefault(); + popup.style.display = 'block'; + }); + + closeBtn.addEventListener('click', function() { + popup.style.display = 'none'; + }); + + window.addEventListener('click', function(e) { + if (e.target == popup) { + popup.style.display = 'none'; + } + }); + + resetForm.addEventListener('submit', function(e) { + e.preventDefault(); + const email = document.getElementById('resetEmail').value; + const newPassword = document.getElementById('newPassword').value; + const confirmPassword = document.getElementById('confirmPassword').value; + + if (validatePassword(newPassword, confirmPassword)) { + // Here you would typically send a request to your server to reset the password + alert('Password successfully changed!'); + popup.style.display = 'none'; + } + }); + + passwordToggles.forEach(toggle => { + toggle.addEventListener('click', function() { + const targetId = this.getAttribute('data-target'); + const targetInput = document.getElementById(targetId); + const icon = this.querySelector('i'); + + if (targetInput.type === 'password') { + targetInput.type = 'text'; + icon.classList.remove('fa-eye'); + icon.classList.add('fa-eye-slash'); + } else { + targetInput.type = 'password'; + icon.classList.remove('fa-eye-slash'); + icon.classList.add('fa-eye'); + } + }); + }); + + function validatePassword(password, confirmPassword) { + const passwordRegex = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[!@#$%^&*])[A-Za-z\d!@#$%^&*]{8,}$/; + + if (!passwordRegex.test(password)) { + alert('Password must be at least 8 characters long and contain at least one uppercase letter, one lowercase letter, one number, and one special character.'); + return false; + } + + if (password !== confirmPassword) { + alert('Passwords do not match.'); + return false; + } + + return true; + } + }); \ No newline at end of file diff --git a/log/image.gif b/log/image.gif new file mode 100644 index 00000000..1eb81938 Binary files /dev/null and b/log/image.gif differ diff --git a/log/login.css b/log/login.css new file mode 100644 index 00000000..8808ee42 --- /dev/null +++ b/log/login.css @@ -0,0 +1,536 @@ +@import url("https://fonts.googleapis.com/css2?family=Poppins"); + +* { + box-sizing: border-box; +} + +body { + display: flex; + background: black; + justify-content: center; + align-items: center; + flex-direction: column; + font-family: "Poppins", sans-serif; + overflow: hidden; + height: 100vh; +} +.top-left-corner { + position: absolute; + top: 10px; + left: 50px; +} +.eye.active { + color: #007bff; /* Change this to whatever color you prefer */ +} + + +.home-button { + display: inline-flex; + align-items: center; + justify-content: center; + width: 40px; + height: 40px; + background-color: #f8f9fa; + border: 1px solid #ddd; + border-radius: 8px; + text-decoration: none; + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); + transition: background-color 0.3s, box-shadow 0.3s; +} + +.home-button:hover { + background-color: #6be1f9; + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); +} + +.home-button svg { + fill: #4bb6b7; + width: 30px; + height: 30px; +} + +h1 { + font-weight: 700; + letter-spacing: -1.5px; + margin: 0; + margin-bottom: 15px; +} + +h1.title { + font-size: 45px; + line-height: 45px; + margin: 0; + text-shadow: 0 0 10px rgba(16, 64, 74, 0.5); +} + +p { + font-size: 14px; + font-weight: 100; + line-height: 20px; + letter-spacing: 0.5px; + margin: 20px 0 30px; + text-shadow: 0 0 10px rgba(16, 64, 74, 0.5); +} + +span { + font-size: 14px; + margin-top: 25px; +} + +a { + color: #333; + font-size: 14px; + text-decoration: none; + margin: 15px 0; + transition: 0.3s ease-in-out; +} + +a:hover { + color: #4bb6b7; +} + +.content { + display: flex; + width: 100%; + height: 50px; + align-items: center; + justify-content: space-around; +} + +.content .checkbox { + display: flex; + align-items: center; + justify-content: center; +} + +.content input { + accent-color: #333; + width: 12px; + height: 12px; +} + +.content label { + font-size: 14px; + user-select: none; + padding-left: 5px; +} + +button { + position: relative; + border-radius: 20px; + border: 1px solid #022a2d; + background-color: #022a2d; + color: #fff; + font-size: 15px; + font-weight: 700; + margin: 10px; + padding: 12px 80px; + letter-spacing: 1px; + text-transform: capitalize; + transition: 0.3s ease-in-out; +} + +button:hover { + letter-spacing: 3px; + background-color: #28cacd; +} + +button:active { + transform: scale(0.95); +} + +button:focus { + outline: none; +} + +button.ghost { + background-color: rgba(225, 225, 225, 0.2); + border: 2px solid #fff; + color: #fff; +} + +button.ghost i{ + position: absolute; + opacity: 0; + transition: 0.3s ease-in-out; +} + +button.ghost i.register{ + right: 70px; +} + +button.ghost i.login{ + left: 70px; +} + +button.ghost:hover i.register{ + right: 40px; + opacity: 1; +} + +button.ghost:hover i.login{ + left: 40px; + opacity: 1; +} + +form { + background-color: #fff; + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + padding: 0 50px; + height: 100%; + text-align: center; +} + +input { + background-color: #eee; + border-radius: 10px; + border: none; + padding: 12px 15px; + margin: 8px 0; + width: 100%; +} + +.container { + background-color: #fff; + border-radius: 25px; + box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22); + position: relative; + overflow: hidden; + width: 768px; + max-width: 100%; + min-height: 500px; +} + +.form-container { + position: absolute; + top: 0; + height: 100%; + transition: all 0.6s ease-in-out; +} + +.login-container { + left: 0; + width: 50%; + z-index: 2; +} + +.container.right-panel-active .login-container { + transform: translateX(100%); +} + +.register-container { + left: 0; + width: 50%; + opacity: 0; + z-index: 1; +} + +.container.right-panel-active .register-container { + transform: translateX(100%); + opacity: 1; + z-index: 5; + animation: show 0.6s; +} + +@keyframes show { + 0%, + 49.99% { + opacity: 0; + z-index: 1; + } + + 50%, + 100% { + opacity: 1; + z-index: 5; + } +} + +.overlay-container { + position: absolute; + top: 0; + left: 50%; + width: 50%; + height: 100%; + overflow: hidden; + transition: transform 0.6s ease-in-out; + z-index: 100; +} + +.container.right-panel-active .overlay-container { + transform: translate(-100%); +} + +.overlay { + background-image: url('image.gif'); + background-repeat: no-repeat; + background-size: cover; + background-position: 0 0; + color: #fff; + position: relative; + left: -100%; + height: 100%; + width: 200%; + transform: translateX(0); + transition: transform 0.6s ease-in-out; +} + +.overlay::before { + content: ""; + position: absolute; + left: 0; + right: 0; + top: 0; + bottom: 0; + background: linear-gradient( + to top, + rgba(46, 94, 109, 0.4) 40%, + rgba(46, 94, 109, 0) + ); +} + +.container.right-panel-active .overlay { + transform: translateX(50%); +} + +.overlay-panel { + position: absolute; + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + padding: 0 40px; + text-align: center; + top: 0; + height: 100%; + width: 50%; + transform: translateX(0); + transition: transform 0.6s ease-in-out; +} + +.overlay-left { + transform: translateX(-20%); +} + +.container.right-panel-active .overlay-left { + transform: translateX(0); +} + +.overlay-right { + right: 0; + transform: translateX(0); +} + +.container.right-panel-active .overlay-right { + transform: translateX(20%); +} + +.social-container { + margin: 20px 0; +} + +.social-container a { + border: 1px solid #dddddd; + border-radius: 50%; + display: inline-flex; + justify-content: center; + align-items: center; + margin: 0 5px; + height: 40px; + width: 40px; + transition: 0.3s ease-in-out; +} + +.social-container #fb:hover { + color: white; + background-color: #1877F2; +} +.social-container #lin:hover { + color: white; + background-color: #0A66C2; +} +.social-container #goog:hover { + color: white; + background-color: #34A853; +} + + + +/* Adjustments for screens smaller than 1024px */ +@media (max-width: 1024px) { + .container { + width: 80%; + } + + .overlay-panel { + padding: 0 30px; + } + + h1 { + font-size: 1.8rem; + } + + input { + padding: 10px; + font-size: 1rem; + } + + button { + padding: 10px 30px; + font-size: 1rem; + } +} + +/* Adjustments for screens smaller than 768px */ +@media (max-width: 768px) { + .container { + width: 90%; + min-height: 450px; + padding: 20px; + } + + form { + padding: 0 20px; + } + + input { + padding: 10px; + margin: 6px 0; + font-size: 0.9rem; + } + + button { + padding: 10px 30px; + margin: 8px; + font-size: 0.9rem; + } + + h1 { + font-size: 1.5rem; + } + + .overlay { + width: 100%; + left: 0; + transform: none; + } + + .overlay-panel { + width: 100%; + position: relative; + transform: none; + padding: 20px; + } + + .overlay-left{ + display: none; + } + +} + +/* Further adjustments for screens smaller than 480px */ +@media (max-width: 480px) { + .container { + width: 100%; + min-height: 400px; + padding: 10px; + } + + h1 { + font-size: 1.2rem; + margin-bottom: 10px; + } + + input { + padding: 8px; + margin: 5px 0; + font-size: 0.8rem; + } + + button { + padding: 8px 20px; + margin: 6px; + font-size: 0.8rem; + } + + .overlay { + height: 100%; + } + + .overlay-panel { + padding: 10px; + } +} +/* Banner styling */ +#successBanner { + display: none; + position: fixed; + top: 0; + left: 0; + width: 100%; + padding: 1rem; + background-color: green; + color: white; + text-align: center; + z-index: 1000; + font-size: 1.2rem; +} +.toggle-password { + position: relative; + cursor: pointer; + user-select: none; +} + +.toggle-password svg { + position: absolute; + right: 10px; + top: 50%; + transform: translateY(-50%); + height: 15px; +} + +/* Additional styles for password container */ +.password-container { + position: relative; + width: 100%; +} + +.password-container input { + padding-right: 30px; /* Adjust based on your eye icon size */ +} + +.container{ + background-color: #143C3D; +} +form{ + background-color: #143C3D; +} +.pass-link a{ + color: cadetblue; +} +.pass-link a:hover{ + color:aqua; +} + +input[type="checkbox"] { + accent-color: aqua; +} +.checkbox label{ + color:whitesmoke; +} +span{ + color:whitesmoke; +} +.social-container a{ + color: whitesmoke; +} +.social-container a:hover{ + color: #4BB6B7; +} +.home-button{ + background-color: #022A2D; + border:none; +} \ No newline at end of file diff --git a/log/login.html b/log/login.html new file mode 100644 index 00000000..44c4e6db --- /dev/null +++ b/log/login.html @@ -0,0 +1,278 @@ + + + + + + + + RAPIDOC + + + + + + + + + + + + + + +
+
+
+

RAPIDOC

+ + +
+ + + + + + + + +
+ + + +
+
+ + + +
+
+
+

Welcome Back!

+

To keep connected with us please login with your personal info

+ +
+
+

Hello, Friend!

+

Enter your personal details and start journey with us

+ +
+
+
+
+ + + + + + \ No newline at end of file diff --git a/log/script.js b/log/script.js new file mode 100644 index 00000000..ab9a24b0 --- /dev/null +++ b/log/script.js @@ -0,0 +1,176 @@ +document.addEventListener("DOMContentLoaded", function() { + const registerButton = document.getElementById("register"); + const loginButton = document.getElementById("login"); + const container = document.getElementById("container"); + const registerForm = document.getElementById("registerForm"); + const loginForm = document.getElementById("loginForm"); + + const successBanner = document.createElement("div"); + // successBanner.id = "successBanner"; + // successBanner.textContent = "Login Successful"; + document.body.appendChild(successBanner); + + // Function to toggle password visibility + function togglePasswordVisibility(toggleButton) { + const passwordField = document.querySelector(toggleButton.getAttribute("toggle")); + const type = passwordField.getAttribute("type") === "password" ? "text" : "password"; + passwordField.setAttribute("type", type); + + // Change eye icon appearance based on password field visibility + toggleButton.querySelector("svg").classList.toggle("visible"); + } + + // Event listener for register and login buttons + registerButton.addEventListener("click", (event) => { + event.preventDefault(); + container.classList.add("right-panel-active"); + registerForm.scrollIntoView({ behavior: "smooth" }); + }); + + loginButton.addEventListener("click", (event) => { + event.preventDefault(); + container.classList.remove("right-panel-active"); + loginForm.scrollIntoView({ behavior: "smooth" }); + }); + + // Event listener for password visibility toggle in register form + const registerEye = document.querySelector("#registerForm .toggle-password"); + registerEye.addEventListener("click", function(event) { + event.preventDefault(); + togglePasswordVisibility(registerEye); + }); + + // Event listener for password visibility toggle in login form + const loginEye = document.querySelector("#loginForm .toggle-password"); + loginEye.addEventListener("click", function(event) { + event.preventDefault(); + togglePasswordVisibility(loginEye); + }); + + registerForm.addEventListener("submit", (event) => { + event.preventDefault(); + // Your registration logic goes here + const name = registerForm.querySelector('input[type="text"]').value; + const email = registerForm.querySelector('input[type="email"]').value; + const password = registerForm.querySelector('#registerPassword').value; + + if (!name || !email || !password) { + alert("Kindly, Please fill all the details😊"); + return; + } + + // Simulate registration success + document.getElementById("registerMessage").style.display = "block"; + setTimeout(() => { + container.classList.remove("right-panel-active"); + loginForm.scrollIntoView({ behavior: "smooth" }); + }, 2000); + }); + + loginForm.addEventListener("submit", (event) => { + event.preventDefault(); + // Your login logic goes here + const email = loginForm.querySelector('input[type="email"]').value; + const password = loginForm.querySelector('#loginPassword').value; + + if (!email || !password) { + alert("Kindly, Please fill all the details😊"); + return; + } + + // Simulate login success + successBanner.style.display = "block"; + setTimeout(() => { + successBanner.style.display = "none"; + window.location.href = "login.html"; // Change "login.html" to your desired URL + }, 500); // Display banner for 2 seconds + }); +}); + + +// Import the functions you need from the SDKs you need +import { initializeApp } from "https://www.gstatic.com/firebasejs/9.9.2/firebase-app.js"; +import { getAuth, signInWithEmailAndPassword, createUserWithEmailAndPassword, sendEmailVerification, reload, deleteUser } from "https://www.gstatic.com/firebasejs/9.9.2/firebase-auth.js"; + +// Your web app's Firebase configuration +const firebaseConfig = { + apiKey: "YOUR_API_KEY", + authDomain: "YOUR_PROJECT_ID.firebaseapp.com", + projectId: "YOUR_PROJECT_ID", + storageBucket: "YOUR_PROJECT_ID.appspot.com", + messagingSenderId: "YOUR_MESSAGING_SENDER_ID", + appId: "YOUR_APP_ID", + measurementId: "YOUR_MEASUREMENT_ID" // optional +}; + + +// Initialize Firebase +const app = initializeApp(firebaseConfig); +const auth = getAuth(app); + +// Register event +const registerForm = document.getElementById('registerForm'); +registerForm.addEventListener('submit', async (e) => { + e.preventDefault(); + + const email = document.getElementById('registerEmail').value; + const password = document.getElementById('registerPassword').value; + + try { + const userCredential = await createUserWithEmailAndPassword(auth, email, password); + const user = userCredential.user; + + // Set a timeout for checking email verification + const timeout = setTimeout(async () => { + await reload(user); + if (!user.emailVerified) { + await deleteUser(user) + .then(() => { + alert('Account deleted due to unverified email.'); + location.reload(); // Reload the page after deletion + }) + .catch((error) => { + const errorCode = error.code; + const errorMessage = error.message; + alert(errorMessage); + location.reload(); // Reload the page on error + }); + } + }, 30000); // 30 seconds + + await sendEmailVerification(user); + alert('Registration successful! Please check your email to verify your account.'); + } catch (error) { + const errorCode = error.code; + const errorMessage = error.message; + alert(errorMessage); + location.reload(); // Reload the page on error + } +}); + +// Login event +const loginForm = document.getElementById('loginForm'); +loginForm.addEventListener('submit', async (e) => { + e.preventDefault(); + + const email = document.getElementById('loginEmail').value; + const password = document.getElementById('loginPassword').value; + + try { + const userCredential = await signInWithEmailAndPassword(auth, email, password); + const user = userCredential.user; + + // Check if email is verified + await reload(user); // Ensure latest user data is fetched + if (user.emailVerified) { + window.location.href = '/index.html'; // Redirect to index.html upon successful login + } else { + alert('Please verify your email address.'); + } + } catch (error) { + const errorCode = error.code; + const errorMessage = error.message; + alert(errorMessage); + location.reload(); // Reload the page on error + } +}); \ No newline at end of file diff --git a/medicine.css b/medicine.css new file mode 100644 index 00000000..c1fdb4a9 --- /dev/null +++ b/medicine.css @@ -0,0 +1,286 @@ +/* @import url('http://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700;800;900&display=swap'); */ + +body +{ + margin: 0; + padding: 0; + box-sizing: border-box; + font-family: 'Poppins',sans-serif; + background-color: rgb(0, 0, 0); + /* min-height: 10vh; */ +} + + + + +.nav_link { + list-style: none; + } + + .nav_link li { + padding: 5px 20px; + display: inline-block; + color: white; + } + + .nav_link li a { + transition: all 0.3s ease 0s; + color: white; + text-decoration: none; + } + + .nav_link li a:hover { + color: #55a5ea; + text-decoration: underline 2.5px rgb(3, 3, 94); + } + + .header_container { + + background-color: #59bcbf51; + opacity: 0.9; + display: flex; + flex-direction: row; + justify-content: space-between; + align-items: center; + height: 60px; + margin: auto; + } +.header_container{ + padding: 10px; +} + +main { + padding: 1rem; +} + + +form { + margin-bottom: 1rem; +} + +label { + display: block; + margin-bottom: 0.5rem; +} + +input { + padding: 0.5rem; + margin-bottom: 1rem; + width: 70%; + max-width: 60px; + box-sizing: border-box; + margin-left: 500px; +} + +.button { + background-color: #3fbcc0a6; + color: white; + padding: 0.5rem; + margin-bottom: 1rem; + width: 50%; + max-width: 60px; + box-sizing: border-box; + border-radius: 1rem; +} +.button::before { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 0; + height: 100%; + background-color: #55a5ea; + transition: width 0.3s ease; + z-index: -1; +} + + +.button::before { + content: ''; + position: absolute; + top: 0; + left: 0; + width: 0; + height: 100%; + background-color: #55a5ea; + transition: width 0.3s ease; + z-index: -1; +} + + +.button:hover { + color: #fff; +} + +.button:hover::before { + width: 100%; +} + +#medicine-info { + background-color: #4bb6b7; + border-radius: 5px; + box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); +} +#medicine-info:hover{ + + background-color: #55a5ea; +} +.footer-wrapper{ + background-color: #59bcbf51; + padding: 10px 0; +} + +.footer-columns { + display: flex; + justify-content: space-around; + flex-wrap: wrap; + text-decoration: none; + + +} +.other-columns { + display: flex; + justify-content: space-between; + width: 100%; + max-width: 1200px; + flex-wrap: wrap; + text-decoration: none; + +} +.links{ + text-decoration: none; + color: #55a5ea; +} +.other-columns ul a { + color: rgb(116, 119, 116); + text-decoration: none; + font-size: 0.85rem; +} + +.other-columns ul a:hover { + text-decoration: none; + color: #080d3f; +} + +.other-columns h3 { + color: var(--link-color); + margin-bottom: 1rem; + font-size: 1rem; + font-family: ui-monospace, monospace; +} + + + +.news-letter form { + color: transparent; + background-color: transparent; + border: none; + display: flex; + + +} + +.news-letter input[type="text"] { + color: transparent; + background-color: transparent; + border: 1px solid #7489c6;; + outline: none; + margin-left:800px; + height: 40px; + width: 150px; +} +.subscribe-button { + background-color: #ffffff; + color: rgb(103, 102, 102); + padding: 0.5rem; + width: 100%; + max-width: 110px; + box-sizing: border-box; + margin-left:10px; +} + + +.subscribe-button:hover { + background-color: #3fbcc051; +} +.footer-bottom { + background-color: #080d3f; + padding: 20px 0; +} + +.footer-bottom-wrapper { + display: flex; + justify-content: space-between; + align-items: center; + flex-wrap: wrap; + max-width: 1200px; + margin: 0 auto; + padding: 0 20px; +} + +.footer-bottom small { + color: #afb6c7; +} +.social-wrapper { + display: flex; + gap: 0.5rem; + margin-right: 100px; + + } + + .social-links { + display: inline-flex; + gap: 0.5rem; + align-items: left; + } + + .social-links img { + width: 1.5rem; + height: 1.5rem; + transition: all 0.2s ease-in-out; + } + + .social-links img:hover { + transform: scale(1.1); + } + + .social-links ul { + display: flex; + flex-wrap: wrap; + gap: 0.75rem; + list-style-type: none; + } + + .footer-bottom-wrapper { + display: flex; + flex-direction: column; + justify-content: center; + } + + +@media screen and (max-width: 768px) { + #ss { + font-size: 12px; + } +} + +@media screen and (max-width: 480px) { + #ss { + font-size: 10px; + } +} + +.img img { + width: 90px; + height: auto; + +} + + + +.slideshow-container { + position: relative; + max-width: 100%; + padding-top:0px ; +} + diff --git a/medicine.html b/medicine.html new file mode 100644 index 00000000..ec66f844 --- /dev/null +++ b/medicine.html @@ -0,0 +1,680 @@ + + + + + + + + + + + + + + + + + + + RapiDoc + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+
+ + + + + + + +
+
Know your Meds!
+
+ + +
+ +
+ +
+
+ +
+
+ +
+
+ + + +
+
+ + +
+ + + +
+

+

+ Know your Meds!
+

+ +
+ + + +
+
+ +
+
+
+ Image 1 + + +
+
+ Image 1 + + +
+ +
+ Image 1 + + + +
+
+ + + + + + + +
+ + + +
+ +
+
+ + + +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + diff --git a/medicine.js b/medicine.js new file mode 100644 index 00000000..aec9ca6f --- /dev/null +++ b/medicine.js @@ -0,0 +1,57 @@ +document.getElementById('medicine-form').addEventListener('submit', function(event) { + event.preventDefault(); + const medicineName = document.getElementById('medicine-name').value; + fetchMedicineInformation(medicineName); +}); + +async function fetchMedicineInformation(medicineName) { + try { + const response = await fetch(`https://api.fda.gov/drug/label.json?search=openfda.brand_name:${medicineName}`); + const data = await response.json(); + displayMedicineInformation(data); + } catch (error) { + console.error('Error fetching medicine information:', error); + document.getElementById('medicine-info').innerHTML = '

There was an error fetching the medicine information. Please try again later.

'; + } +} + +function displayMedicineInformation(data) { + const medicineInfoSection = document.getElementById('medicine-info'); + medicineInfoSection.innerHTML = ''; + + if (data.results && data.results.length > 0) { + const medicineInfo = data.results[0]; + medicineInfoSection.innerHTML = ` +

${medicineInfo.openfda.brand_name ? medicineInfo.openfda.brand_name[0] : 'No brand name available'}

+

Purpose: ${medicineInfo.purpose ? medicineInfo.purpose.join(', ') : 'No purpose information available'}

+

Warnings: ${medicineInfo.warnings ? medicineInfo.warnings.join('
') : 'No warnings available'}

+

Directions: ${medicineInfo.directions ? medicineInfo.directions.join('
') : 'No directions available'}

+ `; + } else { + medicineInfoSection.innerHTML = '

No information found for the specified medicine.

'; + } +} +let slideIndex = 0; +showSlides(); + +function showSlides() { + let slides = document.getElementsByClassName("mySlides"); + + + for (let i = 0; i < slides.length; i++) { + slides[i].style.opacity = 0; + } + + + slideIndex++; + if (slideIndex > slides.length) { + slideIndex = 1; + } + + slides[slideIndex - 1].style.opacity = 1; + + + setTimeout(showSlides, 4000); +} + + diff --git a/mkdocs/docs/Advantages.md b/mkdocs/docs/Advantages.md new file mode 100644 index 00000000..0d24583c --- /dev/null +++ b/mkdocs/docs/Advantages.md @@ -0,0 +1,15 @@ +# βœ… Advanatages + +Here are the advantages of RapiDoc healthcare service: + +- **Convenient access to healthcare services and medical information:** Users can access healthcare services and medical information anytime, anywhere. + +- **User-friendly interface:** The platform offers a user-friendly interface for easy navigation and quick appointment bookings. + +- **Timely updates on emergency bed availability:** Users receive timely updates on bed availability at emergency centers for informed decision-making during emergencies. + +- **Ability to book appointments with top-rated doctors:** Users can book appointments with top-rated doctors across various specialties. + +- **Access to regular health updates and informative newsletters:** Users have access to regular health updates and informative newsletters for staying informed. + +- **Streamlined emergency services:** The platform offers streamlined emergency services to ensure prompt assistance when needed. diff --git a/mkdocs/docs/Architecture.md b/mkdocs/docs/Architecture.md new file mode 100644 index 00000000..26cc2710 --- /dev/null +++ b/mkdocs/docs/Architecture.md @@ -0,0 +1,9 @@ +Here is the architecture diagram of the RapiDoc healthcare application: + +![Architecture diagram](https://github.com/TejaswiKandunuri/RAPIDOC-HEALTHCARE-WEBSITE-/assets/110902627/5184e0e4-f430-4348-95f5-afe7855a9ef1) + +This diagram illustrates the flow of operations within the RapiDoc application, showing how data and control move through the various components. + +![RapiDoc flow diagram](https://github.com/TejaswiKandunuri/RAPIDOC-HEALTHCARE-WEBSITE-/assets/110902627/df749559-19a6-4f84-b082-692eed63fd67) + +

πŸ”

diff --git a/mkdocs/docs/Conclusion.md b/mkdocs/docs/Conclusion.md new file mode 100644 index 00000000..6612e33b --- /dev/null +++ b/mkdocs/docs/Conclusion.md @@ -0,0 +1,5 @@ +# πŸ“ Conclusion + +The RapiDoc healthcare website stands as a very useful digital platform dedicated to transforming healthcare accessibility. By providing comprehensive and user-friendly services, RapiDoc revolutionizes how users access medical care, ensuring convenience and efficiency. With features ranging from appointment booking with top-rated doctors to real-time updates on emergency bed availability, RapiDoc addresses diverse healthcare needs. Moreover, its commitment to accessibility ensures no one is left behind in receiving timely medical care. + +While the platform offers numerous advantages such as easy access to healthcare services and informative updates, it also faces challenges such as potential privacy concerns and dependency on internet connectivity. Looking ahead, RapiDoc has promising future scope areas, including the expansion of services, integration of AI-driven virtual health assistants, and geographical expansion. In essence, RapiDoc emerges as a reliable partner in promoting well-being and enhancing the healthcare experience for all users. diff --git a/mkdocs/docs/Contributing.md b/mkdocs/docs/Contributing.md new file mode 100644 index 00000000..86196ae5 --- /dev/null +++ b/mkdocs/docs/Contributing.md @@ -0,0 +1,20 @@ +# Contributing + +We love your input! We want to make contributing to this project as easy and transparent as possible, whether it's. + +To contribute to the RAPIDOC-HEALTHCARE-WEBSITE repository using GitHub Desktop, follow these steps: + +- Reporting a bug +- Discussing the current state of the code +- Submitting a fix +- Proposing new features + +## Our Contributors Red Heart + +## Thank you for contributing to our repository + +[![Contributors](https://contributors-img.web.app/image?repo=Anishkagupta04/RAPIDOC-HEALTHCARE-WEBSITE-)](https://github.com/Anishkagupta04/RAPIDOC-HEALTHCARE-WEBSITE-/graphs/contributors) + +## Show some Red Heart by starring this awesome repository! + +If you find this project helpful, please consider giving it a star! diff --git a/mkdocs/docs/Disadvantages.md b/mkdocs/docs/Disadvantages.md new file mode 100644 index 00000000..ad8f7a4e --- /dev/null +++ b/mkdocs/docs/Disadvantages.md @@ -0,0 +1,7 @@ +# β›” Disadvantages + +These are the disadvantages of RapiDoc healthcare service: + +- **Potential privacy concerns:** There may be concerns related to storing personal health information online. + +- **Limiting usage in areas with poor connectivity:** The service may be limited in areas where internet connectivity is poor. diff --git a/mkdocs/docs/Future Scope.md b/mkdocs/docs/Future Scope.md new file mode 100644 index 00000000..8065ee5b --- /dev/null +++ b/mkdocs/docs/Future Scope.md @@ -0,0 +1,7 @@ +# πŸ’‘ Future Scope + +- **Expansion of Services:** Introduce additional healthcare services like telemedicine consultations and home healthcare. + +- **AI-powered Virtual Health Assistants:** Develop AI-driven assistants for round-the-clock support and health advice. + +- **Geographical Expansion:** Expand services globally by partnering with healthcare providers worldwide. diff --git a/mkdocs/docs/Installation.md b/mkdocs/docs/Installation.md new file mode 100644 index 00000000..3528f025 --- /dev/null +++ b/mkdocs/docs/Installation.md @@ -0,0 +1,81 @@ +# Get Started Rocket + +### Setup and Installation + +

To contribute to the RAPIDOC-HEALTHCARE-WEBSITE repository, follow these steps:

+ +1. **Fork the Repository:** + Click on the "Fork" button on the repository's GitHub page to create a copy of the repository in your GitHub account. + +2. **Clone the repository:** + Clone the forked repository to your local machine using the following command in your terminal. + ```bash + git clone https://github.com//RAPIDOC-HEALTHCARE-WEBSITE + ``` +3. **Add a remote upstream:** + ```bash + git remote add upstream https://github.com/original-owner-username/RAPIDOC-HEALTHCARE-WEBSITE + ``` +4. **Create a new branch:** + Create a new branch for your changes. Run the following command in your terminal. + ```bash + git checkout -b + ``` +5. **Make the desired changes:** + Make the desired changes to the source code. + +6. **Add your changes:** + Add your changes to the staging area. Run the following command in your terminal. + ```bash + git add ... + ``` +7. **Commit your changes:** + Commit your changes with a meaningful commit message. Run the following command in your terminal. + ```bash + git commit -m "" + ``` +8. **Push your changes:** + Push your changes to your forked repository. Run the following command in your terminal + ```bash + git push origin + ``` +9. **Create a Pull Request:** + Go to the GitHub page of your forked repository. You should see a prompt to create a pull request (PR). Click on it, compare the changes, and create the PR. +

+ +###

To run the project locally in your System

+ +1. _Fork the Repository:_ + Click on the "Fork" button on the repository's GitHub page to create a copy of the repository in your GitHub account. + + ![Screenshot (127)](https://github.com/Anishkagupta04/RAPIDOC-HEALTHCARE-WEBSITE-/assets/105973197/164ba1a7-d42e-4e4d-acbd-4bc81cf387d5) + + ![Screenshot (128)](https://github.com/Anishkagupta04/RAPIDOC-HEALTHCARE-WEBSITE-/assets/105973197/21a47905-69ee-448f-a5c0-71ceb3c694d5) + +2. _Clone the repository:_ + Clone the forked repository to your local machine using the following command in your terminal. + + ```bash + git clone https://github.com//RAPIDOC-HEALTHCARE-WEBSITE + ``` + ![Screenshot (129)](https://github.com/Anishkagupta04/RAPIDOC-HEALTHCARE-WEBSITE-/assets/105973197/88249cc4-5849-4472-b190-9d9bad2bb236) + + +3. _Open the project in VS Code:_ + Click on the open with vs code button , to make changes to the code using the text editor. + + ![Screenshot (130)](https://github.com/Anishkagupta04/RAPIDOC-HEALTHCARE-WEBSITE-/assets/105973197/10644887-eb4b-4471-98bb-26e0b1bb4f07) + +4. _Clearly read the contribution guidelines:_ + Make sure to follow the guidelines to contribute to this project. + + ![Screenshot (131)](https://github.com/Anishkagupta04/RAPIDOC-HEALTHCARE-WEBSITE-/assets/105973197/342c364a-d908-48a4-9d12-2552298d87bd) + +5. _Find the Index.html file:_ + Right click the file mentioned and click on "Open with Live Server" + This will redirect to the web-browser and load the landing page of the project + + ![Screenshot (133)](https://github.com/Anishkagupta04/RAPIDOC-HEALTHCARE-WEBSITE-/assets/105973197/62044e1a-a644-467d-98ac-eabfac970ed9) + + +

πŸ”

\ No newline at end of file diff --git a/mkdocs/docs/Objectives.md b/mkdocs/docs/Objectives.md new file mode 100644 index 00000000..ab4f2ef4 --- /dev/null +++ b/mkdocs/docs/Objectives.md @@ -0,0 +1,12 @@ +- **Comprehensive Healthcare Platform**: Provide a comprehensive online destination for essential healthcare services. +- **Easy Navigation**: Enable users to easily locate nearby clinics, labs, and pharmacies for their medical needs. +- **Blood Bank Updates**: Keep users informed about blood bank statuses and provide regular health updates through a daily feed. +- **Accessibility**: Cater to the accessibility needs of disabled individuals by listing wheelchair-accessible hospitals and clinics. +- **Appointment Booking**: Offer booking services for appointments with top-rated doctors across various specialties. +- **Routine Checkups**: Facilitate normal checkups and blood tests, providing crucial information about body temperature ranges and medicine usage. +- **Health Benefits**: Extend health benefits like boot camps, vaccination drives, and personalized check-ups. +- **Emergency Services**: Streamline emergency services to help users avoid the rush and get immediate assistance, with real-time updates on bed availability at emergency centers. +- **Medical Insights**: Provide users with the latest medical insights and health tips through newsletters. +- **Digital Integration**: Ensure seamless integration of digital solutions for a reliable healthcare experience. +- **Commitment to Quality**: Commit to providing a seamless and efficient healthcare experience for all users. + diff --git a/mkdocs/docs/Technology stack.md b/mkdocs/docs/Technology stack.md new file mode 100644 index 00000000..d043fca4 --- /dev/null +++ b/mkdocs/docs/Technology stack.md @@ -0,0 +1,20 @@ +RapiDoc is at the heart of our innovative healthcare platform. Built using modern web technologies such as HTML5, JavaScript, CSS3, and React, RapiDoc ensures a seamless and engaging experience for users accessing healthcare services and medical information. + +With RapiDoc, users can conveniently book appointments with top-rated doctors, receive timely updates on emergency bed availability, access regular health updates and informative newsletters, and benefit from streamlined emergency services for prompt assistance when needed. + +## **Tech Stack** High Voltage + +

+ + + + + + + + + + + + +

diff --git a/mkdocs/docs/Usage.md b/mkdocs/docs/Usage.md new file mode 100644 index 00000000..c5cf3ce8 --- /dev/null +++ b/mkdocs/docs/Usage.md @@ -0,0 +1,59 @@ +# βœ… Usage + +## Accessing the Website + +Users start by accessing the RapiDoc website through their web browser on any internet-enabled device. + +## Exploring Healthcare Services + +Upon landing on the homepage, users can explore the various healthcare services offered by RapiDoc. This includes services such as: +- Locating nearby clinics, labs, and pharmacies +- Booking appointments with doctors across different specialties +- Accessing blood bank statuses +- Receiving regular health updates + +## Locating Nearby Healthcare Facilities + +If a user is in need of immediate medical assistance or wants to schedule an appointment, they can use the website to locate nearby healthcare facilities such as: +- Clinics +- Labs +- Pharmacies + +The website provides information on the location, services offered, and contact details of these facilities. + +## Booking Appointments + +Users can book appointments with top-rated doctors specializing in various fields like: +- Dermatology +- Gynecology +- Cardiology +- ENT + +They can browse through available appointment slots, select a convenient time, and provide necessary details to confirm the booking. + +## Accessing Medical Information + +RapiDoc provides users with access to crucial medical information such as: +- Body temperature ranges +- Medicine usage guidelines +- General health tips + +Users can stay informed about various health topics through the website's daily feed and newsletter subscriptions. + +## Emergency Services + +In case of emergencies, users can use the website to access streamlined emergency services. Real-time updates on bed availability at emergency centers help users make informed decisions and get immediate assistance when needed. + +## Staying Updated + +Users can stay updated with the latest medical insights and health tips by subscribing to RapiDoc's newsletters. This ensures that they receive timely information about healthcare developments and best practices. + +## Navigating the Website + +Throughout their interaction with the website, users can easily navigate between different pages using intuitive navigation menus and links. The website's user-friendly interface ensures a smooth and seamless browsing experience. + +## Contacting RapiDoc + +For further inquiries or assistance, users can easily get in touch with RapiDoc through the provided contact information, including email and phone number. + +

πŸ”

\ No newline at end of file diff --git a/mkdocs/docs/features And Services.md b/mkdocs/docs/features And Services.md new file mode 100644 index 00000000..42dc07ef --- /dev/null +++ b/mkdocs/docs/features And Services.md @@ -0,0 +1,37 @@ +# πŸš€ FEATURES AND SERVICES + +### **Homepage** + +- **Welcome Section**: Introduces RapiDoc as a digital healthcare destination, emphasizing the ease and convenience of accessing healthcare services through the platform. +- **Download App Button**: Encourages users to download the RapiDoc app for a more integrated experience. + +### **Services** + +- **Clinics/Labs**: Helps users locate the best healthcare facilities around them without hassle. +- **Pharmacy**: Allows users to get prescribed medicines delivered to their doorstep. +- **Daily Feed**: Provides access to health benefits such as bootcamps, vaccination drives, and more. +- **Blood Bank**: Offers information about nearby blood banks and available blood groups to ensure no one suffers in emergencies. +- **Disabled Person Services**: Lists wheelchair-accessible hospitals and clinics to ensure convenient medical care. +- **Health Post**: Delivers health-related content weekly, monthly, yearly, or daily, based on user preference. + +### **Appointments** + +- **Make an Appointment**: A form where users can book appointments with doctors. It includes fields for the user's name, email, phone, appointment date, age, location, and an optional message. + +### **Doctors** + +- **Specialist Listings**: Lists doctors across various specializations such as Dermatology, Gynecology, Cardiology, and ENT, with options to appoint a doctor directly from the website. + +### **Contact** + +- **Feedback Form**: Allows users to provide feedback and suggestions to help improve digital medical care. +- **Contact Information**: Provides the platform's contact details, including location, email, and phone number. +- **Address**: Lists the address as Delhi, India. +- **Links**: Includes quick links to important sections of the website such as Home, About Us, Services, Doctors, and Contact. + +### **Newsletter Subscription** + +- **Daily Newsletter**: Encourages users to subscribe to receive medical insights and updates via email. + + +

πŸ”

\ No newline at end of file diff --git a/mkdocs/docs/index.md b/mkdocs/docs/index.md new file mode 100644 index 00000000..31cdd012 --- /dev/null +++ b/mkdocs/docs/index.md @@ -0,0 +1,47 @@ + +#**RapiDoc - Revolutionizing Digital Healthcare**

+ +### **Project Overview** Rocket + + +Welcome to **RapiDoc**, a pioneering digital healthcare platform designed to transform the way users access medical services. As a comprehensive and user-friendly online destination, RapiDoc provides a wide range of essential healthcare services aimed at improving the overall healthcare experience. + +With a focus on accessibility, RapiDoc ensures users can easily: + +- Locate nearby clinics and labs πŸ₯ +- Access pharmacy deliveries πŸ’Š +- Stay informed about blood bank statuses 🩸 +- Receive regular health updates through our daily feed πŸ“° + +**Inclusivity** is at the heart of RapiDoc. We cater to disabled individuals by listing wheelchair-accessible hospitals and clinics, ensuring no one is left behind in receiving timely and efficient medical care. + +### **Comprehensive Health Services** + +RapiDoc’s services are meticulously designed to cater to various health needs, including: + +- **Book appointments** with top-rated doctors specializing in dermatology, gynecology, cardiology, and ENT. +- **Facilitate normal checkups and blood tests**, providing crucial information about body temperature ranges and medicine usage. +- **Offer health benefits** like bootcamps, vaccination drives, and personalized check-ups. +- **Streamline emergency services** to help users avoid rush and get immediate assistance, with real-time updates on bed availability at emergency centers. + +### **Stay Informed** + +Subscribe to our **newsletters** to keep abreast of the latest medical insights and health tips. RapiDoc ensures you stay informed and empowered to take control of your health. + +Through our seamless integration of digital solutions, RapiDoc stands as a reliable partner in maintaining and enhancing your health, bringing you the best facilities and ensuring you are well-supported at every digital step. + +Join us on this journey to a healthier life with RapiDoc! 🌐✨ + +--- + +**Connect with Us:** + +- [Website](https://69glitch.github.io/RapiDoc/) + +--- + +> **Disclaimer**: RapiDoc is designed to supplement, not replace, the advice of medical professionals. Always consult with a healthcare provider for medical advice and treatment. + +--- + +

πŸ”

\ No newline at end of file diff --git a/mkdocs/docs/purpose.md b/mkdocs/docs/purpose.md new file mode 100644 index 00000000..ea40bd18 --- /dev/null +++ b/mkdocs/docs/purpose.md @@ -0,0 +1,13 @@ +# 🎯Purpose +The purpose of the **RapiDoc** project is to revolutionize the accessibility and delivery of healthcare services through a comprehensive digital platform. It aims to address various needs and challenges faced by individuals seeking medical assistance by providing a user-friendly interface to access a wide range of healthcare services. + +By leveraging digital solutions, RapiDoc intends to: + +- **Streamline the process** of locating nearby clinics, labs, and pharmacies. +- **Facilitate booking appointments** with top-rated doctors. +- **Provide timely health updates** and insights. +- **Enhance access to emergency services**. +- **Cater to the accessibility needs** of disabled individuals. +- **Keep users informed** with the latest medical insights and health tips. + +Overall, the purpose of RapiDoc is to provide a seamless and efficient healthcare experience for all users, enhancing their well-being and ensuring they receive timely and expert medical attention. diff --git a/mkdocs/mkdocs.yml b/mkdocs/mkdocs.yml new file mode 100644 index 00000000..ffd2907d --- /dev/null +++ b/mkdocs/mkdocs.yml @@ -0,0 +1,71 @@ +site_name: RapiDoc +site_author: Anishka Gupta +docs_dir: Docs + +theme: + name: material + feature: + - navigation.tabs + - navigation.sections + - toc.integrate + - navigation.top + - search.suggest + - search.highlight + - content.tabs.link + - content.code.annotations + - content.code.copy + palette: + - scheme: default + toggle: + icon: material/weather-night + name: Switch to dark mode + primary: deep purple + accent: deep purple + - scheme: slate + toggle: + icon: material/weather-sunny + name: Switch to light mode + primary: slate + accent: lime + language: en + logo: favicon.ico + favicon: favicon.ico + +repo_url: https://github.com/Anishkagupta04/RAPIDOC-HEALTHCARE-WEBSITE- +repo_name: RapiDoc + + +markdown_extensions: + - pymdownx.highlight: + anchor_linenums: true + - pymdownx.inlinehilite + - pymdownx.snippets + - admonition + - pymdownx.arithmatex: + generic: true + - footnotes + - pymdownx.details + - pymdownx.superfences + - pymdownx.mark + - attr_list + - pymdownx.emoji: + emoji_index: !!python/name:materialx.emoji.twemoji + emoji_generator: !!python/name:materialx.emoji.to_svg + +nav: + - Home: index.md + - Objectives: Objectives.md + - Purpose: purpose.md + - Features and Services: features And Services.md + - Technology Stack Used: Technology stack.md + - Architecture: Architecture.md + - Getting Started: Installation.md + - Usage: Usage.md + - Advantages: Advantages.md + - Diadvantages: Disadvantages.md + - Future Scope: Future Scope.md + - Contributing: Contributing.md + - Conclusion: Conclusion.md + +copyright: | + © 2024 RapiDoc \ No newline at end of file diff --git a/news.html b/news.html new file mode 100644 index 00000000..ed5025ab --- /dev/null +++ b/news.html @@ -0,0 +1,1083 @@ + + + + + + + + + + + + + + + + + + + + RapiDoc + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+
+ + + + + +
+
+ +
+
+ +
+
+ +
+
+ +
+
+ + + +
+
+
+

Latest News

+
+
+

RapiDoc Launches Revolutionary Telemedicine

+ + + + +
+ +
+ hover me + Read More +
+
+ +
+
+

RapiDoc Expands Network: 500 New Doctors Join

+ + + +
+ +
+ hover me + Read More +
+
+ +
+
+

RapiDoc's AI Diagnosis Tool Shows 95% Accuracy in Trials

+ News Image + + +
+ +
+ hover me + Read More +
+
+
+
+

RapiDoc Introduces 24/7 Emergency Consultation Service

+ + + +
+ +
+ hover me + Read More +
+
+
+
+

RapiDoc Partners with Leading Hospitals for Seamless Referrals

+ + + +
+ +
+ hover me + Read More +
+
+
+
+

RapiDoc's Mobile App Reaches 1 Million Downloads

+ + + +
+ +
+ hover me + Read More +
+
+
+
+

RapiDoc Introduces Personalized Health Monitoring Wearables

+ + + +
+ +
+ hover me + Read More +
+
+
+
+

RapiDoc Launches Innovative Mental Health Support Program

+ + + +
+ +
+ hover me + Read More +
+
+
+
+

RapiDoc's Research Team Publishes Groundbreaking Study on Preventive Healthcare

+ + + +
+
+ hover me + Read More +
+
+ + +
+
+
+
+
+ + + + + +
+
+ + + +
+
+ + + +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/package-lock.json b/package-lock.json new file mode 100644 index 00000000..77f3a1a3 --- /dev/null +++ b/package-lock.json @@ -0,0 +1,6 @@ +{ + "name": "RAPIDOC-HEALTHCARE-WEBSITE-", + "lockfileVersion": 3, + "requires": true, + "packages": {} +} diff --git a/portal.html b/portal.html new file mode 100644 index 00000000..aee89b5d --- /dev/null +++ b/portal.html @@ -0,0 +1,767 @@ + + + + + + + + + + + + + + + + + + + + + + + + + RapiDoc + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+
+ + + +
Patient portal
+ + +
+
+
+

Patient Portal

+

Access your medical records, lab results, and prescription history securely.

+
+
+ + + +
+
+
+ + + +
+ + + +
+ +
+
+ + + +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ + diff --git a/read.md b/read.md new file mode 100644 index 00000000..052b50e2 --- /dev/null +++ b/read.md @@ -0,0 +1,36 @@ +--> Setting up a Firebase account is a straightforward process. Follow these steps to create and configure your Firebase project: +--> Create a Google Account: + If you don't already have a Google account, create one at Google Sign Up. +--> Access Firebase: + Go to the Firebase Console. +--> Create a Firebase Project: + Click on the "Add project" button. + Enter a project name and click "Continue". + (Optional) You can enable Google Analytics for your project. If you do, select the Google Analytics account you want to use. Click "Continue". + Configure Google Analytics settings (if enabled) and click "Create project". +--> Add Firebase to Your App: + Once your project is created, you will be taken to the Firebase project overview page. + Click on the platform icon for the type of app you are building (Web, iOS, Android). +--> Register Your App: + For a web app, you will need to enter a nickname for your app and optionally set up Firebase Hosting. Click "Register app". +--> Add Firebase SDK: + After registering your app, you will be provided with a Firebase configuration snippet. Copy this configuration. + Add the Firebase SDK to your project by including the provided script tags in your HTML file: +-> html code: + + + + +--> Initialize Firebase in Your Project: + In your JavaScript file (e.g., login.js), initialize Firebase using the configuration details: +--> javascript code: + + const firebaseConfig = { + apiKey: "YOUR_API_KEY", + authDomain: "YOUR_PROJECT_ID.firebaseapp.com", + projectId: "YOUR_PROJECT_ID", + storageBucket: "YOUR_PROJECT_ID.appspot.com", + messagingSenderId: "YOUR_MESSAGING_SENDER_ID", + appId: "YOUR_APP_ID", + measurementId: "YOUR_MEASUREMENT_ID" + }; diff --git a/signedup.html b/signedup.html new file mode 100644 index 00000000..f8948002 --- /dev/null +++ b/signedup.html @@ -0,0 +1,34 @@ + + + + + + + RapiDoc + + + + + +
+ + +
+
+ +
+
+ +
+ + + + + diff --git a/signupjs.js b/signupjs.js new file mode 100644 index 00000000..ca34b17c --- /dev/null +++ b/signupjs.js @@ -0,0 +1,65 @@ +import { initializeApp } from "https://www.gstatic.com/firebasejs/10.11.1/firebase-app.js"; +import { getAuth, GoogleAuthProvider, signInWithPopup } from "https://www.gstatic.com/firebasejs/10.11.1/firebase-auth.js"; + +const firebaseConfig = { + apiKey: "AIzaSyDx_FcoL3XJryt6BInhOaDsMKiSmxzrYBI", + authDomain: "fir-7f3dd.firebaseapp.com", + projectId: "fir-7f3dd", + storageBucket: "fir-7f3dd.appspot.com", + messagingSenderId: "467011865433", + appId: "1:467011865433:web:e23be9d0cc3496bb961a48" +}; + +const app = initializeApp(firebaseConfig); +const auth = getAuth(app); +auth.languageCode = 'en'; + +const provider = new GoogleAuthProvider(); + +document.getElementById("google").addEventListener("click", function() { + signInWithPopup(auth, provider) + .then((result) => { + const credential = GoogleAuthProvider.credentialFromResult(result); + const user = result.user; + console.log(user); + window.location.href = "./signedup.html"; + }).catch((error) => { + console.error("Error during Google sign-in:", error); + }); +}); + +document.getElementById("signup-form").addEventListener("submit", function(event) { + event.preventDefault(); // Prevent form from submitting the default way + const name = document.getElementById("name").value; + const email = document.getElementById("email").value; + const password = document.getElementById("password").value; + + if (validateForm(name, email, password)) { + // Simulate a successful registration (Replace with actual Firebase sign-up logic) + console.log("Form submitted with:", { name, email, password }); + window.location.href = "./signedup.html"; + } +}); + +function validateForm(name, email, password) { + if (name === "" || email === "" || password === "") { + alert("All fields are required!"); + return false; + } + if (!validateEmail(email)) { + alert("Please enter a valid email address."); + return false; + } + if (password.length < 6) { + alert("Password must be at least 6 characters long."); + return false; + } + return true; +} + +function validateEmail(email) { + const re = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; + return re.test(email); +} + +/*646664380070-n07i34glgcc6sanb59p3m1k5k0cgn1v1.apps.googleusercontent.com*/ \ No newline at end of file diff --git a/signupjs1.js b/signupjs1.js new file mode 100644 index 00000000..6768d81a --- /dev/null +++ b/signupjs1.js @@ -0,0 +1,63 @@ +import { initializeApp } from "https://www.gstatic.com/firebasejs/10.11.1/firebase-app.js"; +import { getAuth, GoogleAuthProvider, signInWithPopup } from "https://www.gstatic.com/firebasejs/10.11.1/firebase-auth.js"; + +const firebaseConfig = { + apiKey: "AIzaSyDx_FcoL3XJryt6BInhOaDsMKiSmxzrYBI", + authDomain: "fir-7f3dd.firebaseapp.com", + projectId: "fir-7f3dd", + storageBucket: "fir-7f3dd.appspot.com", + messagingSenderId: "467011865433", + appId: "1:467011865433:web:e23be9d0cc3496bb961a48" +}; + +const app = initializeApp(firebaseConfig); +const auth = getAuth(app); +auth.languageCode = 'en'; + +const provider = new GoogleAuthProvider(); + +document.getElementById("google1").addEventListener("click", function() { + signInWithPopup(auth, provider) + .then((result) => { + const credential = GoogleAuthProvider.credentialFromResult(result); + const user = result.user; + console.log(user); + window.location.href = "./signedup.html"; + }).catch((error) => { + console.error("Error during Google sign-in:", error); + }); +}); + +document.getElementById("signup-form").addEventListener("submit", function(event) { + event.preventDefault(); // Prevent form from submitting the default way + const name = document.getElementById("name").value; + const email = document.getElementById("email").value; + const password = document.getElementById("password").value; + + if (validateForm(name, email, password)) { + // Simulate a successful registration (Replace with actual Firebase sign-up logic) + console.log("Form submitted with:", { name, email, password }); + window.location.href = "./signed.html"; + } +}); + +function validateForm(name, email, password) { + if (name === "" || email === "" || password === "") { + alert("All fields are required!"); + return false; + } + if (!validateEmail(email)) { + alert("Please enter a valid email address."); + return false; + } + if (password.length < 6) { + alert("Password must be at least 6 characters long."); + return false; + } + return true; +} + +function validateEmail(email) { + const re = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; + return re.test(email); +} diff --git a/style.css b/style.css index 84e582a1..f1206609 100644 --- a/style.css +++ b/style.css @@ -1,72 +1,73 @@ -body{ +body { font-family: "Open Sans", sans-serif; color: #fff; background-color: #000; } - +.btn1{ + padding:10px; + border: none; + color: white; + border-radius: 10px; +} a { - color: #55a5ea; + color: #ffffff; text-decoration: none; } -a:hover { - color: #55a5ea; - text-decoration: none; +::-webkit-scrollbar{ + + width: 10px; + +} +* { + box-sizing: border-box; + margin: 0; + padding: 0; } -h1, h2, h3, h4, h5, h6 { - font-family: "Raleway", sans-serif; +::-webkit-scrollbar-thumb{ + + background-color: #3fbcc0; + border-radius: 10px; } +::-webkit-scrollbar-thumb:hover{ -.nav_link li { - padding: 5px 20px; - display: inline-block; - color: white; + background-color:#005253; + border-radius: 10px; } -.nav_link li a { - transition: all 0.3s ease 0s; - color: white; +::-webkit-scrollbar-track{ + + background-color:#011212; } -.nav_link li a:hover { +a:hover { color: #55a5ea; - - text-decoration: underline 2.5px rgb(3, 3, 94); + text-decoration: none; } -.header_container { - /* background-color: #d9d9d9; */ - background-color: #022a2d; - opacity: 0.9; - display: flex; - flex-direction: row; - /* justify-content: space-evenly; */ - justify-content: space-between; - align-items: center; - height: 60px; - margin: auto; +h1, +h2, +h3, +h4, +h5, +h6 { + font-family: "Raleway", sans-serif; } .container { - display: flex; + /* display: ; */ font-family: sans-serif; - padding-top: 80px; -} - - -.container a:hover { - text-decoration: underline 2px; + display: unset; } .content { display: flex; flex-direction: column; - padding-left: 20px; - /* justify-content: center; - align-items: center; */ + padding-left: 50px; + padding-top: 90px; } .content h1 { @@ -75,233 +76,468 @@ h1, h2, h3, h4, h5, h6 { } .content h1 span { - color: #f9a826; + color: #55a5ea; + margin-top: 30px; + } -.content h4 { +.content h2 { font-size: 20px; margin-top: 30px; padding-right: 40px; line-height: 1.5; color: #d9d9d9; } +/* Reset styles */ +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} -.content h4 a { - display: inline; - color: #f9a826; +/* Viewport meta tag for responsive design */ +/* Ensure this meta tag is in your HTML section */ +/* */ + +/* General styles */ +.feedback-wrapper { + display: flex; + align-items: center; + justify-content: center; + min-height: 100vh; + padding: 20px; + box-sizing: border-box; + width: 60%; } +.popup { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: rgba(0, 0, 0, 0.5); + display: flex; + align-items: center; + justify-content: center; + z-index: 1000; +} +.popup-content { + background-color: #113435; + padding: 20px; + border-radius: 10px; + text-align: center; + max-width: 100%; + width: 80%; + box-sizing: border-box; +} +.popup-content a { + text-decoration: none; + color: white; +} +.popup-close { + position: absolute; + top: 10px; + right: 10px; + color: #01494b; + font-size: 24px; + cursor: pointer; +} -.container-head{ - display: grid; - align-items: center; - grid-template-columns: 1fr 2fr 13fr 3fr; - margin-top: 0px; +.popup h2 { + color: white; + font-size: 24px; } +.popup p { + margin: 16px 0; + color: #ececec; +} +.popup img { + margin-top: 20px; +} -/*---------------------parallax effect after about------------*/ -.parallax-container { - height: 100vh; - overflow: hidden; - transform: translateY(0); - transition: transform 0.5s ease; +.popup-button { + background-color: #005253; + color: white; + border: none; + padding: 10px 20px; + border-radius: 5px; + cursor: pointer; + font-size: 16px; } -.icon-boxes { - position: relative; - z-index: 1; +.popup-button:hover { + background-color: #206b6c; + color: white; } -.icon-box { - background-color: rgba(255, 255, 255, 0.9); - padding: 20px; - margin-bottom: 20px; +/* Feedback form styles */ +.feedback-form { + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + padding: 40px; + animation: slideInFromBottom 1s cubic-bezier(0.68, -0.55, 0.27, 1.55) forwards; + transition: opacity 0.3s ease-in-out; + background-color: #3fbcc051; border-radius: 10px; + box-shadow: 0 0 10px rgba(6, 130, 130, 0.1); + max-width: 200%; + width: 200%; + opacity: 0; + transition: box-shadow 0.3s ease, transform 0.3s ease; } +.feedback-form:hover { + box-shadow: 0 0 20px rgba(41, 136, 138, 0.5); + transform: translateY(-5px); +} +.feedback-form h2 { + font-size: 27px; + margin-bottom: 8px; + text-align: center; + font-weight: 1000 !important; +} -/** -* Appointment Button * -*/ -.appointment-btn { - margin-left: 25px; - background: #3fbcc0a4; - color: #fff; - border-radius: 50px; - padding: 8px 25px; - white-space: nowrap; - transition: 0.3s; +.feedback-form p { + color: #d7d4d4; font-size: 16px; - font-weight: 600; - display: inline-block; + margin-bottom: 20px; + text-align: center; } -.appointment-btn:hover { - background: #3fbcc0c6; - color: #fff; +.feedback-form .rating-container { + display: flex; + justify-content: center; + margin-bottom: 2px; } -@media (max-width: 768px) { - .appointment-btn { - margin: 0 15px 0 0; - padding: 6px 18px; - } +.rating-container button { + font-size: 24px; + border: none; + background: none; + cursor: pointer; + color: grey; + transition: transform 0.3s ease, color 0.3s ease, text-shadow 0.3s ease; } -/*################----Navigation----################*/ - +.rating-container button.filled { + color: yellow; + transform: scale(1.2); + text-shadow: 0 0 10px yellow; +} -.navbar { - padding: 0; +.rating-container button:hover, +.rating-container button:hover ~ button { + transform: scale(1.1); + color: #ff0; + text-shadow: 0 0 5px yellow; } -.navbar ul { - margin: 0; - padding: 0; - display: flex; - list-style: none; - align-items: center; +.feedback-form .rate-us { + text-align: center !important; + display: block; + margin-top: 0px; + width: 100%; + color: rgb(251, 250, 250); + margin-bottom: 10px; } -.navbar li { - position: relative; +.feedback-form button { + background: none; + border: none; + font-size: 25px; + cursor: pointer; + z-index: 1; + padding: 12px; + transition: transform 0.2s ease; } -.navbar > ul > li { +.feedback-form form { + display: flex; + flex-direction: column; + width: 100%; position: relative; - white-space: nowrap; - padding: 8px 0 8px 20px; + bottom: 7px; } -.navbar a, .navbar a:focus { - display: flex; - align-items: center; - justify-content: space-between; +.feedback-form label { + width: 100%; + text-align: left; font-size: 14px; + margin-top: 9px; + font-weight: 600; color: #fff; - white-space: nowrap; - transition: 0.3s; - border-bottom: 2px solid #fff; - padding: 5px 2px; } -.navbar a i, .navbar a:focus i { - font-size: 12px; - line-height: 0; - margin-left: 5px; +.feedback-form input, +.feedback-form textarea { + margin-top: 10px; + padding: 12px; + border: 1px solid #ccc; + border-radius: 5px; + font-size: 16px; + margin-bottom: 15px; + width: 100%; + box-sizing: border-box; + transition: all 0.3s ease; + box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1); } -.navbar a:hover, .navbar .active, .navbar .active:focus, .navbar li:hover > a { - color: #3fbcc0c6; - border-color: #3fbcc0c6; +.feedback-form input:focus, +.feedback-form textarea:focus { + outline: none; + border-color: #29888a; + box-shadow: 0 0 5px rgba(41, 136, 138, 0.5); } -/*################----Mobile Navigation----################*/ +.feedback-form textarea { + resize: vertical; + min-height: 100px; + max-height: 300px; +} -.mobile-nav-toggle { - color: #fff; - font-size: 28px; +.feedback-form button[type="submit"] { + background-color: hwb(181 16% 46%); + color: white; + border: none; + padding: 12px 20px; + border-radius: 5px; + margin-left: 190px; cursor: pointer; - display: none; - line-height: 0; - transition: 0.5s; + font-size: 16px; + transition: background-color 0.3s ease, transform 0.2s ease; } -.mobile-nav-toggle.bi-x { - color: #fff; +.feedback-form button[type="submit"]:hover { + background-color: #1c5f5e; + transform: translateY(-2px); } -@media (max-width: 991px) { - .mobile-nav-toggle { - display: block; - } - .navbar ul { - display: none; - } +.feedback-form button[type="submit"]:active { + transform: translateY(0); + background-color: #1c5f5e; } -.navbar-mobile { - position: fixed; - overflow: hidden; - top: 0; - right: 0; - left: 0; - bottom: 0; - background: rgba(28, 47, 65, 0.9); - transition: 0.3s; - z-index: 999; +.feedback-form .form-group { + display: flex; + flex-direction: column; + width: 100%; + margin-bottom: 15px; } -.navbar-mobile .mobile-nav-toggle { - position: absolute; - top: 15px; - right: 15px; +/* Keyframes for animation */ +@keyframes slideInFromBottom { + 0% { + transform: translateY(50px); + opacity: 0; + } + 60% { + transform: translateY(-10px); + opacity: 0.8; + } + 80% { + transform: translateY(5px); + opacity: 0.9; + } + 100% { + transform: translateY(0); + opacity: 1; + } } -.navbar-mobile ul { - display: block; - position: absolute; - top: 55px; - right: 15px; - bottom: 15px; - left: 15px; - padding: 10px 0; - background-color: #000; - overflow-y: auto; - transition: 0.3s; -} +/* Responsive adjustments for mobile screens */ +@media (max-width: 768px) { + .feedback-form { + width: 100%; + padding: 15px; + } -.navbar-mobile > ul > li { - padding: 0; + .popup-content { + width: 100%; + padding: 15px; + } + .close-btn { + top: 10px; + } } - -.navbar-mobile a { - padding: 10px 20px; - font-size: 15px; - color: #fff; - border: none; +.content h2 a { + display: inline; + font-size: xx-large; + color: #55a5ea; } - -.navbar-mobile a:hover, .navbar-mobile .active, .navbar-mobile li:hover > a { - color: #3fbcc0c6; +.nav_link li { + margin-right: 1px; + padding: 5px 10px; + display: inline-block; + color: white; } -.navbar-mobile .getstarted { - margin: 15px; + +.nav_link li a { + transition: all 0.3s ease 0s; + color: white; } -/*################----Sections General----################*/ -section { - padding: 60px 0; - overflow: hidden; + +.nav_link li a:hover { + color: #55a5ea; } -.section-bg { - background-color: #000; +#header { + position: relative; + top: 12px; } -.section-title { - text-align: center; - padding-bottom: 30px; +.header_container { + background-color: #022a2d; + display: flex; + flex-direction: row; + justify-content: space-between; + align-items: center; + position: fixed; + width: 100%; + height: 95px; + margin: auto; + margin-top: 0px; + padding-top: 15px; + z-index: 555; } -.section-title h2 { - font-size: 32px; +.logo-text { + color: white; font-weight: bold; - margin-bottom: 20px; - padding-bottom: 20px; - position: relative; - color: #fff; + display: flex; + font-size: 24px; + transform: translateX(120%); + margin-right: 450px; + margin-top: 20px; } -.section-title h2::before { - content: ''; - position: absolute; +.hamburger { + display: none; + flex-direction: column; + cursor: pointer; +} + +.hamburger .line { + width: 25px; + height: 3px; + background-color: white; + margin: 4px 0; +} + +@media (max-width: 768px) { + .logo-text { + display: none; + } + + .nav_link { + display: none; + flex-direction: column; + } + + .hamburger { + display: flex; + order: 1; + margin-left: 10px; + } + + .mobile-logo-text { + display: inline-block; + color: white; + font-weight: bold; + margin-left: 50px; + margin-right: 5px; + font-size: 30px; + } + + .nav_menu.active .nav_link { + display: flex; + flex-direction: column; + position: absolute; + top: 85px; + left: 0; + width: 100%; + background-color: #022a2d; + border-top: 1px solid #ddd; + padding-top: 10px; + z-index: 1; /* Ensure the nav items are above other elements */ + } + + .nav_link li { + margin: 10px 20px; + text-align: left; + } +} + +@media (min-width: 769px) { + .mobile-logo-text { + display: none; + } +} + + + +/*################----Sections General----################*/ +.parallax-container { + height: 100vh; + overflow: hidden; + transform: translateY(0); + transition: transform 0.5s ease; +} + +.icon-boxes { + position: relative; + z-index: 1; +} + +.icon-box { + background-color: rgba(255, 255, 255, 0.9); + padding: 20px; + margin-bottom: 20px; + border-radius: 10px; + z-index: -1; +} +.icon-box { + cursor: pointer +} +section { + overflow: hidden; +} + +.section-bg { + background-color: #000; +} + +.section-title { + /* text-align: left; */ + padding-left: 50px; + padding-right: 50px; + margin-left: 15%; + margin-right: 15%; + text-align: center; + /* text-align: left; */ +} + +.section-title h2 { + font-size: 32px; + font-weight: bold; + margin-bottom: 20px; + padding-bottom: 20px; + position: relative; + color: #fff; +} + +.section-title h2::before { + content: ""; + position: absolute; display: block; width: 120px; height: 1px; @@ -311,21 +547,16 @@ section { } .section-title h2::after { - content: ''; + content: ""; position: absolute; display: block; width: 40px; height: 3px; - background: #3fbcc0c6; + background: #55a5ea; bottom: 0; left: calc(50% - 20px); } -.section-title p { - margin-bottom: 0; -} - - /*################----Home Section----################*/ #home { @@ -335,9 +566,11 @@ section { background-size: cover; margin-bottom: -200px; } -#home .multiple-text{ - color: #3fbcc0a4; + +#home .multiple-text { + color: #55a5ea; } + #home .container { position: relative; margin-top: 150px; @@ -369,11 +602,12 @@ section { border-radius: 50px; transition: 0.5s; color: #fff; - background: #3fbcc0a4; + background: #55a5ea; } -#home video{ + +#home video { margin-top: -70px; - margin-left: 50PX; + margin-left: 50px; height: 900px; position: absolute; top: 200px; @@ -381,7 +615,7 @@ section { } #home .btn-get-started:hover { - background: #3fbcc0c6; + background: #55a5ea; } @media (min-width: 1024px) { @@ -395,13 +629,16 @@ section { margin-bottom: 0; height: 100vh; } + #home .container { padding-bottom: 63px; } + #home h1 { font-size: 28px; line-height: 36px; } + #home h2 { font-size: 18px; line-height: 24px; @@ -415,24 +652,34 @@ section { } } +/*################----Featured----################*/ +.row { + display: flex; + justify-content: center; +} -/*################----Featured----################*/ .featured-services .icon-box { + z-index: -1; + width: 290px; + height: 327px; + margin-left: 15px; + margin-right: 15px; padding: 30px; position: relative; overflow: hidden; background: #111111; box-shadow: 0 0 29px 0 rgba(68, 88, 144, 0.12); transition: all 0.3s ease-in-out; - border-radius: 8px; + border-radius: 50px; z-index: 1; - transform: translateY(0); - transition: transform 0.5s ease; + transform: translateY(0); + transition: transform 0.5s ease; } .featured-services .icon-box::before { - content: ''; + z-index: -1; + content: ""; position: absolute; background: #000; right: 0; @@ -444,49 +691,61 @@ section { } .featured-services .icon-box:hover::before { + z-index: -1; background: #3fbcc051; - top: 50px; - border-radius: 70px; + top: 0px; + border-radius: 50px; } .featured-services .icon1 { + z-index: -1; margin-bottom: 15px; } .featured-services .icon1 i { + z-index: -1; font-size: 48px; line-height: 1; color: #3fbcc0a4; transition: all 0.3s ease-in-out; } + .featured-services .icon2 { + z-index: -1; margin-bottom: 15px; } .featured-services .icon2 i { + z-index: -1; font-size: 48px; line-height: 1; - color: #3fbcc0a4; + color: #55a5ea; transition: all 0.3s ease-in-out; } + .featured-services .icon3 { + z-index: -1; margin-bottom: 15px; } .featured-services .icon3 i { + z-index: -1; font-size: 48px; line-height: 1; - color: #3fbcc0a4; + color: #55a5ea; transition: all 0.3s ease-in-out; } + .featured-services .icon4 { + z-index: -1; margin-bottom: 15px; } .featured-services .icon4 i { + z-index: -1; font-size: 48px; line-height: 1; - color: #3fbcc0a4; + color: #55a5ea; transition: all 0.3s ease-in-out; } @@ -497,7 +756,7 @@ section { } .featured-services .title a { - color: #111; + color: #eee; } .featured-services .description { @@ -506,80 +765,93 @@ section { margin-bottom: 0; } -.featured-services .icon-box:hover .title a, .featured-services .icon-box:hover .description { +.featured-services .icon-box:hover .title a, +.featured-services .icon-box:hover .description { color: #f7f4f4; } -.featured-services .icon-box:hover .icon1 i{ +.featured-services .icon-box:hover .icon1 i { color: red; } -.featured-services .icon-box:hover .icon2 i{ + +.featured-services .icon-box:hover .icon2 i { color: rgb(235, 17, 235); } -.featured-services .icon-box:hover .icon3 i{ + +.featured-services .icon-box:hover .icon3 i { color: orange; } -.featured-services .icon-box:hover .icon4 i{ + +.featured-services .icon-box:hover .icon4 i { color: greenyellow; } - - /*################----About----################*/ .about .icon-boxes h4 { + z-index: -1; font-size: 18px; - color: #3fbcc0a4; + color: #55a5ea; margin-bottom: 15px; } .about .icon-boxes h3 { + z-index: -1; font-size: 28px; font-weight: 700; - color: #3fbcc0a4; + color: #55a5ea; margin-bottom: 15px; } .about .icon-box { + z-index: -1; background: #111111; border-radius: 10px; margin-top: 35px; + margin-left: 15%; + margin-right: 15%; } .about .icon-box .icon { + z-index: -1; float: left; display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; - border: 2px solid #3fbcc0a4; + border: 2px solid #55a5ea; border-radius: 50px; transition: all 0.5s ease-in-out; } .about .icon-box .icon i { + z-index: -1; color: #3fbcc0a4; font-size: 32px; } .about .icon-box:hover .icon { - background: #3fbcc0a6; - border-color: #3fbbc0; + z-index: -1; + background: #55a5ea; + border-color: #55a5ea; } .about .icon-box:hover .icon i { + z-index: -1; color: #fff; } .about .icon-box .title { + z-index: -1; margin-left: 85px; - + font-weight: 700; margin-bottom: 10px; font-size: 18px; } .about .icon-box .title a { + z-index: -1; color: #fff; transition: 0.3s; font-size: 18px; @@ -587,17 +859,20 @@ section { } .about .icon-box .title a:hover { - color: #3fbcc0a6; + z-index: -1; + color: #55a5ea; } .about .icon-box .description { + z-index: -1; margin-left: 85px; line-height: 24px; font-size: 14px; } .about .video-box { - background: url("../img/about.png") center center no-repeat; + z-index: -1; + background: url("../img/about.png") center center no-repeat; background-size: cover; height: 300px; top: 50px; @@ -605,8 +880,9 @@ section { .about .play-btn { width: 94px; + z-index: -1; height: 94px; - background: radial-gradient(#3fbcc0a4 50%, rgba(4, 196, 234, 0.4) 52%); + background: radial-gradient(#55a5ea 50%, rgba(4, 196, 234, 0.4) 52%); border-radius: 50%; display: block; position: absolute; @@ -616,7 +892,8 @@ section { } .about .play-btn::after { - content: ''; + z-index: -1; + content: ""; position: absolute; left: 50%; top: 50%; @@ -627,11 +904,12 @@ section { border-bottom: 10px solid transparent; border-left: 15px solid #fff; z-index: 100; - transition: all .5s cubic-bezier(0.55, 0.055, 0.675, 0.19); + transition: all 0.5s cubic-bezier(0.55, 0.055, 0.675, 0.19); } .about .play-btn::before { - content: ''; + z-index: -1; + content: ""; position: absolute; width: 120px; height: 120px; @@ -644,12 +922,14 @@ section { } .about .play-btn:hover::after { - border-left: 15px solid #3fbcc0a6; + z-index: -1; + border-left: 15px solid #55a5ea; transform: scale(20); } .about .play-btn:hover::before { - content: ''; + content: ""; + z-index: -1; position: absolute; left: 50%; top: 50%; @@ -671,6 +951,7 @@ section { transform: scale(0.6, 0.6); opacity: 1; } + 100% { transform: scale(1, 1); opacity: 0; @@ -682,69 +963,99 @@ section { transform: scale(0.6, 0.6); opacity: 1; } + 100% { transform: scale(1, 1); opacity: 0; } } - - /*################----Counts----################*/ + .counts { - padding-bottom: 30px; + display: flex; + flex-direction: row; + margin: 30px; } .counts .count-box { - box-shadow: -10px -5px 40px 0 rgba(0, 0, 0, 0.1); - padding: 20px; - width: 100%; - background:#1c413b; - border-radius: 15px; - margin-top: 10px; + margin-top: 17px; + flex: 15%; + z-index: -1; + width: 280px; + height: 300px; + margin-left: 25px; + margin-right: 15px; + padding: 53px; + position: relative; + overflow: hidden; + background: #1c413b; + box-shadow: 0 0 29px 0 rgba(68, 88, 144, 0.12); + border-radius: 50px; +} + +.row { + padding-left: 33px; + --bs-gutter-x: 1.5rem; + --bs-gutter-y: 0; + display: flex; + flex-wrap: wrap; + margin-top: calc(var(--bs-gutter-y)* -2); + margin-right: calc(var(--bs-gutter-x) / -2); + margin-left: calc(var(--bs-gutter-x) / -2); +} + +.row-d { + display: flex; + margin: 0px 20px 0px 20px; + align-items: center; + justify-content: space-between; } .counts .count-box i { - display: block; font-size: 30px; color: #fcfcfc; float: left; } -.counts .count-box span{ +.counts .count-box span { font-size: 42px; line-height: 24px; - display: block; + display: inline-block; font-weight: 700; color: #f9f4f4; margin-left: 50px; } -.container .drop .content span{ + +.container .drop .content span { font-size: 42px; line-height: 24px; - display: block; + display: inline-block; font-weight: 700; color: #faf8f8; } -.container .drop .content p{ + +.container .drop .content p { font-size: 30px; line-height: 24px; - display: block; + display: inline-block; + justify-content: center; font-weight: 700; color: #f8f8f8; } + .counts .count-box p { + z-index: -1; padding: 30px 0 0 0; - margin: 0; font-family: "Roboto", sans-serif; font-size: 14px; color: #fffcfc; } .counts .count-box a { + z-index: -1; font-weight: 600; display: block; - margin-top: 10px; color: #faf8f8; font-size: 15px; font-family: "Poppins", sans-serif; @@ -752,16 +1063,20 @@ section { } .counts .count-box a:hover { - color: #3fbcc0a6; + color: #55a5ea; } - - /*################----Services----################*/ .services .icon-box { text-align: center; + margin-left: 2rem; + margin-right: 2rem; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; border: 1px solid #0a0a0a; - padding: 80px 20px; + padding: 30px 20px; transition: all ease-in-out 0.3s; background-color: #1c413b; } @@ -772,7 +1087,7 @@ section { height: 64px; background: #1977cc; border-radius: 5px; - transition: all .3s ease-out 0s; + transition: all 0.3s ease-out 0s; display: flex; align-items: center; justify-content: center; @@ -787,14 +1102,14 @@ section { .services .icon-box .icon::before { position: absolute; - content: ''; + content: ""; left: -8px; top: -8px; height: 100%; width: 100%; background: #badaf7; border-radius: 5px; - transition: all .3s ease-out 0s; + transition: all 0.3s ease-out 0s; transform: translateZ(-1px); } @@ -805,17 +1120,24 @@ section { } .services .icon-box h4 a { - color: #3fbcc0a4; + color: #55a5ea; } .services .icon-box p { line-height: 24px; font-size: 14px; margin-bottom: 0; - } + +.services .container { + display: grid; + grid-template-columns: repeat(3, 1fr); + /* gap: 20px; */ + margin-top: 8px; +} + .services .icon-box:hover { - background: #3fbcc0a4; + background: #55a5ea; border-color: #3fbbc0; } @@ -831,74 +1153,45 @@ section { background: #3291e6; } -.services .icon-box:hover h4 a, .services .icon-box:hover p { +.services .icon-box:hover h4 a, +.services .icon-box:hover p { color: #111111; } - - -/*################----Appointments----################*/ -.layout{ - /*border: 2px solid #ccc; */ - background-color: #3fbcc051; - border-radius: 30px; - padding: 50px; - width: 700px; - margin: 0 auto; -} -.appointment .php-email-form { - width: 100%; -} - -.appointment .php-email-form .form-group { - padding-bottom: 8px; -} - -.appointment .php-email-form input, .appointment .php-email-form textarea, .appointment .php-email-form select { - margin-left: 250px; - border-radius: 0; - box-shadow: none; - font-size: 14px; - background: #badaf7; - border-radius: 10px; - padding: 10px !important; - color: #6c757d; -} - -.appointment .php-email-form input:focus, .appointment .php-email-form textarea:focus, .appointment .php-email-form select:focus { - border-color: #3fbcc0a6; - -} - -.appointment .php-email-form input, .appointment .php-email-form select { - height: 44px; - +/* Styles for medium screens */ +@media (max-width: 991px) { + .services .container { + padding: 1rem; + grid-template-columns: repeat(2, 1fr); + } } -.appointment .php-email-form textarea { - padding: 10px 12px; +/* Styles for smaller screens */ +@media (max-width: 767px) { + .services .container { + grid-template-columns: 1fr; + } } -.appointment .php-email-form button[type="submit"] { - margin-left: 250px; - background: #3fbcc0a6; - border: 0; - padding: 10px 35px; - color: #fff; - transition: 0.4s; - border-radius: 50px; -} +/* Additional smaller adjustments */ +@media (max-width: 575px) { + .services .icon-box { + padding: 20px; + } -.appointment .php-email-form button[type="submit"]:hover { - background: #3fbcc0bd; + .services .icon i { + font-size: 30px; + } } - - - /*################----Doctors----################*/ + .doctors { background: #000; + display: flex; + flex-direction: column; + align-items: center; + } .doctors .member { @@ -906,6 +1199,13 @@ section { position: relative; border-radius: 10px; padding: 30px; + margin: 10px 0; + display: flex; + flex-direction: column; + align-items: center; + text-align: center; + width: 250px; + box-sizing: border-box; } .doctors .member .pic { @@ -923,7 +1223,7 @@ section { } .doctors .member .member-info { - padding-left: 30px; + padding-top: 20px; } .doctors .member h4 { @@ -942,7 +1242,7 @@ section { } .doctors .member span::after { - content: ''; + content: ""; position: absolute; display: block; width: 50px; @@ -951,27 +1251,32 @@ section { bottom: 0; left: 0; } -.doctors .nxt-pg button{ - background: #3fbcc0a6; + +.doctors .nxt-pg { + display: flex; + justify-content: center; + padding: 20px; +} + +.doctors .nxt-pg button { + background: #55a5ea; border: 0; padding: 10px 35px; - text-decoration: none; transition: 0.4s; width: 200px; border-radius: 50px; color: white; } -.doctors .nxt-pg button:hover{ - background:#3fbcc0be; +.doctors .nxt-pg button:hover { + background: #55a5ea; } - - -/*################----Contact----################*/ .contact .info { - width: 100%; - background: #000; + background: #0a0a0a; + border-radius: 15px; + padding: 15px; + margin-bottom: 20px; } .contact .info i { @@ -981,7 +1286,7 @@ section { width: 44px; height: 44px; background: #0a0a0a; - border: 2px solid #3fbcc0a4; + border: 2px solid #55a5ea; display: flex; justify-content: center; align-items: center; @@ -1004,40 +1309,39 @@ section { color: #fff; } -.contact .info .email, .contact .info .phone { - margin-top: 40px; +.contact .info .email, +.contact .info .phone { + margin-top: 20px; } -.contact .info .email:hover i, .contact .info .address:hover i, .contact .info .phone:hover i { - background: #3fbcc0a4; - +.contact .info .email:hover i, +.contact .info .address:hover i, +.contact .info .phone:hover i { + background: #55a5ea; } .contact .php-email-form { - width: 100%; background: #000; + padding: 20px; + border-radius: 15px; } .contact .php-email-form .form-group { - padding-bottom: 8px; -} - -.contact .php-email-form input, .contact .php-email-form textarea { - border-radius: 10px; - box-shadow: none; - font-size: 14px; - -} - -.contact .php-email-form input { - height: 44px; + margin-bottom: 15px; } +.contact .php-email-form input, .contact .php-email-form textarea { - padding: 10px 12px; + border: 1px solid #ccc; + border-radius: 8px; + padding: 10px; + width: 100%; + font-size: 14px; + color: #000; } .contact .php-email-form button[type="submit"] { + display: inline-block; background: #3fbcc0a6; border: 0; padding: 10px 35px; @@ -1047,323 +1351,667 @@ section { } .contact .php-email-form button[type="submit"]:hover { - background:#3fbcc0be; + background: #55a5ea; } -@-webkit-keyframes animate-loading { - 0% { - transform: rotate(0deg); - } - 100% { - transform: rotate(360deg); - } +.confirmation-message { + display: none; + text-align: center; + margin-top: 15px; + color: #fff; } -@keyframes animate-loading { - 0% { - transform: rotate(0deg); - } - 100% { - transform: rotate(360deg); +@media (max-width: 768px) { + .contact .info, + .contact .php-email-form { + padding: 15px; } } -/*################--feedback###############*/ +/* Importing Google font - Open Sans */ +@import url("https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700&display=swap"); -.feedback{ - border-radius: 1rem; - background-color: #fff; - padding: 2rem 4rem; - box-shadow: rgba(50,50,93,0.25) 0px 2px 5px -1px,rgba(0, 0,0,0.3) 0px 1px 3px -1px; - margin: 50px; - width: 60%; - margin-left: 250px; - padding: 20px; -} -.feedback h1{ - color: black; - font-size: 2.0rem; - margin-bottom: 0.3rem; - font-family: "Poppins", sans-serif; +* { + margin: 0; + padding: 0; + box-sizing: border-box; + font-family: "Open Sans", sans-serif; } -.feedback p{ - color: black; - font-size: 1.1rem; - font-family: "Poppins", sans-serif; + +.footer { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + max-width: 1280px; + width: 95%; + background: #3fbcc051; + border-radius: 6px; } -.emoji{ - padding: 1rem 0; - width: 20%; + +.footer .footer-row { display: flex; + flex-wrap: wrap; justify-content: space-between; + gap: 3.5rem; + padding: 60px; +} + +.footer-row .footer-col h4 { + color: #f0f0f0; + font-size: 1.2rem; + font-weight: 400; +} + +.footer-col .links { + margin-top: 20px; +} + +.footer-col .links li { + list-style: none; + margin-bottom: 10px; +} + +.footer-col .links li a { + text-decoration: none; + color: #bfbfbf; +} + +.footer-col .links li a:hover { + color: #fff; +} + +.footer-col p { + margin: 20px 0; + color: #bfbfbf; + max-width: 300px; +} + +.footer-col form { + display: flex; + gap: 5px; } -.btn{ - background-color: transparent; + +.footer-col input { + height: 40px; + border-radius: 6px; + background: none; + width: 100%; + outline: none; + border: 1px solid #7489c6; + caret-color: #fff; + color: #fff; + padding-left: 10px; +} + +.footer-col input::placeholder { + color: #ccc; +} + +.footer-col form button { + background: #fff; border: none; - font-size: 1.5rem; - font-family: "Poppins", sans-serif; - transition: 0.2s ease-in; + color: #08434551; + padding: 10px 15px; + border-radius: 6px; cursor: pointer; - &:hover { - transform: scale(1.5); - } + font-weight: 1000; + transition: 0.2s ease; } -.ques{ - margin: 0.5rem 0; +.footer-col form button:hover { + background: #cecccc; } -.feedback #textarea{ - padding: 1rem; - width: 80%; - background-color: transparent; - border: 0.1rem solid black; - border-radius: 0.5rem; - color: black; - margin-bottom: 0.6rem; - &:active{ - box-shadow: rgba(50, 50, 93,0.25) 0px 2px 5px -1px,rgba(0,0,0,0.3) 0px 1px 3px -1px; + +@media (max-width: 768px) { + .footer { + position: relative; + bottom: 0; + left: 0; + transform: none; + width: 100%; + border-radius: 0; + } + + .footer .footer-row { + padding: 20px; + gap: 1rem; + } + + .footer-col form { + display: block; + } + + .footer-col form :where(input, button) { + width: 100%; + } + + .footer-col form button { + margin: 10px 0 0 0; } } -.radiobtn{ - width: 40%; - display: flex; - justify-content: space-between; - +/*################----Back to top----################*/ +footer { + position: relative; + padding: 50px 0; } -.one{ - display: flex; + +#back-to-top-container { + position: fixed; + bottom: 15px; + right: 77px; + cursor: pointer; + z-index: 1000; } -.input{ - position: relative; - font-family: "Poppins", sans-serif; - font-size: 1rem; - appearance: none; - width: 2rem; - height: 2rem; - border: 0.1rem solid black; - border-radius: 50%; + +.circle { + border-radius: 50%; + background-color: #fff; display: flex; justify-content: center; align-items: center; - &::before{ - content: " "; - width: 1rem; - height: 1rem; - border-radius: 50%; - transition: 0.2s; - } - &:checked::before{ - background-color: #1977cc; + transition: background-color 0.3s; +} - } +#back-to-top { + width: 55px; + height: 55px; + fill: hwb(181 16% 46%); + color: hwb(181 11% 13%); + transition: fill 0.3s; } -.label{ - color: black; - font-family: "Poppins", sans-serif; - font-size: 1.1rem; - margin-left: 1rem; + +#back-to-top:hover { + transform: scale(1.1); } -.info{ - width: 100%; - display: flex; - justify-content: space-between; - flex-direction: column; - margin: 0.5rem 0; + + + +/* Style for pateint portal */ +/* -----***************************************----- */ +.patient-portal { + width: 60%; + margin: 0 auto; + padding: 20px; + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); + background-color: #3fbcc051; + text-align: center; + margin-bottom: 7%; + border-radius: 20px; } -.center{ - margin-top: 2rem; +.patient-portal input{ + padding: 10px; + font-size: 16px; + border: 1px solid #ccc; + border-radius: 5px; + box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); + +} +/* Section title styling */ +.section-title h1 { + color: #29888a; text-align: center; - - .button{ - width: 15%; - background-color: white; - border-radius: 0.5rem; - border: none; - font-size: 1.4rem; - font-family: "Poppins", sans-serif; - padding:1rem 4rem; - cursor: pointer; - color: #000; - } - .button:active{ - background-color: white; - transform: scale(1.0); +} - } - .button:hover{ - background-color:rgb(63, 155, 124) ; - } +.section-title p { + text-align: center; + color: white; + font-size: 20px; } +/* Form styling */ +.form-group { + margin-top: 15px; + margin-bottom: 15px; +} +.forgot-password { + margin-top: 20px; +} -/*################----Footer----################*/ -#footer { - background: #000; - padding: 0 0 30px 0; - color: #fff; - font-size: 14px; +.form-control { + width: 100%; + padding: 10px; + border: 1px solid #ccc; + border-radius: 4px; } -#footer .footer-top { - background: #000; - padding: 60px 0 30px 0; +.btn { + background-color: hwb(181 16% 46%); + color: white; + border: none; + padding: 10px 20px; + border-radius: 4px; + cursor: pointer; + z-index: 1000; } -#footer .footer-top .footer-info { - margin-bottom: 30px; + +:root { + --text-color: #959DA5; + --footer-bg: #3fbcc051; + --footer-bottom-bg: #3fbcc051s; + --white: white; + --link-color: #959DA5; + --link-hover: #2F81CF; + --button-border: #848D97; } -#footer .footer-top .footer-info h3 { - font-size: 24px; - margin: 0 0 20px 0; - padding: 2px 0 2px 0; - line-height: 1; +.subscribe-btn { + display: flex; + align-items: center; + justify-content: center; + max-width: 8rem; + color: var(--white); + text-decoration: none; + font-size: 1rem; + height: 3rem; font-weight: 700; + white-space: nowrap; + vertical-align: middle; + user-select: none; + border: 1px solid var(--link-color); + border-radius: 0.375rem; + transition: all 0.2s ease-in-out; } -#footer .footer-top .footer-info p { - font-size: 14px; - line-height: 24px; - margin-bottom: 0; - font-family: "Roboto", sans-serif; +#subscribeButton:hover { + background-color: #55a5ea; + color: white; + transform: scale(1.05); + border-color: #3fbbc0; } -#footer .footer-top .social-links a { - font-size: 18px; - display: inline-block; - background: #3fbcc0a4; - color: #fff; - line-height: 1; - padding: 8px 0; - margin-right: 4px; - border-radius: 4px; - text-align: center; - width: 36px; - height: 36px; - transition: 0.3s; +/*? footer containers */ +footer { + bottom: 0; + background-color: var(--footer-bg); + width: 100%; + min-width: 20re; + bottom: 0; + display: flex; + align-items: center; + flex-direction: column; } -#footer .footer-top .social-links a:hover { - background: #3fbcc0c1; - text-decoration: none; + +.footer-wrapper { + display: flex; + flex-direction: column; + max-width: 80rem; + width: 100%; + margin: 0 auto; + padding: 1rem; } -#footer .footer-top h4 { - font-size: 16px; - font-weight: 600; - position: relative; - padding-bottom: 12px; +.footer-logo-columns { + list-style-type: none; + display: flex; + flex-direction: row; + flex-wrap: wrap; + flex-grow: 4; + gap: 3rem 1rem; } -#footer .footer-top .footer-links { - margin-bottom: 30px; +.footer-logo { + margin-bottom: 2rem; + width: 3rem; } -#footer .footer-top .footer-links ul { - list-style: none; - padding: 0; - margin: 0; +.footer-logo-column { + display: flex; + grid-area: footer-logo; + flex-direction: column; + min-width: 16rem; + flex-grow: 1; + padding-right: 0.5rem; } -#footer .footer-top .footer-links ul i { - padding-right: 2px; - color: #3fbcc0a4; - font-size: 18px; - line-height: 1; +.footer-logo-column p { + color: var(--text-color); + font-size: 0.95rem; + margin-bottom: 1.5rem; +} + +.footer-logo-column h3 { + color: var(--white); + margin-top: 0.25rem; + margin-bottom: 0.25rem; +} + +/* other columns */ + +.other-columns { + display: inline-grid; + grid-template-columns: repeat(2, 1fr); + width: 100%; + gap: 2rem 1rem; + padding-top: 2rem; } -#footer .footer-top .footer-links ul li { - padding: 10px 0; +.other-columns ul { display: flex; - align-items: center; + gap: 0.75rem; + list-style-type: none; + padding: 0; + margin: 0; + flex-direction: column; + font-weight: 600; } -#footer .footer-top .footer-links ul li:first-child { - padding-top: 0; +.other-columns ul a { + color: var(--text-color); + text-decoration: none; + font-size: 0.85rem; } -#footer .footer-top .footer-links ul a { - color: #fff; - transition: 0.3s; - display: inline-block; - line-height: 1; +.other-columns h3 { + color: var(--link-color); + margin-bottom: 1rem; + font-size: 1rem; + font-family: ui-monospace, monospace; } -#footer .footer-top .footer-links ul a:hover { - color: #3fbbc0; +.footer-logo svg { + fill: var(--white); } -#footer .footer-top .footer-newsletter form { - margin-top: 30px; - background: #fff; - padding: 6px 10px; +/*? Footer bottom */ +.links a { position: relative; - border-radius: 4px; + text-decoration: none; + color: #333; /* Initial link color */ + transition: color 0.3s ease; } -#footer .footer-top .footer-newsletter form input[type="email"] { - border: 0; - padding: 4px; - width: calc(100% - 110px); +.links a::before { + content: ''; + position: absolute; + width: 100%; + height: 2px; + bottom: -4px; /* Adjusts the position of the underline */ + left: 0; + background-color: #55a5ea; + transform: scaleX(0); + transform-origin: right; + transition: transform 0.4s ease; } -#footer .footer-top .footer-newsletter form input[type="submit"] { - position: absolute; +.links a:hover { + color: #55a5ea; /* Text color on hover */ +} + +.links a:hover::before { + transform: scaleX(1); + transform-origin: left; /* Makes the underline appear to slide from left to right */ +} + + +/* Hover effect */ +.links a:hover::after { + width: 100%; + left: 0; + /* Reset to left 0 to create the effect from right to left */ + right: auto; +} + + +.footer-bottom { + width: 100%; + color: var(--text-color); + background-color: var(--footer-bottom-bg); + margin: 0 auto; +} + +.footer-bottom-wrapper { + max-width: 80%; + margin: 0 auto; + gap: 1rem; + width: 100%; + text-align: center; + padding: 1rem; + margin-right: 150px; + margin-top: 3rem; +} + +.footer-bottom small { + font-size: 1rem; + display: inline; +} + +.footer-bottom-links { text-decoration: none; - border: none; - top: -1px; - right: -1px; - bottom: -1px; - background: none; - font-size: 16px; - padding: 0 20px; - background: #3fbcc0a4; - color: #fff; - transition: 0.3s; - border-radius: 0 4px 4px 0; + list-style-type: none; + display: inline-flex; + flex-wrap: wrap; + justify-content: center; + gap: 1rem; } -#footer .footer-top .footer-newsletter form input[type="submit"]:hover { - background: #3fbcc0a4; +.footer-bottom-links a { + color: var(--link-color); + text-decoration: none; + white-space: nowrap; } -#footer .copyright { +.footer-bottom-links a:hover { + color: var(--link-hover); + text-decoration: none; +} + +.footer-bottom>small { + font-size: 1rem; + margin: 0 auto; + width: 100% +} +.copyright{ + height: 5rem; + width: 80%; + margin: 0 auto; text-align: center; - padding-top: 30px; + margin-top: 2rem; + color: #888; +} +#ss{ + text-decoration: underline; +} +#ss2{ + font-style: italic; + font-size: 18px; + font-weight: 500; } +/*? socials */ +.social-wrapper { + display: flex; + gap: 0.5rem; + margin: 0 auto; +} +.social-links { + display: inline-flex; + gap: 1rem; + align-items: center; + margin-left: -100px; + +} -/*################----Back to top----################*/ -.back-to-top { +.social-links img { + width: 1.5rem; + height: 1.5rem; + transition: all 0.2s ease-in-out; +} + +.social-links img:hover { + transform: scale(1.1); +} + +.social-links ul { + display: flex; + flex-wrap: wrap; + gap: 0.75rem; + list-style-type: none; +} + +.footer-bottom-wrapper { + display: flex; + flex-direction: column; + justify-content: center; +} + + + + +@media (min-width: 600px) { + .other-columns { + display: grid; + grid-template-columns: repeat(4, 1fr); + } + + .footer-bottom-wrapper { + flex-direction: row; + } + + .footer-bottom-wrapper small { + font-size: smaller; + } + + .footer-bottom-links { + margin-left: 1.5rem; + } +} + +@media (max-width: 800px) { + .footer-top { + display: flex; + flex-direction: column; + align-items: center; + text-align: center; + padding: 1rem 0.5rem 2rem 0.5rem; + } +} + #abc :hover{ + background: #55a5ea; + border-color: #3fbbc0; +} +.social-links i{ + font-size: 1.5rem + } + #ss{ + font-size: 1.3rem; + } +.social-links #insta:hover { + /* Add the white background */ +background: white; +/* Gradient background for text */ +background-image: linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); +background-size: 100%; +/* Use the text as a mask for the background */ +-webkit-background-clip: text; +background-clip: text; +-webkit-text-fill-color: transparent; +-moz-background-clip: text; +-moz-text-fill-color:transparent; +} +.social-links #twit a:hover{ + color: #000; +} +.social-links #git a:hover{ + color: black; +} +.social-links #git:hover{ + background-color: white; + border-radius: 50%; +} +.social-links #linkd a:hover{ + color: #0077b5; +} +.social-links #fb a:hover{ + color: #1877f2; +} +.social-links #linkd a:hover{ + color: #0077b5; +} +.social-links #phn a:hover{ + color: red; +} +.social-links #mail1 a:hover{ + color: #bd4b39; +} + +#abc a:hover { + background: #55a5ea; + border-color: #3fbbc0; + color: black; +} + +#subscribeBanner { + display: none; position: fixed; - visibility: hidden; - opacity: 0; - right: 15px; - bottom: 15px; - z-index: 996; - background: #3fbcc0a4; - width: 40px; - height: 40px; - border-radius: 4px; - transition: all 0.4s; + top: 100px; + right: 20px; + background: rgb(75, 182, 183); + color: black; + padding: 5px; + z-index: 1000; + border-radius: 5px; + box-shadow: 0 2px 5px rgba(0,0,0,0.2); } -.back-to-top i { - font-size: 28px; - color: #fff; - line-height: 0; + +@media screen and (max-width: 768px) { + #ss { + font-size: 12px; + } } -.back-to-top:hover { - background: #3fbcc0cd; - color: #fff; +@media screen and (max-width: 480px) { + #ss { + font-size: 10px; + } } -.back-to-top.active { - visibility: visible; - opacity: 1; +#feedback-message { + display: none; + position: fixed; + top: 100px; + right: 20px; + background-color: green; + color: white; + padding: 10px 20px; + border-radius: 5px; + z-index: 1000; +} +.popup-message { + display: none; + margin-top: 20px; + padding: 10px; + background-color: white; + color: green; + border: 2px solid green; + border-radius: 5px; + text-align: center; +} +.rating-container button { + font-size: 24px; + cursor: pointer; + background: none; + border: none; +} +.rating-container button:hover{ +transform: scale(1.5); +} +.sec-img { + transform-style: preserve-3d; + will-change: transform; +} +.nav_link li{ +font-size: 16px; +display: flex; +flex-direction: row; +} +.st0 { + fill: #2F7F81; } diff --git a/successful_appointment.html b/successful_appointment.html index 43cbd2fd..cb8778f0 100644 --- a/successful_appointment.html +++ b/successful_appointment.html @@ -3,7 +3,7 @@ - Appointment Booking Success + RapiDoc + + + +
+ + + + + + + + +
+
+
+
+ +
+
Pathology Testing
+

Experience comprehensive analysis and precise diagnosis through our + expert laboratory examinations of your bodily samples.

+ Book Now +
+
+
+
+
+ +
+
Microbiology Tests
+

Discover how we can help identify infections and guide your + treatment with our advanced microbiological investigations.

+ Book Now +
+
+
+
+
+ +
+
Biochemistry Tests
+

Gain valuable health insights with our detailed assessment of your + body's biochemical processes and compounds.

+ Book Now +
+
+
+
+
+ +
+
Histopatology Tests
+

Trust our microscopic tissue examinations to provide accurate + information about the manifestations of diseases.

+ Book Now +
+
+
+
+
+ +
+
Urine Tests
+

Detect and manage various medical conditions with our thorough urine + analysis services. +

+ Book Now +
+
+
+
+
+ +
+
Blood Tests
+

Ensure your overall health and receive accurate diagnoses with our + vital blood examination services.

+ Book Now +
+
+
+
+
+ +
+
Fever Tests
+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur + tellus augue.

+ Book Now +
+
+
+
+
+ +
+
Allergy Tests
+

Identify and manage your allergies with our reliable and + comprehensive testing services, tailored to your specific needs.

+ Book Now +
+
+
+ + + + + + +





+ + + + + + + + + \ No newline at end of file diff --git a/twitter.png b/twitter.png new file mode 100644 index 00000000..e3247ffb Binary files /dev/null and b/twitter.png differ diff --git a/twitter1.png b/twitter1.png new file mode 100644 index 00000000..dbf2e177 Binary files /dev/null and b/twitter1.png differ diff --git a/twitter1.svg b/twitter1.svg new file mode 100644 index 00000000..15b652ee --- /dev/null +++ b/twitter1.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/website mentioned below b/website mentioned below deleted file mode 100644 index 664de6c3..00000000 --- a/website mentioned below +++ /dev/null @@ -1 +0,0 @@ -https://69glitch.github.io/RapiDoc/