Go to file
Mahmoud Emad f22e9faae2 chore: Update Tailwind CSS and dependencies
- Downgraded Tailwind CSS to version 3.4.17 for compatibility.
- Updated various dependencies to resolve version conflicts and
  ensure smooth operation.
- Added missing types for Node.js to enhance type safety.
- Improved the theming system using CSS custom properties (variables)
  for better customization and dark mode support.
- Refactored styles in `app.css` to improve maintainability and
  readability.  Updated the color palette to enhance the user
  experience.
- Updated the PostCSS configuration to use the new Tailwind CSS
  version.
- Updated component styles to utilize the new theming system.
2025-05-12 13:47:47 +03:00
specs ... 2025-05-11 12:55:47 +03:00
sweb chore: Update Tailwind CSS and dependencies 2025-05-12 13:47:47 +03:00
.gitignore chore: Improve website UI and add .vscode to .gitignore 2025-05-11 17:43:11 +03:00
Dockerfile feat: Add Dockerfile and simplify install script 2025-05-11 17:59:50 +03:00
install.sh feat: Add Dockerfile and simplify install script 2025-05-11 17:59:50 +03:00
README.md feat: Add comprehensive README with project details 2025-05-11 16:13:21 +03:00
run.sh feat: Add Dockerfile and simplify install script 2025-05-11 17:59:50 +03:00
start-docker.sh feat: Add Docker startup script 2025-05-11 18:04:46 +03:00

SecureWeb

A modern, responsive web application for displaying secure web content with dynamic Markdown rendering.

Features

  • Dynamic Markdown Rendering: Renders Markdown content from files with support for images and formatting
  • Responsive Design: Works on desktop and mobile devices
  • Navigation System: Sidebar navigation with expandable sections
  • Fixed Footer: Simple, light-colored footer fixed at the bottom of the page
  • Tailwind CSS: Styled with Tailwind CSS for modern, clean UI

Project Structure

secureweb/
├── sweb/                   # Main application directory
│   ├── public/             # Static assets
│   │   └── images/         # Images used in Markdown content
│   ├── src/                # Source code
│   │   ├── components/     # Svelte components
│   │   │   ├── Footer.svelte
│   │   │   ├── Home.svelte
│   │   │   ├── Layout.svelte
│   │   │   ├── MarkdownContent.svelte
│   │   │   ├── Navbar.svelte
│   │   │   ├── NavDataProvider.svelte
│   │   │   └── Sidebar.svelte
│   │   ├── data/           # Data files
│   │   │   └── navData.json # Navigation structure
│   │   ├── docs/           # Markdown content
│   │   │   ├── introduction/
│   │   │   ├── why-ourworld/
│   │   │   ├── our-story/
│   │   │   ├── our-solutions/
│   │   │   ├── our-projects/
│   │   │   └── more-info/
│   │   ├── types/          # TypeScript type definitions
│   │   │   └── nav.ts
│   │   ├── App.svelte      # Main application component
│   │   ├── app.css         # Global styles
│   │   └── main.ts         # Application entry point
│   ├── index.html          # HTML entry point
│   ├── package.json        # Dependencies and scripts
│   ├── postcss.config.js   # PostCSS configuration
│   ├── tailwind.config.js  # Tailwind CSS configuration
│   ├── tsconfig.app.json   # TypeScript configuration
│   └── vite.config.ts      # Vite configuration
└── README.md               # This file

Getting Started

Prerequisites

  • Node.js (v18 or later)
  • pnpm (v8 or later)

Installation

  1. Clone the repository:

    git clone https://github.com/codescalers/secureweb.git
    cd secureweb
    
  2. Install dependencies:

    cd sweb
    pnpm install
    
  3. Start the development server:

    pnpm run dev
    
  4. Open your browser and navigate to http://localhost:5173

Adding Content

Navigation Structure

The navigation structure is defined in src/data/navData.json. Each entry can have:

  • label: The display name in the sidebar
  • link: The URL path
  • children: An array of sub-items (optional)

Adding Markdown Content

  1. Create a new Markdown file in the appropriate directory under src/docs/

  2. Update navData.json to include a link to your new content

  3. Images can be included using standard Markdown syntax:

    ![Alt text](image.jpg)          # Relative path
    ![Alt text](/images/image.jpg)  # Absolute path
    
  4. Place images in the public/images/ directory, preferably in a subdirectory matching your content section

Technologies Used

License

This project is licensed under the MIT License - see the LICENSE file for details.