This commit is contained in:
2026-07-16 05:48:12 -05:00
parent c36d46c3b3
commit e9be65df8c
558 changed files with 74087 additions and 75 deletions
-7
View File
@@ -121,13 +121,6 @@ ipython_config.py
# PEP 582; used by e.g. github.com/David-OConnor/pyflow and github.com/pdm-project/pdm
__pypackages__/
# Celery stuff
celerybeat-schedule
celerybeat.pid
# SageMath parsed files
*.sage.py
# Environments
.env
.venv
+6 -3
View File
@@ -16,7 +16,8 @@ data model, folder layout, deployment, and phased implementation plan.
- Django 6.0, Python 3.12
- Postgres (production), SQLite (local fallback)
- Redis + Celery/Beat for background jobs (sends, scheduled posts)
- **Django Tasks (`django.tasks`)** for background work (sends, scheduled posts) — Postgres
queue store + a single worker process; no Redis/Celery
- `uv` package manager
- Docker; deployed via the `server-infra` Ansible pipeline onto active/active hosts behind
Nginx Proxy Manager (same pattern as `company_site`)
@@ -38,9 +39,10 @@ Once scaffolded:
```bash
uv sync
docker compose up # web + postgres + redis
docker compose up # web + postgres
uv run python manage.py migrate
uv run python manage.py runserver
# Dev uses ImmediateBackend — tasks run inline. For prod-like workers, run worker-entrypoint.
```
## Deployment
@@ -48,4 +50,5 @@ uv run python manage.py runserver
CI on merge to `main` runs tests, then calls
`server-infra/scripts/deploy.sh --app monica_site --env prod --ref <sha>`.
Requires a `monica_site` entry in the `server-infra` `app_catalog`, a reserved host port pair,
a shared-Postgres database, Redis, and a control-node secret env file. Details in the design doc.
a shared-Postgres database, a singleton django.tasks worker on one host, and a control-node
secret env file. Details in the design doc.
+103 -65
View File
@@ -64,13 +64,12 @@ flowchart TB
end
subgraph worker [Background - single host]
WorkerProc["Celery worker"]
Beat["Celery beat (scheduler)"]
TaskWorker["django.tasks worker process"]
DispatchTick["dispatch_due management command / tick"]
end
subgraph data [Shared services 10.0.0.230]
PG[("Postgres - monica_site DB")]
Redis[("Redis - broker + cache")]
PG[("Postgres - monica_site DB + task queue store")]
end
subgraph external [External APIs]
@@ -85,39 +84,69 @@ flowchart TB
Realtor(["Realtor (portal)"]) --> NPM
NPM --> Web1 & Web2
Web1 & Web2 --> PG
Web1 & Web2 --> Redis
Web1 & Web2 --> Recaptcha
WorkerProc --> PG
WorkerProc --> Redis
Beat --> Redis
WorkerProc --> SMTP2GO & Postcard & Meta & LinkedIn
TaskWorker --> PG
DispatchTick --> PG
TaskWorker --> SMTP2GO & Postcard & Meta & LinkedIn
```
Key points:
- **Web tier is stateless** and runs on every app host (matches `company_site`: active/active
behind NPM, `SECURE_PROXY_SSL_HEADER`, `USE_X_FORWARDED_HOST`).
- **Background tier is a singleton**: exactly one Celery worker + one beat, so scheduled
postcards/social posts and bulk sends fire once (not once per replica). Pinned to one host.
- **Shared external Postgres + Redis** live on the existing `10.0.0.230` box alongside NPM,
consistent with the `server-infra` shared-Postgres model.
- **Background work uses Django 6.0 Tasks (`django.tasks`)** — define with `@task`, enqueue with
`.enqueue()`. Queue store lives in **Postgres** (same DB as the app). No Redis, no Celery.
- **Worker is a singleton**: Django's Tasks API does not run tasks itself; a separate worker
process (from a production-capable third-party backend) claims and executes queued tasks.
Exactly one worker host so scheduled sends don't duplicate.
- **Shared external Postgres** on `10.0.0.230` (same pattern as `company_site`).
---
## 4. Why background jobs (and the Django 6.0 angle)
## 4. Background jobs — Django Tasks (not Celery/Redis)
Postcard rendering/mailing, social scheduling, and bulk email/SMS are slow, rate-limited, and
retry-prone — they must run outside the request cycle.
Postcard mailing, social publishing, and bulk email/SMS must run outside the request cycle.
- **Recommended: Celery + Redis + Celery Beat.** Mature, supports scheduled (cron-like) jobs,
retries with backoff, and rate limiting per provider. Beat runs on one host only.
- **Django 6.0 Tasks framework (`django.tasks`)** is a clean native way to *enqueue* background
work and will be used for the app-facing API (`enqueue()` calls), but it is a task-execution
abstraction, not a cron scheduler — so Beat still owns time-based triggers. We wrap enqueue
calls thinly so we can swap backends later.
### Decision
Use **Django 6.0's built-in Tasks framework** (`django.tasks`) as the only background API.
> Decision: use Celery/Redis for execution + scheduling now; keep enqueue calls behind a small
> `messaging.tasks`/`social.tasks` seam so a future move to pure `django.tasks` is mechanical.
| Piece | Choice |
|-------|--------|
| Define / enqueue | `@task` + `.enqueue()` / `aenqueue()` |
| Dev / tests | `ImmediateBackend` (or `DummyBackend` in tests) |
| Production queue | Third-party **database-backed** Task backend (Postgres queue store) + its worker CLI |
| Deferred / scheduled | Prefer `using(run_after=...)` when the backend supports defer; otherwise poll due rows via a small `dispatch_due` management command that enqueues Tasks |
Django guarantees task definition, validation, queuing, and result handling. **Execution** is
always a separate worker process — pick a backend from the
[Django Tasks community ecosystem](https://docs.djangoproject.com/en/6.0/topics/tasks/) /
Django Packages grid that provides a durable queue + worker. Do **not** introduce Redis or
Celery for this app.
### Pattern
```python
from functools import partial
from django.db import transaction
from django.tasks import task
@task
def send_campaign_message(message_id: int) -> None:
...
# After DB writes commit — workers use a separate connection
with transaction.atomic():
message = Message.objects.create(...)
transaction.on_commit(partial(send_campaign_message.enqueue, message_id=message.pk))
```
Scheduled social/campaign work:
1. Persist `scheduled_for` on the model when the realtor schedules.
2. Either enqueue immediately with `run_after=scheduled_for` (if backend supports defer), **or**
run `manage.py dispatch_due` on a short interval (same host as the worker) to find due rows
and `.enqueue()` publish/send tasks.
3. Worker executes; updates status / `provider_message_id` / `remote_id` on success or failure.
> No Redis broker. Task queue + app data share Postgres. One less moving part vs Celery.
---
## 5. Django Apps & Responsibilities
@@ -237,21 +266,23 @@ realtor with a fixed set of accounts.
app review / posting-scope approval — start this early.
- Connectors live in `social/connectors/{meta,linkedin}.py` behind a common
`SocialConnector` interface (`publish(post, target) -> remote_id`, `refresh_token()`).
- OAuth tokens stored encrypted; Beat enqueues due `SocialPost`s; worker fans out to each
`SocialPostTarget` with per-platform retry.
- OAuth tokens stored encrypted; due `SocialPost`s are enqueued as Django Tasks
(`run_after` or `dispatch_due`); the task worker fans out to each `SocialPostTarget`
with per-platform retry.
```mermaid
sequenceDiagram
participant R as Realtor
participant D as Dashboard
participant DB as Postgres
participant B as Celery Beat
participant W as Worker
participant T as django.tasks enqueue
participant W as Task worker
participant P as Platform API
R->>D: Compose post, pick FB/IG/LI, schedule
D->>DB: SocialPost + SocialPostTargets (status=scheduled)
B->>DB: poll due posts
B->>W: enqueue publish(target)
D->>T: enqueue publish with run_after or via dispatch_due
T->>DB: task row in queue store
W->>DB: claim due task
W->>P: publish via connector
P-->>W: remote_id / error
W->>DB: update target status + remote_id
@@ -278,9 +309,9 @@ db**, `scripts/docker-entrypoint.sh`, `.gitea/workflows`).
```
monica_site/ # repo root
├── Dockerfile # python:3.12-slim + uv (copy of company_site pattern)
├── docker-compose.yml # local dev: web + db + redis
├── docker-compose.prod.yml # prod: web only (+ worker/beat); external PG + Redis
├── pyproject.toml # uv-managed deps (django==6.0, ...)
├── docker-compose.yml # local dev: web + db (+ optional task worker)
├── docker-compose.prod.yml # prod: web on all hosts; task worker on one host; external PG
├── pyproject.toml # uv-managed deps (django==6.0, db task backend, ...)
├── uv.lock
├── .env.example / .env.prod.example # documented env (extends company_site's)
├── .dockerignore / .gitignore
@@ -290,8 +321,7 @@ monica_site/ # repo root
│ └── monica-site-design.md # this document
├── scripts/
│ ├── docker-entrypoint.sh # migrate + collectstatic + gunicorn (web role)
│ ├── worker-entrypoint.sh # celery worker
│ ├── beat-entrypoint.sh # celery beat
│ ├── worker-entrypoint.sh # django.tasks backend worker (+ optional dispatch_due loop)
│ └── validate-env.sh
├── .gitea/workflows/
│ ├── ci.yml # PR: uv sync + manage.py test
@@ -303,17 +333,18 @@ monica_site/ # repo root
│ ├── __init__.py
│ ├── settings/
│ │ ├── __init__.py # dispatch on DJANGO_ENV (dev|beta|prod)
│ │ ├── base.py # shared (DATABASE_URL parse, recaptcha, smtp2go, celery)
│ │ ├── dev.py
│ │ ├── base.py # shared (DATABASE_URL, TASKS, recaptcha, smtp2go)
│ │ ├── dev.py # ImmediateBackend for local
│ │ ├── beta.py
│ │ ├── prod.py # DEBUG off, proxy SSL header, secure cookies
│ │ ├── prod.py # DEBUG off, proxy SSL header, secure cookies, DB task backend
│ │ └── logging.py
│ ├── celery.py # Celery app
│ ├── storage.py # TolerantManifestStaticFilesStorage (reuse)
│ ├── urls.py
│ ├── asgi.py
│ └── wsgi.py
├── core/ # base models/mixins/utils
│ └── management/commands/
│ └── dispatch_due.py # poll scheduled rows → enqueue django.tasks (if needed)
├── public/ # marketing pages + contact form (+ templates/static)
├── accounts/ # realtor auth + RealtorProfile
├── dashboard/ # private portal shell
@@ -322,7 +353,7 @@ monica_site/ # repo root
├── analytics/ # UTMVisit, Attribution + reports
├── messaging/ # templates, campaigns, messages, tasks
│ ├── models.py
│ ├── tasks.py # celery tasks (send email/sms/postcard batches)
│ ├── tasks.py # @task senders (email/sms/postcard batches)
│ ├── channels/ # email.py, sms.py, postcard.py (dispatch)
│ └── providers/
│ ├── email/smtp2go.py
@@ -330,7 +361,7 @@ monica_site/ # repo root
│ └── postcard/{base.py,lob.py,click2mail.py,postgrid.py}
└── social/ # accounts, posts, scheduling
├── models.py
├── tasks.py
├── tasks.py # @task publish_social_target, etc.
└── connectors/{base.py,meta.py,linkedin.py}
```
@@ -349,10 +380,11 @@ We plug in by mirroring `company_site` and adding one catalog entry.
- **Dockerfile**: identical pattern to `company_site``python:3.12-slim`, `uv sync --frozen
--no-dev`, copy project, `scripts/docker-entrypoint.sh` runs
`migrate → collectstatic → gunicorn monica_site.wsgi:application`.
- **`docker-compose.prod.yml`**: `web` service only for the app hosts (external Postgres +
Redis via `DATABASE_URL` / `REDIS_URL`; **drop the bundled `db`**, per the server-infra
"required changes in each app repo" checklist). Add `worker` + `beat` services deployed to a
single host (or a separate `docker-compose.worker.yml`) so schedulers are singletons.
- **`docker-compose.prod.yml`**: `web` on app hosts (external Postgres via `DATABASE_URL`;
**drop the bundled `db`**, per the server-infra checklist). Add a **`worker`** service on
exactly one host (or `docker-compose.worker.yml`) that runs the chosen django.tasks backend
worker. Optionally the same process/host loops `dispatch_due` for schedule polling if the
backend lacks `run_after` defer support.
### 8.2 server-infra wiring (repo reviewed)
- Add to `inventory/group_vars/all.yml` → `app_catalog`:
@@ -370,10 +402,10 @@ monica_site:
- Assign host ports in `host_vars/<host>.yml` `host_apps` (reserve a new port pair, e.g.
`prod 8003 / beta 8013`, matching across adama+roslin so NPM can balance).
- Create control-node secret `~/Documents/secrets/monica_site/monica_site_prod.env`
(`DATABASE_URL`, `REDIS_URL`, `DJANGO_SECRET_KEY`, `WEB_PORT`, provider keys). Never committed;
(`DATABASE_URL`, `DJANGO_SECRET_KEY`, `WEB_PORT`, provider keys). Never committed;
Ansible pushes it to `/opt/apps/env/monica_site_prod.env` (mode 600) at deploy.
- Shared Postgres prereq on `10.0.0.230`: create `monica_site` DB + user (and `monica_site_beta`
for beta), like the other apps.
for beta), like the other apps. Task queue tables live in the same DB.
### 8.3 CI/CD flow
Same as `company_site`:
@@ -391,14 +423,14 @@ flowchart LR
UT -->|green| DEP["deploy.yml -> server-infra deploy.sh"]
DEP --> A["adama: web :8003"]
DEP --> R["roslin: web :8003"]
DEP --> WK["worker+beat (single host)"]
DEP --> WK["django.tasks worker (single host)"]
A & R --> NPM["NPM balances monica domain"]
```
### 8.4 New infra bits beyond company_site
- **Redis** service on `10.0.0.230` (broker + cache) — small addition to the shared box.
- **Worker/beat placement**: one host runs the `worker`+`beat` compose project; document that it
must be exactly one to avoid duplicate scheduled sends.
- **Task worker placement**: exactly one host runs the django.tasks worker (and `dispatch_due`
if used). Document this so active/active web replicas do not each run a worker.
- **No Redis** required for background jobs — queue store is Postgres.
---
@@ -414,9 +446,9 @@ DATABASE_URL=postgres://monica_site:<pw>@10.0.0.230:5432/monica_site
WEB_PORT=8003
GUNICORN_WORKERS=2
# Redis / Celery
REDIS_URL=redis://10.0.0.230:6379/0
CELERY_BROKER_URL=${REDIS_URL}
# Django Tasks — prod uses a DB-backed third-party backend + worker.
# Dev defaults to ImmediateBackend in settings/dev.py (no worker needed).
# TASKS is configured in settings, not usually via env; override only if needed.
# reCAPTCHA v3 (same as company_site)
RECAPTCHA_PUBLIC_KEY=...
@@ -454,12 +486,14 @@ TIANJI_WEBSITE_ID=...
### Phase 0 — Scaffolding & deploy skeleton
- Create `monica_site` Django 6.0 project via `uv`; `settings/` dispatch; Dockerfile,
compose (dev with db+redis), entrypoints, `.gitea/workflows`, pre-commit.
compose (dev with db), entrypoints, `.gitea/workflows`, pre-commit.
- Configure `TASKS` (ImmediateBackend in `dev`, DB-backed backend in `prod`); add
`worker-entrypoint.sh` for the task worker.
- Add `core` app (`TimeStampedModel`), health check, base template.
- Wire `server-infra` `app_catalog` entry + host ports + secrets; get a "hello world" deploying
to adama+roslin behind NPM on a staging domain.
- Add Redis to `10.0.0.230`; create Postgres DB/user.
- **Exit:** empty app deploys via CI to prod hosts, health check green.
- Create Postgres DB/user on `10.0.0.230`.
- **Exit:** empty app deploys via CI to prod hosts, health check green; worker can claim a no-op task.
### Phase 1 — Public site + contact form + leads + UTM
- `public`: marketing pages (home/about/contact), `django_recaptcha` v3 contact form.
@@ -470,25 +504,25 @@ TIANJI_WEBSITE_ID=...
- **Exit:** realtor logs in, sees leads with source attribution; visitors submit safely.
### Phase 2 — Mailing list + Email/SMS outreach + opt-out
- `messaging`: `MessageTemplate`, `Campaign`, `Message`, `ProviderEvent`; Celery + Beat online.
- `messaging`: `MessageTemplate`, `Campaign`, `Message`, `ProviderEvent`; `@task` senders online.
- Email via SMTP2GO with unsubscribe links; SMS via SMTP2GO SMS API.
- Opt-out views + SMS `STOP` webhook → `Suppression`; consent enforced on every send.
- Dashboard: contact list management, segment/select recipients, compose + schedule campaign,
delivery status.
delivery status (enqueue via `transaction.on_commit` + django.tasks).
- **Exit:** realtor sends a real email + SMS campaign to consented contacts; opt-out works.
### Phase 3 — Postcards
- `messaging/providers/postcard/` interface + Lob adapter (+ Click2Mail adapter as the
low-volume option); `POSTCARD_PROVIDER` switch.
- Postcard campaign flow: pick template/artwork, select recipients (address required + Lob
address verification), send batch via worker, poll delivery status.
address verification), enqueue batch as Django Tasks, poll delivery status.
- Client prerequisites called out: Lob account, A2P 10DLC for SMS.
- **Exit:** realtor mails a postcard batch and sees delivery tracking.
### Phase 4 — Social automation
- `social`: `SocialAccount` OAuth connect (Meta + LinkedIn), encrypted token storage.
- Connectors for Meta (FB Page + IG Business) and LinkedIn; `SocialPost` + `SocialPostTarget`
compose/schedule; Beat dispatches, worker fans out with retries.
compose/schedule; enqueue via `run_after` or `dispatch_due`; task worker fans out with retries.
- Dashboard: composer with per-platform preview, calendar/scheduled view, post status.
- **Kick off LinkedIn app review in Phase 01** given 24 week approval lead time.
- **Exit:** realtor schedules one post to all three platforms; it publishes and reports status.
@@ -512,8 +546,12 @@ flowchart LR
## 11. Key Risks & Decisions
- **Singleton scheduler:** must run exactly one Beat + worker across the active/active fleet, or
scheduled sends duplicate. Pin to one host; documented in deploy.
- **Singleton task worker:** exactly one django.tasks worker across the active/active fleet, or
duplicate claims / double-sends are possible depending on backend locking. Pin to one host.
- **Django Tasks has no built-in production worker:** must pick and pin a third-party DB backend
+ worker early in Phase 0; built-in backends are Immediate/Dummy only.
- **Scheduling:** if the chosen backend lacks `supports_defer` / `run_after`, rely on
`dispatch_due` polling — keep the tick interval short and idempotent.
- **LinkedIn approval latency (24 wks):** start the app-review process at project kickoff.
- **SMS compliance (A2P 10DLC/TCPA):** client-side registration required before SMS launch;
consent + `STOP` handling are built in but registration is a prerequisite.
@@ -527,10 +565,10 @@ flowchart LR
## 12. Cost Snapshot (why it beats PostcardMania)
- **Hosting:** runs on existing adama/roslin fleet — near-zero marginal infra (add Redis).
- **Hosting:** runs on existing adama/roslin fleet — near-zero marginal infra (Postgres only;
no Redis/Celery stack).
- **Email/SMS:** SMTP2GO usage-based (already an org account).
- **Postcards:** ~$0.350.77/4x6 at provider cost vs PostcardMania's bundled campaign packages;
no forced campaign minimums.
- **Social:** $0 API fees (native), vs PostcardMania add-ons / aggregator per-profile fees.
- **No PostcardMania platform/campaign markup**; realtor pays provider cost + our hosting.
```
Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

+1
View File
@@ -0,0 +1 @@
a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:"";content:none}table{border-collapse:collapse;border-spacing:0}*{box-sizing:border-box}
+1
View File
@@ -0,0 +1 @@
@font-face{font-family:revicons;fallback:fallback;src:url(/_next/static/media/revicons.ff59b316.woff) format("woff"),url(/_next/static/media/revicons.b96bdb22.ttf) format("ttf"),url(/_next/static/media/revicons.652e7269.eot) format("ttf")}.react-multi-carousel-list{display:flex;align-items:center;overflow:hidden;position:relative}.react-multi-carousel-track{list-style:none;padding:0;margin:0;display:flex;flex-direction:row;position:relative;transform-style:preserve-3d;-webkit-backface-visibility:hidden;backface-visibility:hidden;will-change:transform,transition}.react-multiple-carousel__arrow{position:absolute;outline:0;transition:all .5s;border-radius:35px;z-index:1000;border:0;background:rgba(0,0,0,.5);min-width:43px;min-height:43px;opacity:1;cursor:pointer}.react-multiple-carousel__arrow:hover{background:rgba(0,0,0,.8)}.react-multiple-carousel__arrow:before{font-size:20px;color:#fff;display:block;font-family:revicons;text-align:center;z-index:2;position:relative}.react-multiple-carousel__arrow:disabled{cursor:default;background:rgba(0,0,0,.5)}.react-multiple-carousel__arrow--left{left:calc(4% + 1px)}.react-multiple-carousel__arrow--left:before{content:"\e824"}.react-multiple-carousel__arrow--right{right:calc(4% + 1px)}.react-multiple-carousel__arrow--right:before{content:"\e825"}.react-multi-carousel-dot-list{position:absolute;bottom:0;display:flex;left:0;right:0;justify-content:center;padding:0;margin:0;list-style:none;text-align:center}.react-multi-carousel-dot button{display:inline-block;width:12px;height:12px;border-radius:50%;opacity:1;box-shadow:none;transition:background .5s;border:2px solid grey;padding:0;margin:0 6px 0 0;outline:0;cursor:pointer}.react-multi-carousel-dot button:hover:active,.react-multi-carousel-dot--active button{background:#080808}.react-multi-carousel-item{transform-style:preserve-3d;-webkit-backface-visibility:hidden;backface-visibility:hidden}@media (-ms-high-contrast:active),(-ms-high-contrast:none){.react-multi-carousel-item{flex-shrink:0!important}.react-multi-carousel-track{overflow:visible!important}}[dir=rtl].react-multi-carousel-list{direction:rtl}.rtl.react-multiple-carousel__arrow--right{right:auto;left:calc(4% + 1px)}.rtl.react-multiple-carousel__arrow--right:before{content:"\e824"}.rtl.react-multiple-carousel__arrow--left{left:auto;right:calc(4% + 1px)}.rtl.react-multiple-carousel__arrow--left:before{content:"\e825"}
Binary file not shown.

After

Width:  |  Height:  |  Size: 2.5 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 363 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 104 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.1 KiB

+1
View File
@@ -0,0 +1 @@
../../template/real_estate_html/site/css
+1
View File
@@ -0,0 +1 @@
../../template/real_estate_html/site/fonts
+1
View File
@@ -0,0 +1 @@
../../template/real_estate_html/site/images
+40
View File
@@ -0,0 +1,40 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>MKDRealtor.com — Proposal UX Gallery</title>
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700%7CPoppins:400,700">
<link rel="stylesheet" href="proposal.css">
</head>
<body class="hub-page">
<div class="proposal-banner">
<div><span class="tag">Proposal mockup</span> &nbsp; MKDRealtor.com — UX examples (not production)</div>
<div><a href="index.html">All screens</a></div>
</div>
<section class="hub-hero">
<h1>MKDRealtor.com — UX proposal</h1>
<p>Click-through mockups for MKDRealtor.com — public marketing site and private realtor portal: leads, UTM analytics, mailing list, multi-channel campaigns, postcard design, email engagement, and social scheduling.</p>
</section>
<div class="hub-grid">
<a class="hub-card" href="public-home.html"><div class="eyebrow">Public · Phase 1</div><h3>Marketing home</h3><p>Brand-forward landing with hero, services, and CTA to contact.</p></a>
<a class="hub-card" href="public-about.html"><div class="eyebrow">Public · Phase 1</div><h3>About</h3><p>Realtor story and trust signals.</p></a>
<a class="hub-card" href="public-contact.html"><div class="eyebrow">Public · Phase 1</div><h3>Contact form</h3><p>reCAPTCHA-protected lead capture; consent notice; creates Lead + Contact.</p></a>
<a class="hub-card" href="public-unsubscribe.html"><div class="eyebrow">Public · Phase 2</div><h3>Opt-out / unsubscribe</h3><p>One-click email unsubscribe and per-channel preference.</p></a>
<a class="hub-card" href="public-404.html"><div class="eyebrow">Public · system</div><h3>404 not found</h3><p>Branded error page with path home or to contact.</p></a>
<a class="hub-card" href="public-under-construction.html"><div class="eyebrow">Public · system</div><h3>Under construction</h3><p>Pre-launch / maintenance holding page with notify-me email.</p></a>
<a class="hub-card" href="portal-login.html"><div class="eyebrow">Portal · Phase 1</div><h3>Login</h3><p>Private realtor authentication.</p></a>
<a class="hub-card" href="portal-dashboard.html"><div class="eyebrow">Portal · Phase 1</div><h3>Dashboard</h3><p>Home widgets: new leads, campaign health, scheduled posts.</p></a>
<a class="hub-card" href="portal-leads.html"><div class="eyebrow">Portal · Phase 1</div><h3>Lead inbox</h3><p>Statuses, source attribution, quick filter.</p></a>
<a class="hub-card" href="portal-lead-detail.html"><div class="eyebrow">Portal · Phase 1</div><h3>Lead detail</h3><p>Notes, UTM attribution, linked contact consent.</p></a>
<a class="hub-card" href="portal-analytics.html"><div class="eyebrow">Portal · Phase 1</div><h3>UTM analytics</h3><p>Leads by source/campaign over time.</p></a>
<a class="hub-card" href="portal-contacts.html"><div class="eyebrow">Portal · Phase 2</div><h3>Mailing list</h3><p>Contacts with per-channel consent (email / SMS / postcard).</p></a>
<a class="hub-card" href="portal-contacts-import.html"><div class="eyebrow">Portal · Phase 2</div><h3>Import contacts</h3><p>CSV/Excel upload, column mapping, consent defaults, duplicate merge.</p></a>
<a class="hub-card" href="portal-campaign.html"><div class="eyebrow">Portal · Phase 23</div><h3>Campaign composer</h3><p>Email, SMS, or postcard — select recipients, schedule, send.</p></a>
<a class="hub-card" href="portal-campaign-report.html"><div class="eyebrow">Portal · Phase 2</div><h3>Email engagement</h3><p>SMTP2GO opens, clicks, bounces, unsubscribes per campaign.</p></a>
<a class="hub-card" href="portal-postcard-designer.html"><div class="eyebrow">Portal · Phase 3</div><h3>Postcard designer</h3><p>Size picker (4×6jumbo), reusable media library uploads, live front/back preview.</p></a>
<a class="hub-card" href="portal-social.html"><div class="eyebrow">Portal · Phase 4</div><h3>Social live preview</h3><p>Compose with AI chat assist; live FB / IG / LinkedIn previews update as you type.</p></a>
<a class="hub-card" href="portal-social-accounts.html"><div class="eyebrow">Portal · Phase 4</div><h3>Social accounts</h3><p>Add via OAuth; reconnect when tokens expire; health + disconnect.</p></a>
</div>
</body>
</html>
+1
View File
@@ -0,0 +1 @@
../../template/real_estate_html/site/js
+76
View File
@@ -0,0 +1,76 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>UTM analytics · Portal · MKDRealtor.com</title>
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700%7CPoppins:400,600,700">
<link rel="stylesheet" href="proposal.css">
</head>
<body class="portal">
<div class="proposal-banner">
<div><span class="tag">Proposal mockup</span> &nbsp; MKDRealtor.com — UX examples (not production)</div>
<div><a href="index.html">All screens</a></div>
</div>
<div class="portal-shell">
<aside class="portal-sidebar">
<a class="portal-brand" href="portal-dashboard.html"><img src="brand/exit_logo.png" alt="EXIT Realty"><span>MKDRealtor.com</span></a>
<nav class="portal-nav">
<div class="nav-section">Overview</div>
<a class="" href="portal-dashboard.html">Dashboard</a>
<a class="" href="portal-leads.html">Leads</a>
<a class="active" href="portal-analytics.html">Analytics</a>
<div class="nav-section">Outreach</div>
<a class="" href="portal-contacts.html">Mailing list</a>
<a class="" href="portal-campaign.html">Campaigns</a>
<a class="" href="portal-postcard-designer.html">Postcard design</a>
<div class="nav-section">Social</div>
<a class="" href="portal-social.html">Compose &amp; preview</a>
<a class="" href="portal-social-accounts.html">Accounts</a>
</nav>
</aside>
<div class="portal-main">
<div class="portal-topbar">
<h1>UTM analytics</h1>
<div class="portal-user">Signed in as <strong>Monica Dhillon</strong> · <a href="portal-login.html" style="color:#00626c">Sign out</a></div>
</div>
<div class="portal-content">
<div class="proposal-note"><strong>UX note:</strong> Conversion attribution we own (UTMVisit → Lead). Pageviews stay in Tianji; this view answers “which campaigns create leads?”</div>
<div class="stat-row">
<div class="stat-card"><div class="label">Leads (30d)</div><div class="value">34</div><div class="delta">↑ 12% vs prior</div></div>
<div class="stat-card"><div class="label">Top source</div><div class="value" style="font-size:18px;margin-top:10px">Facebook</div><div class="delta">14 leads</div></div>
<div class="stat-card"><div class="label">Top campaign</div><div class="value" style="font-size:18px;margin-top:10px">spring-open</div><div class="delta">9 leads</div></div>
<div class="stat-card"><div class="label">Direct / none</div><div class="value">6</div><div class="delta">organic / typed URL</div></div>
</div>
<div class="panel">
<div class="panel-h"><h2>Leads by week</h2><span style="font-size:12px;color:#6b7280">Chart.js in production</span></div>
<div class="panel-b">
<div class="chart-placeholder">
<div class="bar" style="height:40%"></div><div class="bar" style="height:55%"></div><div class="bar" style="height:35%"></div>
<div class="bar" style="height:70%"></div><div class="bar" style="height:60%"></div><div class="bar" style="height:85%"></div>
<div class="bar" style="height:50%"></div><div class="bar" style="height:75%"></div>
</div>
</div>
</div>
<div class="panel">
<div class="panel-h"><h2>By source / campaign</h2></div>
<div class="panel-b" style="padding:0">
<table class="table">
<thead><tr><th>Source</th><th>Medium</th><th>Campaign</th><th>Leads</th><th>Won</th></tr></thead>
<tbody>
<tr><td>facebook</td><td>cpc</td><td>spring-open</td><td>9</td><td>2</td></tr>
<tr><td>google</td><td>organic</td><td>brand</td><td>7</td><td>1</td></tr>
<tr><td>instagram</td><td>social</td><td>reel-tour</td><td>5</td><td>1</td></tr>
<tr><td>postcard</td><td>mail</td><td>march-mailer</td><td>4</td><td>0</td></tr>
<tr><td>(direct)</td><td></td><td></td><td>6</td><td>1</td></tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
+116
View File
@@ -0,0 +1,116 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Email campaign report · Portal · MKDRealtor.com</title>
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700%7CPoppins:400,600,700">
<link rel="stylesheet" href="proposal.css">
</head>
<body class="portal">
<div class="proposal-banner">
<div><span class="tag">Proposal mockup</span> &nbsp; MKDRealtor.com — UX examples (not production)</div>
<div><a href="index.html">All screens</a></div>
</div>
<div class="portal-shell">
<aside class="portal-sidebar">
<a class="portal-brand" href="portal-dashboard.html"><img src="brand/exit_logo.png" alt="EXIT Realty"><span>MKDRealtor.com</span></a>
<nav class="portal-nav">
<div class="nav-section">Overview</div>
<a class="" href="portal-dashboard.html">Dashboard</a>
<a class="" href="portal-leads.html">Leads</a>
<a class="" href="portal-analytics.html">Analytics</a>
<div class="nav-section">Outreach</div>
<a class="" href="portal-contacts.html">Mailing list</a>
<a class="active" href="portal-campaign.html">Campaigns</a>
<a class="" href="portal-postcard-designer.html">Postcard design</a>
<div class="nav-section">Social</div>
<a class="" href="portal-social.html">Compose & preview</a>
<a class="" href="portal-social-accounts.html">Accounts</a>
</nav>
</aside>
<div class="portal-main">
<div class="portal-topbar">
<h1>Email campaign report</h1>
<div class="portal-user">Signed in as <strong>Monica Dhillon</strong> · <a href="portal-login.html" style="color:#00626c">Sign out</a></div>
</div>
<div class="portal-content">
<div class="proposal-note"><strong>UX note:</strong> SMTP2GO webhooks feed opens, clicks, bounces into ProviderEvent. Dashboard shows unique opens, click rate, and per-recipient activity.</div>
<div style="display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:16px;align-items:center">
<div>
<div class="muted" style="font-size:13px">Campaign</div>
<strong style="font-size:16px">Spring seller tips</strong>
<span class="badge badge-sent" style="margin-left:8px">Sent</span>
</div>
<div style="display:flex;gap:8px">
<a class="btn btn-ghost" href="portal-campaign.html">Back to campaigns</a>
<button class="btn btn-sm btn-ghost" type="button">Export CSV</button>
</div>
</div>
<div class="stat-row">
<div class="stat-card"><div class="label">Delivered</div><div class="value">182</div><div class="delta">of 186 sent · 97.8%</div></div>
<div class="stat-card"><div class="label">Opened</div><div class="value">94</div><div class="delta">51.6% open rate</div></div>
<div class="stat-card"><div class="label">Clicked</div><div class="value">27</div><div class="delta">14.8% click rate</div></div>
<div class="stat-card"><div class="label">Bounced / unsub</div><div class="value">4 / 2</div><div class="delta">SMTP2GO events</div></div>
</div>
<div class="split">
<div class="panel">
<div class="panel-h"><h2>Engagement over time</h2><span class="muted" style="font-size:12px">From SMTP2GO webhooks → ProviderEvent</span></div>
<div class="panel-b">
<div class="chart-placeholder">
<div class="bar" style="height:20%;opacity:.4" title="sent"></div>
<div class="bar" style="height:45%"></div>
<div class="bar" style="height:70%"></div>
<div class="bar" style="height:85%"></div>
<div class="bar" style="height:60%"></div>
<div class="bar" style="height:40%"></div>
<div class="bar" style="height:25%"></div>
<div class="bar" style="height:15%"></div>
</div>
<p class="muted" style="font-size:12px;margin:8px 0 0">Opens by hour after send (tracking pixel + SMTP2GO open events)</p>
</div>
</div>
<div class="panel">
<div class="panel-h"><h2>What we track</h2></div>
<div class="panel-b" style="font-size:14px">
<ul class="plain-list">
<li><strong>Sent / delivered / bounced</strong> — SMTP2GO delivery webhooks</li>
<li><strong>Opened</strong> — open tracking (unique + total)</li>
<li><strong>Clicked</strong> — link click tracking</li>
<li><strong>Unsubscribed</strong> — our opt-out link + SMTP2GO complaint</li>
<li><strong>Failed</strong> — provider errors (retried via django.tasks)</li>
</ul>
<p class="muted" style="margin:0">SMS: delivery + STOP via SMTP2GO SMS API (no “opens”). Postcards: Lob/Click2Mail in-transit status, not opens.</p>
</div>
</div>
</div>
<div class="panel">
<div class="panel-h"><h2>Recipients</h2>
<select style="padding:6px 10px;border:1px solid #e3e8ef;font-size:13px">
<option>All</option><option>Opened</option><option>Clicked</option><option>Not opened</option><option>Bounced</option>
</select>
</div>
<div class="panel-b" style="padding:0">
<table class="table">
<thead><tr><th>Contact</th><th>Status</th><th>Opened</th><th>Clicked</th><th>Last event</th></tr></thead>
<tbody>
<tr><td>Jordan Lee</td><td><span class="badge badge-delivered">Delivered</span></td><td>Yes · 2×</td><td>Yes</td><td>Jul 18 10:22a open</td></tr>
<tr><td>Sam Ortiz</td><td><span class="badge badge-delivered">Delivered</span></td><td>Yes · 1×</td><td></td><td>Jul 18 11:05a open</td></tr>
<tr><td>Riley Brooks</td><td><span class="badge badge-delivered">Delivered</span></td><td></td><td></td><td>Jul 18 10:01a delivered</td></tr>
<tr><td>Casey Ng</td><td><span class="badge badge-failed">Bounced</span></td><td></td><td></td><td>Jul 18 10:00a hard bounce</td></tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
+112
View File
@@ -0,0 +1,112 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Campaign composer · Portal · MKDRealtor.com</title>
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700%7CPoppins:400,600,700">
<link rel="stylesheet" href="proposal.css">
</head>
<body class="portal">
<div class="proposal-banner">
<div><span class="tag">Proposal mockup</span> &nbsp; MKDRealtor.com — UX examples (not production)</div>
<div><a href="index.html">All screens</a></div>
</div>
<div class="portal-shell">
<aside class="portal-sidebar">
<a class="portal-brand" href="portal-dashboard.html"><img src="brand/exit_logo.png" alt="EXIT Realty"><span>MKDRealtor.com</span></a>
<nav class="portal-nav">
<div class="nav-section">Overview</div>
<a class="" href="portal-dashboard.html">Dashboard</a>
<a class="" href="portal-leads.html">Leads</a>
<a class="" href="portal-analytics.html">Analytics</a>
<div class="nav-section">Outreach</div>
<a class="" href="portal-contacts.html">Mailing list</a>
<a class="active" href="portal-campaign.html">Campaigns</a>
<a class="" href="portal-postcard-designer.html">Postcard design</a>
<div class="nav-section">Social</div>
<a class="" href="portal-social.html">Compose & preview</a>
<a class="" href="portal-social-accounts.html">Accounts</a>
</nav>
</aside>
<div class="portal-main">
<div class="portal-topbar">
<h1>Campaign composer</h1>
<div class="portal-user">Signed in as <strong>Monica Dhillon</strong> · <a href="portal-login.html" style="color:#00626c">Sign out</a></div>
</div>
<div class="portal-content">
<div class="proposal-note"><strong>UX note:</strong> Email/SMS/postcard composer. Email engagement (opens/clicks) from SMTP2GO. Postcards use the live designer.</div>
<div class="channel-tabs">
<a class="active" href="#email">Email</a>
<a href="#sms">SMS</a>
<a href="portal-postcard-designer.html">Postcard</a>
</div>
<div class="split">
<div class="panel">
<div class="panel-h"><h2>Compose</h2></div>
<div class="panel-b form-grid">
<div class="field"><label>Campaign name</label><input value="Spring seller tips"></div>
<div class="field"><label>Template</label>
<select><option>Seller tips — newsletter</option><option>Open house invite</option><option>Just listed</option><option>(blank)</option></select>
</div>
<div class="field"><label>Subject</label><input value="3 things sellers overlook this spring"></div>
<div class="field"><label>Body</label>
<textarea style="min-height:140px">Hi {{first_name}},
A few timing tips for listing this season…
— Monica</textarea>
<div class="hint">Merge tags: {{first_name}}, {{last_name}}. Unsubscribe link appended. Open/click tracking via SMTP2GO.</div>
</div>
<div class="form-grid cols-2">
<div class="field"><label>Recipients</label><input value="186 consented email contacts" readonly></div>
<div class="field"><label>Schedule</label><input type="datetime-local" value="2026-07-18T10:00"></div>
</div>
<div style="display:flex;gap:8px;flex-wrap:wrap">
<button class="btn btn-primary" type="button">Schedule send</button>
<button class="btn btn-ghost" type="button">Save draft</button>
</div>
</div>
</div>
<div>
<div class="panel">
<div class="panel-h"><h2>Preview</h2></div>
<div class="panel-b"><div class="preview-pane">
<strong>Subject:</strong> 3 things sellers overlook this spring<br><br>
Hi Jordan,<br><br>
A few timing tips for listing this season…<br><br>
— Monica<br><br>
<span class="muted" style="font-size:12px"><a href="public-unsubscribe.html">Unsubscribe</a> · Monica Dhillon · MKDRealtor.com</span>
</div></div>
</div>
<div class="panel">
<div class="panel-h"><h2>After send</h2></div>
<div class="panel-b" style="font-size:14px">
<p>SMTP2GO reports <strong>opens, clicks, bounces, complaints</strong> via webhooks.</p>
<a class="btn btn-sm btn-primary" href="portal-campaign-report.html">View sample engagement report</a>
<p class="muted" style="margin:12px 0 0;font-size:13px">Postcard campaigns: design in <a href="portal-postcard-designer.html">Postcard designer</a>, then select recipients with addresses.</p>
</div>
</div>
</div>
</div>
<div class="panel">
<div class="panel-h"><h2>Recent campaigns</h2></div>
<div class="panel-b" style="padding:0">
<table class="table">
<thead><tr><th>Name</th><th>Channel</th><th>Recipients</th><th>Engagement</th><th>Status</th><th></th></tr></thead>
<tbody>
<tr><td>March mailer</td><td>Postcard</td><td>120</td><td></td><td><span class="badge badge-delivered">Delivered</span></td><td></td></tr>
<tr><td>Open house SMS</td><td>SMS</td><td>42</td><td>delivered 40</td><td><span class="badge badge-sent">Sent</span></td><td></td></tr>
<tr><td>Spring seller tips</td><td>Email</td><td>186</td><td>94 opens · 27 clicks</td><td><span class="badge badge-sent">Sent</span></td><td><a href="portal-campaign-report.html">Report</a></td></tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
+121
View File
@@ -0,0 +1,121 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Import contacts · Portal · MKDRealtor.com</title>
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700%7CPoppins:400,600,700">
<link rel="stylesheet" href="proposal.css">
</head>
<body class="portal">
<div class="proposal-banner">
<div><span class="tag">Proposal mockup</span> &nbsp; MKDRealtor.com — UX examples (not production)</div>
<div><a href="index.html">All screens</a></div>
</div>
<div class="portal-shell">
<aside class="portal-sidebar">
<a class="portal-brand" href="portal-dashboard.html"><img src="brand/exit_logo.png" alt="EXIT Realty"><span>MKDRealtor.com</span></a>
<nav class="portal-nav">
<div class="nav-section">Overview</div>
<a class="" href="portal-dashboard.html">Dashboard</a>
<a class="" href="portal-leads.html">Leads</a>
<a class="" href="portal-analytics.html">Analytics</a>
<div class="nav-section">Outreach</div>
<a class="active" href="portal-contacts.html">Mailing list</a>
<a class="" href="portal-campaign.html">Campaigns</a>
<a class="" href="portal-postcard-designer.html">Postcard design</a>
<div class="nav-section">Social</div>
<a class="" href="portal-social.html">Compose & preview</a>
<a class="" href="portal-social-accounts.html">Accounts</a>
</nav>
</aside>
<div class="portal-main">
<div class="portal-topbar">
<h1>Import contacts</h1>
<div class="portal-user">Signed in as <strong>Monica Dhillon</strong> · <a href="portal-login.html" style="color:#00626c">Sign out</a></div>
</div>
<div class="portal-content">
<div class="proposal-note"><strong>UX note:</strong> CSV/Excel upload → map columns → set consent defaults → merge duplicates. Creates Contact + ConsentRecord rows.</div>
<div class="steps">
<div class="step active"><span>1</span> Upload</div>
<div class="step active"><span>2</span> Map columns</div>
<div class="step"><span>3</span> Consent &amp; review</div>
<div class="step"><span>4</span> Import</div>
</div>
<div class="split">
<div>
<div class="panel">
<div class="panel-h"><h2>Upload file</h2></div>
<div class="panel-b">
<div class="dropzone" id="dropzone">
<strong>Drop CSV or Excel here</strong>
<p class="muted">or click to browse · .csv, .xlsx · max 10MB</p>
<input type="file" accept=".csv,.xlsx" style="margin-top:12px" onchange="document.getElementById('file-name').textContent=this.files[0]?this.files[0].name:'No file'">
<p id="file-name" style="margin:8px 0 0;font-size:13px">sample-contacts.csv (mock loaded)</p>
</div>
<p class="hint-block">Download <a href="#">sample CSV template</a> with columns: first_name, last_name, email, phone, street, city, state, zip, consent_email, consent_sms, consent_postcard.</p>
</div>
</div>
<div class="panel">
<div class="panel-h"><h2>Column mapping</h2></div>
<div class="panel-b" style="padding:0">
<table class="table">
<thead><tr><th>Your column</th><th>Maps to</th><th>Sample</th></tr></thead>
<tbody>
<tr><td>First Name</td><td><select><option selected>first_name</option><option>Skip</option></select></td><td>Jordan</td></tr>
<tr><td>Last Name</td><td><select><option selected>last_name</option></select></td><td>Lee</td></tr>
<tr><td>Email Address</td><td><select><option selected>email</option></select></td><td>jordan.lee@example.com</td></tr>
<tr><td>Mobile</td><td><select><option selected>phone</option><option>Skip</option></select></td><td>555-018-4420</td></tr>
<tr><td>Mailing Street</td><td><select><option selected>street</option></select></td><td>214 Maple St</td></tr>
<tr><td>City / ST / ZIP</td><td><select><option selected>city + state + zip</option></select></td><td>Metro, ST 94117</td></tr>
</tbody>
</table>
</div>
</div>
</div>
<div>
<div class="panel">
<div class="panel-h"><h2>Consent defaults</h2></div>
<div class="panel-b form-grid">
<p class="muted" style="margin:0">Applied when the file has no consent columns. You are responsible for having permission to contact.</p>
<label class="check-row"><input type="checkbox" checked> Mark email opted-in</label>
<label class="check-row"><input type="checkbox"> Mark SMS opted-in</label>
<label class="check-row"><input type="checkbox"> Mark postcard opted-in (needs address)</label>
<div class="field"><label>Source label</label><input value="csv-import-jul2026"></div>
<div class="field"><label>Duplicates</label>
<select><option>Merge on email/phone (update blank fields)</option><option>Skip existing</option><option>Create new anyway</option></select>
</div>
</div>
</div>
<div class="panel">
<div class="panel-h"><h2>Preview · first 3 rows</h2></div>
<div class="panel-b" style="padding:0">
<table class="table">
<thead><tr><th>Name</th><th>Email</th><th>Consent</th></tr></thead>
<tbody>
<tr><td>Jordan Lee</td><td>jordan.lee@example.com</td><td><span class="badge badge-optin">E</span></td></tr>
<tr><td>Sam Ortiz</td><td>sam.ortiz@example.com</td><td><span class="badge badge-optin">E</span> <span class="badge badge-optin">P</span></td></tr>
<tr><td>Avery Chen</td><td></td><td><span class="badge badge-optin">S</span> <span class="badge badge-optin">P</span></td></tr>
</tbody>
</table>
</div>
</div>
<div class="panel">
<div class="panel-b">
<p style="font-size:14px;margin:0 0 12px"><strong>Ready:</strong> 248 rows · 12 missing email · 31 missing address · 4 duplicates to merge</p>
<button class="btn btn-primary" type="button" onclick="alert('Mockup: enqueue import task → create/update Contact + ConsentRecord')">Import 248 contacts</button>
<a class="btn btn-ghost" href="portal-contacts.html">Cancel</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
+70
View File
@@ -0,0 +1,70 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Mailing list · Portal · MKDRealtor.com</title>
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700%7CPoppins:400,600,700">
<link rel="stylesheet" href="proposal.css">
</head>
<body class="portal">
<div class="proposal-banner">
<div><span class="tag">Proposal mockup</span> &nbsp; MKDRealtor.com — UX examples (not production)</div>
<div><a href="index.html">All screens</a></div>
</div>
<div class="portal-shell">
<aside class="portal-sidebar">
<a class="portal-brand" href="portal-dashboard.html"><img src="brand/exit_logo.png" alt="EXIT Realty"><span>MKDRealtor.com</span></a>
<nav class="portal-nav">
<div class="nav-section">Overview</div>
<a class="" href="portal-dashboard.html">Dashboard</a>
<a class="" href="portal-leads.html">Leads</a>
<a class="" href="portal-analytics.html">Analytics</a>
<div class="nav-section">Outreach</div>
<a class="active" href="portal-contacts.html">Mailing list</a>
<a class="" href="portal-campaign.html">Campaigns</a>
<a class="" href="portal-postcard-designer.html">Postcard design</a>
<div class="nav-section">Social</div>
<a class="" href="portal-social.html">Compose & preview</a>
<a class="" href="portal-social-accounts.html">Accounts</a>
</nav>
</aside>
<div class="portal-main">
<div class="portal-topbar">
<h1>Mailing list</h1>
<div class="portal-user">Signed in as <strong>Monica Dhillon</strong> · <a href="portal-login.html" style="color:#00626c">Sign out</a></div>
</div>
<div class="portal-content">
<div class="proposal-note"><strong>UX note:</strong> One list. Per-channel consent. Import CSV/Excel or capture from the contact form.</div>
<div style="display:flex;gap:12px;flex-wrap:wrap;margin-bottom:16px;justify-content:space-between">
<div style="display:flex;gap:12px;flex-wrap:wrap">
<input style="padding:8px 12px;border:1px solid #e3e8ef;min-width:200px" placeholder="Search contacts…">
<select style="padding:8px 12px;border:1px solid #e3e8ef"><option>Any consent</option><option>Email opted in</option><option>SMS opted in</option><option>Postcard opted in</option></select>
</div>
<div style="display:flex;gap:8px">
<a class="btn btn-ghost" href="portal-contacts-import.html">Import CSV / Excel</a>
<a class="btn btn-primary" href="portal-campaign.html">New campaign</a>
</div>
</div>
<div class="panel">
<div class="panel-b" style="padding:0">
<table class="table">
<thead><tr><th></th><th>Contact</th><th>Address</th><th>Consent</th><th>Source</th></tr></thead>
<tbody>
<tr><td><input type="checkbox" checked></td><td>Jordan Lee<br><span class="muted">jordan.lee@example.com · (555) 018-4420</span></td><td></td><td><span class="badge badge-optin">E</span> <span class="badge badge-optin">S</span> <span class="badge badge-optout">P</span></td><td>form</td></tr>
<tr><td><input type="checkbox" checked></td><td>Sam Ortiz<br><span class="muted">sam.ortiz@example.com</span></td><td>214 Maple St</td><td><span class="badge badge-optin">E</span> <span class="badge badge-optout">S</span> <span class="badge badge-optin">P</span></td><td>import</td></tr>
<tr><td><input type="checkbox"></td><td>Avery Chen<br><span class="muted">(555) 014-2291</span></td><td>88 Birch Ave</td><td><span class="badge badge-optout">E</span> <span class="badge badge-optin">S</span> <span class="badge badge-optin">P</span></td><td>postcard</td></tr>
<tr><td><input type="checkbox" checked></td><td>Riley Brooks<br><span class="muted">riley.b@example.com</span></td><td></td><td><span class="badge badge-optin">E</span> <span class="badge badge-optin">S</span> <span class="badge badge-optout">P</span></td><td>form</td></tr>
</tbody>
</table>
</div>
</div>
<p class="muted" style="font-size:13px">E = email · S = SMS · P = postcard. <a href="portal-contacts-import.html">Import contacts</a> for bulk CSV/Excel.</p>
</div>
</div>
</div>
</body>
</html>
+74
View File
@@ -0,0 +1,74 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Dashboard · Portal · MKDRealtor.com</title>
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700%7CPoppins:400,600,700">
<link rel="stylesheet" href="proposal.css">
</head>
<body class="portal">
<div class="proposal-banner">
<div><span class="tag">Proposal mockup</span> &nbsp; MKDRealtor.com — UX examples (not production)</div>
<div><a href="index.html">All screens</a></div>
</div>
<div class="portal-shell">
<aside class="portal-sidebar">
<a class="portal-brand" href="portal-dashboard.html"><img src="brand/exit_logo.png" alt="EXIT Realty"><span>MKDRealtor.com</span></a>
<nav class="portal-nav">
<div class="nav-section">Overview</div>
<a class="active" href="portal-dashboard.html">Dashboard</a>
<a class="" href="portal-leads.html">Leads</a>
<a class="" href="portal-analytics.html">Analytics</a>
<div class="nav-section">Outreach</div>
<a class="" href="portal-contacts.html">Mailing list</a>
<a class="" href="portal-campaign.html">Campaigns</a>
<a class="" href="portal-postcard-designer.html">Postcard design</a>
<div class="nav-section">Social</div>
<a class="" href="portal-social.html">Compose &amp; preview</a>
<a class="" href="portal-social-accounts.html">Accounts</a>
</nav>
</aside>
<div class="portal-main">
<div class="portal-topbar">
<h1>Dashboard</h1>
<div class="portal-user">Signed in as <strong>Monica Dhillon</strong> · <a href="portal-login.html" style="color:#00626c">Sign out</a></div>
</div>
<div class="portal-content">
<div class="proposal-note"><strong>UX note:</strong> Portal home — glanceable widgets for leads, list health, and scheduled work. No CRM pipeline chrome.</div>
<div class="stat-row">
<div class="stat-card"><div class="label">New leads</div><div class="value">7</div><div class="delta">+3 this week</div></div>
<div class="stat-card"><div class="label">Open pipeline</div><div class="value">18</div><div class="delta">4 contacted</div></div>
<div class="stat-card"><div class="label">Mailing list</div><div class="value">412</div><div class="delta">8 opted out (30d)</div></div>
<div class="stat-card"><div class="label">Scheduled posts</div><div class="value">5</div><div class="delta">Next: tomorrow 9am</div></div>
</div>
<div class="split">
<div class="panel">
<div class="panel-h"><h2>Recent leads</h2><a class="btn btn-sm btn-ghost" href="portal-leads.html">View all</a></div>
<div class="panel-b" style="padding:0">
<table class="table">
<thead><tr><th>Name</th><th>Source</th><th>Status</th></tr></thead>
<tbody>
<tr><td><a href="portal-lead-detail.html">Jordan Lee</a></td><td>facebook / spring-open</td><td><span class="badge badge-new">New</span></td></tr>
<tr><td><a href="portal-lead-detail.html">Sam Ortiz</a></td><td>google / brand</td><td><span class="badge badge-contacted">Contacted</span></td></tr>
<tr><td><a href="portal-lead-detail.html">Avery Chen</a></td><td>postcard / march-mailer</td><td><span class="badge badge-new">New</span></td></tr>
</tbody>
</table>
</div>
</div>
<div class="panel">
<div class="panel-h"><h2>Upcoming outreach</h2><a class="btn btn-sm btn-ghost" href="portal-campaign.html">Compose</a></div>
<div class="panel-b">
<p style="margin:0 0 12px;font-size:14px"><strong>Spring seller tips</strong> — Email · scheduled Fri 10:00 · 186 recipients</p>
<p style="margin:0 0 12px;font-size:14px"><strong>Open house reminder</strong> — SMS · draft · 42 recipients</p>
<p style="margin:0;font-size:14px"><strong>Neighborhood just listed</strong> — Postcard · queued · 120 pieces</p>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
+94
View File
@@ -0,0 +1,94 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Lead detail · Portal · MKDRealtor.com</title>
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700%7CPoppins:400,600,700">
<link rel="stylesheet" href="proposal.css">
</head>
<body class="portal">
<div class="proposal-banner">
<div><span class="tag">Proposal mockup</span> &nbsp; MKDRealtor.com — UX examples (not production)</div>
<div><a href="index.html">All screens</a></div>
</div>
<div class="portal-shell">
<aside class="portal-sidebar">
<a class="portal-brand" href="portal-dashboard.html"><img src="brand/exit_logo.png" alt="EXIT Realty"><span>MKDRealtor.com</span></a>
<nav class="portal-nav">
<div class="nav-section">Overview</div>
<a class="" href="portal-dashboard.html">Dashboard</a>
<a class="active" href="portal-leads.html">Leads</a>
<a class="" href="portal-analytics.html">Analytics</a>
<div class="nav-section">Outreach</div>
<a class="" href="portal-contacts.html">Mailing list</a>
<a class="" href="portal-campaign.html">Campaigns</a>
<a class="" href="portal-postcard-designer.html">Postcard design</a>
<div class="nav-section">Social</div>
<a class="" href="portal-social.html">Compose &amp; preview</a>
<a class="" href="portal-social-accounts.html">Accounts</a>
</nav>
</aside>
<div class="portal-main">
<div class="portal-topbar">
<h1>Lead detail</h1>
<div class="portal-user">Signed in as <strong>Monica Dhillon</strong> · <a href="portal-login.html" style="color:#00626c">Sign out</a></div>
</div>
<div class="portal-content">
<div class="proposal-note"><strong>UX note:</strong> Lead + notes + Attribution from UTMVisit. Consent shown from linked Contact (per channel).</div>
<div class="split">
<div>
<div class="panel">
<div class="panel-h"><h2>Jordan Lee</h2><span class="badge badge-new">New</span></div>
<div class="panel-b form-grid">
<div class="field"><label>Email</label><div>jordan.lee@example.com</div></div>
<div class="field"><label>Phone</label><div>(555) 018-4420</div></div>
<div class="field"><label>Interest</label><div>Buying a home · 3bed, under $450k, north side</div></div>
<div class="field"><label>Message</label><div>“Saw your open-house post — available Saturday morning?”</div></div>
<div class="field"><label>Status</label>
<select><option selected>New</option><option>Contacted</option><option>Won</option><option>Lost</option></select>
</div>
<button class="btn btn-primary" type="button">Save</button>
</div>
</div>
<div class="panel">
<div class="panel-h"><h2>Notes</h2></div>
<div class="panel-b">
<div style="font-size:13px;color:#6b7280;margin-bottom:12px"><strong style="color:#1a1f2c">You</strong> · Today 8:20a — Prefers text over call. Looking near Oakridge schools.</div>
<div class="field"><textarea placeholder="Add a note…"></textarea></div>
<button class="btn btn-sm btn-primary" type="button">Add note</button>
</div>
</div>
</div>
<div>
<div class="panel">
<div class="panel-h"><h2>Attribution</h2></div>
<div class="panel-b" style="font-size:14px">
<p><strong>utm_source</strong> facebook<br>
<strong>utm_medium</strong> cpc<br>
<strong>utm_campaign</strong> spring-open<br>
<strong>utm_content</strong> carousel-a<br>
<strong>Landing</strong> /contact?utm_…<br>
<strong>First touch</strong> Today 8:02a · <strong>Converted</strong> 8:14a</p>
</div>
</div>
<div class="panel">
<div class="panel-h"><h2>Linked contact · consent</h2></div>
<div class="panel-b">
<div class="consent-pills">
<span class="badge badge-optin">Email on</span>
<span class="badge badge-optin">SMS on</span>
<span class="badge badge-optout">Postcard off</span>
</div>
<p style="font-size:13px;color:#6b7280;margin:12px 0 0">Form submit defaulted email+SMS opt-in with notice. Postcard requires address + separate consent.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
+64
View File
@@ -0,0 +1,64 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Lead inbox · Portal · MKDRealtor.com</title>
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700%7CPoppins:400,600,700">
<link rel="stylesheet" href="proposal.css">
</head>
<body class="portal">
<div class="proposal-banner">
<div><span class="tag">Proposal mockup</span> &nbsp; MKDRealtor.com — UX examples (not production)</div>
<div><a href="index.html">All screens</a></div>
</div>
<div class="portal-shell">
<aside class="portal-sidebar">
<a class="portal-brand" href="portal-dashboard.html"><img src="brand/exit_logo.png" alt="EXIT Realty"><span>MKDRealtor.com</span></a>
<nav class="portal-nav">
<div class="nav-section">Overview</div>
<a class="" href="portal-dashboard.html">Dashboard</a>
<a class="active" href="portal-leads.html">Leads</a>
<a class="" href="portal-analytics.html">Analytics</a>
<div class="nav-section">Outreach</div>
<a class="" href="portal-contacts.html">Mailing list</a>
<a class="" href="portal-campaign.html">Campaigns</a>
<a class="" href="portal-postcard-designer.html">Postcard design</a>
<div class="nav-section">Social</div>
<a class="" href="portal-social.html">Compose &amp; preview</a>
<a class="" href="portal-social-accounts.html">Accounts</a>
</nav>
</aside>
<div class="portal-main">
<div class="portal-topbar">
<h1>Lead inbox</h1>
<div class="portal-user">Signed in as <strong>Monica Dhillon</strong> · <a href="portal-login.html" style="color:#00626c">Sign out</a></div>
</div>
<div class="portal-content">
<div class="proposal-note"><strong>UX note:</strong> Lead lifecycle: new → contacted → won/lost. Source column shows UTM attribution when available.</div>
<div style="display:flex;gap:12px;flex-wrap:wrap;margin-bottom:16px;align-items:center">
<input style="padding:8px 12px;border:1px solid #e3e8ef;min-width:200px" placeholder="Search leads…">
<select style="padding:8px 12px;border:1px solid #e3e8ef"><option>All statuses</option><option>New</option><option>Contacted</option><option>Won</option><option>Lost</option></select>
<select style="padding:8px 12px;border:1px solid #e3e8ef"><option>All sources</option><option>facebook</option><option>google</option><option>postcard</option><option>direct</option></select>
</div>
<div class="panel">
<div class="panel-b" style="padding:0">
<table class="table">
<thead><tr><th>Lead</th><th>Interest</th><th>UTM / source</th><th>Status</th><th>Received</th></tr></thead>
<tbody>
<tr><td><a href="portal-lead-detail.html">Jordan Lee</a><br><span style="font-size:12px;color:#6b7280">jordan.lee@example.com</span></td><td>Buying</td><td>facebook / cpc / spring-open</td><td><span class="badge badge-new">New</span></td><td>Today 8:14a</td></tr>
<tr><td><a href="portal-lead-detail.html">Sam Ortiz</a><br><span style="font-size:12px;color:#6b7280">sam.ortiz@example.com</span></td><td>Selling</td><td>google / organic / brand</td><td><span class="badge badge-contacted">Contacted</span></td><td>Yesterday</td></tr>
<tr><td><a href="portal-lead-detail.html">Avery Chen</a><br><span style="font-size:12px;color:#6b7280">(555) 014-2291</span></td><td>Both</td><td>postcard / mail / march-mailer</td><td><span class="badge badge-new">New</span></td><td>Mon</td></tr>
<tr><td><a href="portal-lead-detail.html">Riley Brooks</a><br><span style="font-size:12px;color:#6b7280">riley.b@example.com</span></td><td>Buying</td><td>instagram / social / reel-tour</td><td><span class="badge badge-won">Won</span></td><td>Last week</td></tr>
<tr><td><a href="portal-lead-detail.html">Casey Ng</a><br><span style="font-size:12px;color:#6b7280">casey.ng@example.com</span></td><td>Selling</td><td>direct / (none)</td><td><span class="badge badge-lost">Lost</span></td><td>2 weeks ago</td></tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
+36
View File
@@ -0,0 +1,36 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Sign in · Portal · MKDRealtor.com</title>
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700%7CPoppins:400,600,700">
<link rel="stylesheet" href="proposal.css">
</head>
<body class="portal">
<div class="proposal-banner">
<div><span class="tag">Proposal mockup</span> &nbsp; MKDRealtor.com — UX examples (not production)</div>
<div><a href="index.html">All screens</a></div>
</div>
<div class="login-wrap">
<div class="login-card">
<div class="proposal-note" style="margin-bottom:20px"><strong>UX note:</strong> Private realtor login (Django auth). Not public.</div>
<h1>MKD Portal</h1>
<p class="sub">MKDRealtor.com · EXIT Realty Redefined</p>
<p class="sub" style="margin-top:0;margin-bottom:16px;font-size:13px">Leads, campaigns, and social — one place.</p>
<form class="form-grid" action="portal-dashboard.html" method="get">
<div class="field">
<label for="email">Email</label>
<input id="email" type="email" value="monica@example.com">
</div>
<div class="field">
<label for="password">Password</label>
<input id="password" type="password" value="••••••••">
</div>
<button class="btn btn-primary" type="submit">Sign in</button>
</form>
<p style="margin-top:16px;font-size:13px;color:#6b7280"><a href="index.html">← Back to proposal gallery</a></p>
</div>
</div>
</body>
</html>
@@ -0,0 +1,313 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Postcard designer · Portal · MKDRealtor.com</title>
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700%7CPoppins:400,600,700">
<link rel="stylesheet" href="proposal.css">
</head>
<body class="portal">
<div class="proposal-banner">
<div><span class="tag">Proposal mockup</span> &nbsp; MKDRealtor.com — UX examples (not production)</div>
<div><a href="index.html">All screens</a></div>
</div>
<div class="portal-shell">
<aside class="portal-sidebar">
<a class="portal-brand" href="portal-dashboard.html"><img src="brand/exit_logo.png" alt="EXIT Realty"><span>MKDRealtor.com</span></a>
<nav class="portal-nav">
<div class="nav-section">Overview</div>
<a class="" href="portal-dashboard.html">Dashboard</a>
<a class="" href="portal-leads.html">Leads</a>
<a class="" href="portal-analytics.html">Analytics</a>
<div class="nav-section">Outreach</div>
<a class="" href="portal-contacts.html">Mailing list</a>
<a class="" href="portal-campaign.html">Campaigns</a>
<a class="active" href="portal-postcard-designer.html">Postcard design</a>
<div class="nav-section">Social</div>
<a class="" href="portal-social.html">Compose & preview</a>
<a class="" href="portal-social-accounts.html">Accounts</a>
</nav>
</aside>
<div class="portal-main">
<div class="portal-topbar">
<h1>Postcard designer</h1>
<div class="portal-user">Signed in as <strong>Monica Dhillon</strong> · <a href="portal-login.html" style="color:#00626c">Sign out</a></div>
</div>
<div class="portal-content">
<div class="proposal-note"><strong>UX note:</strong> Pick print size (4×6 / 6×9 / 6×11 / square). Upload images once into a reusable media library, then apply to any design. Save as template → attach to postcard campaign.</div>
<div class="designer-layout">
<div class="designer-controls">
<div class="panel">
<div class="panel-h"><h2>Card size</h2><span class="muted" style="font-size:12px" id="size-label">4×6 in</span></div>
<div class="panel-b">
<div class="size-grid" id="size-grid">
<button type="button" class="size-option active" data-size="4x6" data-label="4×6 in" data-ratio="6/4" onclick="setSize(this)">
<div class="sz-name">4 × 6</div>
<div class="sz-meta">Standard · lowest postage</div>
<span class="sz-badge">Most common</span>
</button>
<button type="button" class="size-option" data-size="6x9" data-label="6×9 in" data-ratio="9/6" onclick="setSize(this)">
<div class="sz-name">6 × 9</div>
<div class="sz-meta">More room for photo + copy</div>
</button>
<button type="button" class="size-option" data-size="6x11" data-label="6×11 in" data-ratio="11/6" onclick="setSize(this)">
<div class="sz-name">6 × 11</div>
<div class="sz-meta">Jumbo · stands out in mail</div>
</button>
<button type="button" class="size-option" data-size="square" data-label="6×6 in square" data-ratio="1/1" onclick="setSize(this)">
<div class="sz-name">6 × 6</div>
<div class="sz-meta">Square · social-ready crop</div>
</button>
</div>
<p class="library-hint">Size locked when campaign is queued. Provider pricing varies by size.</p>
</div>
</div>
<div class="panel">
<div class="panel-h"><h2>Media library</h2><span class="muted" style="font-size:12px">Reusable</span></div>
<div class="panel-b">
<input type="file" id="pc-upload" accept="image/*" multiple hidden onchange="handleUpload(event)">
<div class="dropzone compact" id="pc-drop" onclick="document.getElementById('pc-upload').click()"
ondragover="event.preventDefault();this.style.borderColor='#00626c'"
ondragleave="this.style.borderColor=''"
ondrop="event.preventDefault();this.style.borderColor=''; handleDrop(event)">
Drop images here or <strong>click to upload</strong><br>
<span class="muted">Saved to your library — reuse across postcards &amp; campaigns</span>
</div>
<div class="media-library" id="media-library" style="margin-top:12px"></div>
<p class="library-hint" id="library-count">0 images in library</p>
</div>
</div>
<div class="panel">
<div class="panel-h"><h2>Side</h2></div>
<div class="panel-b">
<div class="channel-tabs" style="margin:0">
<a href="#" class="active" id="tab-front" onclick="showSide('front');return false">Front</a>
<a href="#" id="tab-back" onclick="showSide('back');return false">Back</a>
</div>
</div>
</div>
<div class="panel" id="front-controls">
<div class="panel-h"><h2>Front artwork</h2></div>
<div class="panel-b form-grid">
<div class="field"><label>Headline</label>
<input id="pc-headline" value="JUST LISTED" oninput="syncPostcard()">
</div>
<div class="field"><label>Subhead</label>
<input id="pc-sub" value="412 Willow Lane · Open Sat 111" oninput="syncPostcard()">
</div>
<div class="field"><label>Accent color</label>
<input id="pc-color" type="color" value="#00626c" oninput="syncPostcard()">
</div>
<div class="field"><label>Overlay</label>
<select id="pc-overlay" onchange="syncPostcard()">
<option value="dark">Dark gradient</option>
<option value="light">Light band</option>
<option value="none">None</option>
</select>
</div>
</div>
</div>
<div class="panel" id="back-controls" style="display:none">
<div class="panel-h"><h2>Back copy</h2></div>
<div class="panel-b form-grid">
<div class="field"><label>Body text</label>
<textarea id="pc-body" style="min-height:100px" oninput="syncPostcard()">Quiet street, updated kitchen, walkable to Oakridge schools. Asking $449,000.
Call or text Monica for a private showing.</textarea>
</div>
<div class="field"><label>Agent line</label>
<input id="pc-agent" value="Monica Dhillon · (555) 123-4567 · mkdrealtor.com" oninput="syncPostcard()">
</div>
<div class="field"><label>Include</label>
<label class="check-row"><input type="checkbox" id="pc-qr" checked onchange="syncPostcard()"> QR to listing / contact</label>
<label class="check-row"><input type="checkbox" id="pc-addr" checked onchange="syncPostcard()"> Recipient address block ( Lob )</label>
</div>
</div>
</div>
<div class="panel">
<div class="panel-b" style="display:flex;gap:8px;flex-wrap:wrap">
<button class="btn btn-primary" type="button" onclick="alert('Mockup: save front/back assets + size + library refs → MessageTemplate')">Save design</button>
<a class="btn btn-ghost" href="portal-campaign.html">Use in campaign</a>
</div>
</div>
</div>
<div class="designer-preview-col">
<div class="panel">
<div class="panel-h">
<h2>Live preview · <span id="preview-size">4×6</span></h2>
<span class="muted" style="font-size:12px" id="side-label">Front</span>
</div>
<div class="panel-b" style="background:#e8edf3;display:flex;justify-content:center;padding:28px">
<div class="postcard size-4x6" id="postcard-front">
<div class="postcard-media" id="pc-media"></div>
<div class="postcard-overlay" id="pc-ov"></div>
<div class="postcard-copy">
<div class="postcard-headline" id="pc-h-out">JUST LISTED</div>
<div class="postcard-sub" id="pc-s-out">412 Willow Lane · Open Sat 111</div>
</div>
</div>
<div class="postcard postcard-back size-4x6" id="postcard-back" style="display:none">
<div class="postcard-back-grid">
<div class="postcard-back-msg">
<div class="postcard-back-body" id="pc-b-out"></div>
<div class="postcard-agent" id="pc-a-out"></div>
<div class="postcard-qr" id="pc-qr-out">QR</div>
</div>
<div class="postcard-back-mail" id="pc-mail-out">
<div class="stamp">Stamp</div>
<div class="addr-block">
{{first_name}} {{last_name}}<br>
{{street}}<br>
{{city}}, {{state}} {{zip}}
</div>
</div>
</div>
</div>
</div>
</div>
<p class="muted" style="font-size:13px;margin:0">Print provider receives front + back images at selected size. Address verified before batch send (Lob).</p>
</div>
</div>
</div>
</div>
</div>
<script>
const LIBRARY_KEY = 'monica_postcard_library_v1';
let selectedBg = 'images/grid-layout-1-370x256.jpg';
let currentSize = '4x6';
const SEED_LIBRARY = [
{ id: 'seed-1', name: 'Willow exterior', src: 'images/grid-layout-1-370x256.jpg', reused: 3 },
{ id: 'seed-2', name: 'Kitchen', src: 'images/grid-layout-2-370x256.jpg', reused: 1 },
{ id: 'seed-3', name: 'Living room', src: 'images/grid-layout-3-370x256.jpg', reused: 0 },
{ id: 'seed-4', name: 'Neighborhood', src: 'images/bg-image-1.jpg', reused: 2 },
];
function loadLibrary() {
try {
const raw = localStorage.getItem(LIBRARY_KEY);
if (raw) return JSON.parse(raw);
} catch (e) {}
return SEED_LIBRARY.slice();
}
function saveLibrary(items) {
try { localStorage.setItem(LIBRARY_KEY, JSON.stringify(items)); } catch (e) {}
}
let library = loadLibrary();
function renderLibrary() {
const root = document.getElementById('media-library');
root.innerHTML = '';
const upload = document.createElement('button');
upload.type = 'button';
upload.className = 'media-tile upload-tile';
upload.innerHTML = '<span>+</span>Upload';
upload.onclick = () => document.getElementById('pc-upload').click();
root.appendChild(upload);
library.forEach(item => {
const btn = document.createElement('button');
btn.type = 'button';
btn.className = 'media-tile' + (item.src === selectedBg ? ' active' : '');
btn.style.backgroundImage = 'url(' + JSON.stringify(item.src).slice(1, -1) + ')';
btn.title = item.name + (item.reused ? ' · used ' + item.reused + '×' : '');
btn.innerHTML = '<span class="media-label">' + escapeHtml(item.name) + '</span>';
btn.onclick = () => selectMedia(item.id);
root.appendChild(btn);
});
document.getElementById('library-count').textContent =
library.length + ' image' + (library.length === 1 ? '' : 's') + ' in library · click to use on this card';
}
function escapeHtml(s) {
return String(s).replace(/[&<>"']/g, c => ({'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&#39;'}[c]));
}
function selectMedia(id) {
const item = library.find(x => x.id === id);
if (!item) return;
selectedBg = item.src;
item.reused = (item.reused || 0) + 1;
saveLibrary(library);
renderLibrary();
syncPostcard();
}
function addFiles(files) {
Array.from(files || []).forEach(file => {
if (!file.type.startsWith('image/')) return;
const reader = new FileReader();
reader.onload = () => {
const item = {
id: 'up-' + Date.now() + '-' + Math.random().toString(36).slice(2, 7),
name: file.name.replace(/\.[^.]+$/, '') || 'Upload',
src: reader.result,
reused: 0,
};
library.unshift(item);
saveLibrary(library);
selectedBg = item.src;
renderLibrary();
syncPostcard();
};
reader.readAsDataURL(file);
});
}
function handleUpload(e) { addFiles(e.target.files); e.target.value = ''; }
function handleDrop(e) { addFiles(e.dataTransfer.files); }
function setSize(btn) {
currentSize = btn.dataset.size;
document.querySelectorAll('.size-option').forEach(el => el.classList.toggle('active', el === btn));
document.getElementById('size-label').textContent = btn.dataset.label;
document.getElementById('preview-size').textContent = btn.dataset.label.replace(' in', '');
['postcard-front', 'postcard-back'].forEach(id => {
const el = document.getElementById(id);
el.className = el.className.replace(/size-\S+/g, '').trim() + ' size-' + currentSize;
if (id === 'postcard-back') el.classList.add('postcard-back');
});
}
function showSide(side) {
const front = side === 'front';
document.getElementById('postcard-front').style.display = front ? 'block' : 'none';
document.getElementById('postcard-back').style.display = front ? 'none' : 'block';
document.getElementById('front-controls').style.display = front ? 'block' : 'none';
document.getElementById('back-controls').style.display = front ? 'none' : 'block';
document.getElementById('tab-front').classList.toggle('active', front);
document.getElementById('tab-back').classList.toggle('active', !front);
document.getElementById('side-label').textContent = front ? 'Front' : 'Back';
}
function syncPostcard() {
const color = document.getElementById('pc-color').value;
const ov = document.getElementById('pc-overlay').value;
document.getElementById('pc-media').style.backgroundImage = 'url(' + JSON.stringify(selectedBg).slice(1, -1) + ')';
document.getElementById('pc-h-out').textContent = document.getElementById('pc-headline').value;
document.getElementById('pc-s-out').textContent = document.getElementById('pc-sub').value;
const textColor = ov === 'light' ? '#111' : '#fff';
document.getElementById('pc-h-out').style.color = textColor;
document.getElementById('pc-s-out').style.color = textColor;
document.getElementById('pc-h-out').style.borderColor = color;
document.getElementById('pc-ov').className = 'postcard-overlay ov-' + ov;
document.getElementById('pc-b-out').textContent = document.getElementById('pc-body').value;
document.getElementById('pc-a-out').textContent = document.getElementById('pc-agent').value;
document.getElementById('pc-qr-out').style.display = document.getElementById('pc-qr').checked ? 'flex' : 'none';
document.getElementById('pc-mail-out').style.display = document.getElementById('pc-addr').checked ? 'block' : 'none';
}
renderLibrary();
syncPostcard();
</script>
</body>
</html>
+145
View File
@@ -0,0 +1,145 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Social accounts · Portal · MKDRealtor.com</title>
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700%7CPoppins:400,600,700">
<link rel="stylesheet" href="proposal.css">
</head>
<body class="portal">
<div class="proposal-banner">
<div><span class="tag">Proposal mockup</span> &nbsp; MKDRealtor.com — UX examples (not production)</div>
<div><a href="index.html">All screens</a></div>
</div>
<div class="portal-shell">
<aside class="portal-sidebar">
<a class="portal-brand" href="portal-dashboard.html"><img src="brand/exit_logo.png" alt="EXIT Realty"><span>MKDRealtor.com</span></a>
<nav class="portal-nav">
<div class="nav-section">Overview</div>
<a class="" href="portal-dashboard.html">Dashboard</a>
<a class="" href="portal-leads.html">Leads</a>
<a class="" href="portal-analytics.html">Analytics</a>
<div class="nav-section">Outreach</div>
<a class="" href="portal-contacts.html">Mailing list</a>
<a class="" href="portal-campaign.html">Campaigns</a>
<a class="" href="portal-postcard-designer.html">Postcard design</a>
<div class="nav-section">Social</div>
<a class="" href="portal-social.html">Compose & preview</a>
<a class="active" href="portal-social-accounts.html">Accounts</a>
</nav>
</aside>
<div class="portal-main">
<div class="portal-topbar">
<h1>Social accounts</h1>
<div class="portal-user">Signed in as <strong>Monica Dhillon</strong> · <a href="portal-login.html" style="color:#00626c">Sign out</a></div>
</div>
<div class="portal-content">
<div class="proposal-note"><strong>UX note:</strong> Add via OAuth (Meta / LinkedIn). Re-authorize when token expires or refresh fails — same connect button, no data loss.</div>
<div style="display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px">
<p style="margin:0;font-size:14px;color:#6b7280">Connect native APIs (Meta + LinkedIn). Tokens encrypted. Re-auth when expired or scopes change.</p>
<button class="btn btn-primary" type="button" onclick="document.getElementById('add-panel').style.display='block'">Add account</button>
</div>
<div class="panel" id="add-panel" style="display:none;border-color:#93c5fd">
<div class="panel-h"><h2>Add a social account</h2><button class="btn btn-sm btn-ghost" type="button" onclick="document.getElementById('add-panel').style.display='none'">Close</button></div>
<div class="panel-b">
<div class="connect-grid">
<button class="connect-card" type="button" onclick="alert('Mockup: redirect to Meta OAuth → grant Pages + Instagram Business')">
<div class="platform-icon meta">f</div>
<div>
<strong>Facebook Page</strong>
<p>Meta Graph OAuth. Pick a Page you manage.</p>
</div>
</button>
<button class="connect-card" type="button" onclick="alert('Mockup: same Meta OAuth → select IG Business linked to a Page')">
<div class="platform-icon ig">ig</div>
<div>
<strong>Instagram Business</strong>
<p>Requires IG Business/Creator linked to a Facebook Page.</p>
</div>
</button>
<button class="connect-card" type="button" onclick="alert('Mockup: redirect to LinkedIn OAuth → org or member posting')">
<div class="platform-icon li">in</div>
<div>
<strong>LinkedIn</strong>
<p>Organization or member posting. App review may take 24 weeks.</p>
</div>
</button>
</div>
<p class="hint-block">Flow: click Connect → provider consent screen → callback stores encrypted token + SocialAccount row → status = Connected.</p>
</div>
</div>
<div class="panel">
<div class="panel-h"><h2>Connected accounts</h2></div>
<div class="panel-b" style="padding:0">
<table class="table">
<thead><tr><th>Platform</th><th>Account</th><th>Status</th><th>Token</th><th>Actions</th></tr></thead>
<tbody>
<tr>
<td><span class="platform-pill meta">Facebook</span></td>
<td>Monica Dhillon · MKDRealtor.com<br><span class="muted">Page ID · 1029384756</span></td>
<td><span class="badge badge-won">Connected</span></td>
<td><span class="muted">Expires Oct 2026</span></td>
<td>
<button class="btn btn-sm btn-ghost" type="button">Test post</button>
<button class="btn btn-sm btn-ghost" type="button" onclick="alert('Mockup: disconnect + revoke token')">Disconnect</button>
</td>
</tr>
<tr>
<td><span class="platform-pill ig">Instagram</span></td>
<td>@monicadhillonhomes<br><span class="muted">Linked to FB Page above</span></td>
<td><span class="badge badge-won">Connected</span></td>
<td><span class="muted">Expires Oct 2026</span></td>
<td>
<button class="btn btn-sm btn-ghost" type="button">Test post</button>
<button class="btn btn-sm btn-ghost" type="button">Disconnect</button>
</td>
</tr>
<tr class="row-warn">
<td><span class="platform-pill li">LinkedIn</span></td>
<td>Monica Dhillon<br><span class="muted">Member + Company page</span></td>
<td><span class="badge badge-contacted">Needs re-auth</span></td>
<td><span class="text-warn">Expired Jul 12 · refresh failed</span></td>
<td>
<button class="btn btn-sm btn-primary" type="button" onclick="alert('Mockup: LinkedIn OAuth re-consent → refresh_token()')">Re-authorize</button>
<button class="btn btn-sm btn-ghost" type="button">Disconnect</button>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="split">
<div class="panel">
<div class="panel-h"><h2>When to re-auth</h2></div>
<div class="panel-b" style="font-size:14px">
<ul class="plain-list">
<li>Token expired / refresh failed (banner on compose + Accounts)</li>
<li>Provider asks for new scopes (e.g. Meta Graph version bump)</li>
<li>You switched Page / IG account</li>
<li>Password change or security review on the social side</li>
</ul>
<p class="muted" style="margin:0">Re-auth = same OAuth connect flow; we replace the encrypted token and clear the “needs re-auth” flag. Scheduled posts stay queued until token works again.</p>
</div>
</div>
<div class="panel">
<div class="panel-h"><h2>Health checks</h2></div>
<div class="panel-b" style="font-size:14px">
<p><strong>Last refresh job</strong> — today 6:00a · 2 OK · 1 failed (LinkedIn)</p>
<p><strong>Failed publish (7d)</strong> — 1 IG (media format) · 2 LI (auth)</p>
<p style="margin:0"><a href="portal-social.html">Open composer</a> — platforms that need re-auth are disabled until fixed.</p>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
+296
View File
@@ -0,0 +1,296 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Compose & preview · Portal · MKDRealtor.com</title>
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700%7CPoppins:400,600,700">
<link rel="stylesheet" href="proposal.css">
</head>
<body class="portal">
<div class="proposal-banner">
<div><span class="tag">Proposal mockup</span> &nbsp; MKDRealtor.com — UX examples (not production)</div>
<div><a href="index.html">All screens</a></div>
</div>
<div class="portal-shell">
<aside class="portal-sidebar">
<a class="portal-brand" href="portal-dashboard.html"><img src="brand/exit_logo.png" alt="EXIT Realty"><span>MKDRealtor.com</span></a>
<nav class="portal-nav">
<div class="nav-section">Overview</div>
<a class="" href="portal-dashboard.html">Dashboard</a>
<a class="" href="portal-leads.html">Leads</a>
<a class="" href="portal-analytics.html">Analytics</a>
<div class="nav-section">Outreach</div>
<a class="" href="portal-contacts.html">Mailing list</a>
<a class="" href="portal-campaign.html">Campaigns</a>
<a class="" href="portal-postcard-designer.html">Postcard design</a>
<div class="nav-section">Social</div>
<a class="active" href="portal-social.html">Compose & preview</a>
<a class="" href="portal-social-accounts.html">Accounts</a>
</nav>
</aside>
<div class="portal-main">
<div class="portal-topbar">
<h1>Compose & preview</h1>
<div class="portal-user">Signed in as <strong>Monica Dhillon</strong> · <a href="portal-login.html" style="color:#00626c">Sign out</a></div>
</div>
<div class="portal-content">
<div class="proposal-note"><strong>UX note:</strong> AI chat helps draft captions (tone, length, hashtags). Insert or replace into the composer — live FB / IG / LinkedIn previews update instantly.</div>
<div class="auth-alert" id="li-warn">
<strong>LinkedIn needs re-auth.</strong> Token expired —
<a href="portal-social-accounts.html">Re-authorize in Accounts</a> before scheduling to LinkedIn.
</div>
<div class="designer-layout with-ai">
<div class="designer-controls">
<div class="panel">
<div class="panel-h"><h2>Compose</h2><a class="btn btn-sm btn-ghost" href="portal-social-accounts.html">Manage accounts</a></div>
<div class="panel-b form-grid">
<div class="field"><label>Caption</label>
<textarea id="soc-caption" style="min-height:130px" oninput="syncSocial()">Open house this Saturday 111 at 412 Willow Lane. Quiet street, updated kitchen, walkable to Oakridge. DM or text me for details.
#JustListed #OpenHouse</textarea>
<div class="hint"><span id="char-count">0</span> characters · IG soft limit ~2,200</div>
</div>
<div class="field"><label>Media</label>
<select id="soc-media" onchange="syncSocial()">
<option value="images/grid-layout-1-370x256.jpg">Willow Lane exterior</option>
<option value="images/grid-layout-2-370x256.jpg">Kitchen</option>
<option value="images/grid-layout-3-370x256.jpg">Living room</option>
<option value="">Text only (FB / LI)</option>
</select>
</div>
<div class="field"><label>Platforms</label>
<div class="platform-toggles">
<label class="toggle-pill"><input type="checkbox" id="plat-fb" checked onchange="syncSocial()"> Facebook</label>
<label class="toggle-pill"><input type="checkbox" id="plat-ig" checked onchange="syncSocial()"> Instagram</label>
<label class="toggle-pill warn"><input type="checkbox" id="plat-li" onchange="syncSocial()"> LinkedIn <span class="muted">(re-auth)</span></label>
</div>
</div>
<div class="form-grid cols-2">
<div class="field"><label>Publish</label>
<select id="soc-when-mode"><option>Schedule</option><option>Publish now</option></select>
</div>
<div class="field"><label>When</label><input type="datetime-local" value="2026-07-16T09:00"></div>
</div>
<div class="field"><label>Preview as</label>
<div class="channel-tabs" style="margin:0">
<a href="#" class="active" id="prev-fb" onclick="setPreview('fb');return false">Facebook</a>
<a href="#" id="prev-ig" onclick="setPreview('ig');return false">Instagram</a>
<a href="#" id="prev-li" onclick="setPreview('li');return false">LinkedIn</a>
</div>
</div>
<button class="btn btn-primary" type="button" onclick="alert('Mockup: SocialPost + SocialPostTargets enqueued')">Schedule to selected platforms</button>
</div>
</div>
</div>
<div class="ai-assist-col">
<div class="ai-chat">
<div class="ai-chat-h">
<h2>AI post assistant</h2>
<span class="ai-pill">Beta mockup</span>
</div>
<div class="ai-chat-messages" id="ai-messages">
<div class="ai-msg bot">
<div class="who">Assistant</div>
<div class="bubble">
I can draft or refine captions for Facebook, Instagram, and LinkedIn.
Tell me the listing, tone (warm / bold / luxury), and any must-include details —
or tap a quick prompt below.
</div>
</div>
</div>
<div class="ai-chat-prompts">
<button type="button" class="chip" onclick="sendPrompt('Write an open-house post for 412 Willow Lane')">Open house draft</button>
<button type="button" class="chip" onclick="sendPrompt('Make my caption shorter for Instagram')">Shorter for IG</button>
<button type="button" class="chip" onclick="sendPrompt('Rewrite in a warmer, neighborly tone')">Warmer tone</button>
<button type="button" class="chip" onclick="sendPrompt('Add 4 relevant hashtags')">Add hashtags</button>
<button type="button" class="chip" onclick="sendPrompt('Make a LinkedIn-friendly professional version')">LinkedIn version</button>
</div>
<div class="ai-chat-input">
<textarea id="ai-input" placeholder="Ask for a draft, rewrite, or hashtags…" rows="2"
onkeydown="if(event.key==='Enter'&&!event.shiftKey){event.preventDefault();sendChat();}"></textarea>
<button class="btn btn-primary" type="button" onclick="sendChat()">Send</button>
</div>
</div>
</div>
<div class="designer-preview-col">
<div class="panel">
<div class="panel-h"><h2>Live post preview</h2><span class="muted" style="font-size:12px" id="prev-label">Facebook</span></div>
<div class="panel-b" style="background:#e8edf3;display:flex;justify-content:center;padding:24px">
<div class="social-phone" id="preview-fb">
<div class="soc-header">
<div class="soc-avatar">MR</div>
<div>
<div class="soc-name">Monica Dhillon · MKDRealtor.com</div>
<div class="soc-meta">Sponsored · Just now · 🌐</div>
</div>
</div>
<div class="soc-caption" id="fb-caption"></div>
<div class="soc-image" id="fb-image"></div>
<div class="soc-actions">Like · Comment · Share</div>
</div>
<div class="social-phone ig" id="preview-ig" style="display:none">
<div class="soc-header">
<div class="soc-avatar round">MR</div>
<div>
<div class="soc-name">monicadhillonhomes</div>
<div class="soc-meta">Metro Area</div>
</div>
<div class="soc-more">•••</div>
</div>
<div class="soc-image square" id="ig-image"></div>
<div class="soc-actions ig-act">&nbsp; 💬 &nbsp;</div>
<div class="soc-caption"><strong>monicadhillonhomes</strong> <span id="ig-caption"></span></div>
</div>
<div class="social-phone li" id="preview-li" style="display:none">
<div class="soc-header">
<div class="soc-avatar sq">MR</div>
<div>
<div class="soc-name">Monica Dhillon</div>
<div class="soc-meta">Realtor · 1st · Just now</div>
</div>
</div>
<div class="soc-caption" id="li-caption"></div>
<div class="soc-image" id="li-image"></div>
<div class="soc-actions">Like · Comment · Repost · Send</div>
</div>
</div>
</div>
<div class="panel">
<div class="panel-h"><h2>Scheduled</h2></div>
<div class="panel-b" style="padding:0">
<table class="table">
<thead><tr><th>Post</th><th>Platforms</th><th>Status</th></tr></thead>
<tbody>
<tr><td>Open house Willow Lane</td><td>FB · IG</td><td><span class="badge badge-scheduled">Scheduled</span></td></tr>
<tr><td>Just sold — Birch Ave</td><td>FB · IG · LI</td><td><span class="badge badge-delivered">Published</span></td></tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script>
let previewPlat = 'fb';
let lastDraft = '';
function setPreview(p) {
previewPlat = p;
['fb','ig','li'].forEach(x => {
document.getElementById('preview-' + x).style.display = x === p ? 'block' : 'none';
document.getElementById('prev-' + x).classList.toggle('active', x === p);
});
document.getElementById('prev-label').textContent = ({fb:'Facebook',ig:'Instagram',li:'LinkedIn'})[p];
}
function syncSocial() {
const cap = document.getElementById('soc-caption').value;
const media = document.getElementById('soc-media').value;
document.getElementById('char-count').textContent = cap.length;
document.getElementById('fb-caption').textContent = cap;
document.getElementById('ig-caption').textContent = cap;
document.getElementById('li-caption').textContent = cap;
['fb','ig','li'].forEach(x => {
const el = document.getElementById(x + '-image');
if (!media) { el.style.display = 'none'; }
else { el.style.display = 'block'; el.style.backgroundImage = 'url(' + media + ')'; }
});
document.getElementById('li-warn').style.display = document.getElementById('plat-li').checked ? 'block' : 'none';
}
function escapeHtml(s) {
return String(s).replace(/[&<>"']/g, c => ({'&':'&amp;','<':'&lt;','>':'&gt;','"':'&quot;',"'":'&#39;'}[c]));
}
function appendMsg(role, html) {
const root = document.getElementById('ai-messages');
const div = document.createElement('div');
div.className = 'ai-msg ' + role;
div.innerHTML =
'<div class="who">' + (role === 'user' ? 'You' : 'Assistant') + '</div>' +
'<div class="bubble">' + html + '</div>';
root.appendChild(div);
root.scrollTop = root.scrollHeight;
}
function draftActions(draft) {
lastDraft = draft;
const id = 'draft-' + Date.now();
return (
'<div class="ai-draft" id="' + id + '">' + escapeHtml(draft) + '</div>' +
'<div class="ai-msg-actions">' +
'<button type="button" class="btn btn-sm btn-primary" onclick="insertDraft(false)">Replace caption</button>' +
'<button type="button" class="btn btn-sm btn-ghost" onclick="insertDraft(true)">Append</button>' +
'</div>'
);
}
function insertDraft(append) {
const ta = document.getElementById('soc-caption');
if (append && ta.value.trim()) ta.value = ta.value.replace(/\s*$/, '') + '\n\n' + lastDraft;
else ta.value = lastDraft;
syncSocial();
}
function inventReply(prompt, current) {
const p = prompt.toLowerCase();
if (p.includes('shorter') || p.includes('instagram')) {
return 'Open house Sat 111 · 412 Willow Lane\nUpdated kitchen, quiet street, walk to Oakridge.\nDM for details 🏡\n\n#JustListed #OpenHouse #WillowLane';
}
if (p.includes('warm') || p.includes('neighbor')) {
return 'I\'d love to show you around this Saturday.\n\n412 Willow Lane is open 111 — quiet street, bright kitchen, and an easy walk to Oakridge schools. Come say hi, no pressure.\n\nText me anytime if you want a private look first.';
}
if (p.includes('hashtag')) {
const base = current.trim() || 'Just listed — 412 Willow Lane. Open house Saturday 111.';
return base.replace(/\s*#\S+/g, '').trim() + '\n\n#JustListed #OpenHouse #RealEstate #HomeTour';
}
if (p.includes('linkedin') || p.includes('professional')) {
return 'Hosting an open house this Saturday, 111, at 412 Willow Lane.\n\nUpdated kitchen, walkable to Oakridge schools, asking $449,000. Happy to arrange a private showing for clients who can\'t make the window.\n\n#RealEstate #OpenHouse';
}
if (p.includes('open house') || p.includes('willow') || p.includes('draft')) {
return 'Open house this Saturday 111 at 412 Willow Lane.\n\nQuiet street · updated kitchen · walkable to Oakridge.\nDM or text me for details — hope to see you there!\n\n#JustListed #OpenHouse';
}
if (p.includes('rewrite') || p.includes('improve') || current.trim()) {
return 'Just listed: 412 Willow Lane.\n\nOpen Saturday 111. Updated kitchen, quiet street, walkable to Oakridge schools. Asking $449,000.\n\nMessage me for a private showing.\n\n#JustListed #OpenHouse';
}
return 'Tell me the address, price band, and vibe (warm / bold / luxury) and I\'ll draft a caption you can drop straight into the composer.';
}
function respond(prompt) {
const current = document.getElementById('soc-caption').value;
const draft = inventReply(prompt, current);
const needsDraft = !/tell me the address/i.test(draft);
const body = needsDraft
? 'Here\'s a draft you can use:' + draftActions(draft)
: escapeHtml(draft);
appendMsg('bot', body);
}
function sendPrompt(text) {
document.getElementById('ai-input').value = text;
sendChat();
}
function sendChat() {
const input = document.getElementById('ai-input');
const text = input.value.trim();
if (!text) return;
appendMsg('user', escapeHtml(text));
input.value = '';
setTimeout(() => respond(text), 350);
}
syncSocial();
</script>
</body>
</html>
+643
View File
@@ -0,0 +1,643 @@
/* MKDRealtor.com — proposal mockup extras (Exit Realty Wheaton palette) */
:root {
--monica-primary: #00626c;
--monica-primary-light: #008898;
--monica-ink: #212121;
--monica-muted: #6b7280;
--monica-surface: #f4f7f7;
--monica-border: #d9e3e4;
--monica-ok: #1a7f4b;
--monica-warn: #b45309;
--monica-danger: #b91c1c;
--portal-sidebar: 240px;
--exit-dark: #080808;
--exit-teal: #00626c;
--exit-teal-bright: #008898;
}
/* Proposal chrome */
.proposal-banner {
background: #111827;
color: #e5e7eb;
font-family: "Work Sans", sans-serif;
font-size: 13px;
padding: 8px 16px;
display: flex;
flex-wrap: wrap;
gap: 12px;
align-items: center;
justify-content: space-between;
position: sticky;
top: 0;
z-index: 10000;
}
.proposal-banner a { color: #7dd3da; text-decoration: none; }
.proposal-banner a:hover { text-decoration: underline; }
.proposal-banner .tag {
display: inline-block;
background: #00626c;
color: #fff;
padding: 2px 8px;
border-radius: 2px;
font-size: 11px;
letter-spacing: 0.04em;
text-transform: uppercase;
font-weight: 600;
}
.proposal-note {
border-left: 3px solid var(--monica-primary);
background: #e8f4f5;
padding: 12px 16px;
margin: 0 0 24px;
font-size: 14px;
color: #0d4a52;
}
/* Hub */
.hub-page { background: var(--monica-surface); min-height: 100vh; font-family: "Work Sans", sans-serif; }
.hub-hero {
background: linear-gradient(135deg, #080808 0%, #00626c 55%, #008898 100%);
color: #fff;
padding: 64px 24px 56px;
}
.hub-hero h1 { font-family: Poppins, sans-serif; font-weight: 700; letter-spacing: 0.02em; margin: 0 0 12px; }
.hub-hero p { max-width: 560px; opacity: 0.9; margin: 0; }
.hub-grid { max-width: 1100px; margin: -32px auto 48px; padding: 0 24px; display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.hub-card {
background: #fff;
border: 1px solid var(--monica-border);
padding: 20px;
text-decoration: none;
color: inherit;
transition: border-color 0.15s, transform 0.15s;
}
.hub-card:hover { border-color: var(--monica-primary); transform: translateY(-2px); color: inherit; text-decoration: none; }
.hub-card .eyebrow { font-size: 11px; text-transform: uppercase; letter-spacing: 0.08em; color: var(--monica-primary); font-weight: 600; margin-bottom: 6px; }
.hub-card h3 { margin: 0 0 8px; font-size: 18px; font-family: Poppins, sans-serif; }
.hub-card p { margin: 0; font-size: 14px; color: var(--monica-muted); }
/* Public brand text logo */
.brand-text {
font-family: Poppins, sans-serif;
font-weight: 700;
font-size: 18px;
color: var(--monica-ink);
text-decoration: none;
letter-spacing: 0.02em;
}
.brand-text span { color: var(--monica-primary); }
.brand-text:hover { text-decoration: none; color: var(--monica-ink); }
.brand-logo { height: 44px; width: auto; display: block; }
.brand-logo.sm { height: 32px; }
.footer-brand-row { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; }
.footer-brand-row img { height: 40px; width: auto; }
/* Portal shell */
body.portal {
margin: 0;
background: var(--monica-surface);
font-family: "Work Sans", sans-serif;
color: var(--monica-ink);
}
.portal-shell { display: flex; min-height: calc(100vh - 36px); }
.portal-sidebar {
width: var(--portal-sidebar);
background: #080808;
color: #cbd5e1;
flex-shrink: 0;
display: flex;
flex-direction: column;
}
.portal-brand {
padding: 16px 18px;
border-bottom: 1px solid rgba(255,255,255,0.08);
font-family: Poppins, sans-serif;
font-weight: 700;
color: #fff;
font-size: 14px;
text-decoration: none;
display: flex;
align-items: center;
gap: 10px;
}
.portal-brand img {
height: 36px;
width: auto;
display: block;
}
.portal-brand span { color: #7dd3da; font-size: 12px; letter-spacing: 0.04em; }
.portal-nav { padding: 12px 0; flex: 1; }
.portal-nav a {
display: block;
padding: 10px 18px;
color: #94a3b8;
text-decoration: none;
font-size: 14px;
border-left: 3px solid transparent;
}
.portal-nav a:hover { color: #fff; background: rgba(255,255,255,0.04); }
.portal-nav a.active { color: #fff; background: rgba(0,98,108,0.28); border-left-color: #00a0ab; }
.portal-nav .nav-section {
font-size: 10px;
text-transform: uppercase;
letter-spacing: 0.1em;
color: #64748b;
padding: 16px 18px 6px;
}
.portal-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.portal-topbar {
background: #fff;
border-bottom: 1px solid var(--monica-border);
padding: 14px 24px;
display: flex;
align-items: center;
justify-content: space-between;
gap: 16px;
}
.portal-topbar h1 { margin: 0; font-size: 20px; font-family: Poppins, sans-serif; font-weight: 600; }
.portal-content { padding: 24px; flex: 1; }
.portal-user { font-size: 13px; color: var(--monica-muted); }
.portal-user strong { color: var(--monica-ink); }
/* Portal widgets */
.stat-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 16px; margin-bottom: 24px; }
.stat-card {
background: #fff;
border: 1px solid var(--monica-border);
padding: 18px;
}
.stat-card .label { font-size: 12px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--monica-muted); }
.stat-card .value { font-size: 28px; font-weight: 700; font-family: Poppins, sans-serif; margin-top: 4px; }
.stat-card .delta { font-size: 12px; margin-top: 4px; color: var(--monica-ok); }
.panel {
background: #fff;
border: 1px solid var(--monica-border);
margin-bottom: 20px;
}
.panel-h {
padding: 14px 18px;
border-bottom: 1px solid var(--monica-border);
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
}
.panel-h h2 { margin: 0; font-size: 15px; font-family: Poppins, sans-serif; font-weight: 600; }
.panel-b { padding: 18px; }
.btn {
display: inline-block;
padding: 9px 18px;
font-size: 13px;
font-weight: 600;
border: none;
cursor: pointer;
text-decoration: none;
font-family: "Work Sans", sans-serif;
}
.btn-primary { background: var(--monica-primary); color: #fff; }
.btn-primary:hover { background: #004e56; color: #fff; text-decoration: none; }
.btn-ghost { background: transparent; border: 1px solid var(--monica-border); color: var(--monica-ink); }
.btn-sm { padding: 6px 12px; font-size: 12px; }
.table { width: 100%; border-collapse: collapse; font-size: 14px; }
.table th {
text-align: left;
font-size: 11px;
text-transform: uppercase;
letter-spacing: 0.06em;
color: var(--monica-muted);
padding: 10px 12px;
border-bottom: 1px solid var(--monica-border);
font-weight: 600;
}
.table td { padding: 12px; border-bottom: 1px solid var(--monica-border); vertical-align: middle; }
.table tr:hover td { background: #f8fafc; }
.table a { color: var(--monica-primary); text-decoration: none; font-weight: 500; }
.badge {
display: inline-block;
padding: 2px 8px;
font-size: 11px;
font-weight: 600;
border-radius: 2px;
text-transform: uppercase;
letter-spacing: 0.04em;
}
.badge-new { background: #d0eef0; color: #00626c; }
.badge-contacted { background: #fef3c7; color: #92400e; }
.badge-won { background: #d1fae5; color: #065f46; }
.badge-lost { background: #fee2e2; color: #991b1b; }
.badge-sent { background: #d0eef0; color: #00626c; }
.badge-scheduled { background: #ede9fe; color: #5b21b6; }
.badge-delivered { background: #d1fae5; color: #065f46; }
.badge-failed { background: #fee2e2; color: #991b1b; }
.badge-optin { background: #d1fae5; color: #065f46; }
.badge-optout { background: #f3f4f6; color: #4b5563; }
.form-grid { display: grid; gap: 16px; }
.form-grid.cols-2 { grid-template-columns: 1fr 1fr; }
@media (max-width: 700px) { .form-grid.cols-2 { grid-template-columns: 1fr; } }
.field label { display: block; font-size: 12px; font-weight: 600; margin-bottom: 6px; color: #374151; }
.field input, .field select, .field textarea {
width: 100%;
padding: 10px 12px;
border: 1px solid var(--monica-border);
font: inherit;
background: #fff;
box-sizing: border-box;
}
.field textarea { min-height: 100px; resize: vertical; }
.field .hint { font-size: 12px; color: var(--monica-muted); margin-top: 4px; }
.channel-tabs { display: flex; gap: 0; border-bottom: 1px solid var(--monica-border); margin-bottom: 18px; }
.channel-tabs a {
padding: 10px 16px;
font-size: 13px;
font-weight: 600;
color: var(--monica-muted);
text-decoration: none;
border-bottom: 2px solid transparent;
margin-bottom: -1px;
}
.channel-tabs a.active { color: var(--monica-primary); border-bottom-color: var(--monica-primary); }
.chart-placeholder {
height: 220px;
background: linear-gradient(180deg, #e8f4f5 0%, #fff 100%);
border: 1px dashed #a8d8dc;
display: flex;
align-items: flex-end;
gap: 8px;
padding: 24px 16px 16px;
}
.chart-placeholder .bar {
flex: 1;
background: var(--monica-primary);
opacity: 0.75;
border-radius: 2px 2px 0 0;
min-height: 20px;
}
.consent-pills { display: flex; gap: 6px; flex-wrap: wrap; }
.preview-pane {
background: #f8fafc;
border: 1px solid var(--monica-border);
padding: 16px;
font-size: 14px;
min-height: 160px;
}
.calendar-grid {
display: grid;
grid-template-columns: repeat(7, 1fr);
gap: 4px;
font-size: 12px;
}
.calendar-grid .dow { text-align: center; color: var(--monica-muted); font-weight: 600; padding: 6px; }
.calendar-grid .day {
aspect-ratio: 1;
border: 1px solid var(--monica-border);
background: #fff;
padding: 6px;
position: relative;
}
.calendar-grid .day.has-post { background: #e8f4f5; }
.calendar-grid .day .dot {
width: 6px; height: 6px; border-radius: 50%;
background: var(--monica-primary);
margin-top: 4px;
}
.login-wrap {
min-height: calc(100vh - 36px);
display: flex;
align-items: center;
justify-content: center;
background: linear-gradient(160deg, #080808, #00626c 60%, #e8f4f5 60%);
padding: 24px;
}
.login-card {
background: #fff;
width: 100%;
max-width: 400px;
padding: 36px 32px;
border: 1px solid var(--monica-border);
}
.login-card h1 { font-family: Poppins, sans-serif; font-size: 22px; margin: 0 0 6px; }
.login-card .sub { color: var(--monica-muted); font-size: 14px; margin-bottom: 24px; }
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
@media (max-width: 900px) {
.portal-shell { flex-direction: column; }
.portal-sidebar { width: 100%; }
.portal-nav { display: flex; flex-wrap: wrap; padding: 8px; }
.portal-nav .nav-section { display: none; }
.portal-nav a { border-left: none; border-bottom: 2px solid transparent; padding: 8px 12px; }
.portal-nav a.active { border-bottom-color: #00a0ab; }
.split { grid-template-columns: 1fr; }
}
/* Public brand — EXIT Realty logo from exitrealtywheaton.com */
.page .rd-navbar-brand {
display: inline-flex;
align-items: center;
gap: 10px;
}
.page .rd-navbar-brand img {
display: block !important;
height: 44px;
width: auto;
max-width: 160px;
}
.page .rd-navbar-brand::before,
.page .rd-navbar-brand::after { content: none !important; display: none !important; }
.page .rd-navbar-brand .brand-site {
font-family: Poppins, sans-serif;
font-weight: 700;
font-size: 13px;
letter-spacing: 0.04em;
color: #00626c;
text-decoration: none;
line-height: 1.2;
}
.page .rd-navbar-brand .brand-site span {
display: block;
font-size: 10px;
font-weight: 600;
letter-spacing: 0.12em;
text-transform: uppercase;
color: #6b7280;
}
/* Shared extras */
.muted { color: var(--monica-muted); font-size: 12px; }
.text-warn { color: var(--monica-warn); font-size: 12px; }
.hint-block { font-size: 13px; color: var(--monica-muted); margin: 12px 0 0; }
.plain-list { margin: 0 0 12px; padding-left: 18px; }
.plain-list li { margin-bottom: 6px; }
.check-row { display: flex; align-items: center; gap: 8px; font-size: 14px; }
.row-warn td { background: #fffbeb; }
.auth-alert {
background: #fff7ed;
border: 1px solid #fdba74;
color: #9a3412;
padding: 12px 16px;
margin-bottom: 16px;
font-size: 14px;
}
.auth-alert a { color: #9a3412; font-weight: 600; }
/* Social accounts */
.connect-grid { display: grid; gap: 12px; }
.connect-card {
display: flex; gap: 14px; align-items: flex-start; text-align: left;
padding: 14px; border: 1px solid var(--monica-border); background: #fff;
cursor: pointer; font: inherit; width: 100%;
}
.connect-card:hover { border-color: var(--monica-primary); }
.connect-card p { margin: 4px 0 0; font-size: 13px; color: var(--monica-muted); }
.platform-icon {
width: 40px; height: 40px; border-radius: 8px; display: flex; align-items: center;
justify-content: center; color: #fff; font-weight: 700; flex-shrink: 0; font-size: 14px;
}
.platform-icon.meta { background: #1877f2; }
.platform-icon.ig { background: linear-gradient(45deg, #f58529, #dd2a7b, #8134af); font-size: 12px; }
.platform-icon.li { background: #0a66c2; }
.platform-pill {
display: inline-block; padding: 2px 8px; font-size: 11px; font-weight: 600;
color: #fff; border-radius: 2px;
}
.platform-pill.meta { background: #1877f2; }
.platform-pill.ig { background: #dd2a7b; }
.platform-pill.li { background: #0a66c2; }
/* Import wizard */
.steps {
display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 20px;
}
.step {
display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--monica-muted);
padding: 8px 12px; background: #fff; border: 1px solid var(--monica-border);
}
.step span {
width: 22px; height: 22px; border-radius: 50%; background: #e5e7eb; color: #374151;
display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700;
}
.step.active { border-color: var(--monica-primary); color: var(--monica-ink); }
.step.active span { background: var(--monica-primary); color: #fff; }
.dropzone {
border: 2px dashed var(--monica-border); padding: 32px; text-align: center; background: #f8fafc;
}
/* Designer shared layout */
.designer-layout {
display: grid; grid-template-columns: minmax(280px, 380px) 1fr; gap: 20px; align-items: start;
}
.designer-layout.with-ai {
grid-template-columns: minmax(260px, 340px) minmax(240px, 320px) 1fr;
}
@media (max-width: 1200px) {
.designer-layout.with-ai { grid-template-columns: 1fr 1fr; }
.designer-layout.with-ai .designer-preview-col { grid-column: 1 / -1; }
}
@media (max-width: 960px) {
.designer-layout,
.designer-layout.with-ai { grid-template-columns: 1fr; }
}
/* Size picker */
.size-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.size-option {
border: 1px solid var(--monica-border); background: #fff; padding: 10px 12px;
text-align: left; cursor: pointer; font: inherit; color: inherit;
}
.size-option:hover { border-color: var(--monica-primary); }
.size-option.active {
border-color: var(--monica-primary); background: #e8f4f5;
box-shadow: inset 3px 0 0 var(--monica-primary);
}
.size-option .sz-name { font-weight: 700; font-size: 13px; font-family: Poppins, sans-serif; }
.size-option .sz-meta { font-size: 11px; color: var(--monica-muted); margin-top: 2px; }
.size-option .sz-badge {
display: inline-block; margin-top: 6px; font-size: 10px; font-weight: 600;
text-transform: uppercase; letter-spacing: 0.04em; color: var(--monica-primary);
}
/* Media library */
.media-library { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.media-tile {
position: relative; aspect-ratio: 4 / 3; border: 2px solid transparent;
background-size: cover; background-position: center; background-color: #e5e7eb;
cursor: pointer; padding: 0; overflow: hidden;
}
.media-tile.active { border-color: var(--monica-primary); }
.media-tile .media-label {
position: absolute; left: 0; right: 0; bottom: 0; padding: 4px 6px;
background: rgba(15, 23, 42, 0.72); color: #fff; font-size: 10px;
white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.media-tile.upload-tile {
border: 2px dashed var(--monica-border); background: #f8fafc;
display: flex; flex-direction: column; align-items: center; justify-content: center;
gap: 4px; color: var(--monica-muted); font-size: 11px; font-weight: 600;
}
.media-tile.upload-tile:hover { border-color: var(--monica-primary); color: var(--monica-primary); }
.media-tile.upload-tile span { font-size: 22px; line-height: 1; color: var(--monica-primary); }
.dropzone.compact { padding: 16px; font-size: 13px; cursor: pointer; }
.dropzone.compact:hover { border-color: var(--monica-primary); }
.library-hint { font-size: 12px; color: var(--monica-muted); margin: 8px 0 0; }
/* AI chat assist */
.ai-chat {
display: flex; flex-direction: column; height: min(640px, 75vh);
background: #fff; border: 1px solid var(--monica-border);
}
.ai-chat-h {
padding: 12px 14px; border-bottom: 1px solid var(--monica-border);
display: flex; align-items: center; justify-content: space-between; gap: 8px;
}
.ai-chat-h h2 { margin: 0; font-size: 15px; font-family: Poppins, sans-serif; font-weight: 600; }
.ai-pill {
font-size: 10px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase;
background: #e8f4f5; color: var(--monica-primary); padding: 3px 8px;
}
.ai-chat-messages {
flex: 1; overflow-y: auto; padding: 14px; display: flex; flex-direction: column; gap: 12px;
background: linear-gradient(180deg, #f8fafc 0%, #fff 40%);
}
.ai-msg { max-width: 92%; font-size: 13px; line-height: 1.45; }
.ai-msg.bot { align-self: flex-start; }
.ai-msg.user { align-self: flex-end; }
.ai-msg .bubble {
padding: 10px 12px; border: 1px solid var(--monica-border); background: #fff;
}
.ai-msg.user .bubble {
background: var(--monica-primary); color: #fff; border-color: var(--monica-primary);
}
.ai-msg .who {
font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em;
color: var(--monica-muted); margin-bottom: 4px;
}
.ai-msg.user .who { text-align: right; color: var(--monica-primary); }
.ai-draft {
margin-top: 8px; padding: 10px; background: #f8fafc; border: 1px dashed #a8d8dc;
white-space: pre-wrap; font-size: 12px; color: var(--monica-ink);
}
.ai-msg-actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.ai-chat-prompts {
padding: 8px 12px; border-top: 1px solid var(--monica-border);
display: flex; flex-wrap: wrap; gap: 6px; background: #fafbfc;
}
.chip {
border: 1px solid var(--monica-border); background: #fff; font: inherit;
font-size: 11px; font-weight: 600; padding: 5px 10px; cursor: pointer; color: var(--monica-ink);
}
.chip:hover { border-color: var(--monica-primary); color: var(--monica-primary); }
.ai-chat-input {
border-top: 1px solid var(--monica-border); padding: 10px 12px;
display: flex; gap: 8px; align-items: flex-end;
}
.ai-chat-input textarea {
flex: 1; min-height: 44px; max-height: 100px; resize: vertical;
border: 1px solid var(--monica-border); padding: 8px 10px; font: inherit; font-size: 13px;
}
.ai-chat-input .btn { flex-shrink: 0; }
/* Postcard */
.postcard {
width: 100%; max-width: 420px; aspect-ratio: 6 / 4; position: relative; overflow: hidden;
background: #111; box-shadow: 0 12px 40px rgba(15, 23, 42, 0.25); color: #fff;
transition: max-width 0.2s, aspect-ratio 0.2s;
}
.postcard.size-4x6 { max-width: 420px; aspect-ratio: 6 / 4; }
.postcard.size-6x9 { max-width: 480px; aspect-ratio: 9 / 6; }
.postcard.size-6x11 { max-width: 520px; aspect-ratio: 11 / 6; }
.postcard.size-square { max-width: 400px; aspect-ratio: 1 / 1; }
.postcard-media {
position: absolute; inset: 0; background-size: cover; background-position: center;
}
.postcard-overlay { position: absolute; inset: 0; pointer-events: none; }
.postcard-overlay.ov-dark { background: linear-gradient(transparent 35%, rgba(0,0,0,.75)); }
.postcard-overlay.ov-light { background: linear-gradient(transparent 50%, rgba(255,255,255,.92)); }
.postcard-overlay.ov-none { background: none; }
.postcard-overlay.ov-light ~ .postcard-copy,
.ov-light + .postcard-copy { color: #111; }
.postcard-copy {
position: absolute; left: 20px; right: 20px; bottom: 18px; z-index: 2;
}
.postcard-headline {
font-family: Poppins, sans-serif; font-weight: 700; font-size: 28px; letter-spacing: 0.04em;
border-left: 4px solid #00626c; padding-left: 10px; line-height: 1.1;
}
.postcard-sub { margin-top: 8px; font-size: 14px; opacity: 0.95; }
.postcard-back { background: #fafafa; color: #212121; }
.postcard-back-grid { display: grid; grid-template-columns: 1.2fr 1fr; height: 100%; }
.postcard-back-msg { padding: 16px; display: flex; flex-direction: column; gap: 10px; border-right: 1px dashed #cbd5e1; }
.postcard-back-body { font-size: 12px; white-space: pre-wrap; flex: 1; line-height: 1.45; }
.postcard-agent { font-size: 11px; font-weight: 600; color: #00626c; }
.postcard-qr {
width: 48px; height: 48px; background: #111; color: #fff; font-size: 10px;
display: flex; align-items: center; justify-content: center; letter-spacing: 0.05em;
}
.postcard-back-mail { padding: 12px; position: relative; }
.stamp {
width: 44px; height: 52px; border: 2px dashed #94a3b8; float: right;
font-size: 9px; color: #94a3b8; display: flex; align-items: center; justify-content: center;
}
.addr-block {
margin-top: 48px; font-size: 12px; line-height: 1.4;
border-bottom: 1px solid #e2e8f0; padding-bottom: 8px;
}
/* Social live preview */
.platform-toggles { display: flex; flex-wrap: wrap; gap: 8px; }
.toggle-pill {
border: 1px solid var(--monica-border); padding: 8px 12px; font-size: 13px;
background: #fff; display: inline-flex; align-items: center; gap: 6px;
}
.toggle-pill.warn { border-color: #fdba74; background: #fff7ed; }
.social-phone {
width: 100%; max-width: 360px; background: #fff; border: 1px solid #d1d5db;
box-shadow: 0 8px 30px rgba(15,23,42,.12); overflow: hidden; font-size: 14px;
}
.social-phone.ig { max-width: 340px; }
.soc-header {
display: flex; align-items: center; gap: 10px; padding: 12px 14px; position: relative;
}
.soc-avatar {
width: 40px; height: 40px; background: #00626c; color: #fff; display: flex;
align-items: center; justify-content: center; font-weight: 700; font-size: 13px; flex-shrink: 0;
}
.soc-avatar.round { border-radius: 50%; background: linear-gradient(45deg, #f58529, #dd2a7b); }
.soc-avatar.sq { border-radius: 4px; background: #0a66c2; }
.soc-name { font-weight: 700; font-size: 13px; }
.soc-meta { font-size: 11px; color: #6b7280; }
.soc-more { margin-left: auto; color: #6b7280; }
.soc-caption { padding: 0 14px 12px; white-space: pre-wrap; line-height: 1.4; font-size: 13px; }
.soc-image {
height: 200px; background-size: cover; background-position: center; background-color: #e5e7eb;
}
.soc-image.square { height: 340px; }
.soc-actions {
padding: 10px 14px; border-top: 1px solid #e5e7eb; font-size: 12px; color: #4b5563; font-weight: 600;
}
.ig-act { font-size: 18px; border-top: none; padding-top: 8px; }
/* Exit brand overrides on template buttons */
.page .button-primary,
.page .button-primary:focus,
.page .button-primary:active {
background-color: #00626c !important;
border-color: #00626c !important;
color: #fff !important;
}
.page .button-primary:hover {
background-color: #008898 !important;
border-color: #008898 !important;
color: #fff !important;
}
.page .breadcrumbs-custom-path a,
.page a.link-default { color: #00626c; }
+57
View File
@@ -0,0 +1,57 @@
<!DOCTYPE html>
<html class="wide wow-animation" lang="en">
<head>
<title>404 · Monica Dhillon</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="brand/favicon-32.png" type="image/x-icon">
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700,800%7CPoppins:300,400,700">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/fonts.css">
<link rel="stylesheet" href="css/style.css" id="main-styles-link">
<link rel="stylesheet" href="proposal.css">
</head>
<body>
<div class="proposal-banner">
<div><span class="tag">Proposal mockup</span> &nbsp; MKDRealtor.com — UX examples (not production)</div>
<div><a href="index.html">All screens</a></div>
</div>
<div class="page">
<section class="section section-single bg-gray-800 primary-overlay" style="background-image: url(images/bg-image-7.jpg);">
<div class="section-single-inner">
<div class="section-single-dummy"></div>
<div class="section-single-main">
<div class="container">
<div class="proposal-note" style="max-width:640px;margin:0 auto 24px;text-align:left">
<strong>UX note:</strong> Custom 404 for broken or removed URLs. Keeps visitor on-brand and offers a path home or to contact.
</div>
<div class="row row-30">
<div class="col-sm-6 text-center text-sm-left">
<p class="text-extra-large">404</p>
</div>
<div class="col-sm-6">
<div class="section-single-main-content">
<h6 class="title-decorated title-decorated-lg">Page not found</h6>
<p><span class="text-width-2">That page may have moved or the link is outdated. Lets get you back on track.</span></p>
<a class="button button-lg button-primary button-winona" href="public-home.html">Back to home</a>
<a class="button button-lg button-default-outline button-winona" href="public-contact.html" style="margin-left:8px">Contact Monica</a>
</div>
</div>
</div>
</div>
</div>
<div class="footer-minimal section-single-footer">
<div class="container">
<div class="footer-minimal-inner">
<a class="brand" href="public-home.html"><img src="brand/exit_logo.png" alt="EXIT Realty · Monica Dhillon" width="151" height="44"/></a>
<p class="rights"><span>&copy;&nbsp;</span><span>2026</span><span>&nbsp;</span><span>Monica Dhillon · MKDRealtor.com</span></p>
</div>
</div>
</div>
</div>
</section>
</div>
<script src="js/core.min.js"></script>
<script src="js/script.js"></script>
</body>
</html>
+119
View File
@@ -0,0 +1,119 @@
<!DOCTYPE html>
<html class="wide wow-animation" lang="en">
<head>
<title>About · Monica Dhillon</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="brand/favicon-32.png" type="image/x-icon">
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700,800%7CPoppins:300,400,700">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/fonts.css">
<link rel="stylesheet" href="css/style.css" id="main-styles-link">
<link rel="stylesheet" href="proposal.css">
</head>
<body>
<div class="proposal-banner">
<div><span class="tag">Proposal mockup</span> &nbsp; MKDRealtor.com — UX examples (not production)</div>
<div><a href="index.html">All screens</a></div>
</div>
<div class="page">
<header class="section page-header">
<div class="rd-navbar-wrap">
<nav class="rd-navbar rd-navbar-corporate" data-layout="rd-navbar-fixed" data-sm-layout="rd-navbar-fixed" data-md-layout="rd-navbar-fixed" data-md-device-layout="rd-navbar-fixed" data-lg-layout="rd-navbar-static" data-lg-device-layout="rd-navbar-static" data-lg-stick-up="true" data-lg-stick-up-offset="118px" data-xl-layout="rd-navbar-static" data-xl-device-layout="rd-navbar-static" data-xl-stick-up="true" data-xl-stick-up-offset="118px" data-xxl-layout="rd-navbar-static" data-xxl-device-layout="rd-navbar-static" data-xxl-stick-up-offset="118px" data-xxl-stick-up="true">
<div class="rd-navbar-aside-outer">
<div class="rd-navbar-aside">
<div class="rd-navbar-panel">
<button class="rd-navbar-toggle" data-rd-navbar-toggle="#rd-navbar-nav-wrap-1"><span></span></button>
<a class="rd-navbar-brand" href="public-home.html"><img src="brand/exit_logo.png" alt="EXIT Realty · Monica Dhillon" width="151" height="44"/></a>
</div>
<div class="rd-navbar-collapse">
<button class="rd-navbar-collapse-toggle rd-navbar-fixed-element-1" data-rd-navbar-toggle="#rd-navbar-collapse-content-1"><span></span></button>
<div class="rd-navbar-collapse-content" id="rd-navbar-collapse-content-1">
<article class="unit align-items-center">
<div class="unit-left"><span class="icon icon-md icon-modern mdi mdi-phone"></span></div>
<div class="unit-body"><a class="link-default" href="tel:+15551234567">(555) 123-4567</a></div>
</article>
<article class="unit align-items-center">
<div class="unit-left"><span class="icon icon-md icon-modern mdi mdi-map-marker"></span></div>
<div class="unit-body"><span class="link-default">Serving Greater Metro Area</span></div>
</article>
<a class="button button-gray-bordered button-winona" href="public-contact.html">Get in touch</a>
</div>
</div>
</div>
</div>
<div class="rd-navbar-main-outer">
<div class="rd-navbar-main">
<div class="rd-navbar-nav-wrap" id="rd-navbar-nav-wrap-1">
<ul class="rd-navbar-nav">
<li class="rd-nav-item "><a class="rd-nav-link" href="public-home.html">Home</a></li>
<li class="rd-nav-item active"><a class="rd-nav-link" href="public-about.html">About</a></li>
<li class="rd-nav-item "><a class="rd-nav-link" href="public-contact.html">Contact</a></li>
</ul>
</div>
</div>
</div>
</nav>
</div>
</header>
<section class="breadcrumbs-custom bg-image context-dark" style="background-image: url(images/breadcrumbs-image-1.jpg);">
<div class="breadcrumbs-custom-inner">
<div class="container breadcrumbs-custom-container">
<div class="breadcrumbs-custom-main">
<h6 class="breadcrumbs-custom-subtitle title-decorated">About</h6>
<h2 class="text-uppercase breadcrumbs-custom-title">Meet Monica</h2>
</div>
<ul class="breadcrumbs-custom-path">
<li><a href="public-home.html">Home</a></li>
<li class="active">About</li>
</ul>
</div>
</div>
</section>
<section class="section section-lg">
<div class="container">
<div class="row row-50 justify-content-center justify-content-lg-between flex-lg-row-reverse">
<div class="col-md-10 col-lg-6 col-xl-5">
<h3 class="text-uppercase">Local realtor,<br>personal service</h3>
<p class="about-subtitle">I help families buy and sell homes with clear communication and marketing that actually reaches people — not just another postcard blast.</p>
<p>This site replaces a costly third-party campaign platform. Visitors reach me through a protected contact form; every inquiry lands in my portal with source tracking so I know which campaigns work.</p>
<a class="button button-lg button-primary button-winona" href="public-contact.html">Work with me</a>
</div>
<div class="col-md-10 col-lg-6 col-xl-6"><img class="img-responsive" src="images/careers-1-570x388.jpg" alt="Monica Dhillon" width="570" height="388"/></div>
</div>
</div>
</section>
<footer class="section footer-advanced bg-gray-700">
<div class="footer-advanced-main">
<div class="container">
<div class="row row-50">
<div class="col-lg-6">
<div class="footer-brand-row"><img src="brand/exit_logo.png" alt="EXIT Realty"><div><h5 class="font-weight-bold text-uppercase text-white" style="margin:0">Monica Dhillon</h5><span style="color:#7dd3da;font-size:12px">MKDRealtor.com · EXIT Realty Redefined</span></div></div>
<p class="footer-advanced-text">Local expertise, clear communication, and a marketing platform built to bring serious buyers and sellers to you — not to a generic campaign factory.</p>
</div>
<div class="col-lg-6">
<h5 class="font-weight-bold text-uppercase text-white">Navigate</h5>
<ul class="list-marked list-marked-sm">
<li><a href="public-home.html">Home</a></li>
<li><a href="public-about.html">About</a></li>
<li><a href="public-contact.html">Contact</a></li>
<li><a href="portal-login.html">Realtor portal</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="footer-advanced-aside">
<div class="container">
<div class="footer-advanced-layout"><a class="brand" href="public-home.html"><img src="brand/exit_logo.png" alt="EXIT Realty · Monica Dhillon" width="151" height="44"/></a>
<p class="rights"><span>&copy;&nbsp;</span><span>2026&nbsp;</span><span>Monica Dhillon · MKDRealtor.com</span><span>.&nbsp;</span><a href="public-unsubscribe.html">Email preferences</a></p>
</div>
</div>
</div>
</footer>
</div>
<script src="js/core.min.js"></script>
<script src="js/script.js"></script>
</body>
</html>
+187
View File
@@ -0,0 +1,187 @@
<!DOCTYPE html>
<html class="wide wow-animation" lang="en">
<head>
<title>Contact · Monica Dhillon</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="brand/favicon-32.png" type="image/x-icon">
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700,800%7CPoppins:300,400,700">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/fonts.css">
<link rel="stylesheet" href="css/style.css" id="main-styles-link">
<link rel="stylesheet" href="proposal.css">
</head>
<body>
<div class="proposal-banner">
<div><span class="tag">Proposal mockup</span> &nbsp; MKDRealtor.com — UX examples (not production)</div>
<div><a href="index.html">All screens</a></div>
</div>
<div class="page">
<header class="section page-header">
<div class="rd-navbar-wrap">
<nav class="rd-navbar rd-navbar-corporate" data-layout="rd-navbar-fixed" data-sm-layout="rd-navbar-fixed" data-md-layout="rd-navbar-fixed" data-md-device-layout="rd-navbar-fixed" data-lg-layout="rd-navbar-static" data-lg-device-layout="rd-navbar-static" data-lg-stick-up="true" data-lg-stick-up-offset="118px" data-xl-layout="rd-navbar-static" data-xl-device-layout="rd-navbar-static" data-xl-stick-up="true" data-xl-stick-up-offset="118px" data-xxl-layout="rd-navbar-static" data-xxl-device-layout="rd-navbar-static" data-xxl-stick-up-offset="118px" data-xxl-stick-up="true">
<div class="rd-navbar-aside-outer">
<div class="rd-navbar-aside">
<div class="rd-navbar-panel">
<button class="rd-navbar-toggle" data-rd-navbar-toggle="#rd-navbar-nav-wrap-1"><span></span></button>
<a class="rd-navbar-brand" href="public-home.html"><img src="brand/exit_logo.png" alt="EXIT Realty · Monica Dhillon" width="151" height="44"/></a>
</div>
<div class="rd-navbar-collapse">
<button class="rd-navbar-collapse-toggle rd-navbar-fixed-element-1" data-rd-navbar-toggle="#rd-navbar-collapse-content-1"><span></span></button>
<div class="rd-navbar-collapse-content" id="rd-navbar-collapse-content-1">
<article class="unit align-items-center">
<div class="unit-left"><span class="icon icon-md icon-modern mdi mdi-phone"></span></div>
<div class="unit-body"><a class="link-default" href="tel:+15551234567">(555) 123-4567</a></div>
</article>
<article class="unit align-items-center">
<div class="unit-left"><span class="icon icon-md icon-modern mdi mdi-map-marker"></span></div>
<div class="unit-body"><span class="link-default">Serving Greater Metro Area</span></div>
</article>
<a class="button button-gray-bordered button-winona" href="public-contact.html">Get in touch</a>
</div>
</div>
</div>
</div>
<div class="rd-navbar-main-outer">
<div class="rd-navbar-main">
<div class="rd-navbar-nav-wrap" id="rd-navbar-nav-wrap-1">
<ul class="rd-navbar-nav">
<li class="rd-nav-item "><a class="rd-nav-link" href="public-home.html">Home</a></li>
<li class="rd-nav-item "><a class="rd-nav-link" href="public-about.html">About</a></li>
<li class="rd-nav-item active"><a class="rd-nav-link" href="public-contact.html">Contact</a></li>
</ul>
</div>
</div>
</div>
</nav>
</div>
</header>
<section class="breadcrumbs-custom bg-image context-dark" style="background-image: url(images/breadcrumbs-image-1.jpg);">
<div class="breadcrumbs-custom-inner">
<div class="container breadcrumbs-custom-container">
<div class="breadcrumbs-custom-main">
<h6 class="breadcrumbs-custom-subtitle title-decorated">Contact</h6>
<h2 class="text-uppercase breadcrumbs-custom-title">Get in touch</h2>
</div>
<ul class="breadcrumbs-custom-path">
<li><a href="public-home.html">Home</a></li>
<li class="active">Contact</li>
</ul>
</div>
</div>
</section>
<section class="section section-sm">
<div class="container">
<div class="layout-bordered">
<div class="layout-bordered-item wow-outer">
<div class="layout-bordered-item-inner wow slideInUp">
<div class="icon icon-lg mdi mdi-phone text-primary"></div>
<ul class="list-0"><li><a class="link-default" href="tel:+15551234567">(555) 123-4567</a></li></ul>
</div>
</div>
<div class="layout-bordered-item wow-outer">
<div class="layout-bordered-item-inner wow slideInUp">
<div class="icon icon-lg mdi mdi-email text-primary"></div>
<a class="link-default" href="mailto:monica@example.com">monica@example.com</a>
</div>
</div>
<div class="layout-bordered-item wow-outer">
<div class="layout-bordered-item-inner wow slideInUp">
<div class="icon icon-lg mdi mdi-map-marker text-primary"></div>
<span class="link-default">Greater Metro Area</span>
</div>
</div>
</div>
</div>
</section>
<section class="section bg-gray-100">
<div class="container section-lg">
<div class="row">
<div class="col-lg-8">
<div class="proposal-note"><strong>UX note:</strong> Form protected by reCAPTCHA v3 (invisible). Submit creates/updates a <em>Contact</em>, opens a <em>Lead</em>, and ties UTM visit → attribution. Consent notice below.</div>
<h3 class="text-uppercase">Send a message</h3>
<form class="rd-form" action="#" method="post" onsubmit="alert('Mockup only — in production this submits with reCAPTCHA and creates a lead.'); return false;">
<div class="row row-10">
<div class="col-md-6">
<div class="form-wrap">
<label class="form-label-outside" for="contact-first-name">First name</label>
<input class="form-input" id="contact-first-name" type="text" name="first_name" required>
</div>
</div>
<div class="col-md-6">
<div class="form-wrap">
<label class="form-label-outside" for="contact-last-name">Last name</label>
<input class="form-input" id="contact-last-name" type="text" name="last_name" required>
</div>
</div>
<div class="col-md-6">
<div class="form-wrap">
<label class="form-label-outside" for="contact-email">Email</label>
<input class="form-input" id="contact-email" type="email" name="email" required>
</div>
</div>
<div class="col-md-6">
<div class="form-wrap">
<label class="form-label-outside" for="contact-phone">Phone</label>
<input class="form-input" id="contact-phone" type="tel" name="phone">
</div>
</div>
<div class="col-12">
<div class="form-wrap">
<label class="form-label-outside" for="contact-interest">I am interested in</label>
<select class="form-input" id="contact-interest" name="interest">
<option>Buying a home</option>
<option>Selling a home</option>
<option>Both / not sure yet</option>
<option>Something else</option>
</select>
</div>
</div>
<div class="col-12">
<div class="form-wrap">
<label class="form-label-outside" for="contact-message">Message</label>
<textarea class="form-input" id="contact-message" name="message" required></textarea>
</div>
</div>
</div>
<p style="font-size:13px;color:#6b7280;margin:12px 0 20px;">By submitting, you agree I may contact you about your inquiry. You can unsubscribe from marketing email anytime. Protected by reCAPTCHA.</p>
<button class="button button-primary button-winona" type="submit">Send message</button>
</form>
</div>
</div>
</div>
</section>
<footer class="section footer-advanced bg-gray-700">
<div class="footer-advanced-main">
<div class="container">
<div class="row row-50">
<div class="col-lg-6">
<div class="footer-brand-row"><img src="brand/exit_logo.png" alt="EXIT Realty"><div><h5 class="font-weight-bold text-uppercase text-white" style="margin:0">Monica Dhillon</h5><span style="color:#7dd3da;font-size:12px">MKDRealtor.com · EXIT Realty Redefined</span></div></div>
<p class="footer-advanced-text">Local expertise, clear communication, and a marketing platform built to bring serious buyers and sellers to you — not to a generic campaign factory.</p>
</div>
<div class="col-lg-6">
<h5 class="font-weight-bold text-uppercase text-white">Navigate</h5>
<ul class="list-marked list-marked-sm">
<li><a href="public-home.html">Home</a></li>
<li><a href="public-about.html">About</a></li>
<li><a href="public-contact.html">Contact</a></li>
<li><a href="portal-login.html">Realtor portal</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="footer-advanced-aside">
<div class="container">
<div class="footer-advanced-layout"><a class="brand" href="public-home.html"><img src="brand/exit_logo.png" alt="EXIT Realty · Monica Dhillon" width="151" height="44"/></a>
<p class="rights"><span>&copy;&nbsp;</span><span>2026&nbsp;</span><span>Monica Dhillon · MKDRealtor.com</span><span>.&nbsp;</span><a href="public-unsubscribe.html">Email preferences</a></p>
</div>
</div>
</div>
</footer>
</div>
<script src="js/core.min.js"></script>
<script src="js/script.js"></script>
</body>
</html>
+165
View File
@@ -0,0 +1,165 @@
<!DOCTYPE html>
<html class="wide wow-animation" lang="en">
<head>
<title>Home · Monica Dhillon</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="brand/favicon-32.png" type="image/x-icon">
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700,800%7CPoppins:300,400,700">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/fonts.css">
<link rel="stylesheet" href="css/style.css" id="main-styles-link">
<link rel="stylesheet" href="proposal.css">
</head>
<body>
<div class="proposal-banner">
<div><span class="tag">Proposal mockup</span> &nbsp; MKDRealtor.com — UX examples (not production)</div>
<div><a href="index.html">All screens</a></div>
</div>
<div class="page">
<header class="section page-header">
<div class="rd-navbar-wrap">
<nav class="rd-navbar rd-navbar-corporate" data-layout="rd-navbar-fixed" data-sm-layout="rd-navbar-fixed" data-md-layout="rd-navbar-fixed" data-md-device-layout="rd-navbar-fixed" data-lg-layout="rd-navbar-static" data-lg-device-layout="rd-navbar-static" data-lg-stick-up="true" data-lg-stick-up-offset="118px" data-xl-layout="rd-navbar-static" data-xl-device-layout="rd-navbar-static" data-xl-stick-up="true" data-xl-stick-up-offset="118px" data-xxl-layout="rd-navbar-static" data-xxl-device-layout="rd-navbar-static" data-xxl-stick-up-offset="118px" data-xxl-stick-up="true">
<div class="rd-navbar-aside-outer">
<div class="rd-navbar-aside">
<div class="rd-navbar-panel">
<button class="rd-navbar-toggle" data-rd-navbar-toggle="#rd-navbar-nav-wrap-1"><span></span></button>
<a class="rd-navbar-brand" href="public-home.html"><img src="brand/exit_logo.png" alt="EXIT Realty · Monica Dhillon" width="151" height="44"/></a>
</div>
<div class="rd-navbar-collapse">
<button class="rd-navbar-collapse-toggle rd-navbar-fixed-element-1" data-rd-navbar-toggle="#rd-navbar-collapse-content-1"><span></span></button>
<div class="rd-navbar-collapse-content" id="rd-navbar-collapse-content-1">
<article class="unit align-items-center">
<div class="unit-left"><span class="icon icon-md icon-modern mdi mdi-phone"></span></div>
<div class="unit-body"><a class="link-default" href="tel:+15551234567">(555) 123-4567</a></div>
</article>
<article class="unit align-items-center">
<div class="unit-left"><span class="icon icon-md icon-modern mdi mdi-map-marker"></span></div>
<div class="unit-body"><span class="link-default">Serving Greater Metro Area</span></div>
</article>
<a class="button button-gray-bordered button-winona" href="public-contact.html">Get in touch</a>
</div>
</div>
</div>
</div>
<div class="rd-navbar-main-outer">
<div class="rd-navbar-main">
<div class="rd-navbar-nav-wrap" id="rd-navbar-nav-wrap-1">
<ul class="rd-navbar-nav">
<li class="rd-nav-item active"><a class="rd-nav-link" href="public-home.html">Home</a></li>
<li class="rd-nav-item "><a class="rd-nav-link" href="public-about.html">About</a></li>
<li class="rd-nav-item "><a class="rd-nav-link" href="public-contact.html">Contact</a></li>
</ul>
</div>
</div>
</div>
</nav>
</div>
</header>
<div class="swiper-container swiper-slider swiper-slider-minimal" data-loop="true" data-slide-effect="fade" data-autoplay="false" data-simulate-touch="true">
<div class="swiper-wrapper">
<div class="swiper-slide" data-slide-bg="images/slider-minimal-slide-1-1920x968.jpg">
<div class="container">
<div class="jumbotron-classic-content">
<div class="wow-outer">
<div class="title-docor-text font-weight-bold title-decorated text-uppercase wow slideInLeft text-white">Monica Dhillon · MKDRealtor.com</div>
</div>
<h1 class="text-uppercase text-white font-weight-bold wow-outer"><span class="wow slideInDown" data-wow-delay=".2s">Your Home,<br>Guided Well</span></h1>
<p class="text-white wow-outer"><span class="wow slideInDown" data-wow-delay=".35s">EXIT Realty Redefined — buying or selling in the metro area with clear advice, strong marketing, and a team that answers the phone.</span></p>
<div class="wow-outer button-outer"><a class="button button-md button-primary button-winona wow slideInDown" href="public-contact.html" data-wow-delay=".4s">Start a conversation</a></div>
</div>
</div>
</div>
<div class="swiper-slide" data-slide-bg="images/slider-minimal-slide-2-1920x968.jpg">
<div class="container">
<div class="jumbotron-classic-content">
<div class="wow-outer">
<div class="title-docor-text font-weight-bold title-decorated text-uppercase wow slideInLeft text-white">Local Market Insight</div>
</div>
<h1 class="text-uppercase text-white font-weight-bold wow-outer"><span class="wow slideInDown" data-wow-delay=".2s">Sell With<br>Confidence</span></h1>
<p class="text-white wow-outer"><span class="wow slideInDown" data-wow-delay=".35s">Pricing strategy, staging guidance, and multi-channel outreach so the right buyers see your listing.</span></p>
<div class="wow-outer button-outer"><a class="button button-md button-primary button-winona wow slideInDown" href="public-about.html" data-wow-delay=".4s">Meet Monica</a></div>
</div>
</div>
</div>
</div>
<div class="swiper-pagination-outer container">
<div class="swiper-pagination swiper-pagination-primary"></div>
</div>
</div>
<section class="section section-lg">
<div class="container">
<div class="proposal-note"><strong>UX note:</strong> First viewport = brand + one headline + one CTA + full-bleed hero. No stats strip or card clutter in the hero.</div>
<h3 class="text-uppercase text-center wow-outer"><span class="wow slideInDown">How I can help</span></h3>
<div class="row row-50">
<div class="col-md-4 wow-outer">
<article class="box-chloe wow slideInUp">
<div class="box-chloe__icon linearicons-home-icon3"></div>
<div class="box-chloe__main">
<h4 class="box-chloe__title">Buyers</h4>
<p>Neighborhood tours, offer strategy, and negotiation that protects your timeline and budget.</p>
</div>
</article>
</div>
<div class="col-md-4 wow-outer">
<article class="box-chloe wow slideInUp" data-wow-delay=".05s">
<div class="box-chloe__icon linearicons-apartment"></div>
<div class="box-chloe__main">
<h4 class="box-chloe__title">Sellers</h4>
<p>Listing prep, professional marketing, and outreach across email, SMS, postcard, and social.</p>
</div>
</article>
</div>
<div class="col-md-4 wow-outer">
<article class="box-chloe wow slideInUp" data-wow-delay=".1s">
<div class="box-chloe__icon linearicons-chart-growth"></div>
<div class="box-chloe__main">
<h4 class="box-chloe__title">Market guidance</h4>
<p>Honest comps and timing advice — whether you move this season or plan ahead.</p>
</div>
</article>
</div>
</div>
</div>
</section>
<section class="section section-lg bg-gray-100 text-center">
<div class="container">
<h3 class="text-uppercase wow-outer"><span class="wow slideInUp">Ready when you are</span></h3>
<p class="wow-outer"><span class="text-width-1 wow slideInDown">Tell me what you are looking for. I will follow up personally — your message becomes a lead in my private portal.</span></p>
<a class="button button-lg button-primary button-winona" href="public-contact.html">Contact Monica</a>
</div>
</section>
<footer class="section footer-advanced bg-gray-700">
<div class="footer-advanced-main">
<div class="container">
<div class="row row-50">
<div class="col-lg-6">
<div class="footer-brand-row"><img src="brand/exit_logo.png" alt="EXIT Realty"><div><h5 class="font-weight-bold text-uppercase text-white" style="margin:0">Monica Dhillon</h5><span style="color:#7dd3da;font-size:12px">MKDRealtor.com · EXIT Realty Redefined</span></div></div>
<p class="footer-advanced-text">Local expertise, clear communication, and a marketing platform built to bring serious buyers and sellers to you — not to a generic campaign factory.</p>
</div>
<div class="col-lg-6">
<h5 class="font-weight-bold text-uppercase text-white">Navigate</h5>
<ul class="list-marked list-marked-sm">
<li><a href="public-home.html">Home</a></li>
<li><a href="public-about.html">About</a></li>
<li><a href="public-contact.html">Contact</a></li>
<li><a href="portal-login.html">Realtor portal</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="footer-advanced-aside">
<div class="container">
<div class="footer-advanced-layout"><a class="brand" href="public-home.html"><img src="brand/exit_logo.png" alt="EXIT Realty · Monica Dhillon" width="151" height="44"/></a>
<p class="rights"><span>&copy;&nbsp;</span><span>2026&nbsp;</span><span>Monica Dhillon · MKDRealtor.com</span><span>.&nbsp;</span><a href="public-unsubscribe.html">Email preferences</a></p>
</div>
</div>
</div>
</footer>
</div>
<script src="js/core.min.js"></script>
<script src="js/script.js"></script>
</body>
</html>
@@ -0,0 +1,64 @@
<!DOCTYPE html>
<html class="wide wow-animation" lang="en">
<head>
<title>Under construction · Monica Dhillon</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="brand/favicon-32.png" type="image/x-icon">
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700,800%7CPoppins:300,400,700">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/fonts.css">
<link rel="stylesheet" href="css/style.css" id="main-styles-link">
<link rel="stylesheet" href="proposal.css">
</head>
<body>
<div class="proposal-banner">
<div><span class="tag">Proposal mockup</span> &nbsp; MKDRealtor.com — UX examples (not production)</div>
<div><a href="index.html">All screens</a></div>
</div>
<div class="page">
<section class="section section-single bg-gray-800 primary-overlay" style="background-image: url(images/bg-image-4.jpg);">
<div class="section-single-inner">
<div class="section-single-dummy"></div>
<div class="section-single-main">
<div class="container">
<div class="row row-30 justify-content-center justify-content-sm-start">
<div class="col-sm-10 col-md-9 col-lg-7 col-xl-6">
<div class="proposal-note" style="margin-bottom:20px">
<strong>UX note:</strong> Holding page for maintenance or pre-launch. Optional notify list; still offers a way to reach Monica.
</div>
<h6 class="title-decorated title-decorated-lg">Were getting ready to launch</h6>
<p>Monica Dhillon · MKDRealtor.coms new site is almost here. Leave your email and Ill let you know when its live — or reach out now if you need help buying or selling.</p>
<div class="rd-mailform-wrap">
<form class="rd-form form-inline" action="#" method="post" onsubmit="alert('Mockup only — would store a notify-me Contact.'); return false;">
<div class="form-wrap">
<input class="form-input" id="subscribe-form-1-email" type="email" name="email" required>
<label class="form-label" for="subscribe-form-1-email">Your e-mail</label>
</div>
<div class="form-button">
<button class="button button-primary button-winona" type="submit">Notify me</button>
</div>
</form>
</div>
<p style="margin-top:20px">
<a class="button button-default-outline button-winona" href="public-contact.html">Contact Monica now</a>
</p>
</div>
</div>
</div>
</div>
<div class="footer-minimal section-single-footer">
<div class="container">
<div class="footer-minimal-inner">
<a class="brand" href="public-home.html"><img src="brand/exit_logo.png" alt="EXIT Realty · Monica Dhillon" width="151" height="44"/></a>
<p class="rights"><span>&copy;&nbsp;</span><span>2026</span><span>&nbsp;</span><span>Monica Dhillon · MKDRealtor.com</span><span>&nbsp;·&nbsp;</span><a href="tel:+15551234567">(555) 123-4567</a></p>
</div>
</div>
</div>
</div>
</section>
</div>
<script src="js/core.min.js"></script>
<script src="js/script.js"></script>
</body>
</html>
+113
View File
@@ -0,0 +1,113 @@
<!DOCTYPE html>
<html class="wide wow-animation" lang="en">
<head>
<title>Email preferences · Monica Dhillon</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="brand/favicon-32.png" type="image/x-icon">
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700,800%7CPoppins:300,400,700">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/fonts.css">
<link rel="stylesheet" href="css/style.css" id="main-styles-link">
<link rel="stylesheet" href="proposal.css">
</head>
<body>
<div class="proposal-banner">
<div><span class="tag">Proposal mockup</span> &nbsp; MKDRealtor.com — UX examples (not production)</div>
<div><a href="index.html">All screens</a></div>
</div>
<div class="page">
<header class="section page-header">
<div class="rd-navbar-wrap">
<nav class="rd-navbar rd-navbar-corporate" data-layout="rd-navbar-fixed" data-sm-layout="rd-navbar-fixed" data-md-layout="rd-navbar-fixed" data-md-device-layout="rd-navbar-fixed" data-lg-layout="rd-navbar-static" data-lg-device-layout="rd-navbar-static" data-lg-stick-up="true" data-lg-stick-up-offset="118px" data-xl-layout="rd-navbar-static" data-xl-device-layout="rd-navbar-static" data-xl-stick-up="true" data-xl-stick-up-offset="118px" data-xxl-layout="rd-navbar-static" data-xxl-device-layout="rd-navbar-static" data-xxl-stick-up-offset="118px" data-xxl-stick-up="true">
<div class="rd-navbar-aside-outer">
<div class="rd-navbar-aside">
<div class="rd-navbar-panel">
<button class="rd-navbar-toggle" data-rd-navbar-toggle="#rd-navbar-nav-wrap-1"><span></span></button>
<a class="rd-navbar-brand" href="public-home.html"><img src="brand/exit_logo.png" alt="EXIT Realty · Monica Dhillon" width="151" height="44"/></a>
</div>
<div class="rd-navbar-collapse">
<button class="rd-navbar-collapse-toggle rd-navbar-fixed-element-1" data-rd-navbar-toggle="#rd-navbar-collapse-content-1"><span></span></button>
<div class="rd-navbar-collapse-content" id="rd-navbar-collapse-content-1">
<article class="unit align-items-center">
<div class="unit-left"><span class="icon icon-md icon-modern mdi mdi-phone"></span></div>
<div class="unit-body"><a class="link-default" href="tel:+15551234567">(555) 123-4567</a></div>
</article>
<article class="unit align-items-center">
<div class="unit-left"><span class="icon icon-md icon-modern mdi mdi-map-marker"></span></div>
<div class="unit-body"><span class="link-default">Serving Greater Metro Area</span></div>
</article>
<a class="button button-gray-bordered button-winona" href="public-contact.html">Get in touch</a>
</div>
</div>
</div>
</div>
<div class="rd-navbar-main-outer">
<div class="rd-navbar-main">
<div class="rd-navbar-nav-wrap" id="rd-navbar-nav-wrap-1">
<ul class="rd-navbar-nav">
<li class="rd-nav-item "><a class="rd-nav-link" href="public-home.html">Home</a></li>
<li class="rd-nav-item "><a class="rd-nav-link" href="public-about.html">About</a></li>
<li class="rd-nav-item "><a class="rd-nav-link" href="public-contact.html">Contact</a></li>
</ul>
</div>
</div>
</div>
</nav>
</div>
</header>
<section class="section section-lg">
<div class="container" style="max-width:560px;">
<div class="proposal-note"><strong>UX note:</strong> Signed-token one-click unsubscribe. Per-channel consent — opt out of email while keeping SMS if desired.</div>
<h3 class="text-uppercase">Email preferences</h3>
<p>You are subscribed as <strong>jordan.lee@example.com</strong>.</p>
<form onsubmit="alert('Mockup: would write ConsentRecord + Suppression.'); return false;">
<div class="form-wrap">
<label><input type="checkbox" checked> Email marketing</label>
</div>
<div class="form-wrap">
<label><input type="checkbox" checked> SMS updates</label>
</div>
<div class="form-wrap">
<label><input type="checkbox" checked> Postcard mailings</label>
</div>
<p style="font-size:13px;color:#6b7280;">SMS: reply STOP anytime. Changes take effect immediately.</p>
<button class="button button-primary button-winona" type="submit">Save preferences</button>
<button class="button button-gray-bordered button-winona" type="button" onclick="alert('Mockup: unsubscribe all channels')">Unsubscribe from all</button>
</form>
</div>
</section>
<footer class="section footer-advanced bg-gray-700">
<div class="footer-advanced-main">
<div class="container">
<div class="row row-50">
<div class="col-lg-6">
<div class="footer-brand-row"><img src="brand/exit_logo.png" alt="EXIT Realty"><div><h5 class="font-weight-bold text-uppercase text-white" style="margin:0">Monica Dhillon</h5><span style="color:#7dd3da;font-size:12px">MKDRealtor.com · EXIT Realty Redefined</span></div></div>
<p class="footer-advanced-text">Local expertise, clear communication, and a marketing platform built to bring serious buyers and sellers to you — not to a generic campaign factory.</p>
</div>
<div class="col-lg-6">
<h5 class="font-weight-bold text-uppercase text-white">Navigate</h5>
<ul class="list-marked list-marked-sm">
<li><a href="public-home.html">Home</a></li>
<li><a href="public-about.html">About</a></li>
<li><a href="public-contact.html">Contact</a></li>
<li><a href="portal-login.html">Realtor portal</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="footer-advanced-aside">
<div class="container">
<div class="footer-advanced-layout"><a class="brand" href="public-home.html"><img src="brand/exit_logo.png" alt="EXIT Realty · Monica Dhillon" width="151" height="44"/></a>
<p class="rights"><span>&copy;&nbsp;</span><span>2026&nbsp;</span><span>Monica Dhillon · MKDRealtor.com</span><span>.&nbsp;</span><a href="public-unsubscribe.html">Email preferences</a></p>
</div>
</div>
</div>
</footer>
</div>
<script src="js/core.min.js"></script>
<script src="js/script.js"></script>
</body>
</html>
@@ -0,0 +1 @@
,westfarn,ryan-development-1,15.07.2026 14:50,file:///home/westfarn/.config/libreoffice/4;
Binary file not shown.
Binary file not shown.

After

Width:  |  Height:  |  Size: 74 KiB

File diff suppressed because it is too large Load Diff
+100
View File
@@ -0,0 +1,100 @@
#!/usr/bin/env python3
"""Capture proposal/pages HTML mockups → powerpoint/screenshots/*.png
Requires Chromium and a local HTTP server (started automatically).
"""
from __future__ import annotations
import subprocess
import sys
import time
import urllib.request
from pathlib import Path
ROOT = Path(__file__).resolve().parent
PAGES = ROOT.parent / "pages"
SHOTS = ROOT / "screenshots"
PORT = 8765
PAGES_LIST = [
"index.html",
"public-home.html",
"public-about.html",
"public-contact.html",
"public-unsubscribe.html",
"public-404.html",
"public-under-construction.html",
"portal-login.html",
"portal-dashboard.html",
"portal-leads.html",
"portal-lead-detail.html",
"portal-analytics.html",
"portal-contacts.html",
"portal-contacts-import.html",
"portal-campaign.html",
"portal-campaign-report.html",
"portal-postcard-designer.html",
"portal-social.html",
"portal-social-accounts.html",
]
def find_chromium() -> str:
for candidate in ("chromium", "google-chrome", "google-chrome-stable", "/snap/bin/chromium"):
path = Path(candidate) if candidate.startswith("/") else None
if path and path.exists():
return str(path)
found = subprocess.run(["which", candidate], capture_output=True, text=True)
if found.returncode == 0 and found.stdout.strip():
return found.stdout.strip()
raise SystemExit("Chromium/Chrome not found")
def main() -> None:
SHOTS.mkdir(parents=True, exist_ok=True)
chromium = find_chromium()
server = subprocess.Popen(
[sys.executable, "-m", "http.server", str(PORT)],
cwd=str(PAGES),
stdout=subprocess.DEVNULL,
stderr=subprocess.DEVNULL,
)
try:
for _ in range(30):
try:
urllib.request.urlopen(f"http://127.0.0.1:{PORT}/index.html", timeout=1)
break
except Exception:
time.sleep(0.2)
else:
raise SystemExit("HTTP server failed to start")
for page in PAGES_LIST:
stem = page.removesuffix(".html")
out = SHOTS / f"{stem}.png"
url = f"http://127.0.0.1:{PORT}/{page}"
print(f"screenshot {page}{out.name}")
subprocess.run(
[
chromium,
"--headless=new",
"--disable-gpu",
"--no-sandbox",
"--hide-scrollbars",
"--window-size=1440,900",
f"--virtual-time-budget=5000",
f"--screenshot={out}",
url,
],
check=True,
capture_output=True,
)
print(f"Done: {len(PAGES_LIST)} screenshots in {SHOTS}")
finally:
server.terminate()
server.wait(timeout=5)
if __name__ == "__main__":
main()
Binary file not shown.

After

Width:  |  Height:  |  Size: 2.5 KiB

+3
View File
@@ -0,0 +1,3 @@
python-pptx>=1.0.2
lxml>=5.0
Pillow>=10.0
Binary file not shown.

After

Width:  |  Height:  |  Size: 233 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 87 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 124 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 116 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 135 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 80 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 88 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 105 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 88 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 276 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 224 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 130 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 199 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 843 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 552 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 741 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.5 MiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 79 KiB

+1
View File
@@ -0,0 +1 @@
http://documentation.zemez.io/html/bootstrap/v1-4/
+67
View File
@@ -0,0 +1,67 @@
<!DOCTYPE html>
<html class="wide wow-animation" lang="en">
<head>
<title>404 Page</title>
<meta name="format-detection" content="telephone=no">
<meta name="viewport" content="width=device-width height=device-height initial-scale=1.0 maximum-scale=1.0 user-scalable=0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta charset="utf-8">
<link rel="icon" href="images/favicon.ico" type="image/x-icon">
<!-- Stylesheets-->
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700,800%7CPoppins:300,400,700">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/fonts.css">
<link rel="stylesheet" href="css/style.css" id="main-styles-link">
<!--[if lt IE 10]>
<div style="background: #212121; padding: 10px 0; box-shadow: 3px 3px 5px 0 rgba(0,0,0,.3); clear: both; text-align:center; position: relative; z-index:1;"><a href="http://windows.microsoft.com/en-US/internet-explorer/"><img src="images/ie8-panel/warning_bar_0000_us.jpg" border="0" height="42" width="820" alt="You are using an outdated browser. For a faster, safer browsing experience, upgrade for free today."></a></div>
<script src="js/html5shiv.min.js"></script>
<![endif]-->
</head>
<body>
<div class="page">
<!-- Page content-->
<section class="section section-single bg-gray-800 primary-overlay" style="background-image: url(images/bg-image-7.jpg);">
<div class="section-single-inner">
<div class="section-single-dummy"></div>
<div class="section-single-main">
<div class="container">
<div class="row row-30">
<div class="col-sm-6 text-center text-sm-left">
<p class="text-extra-large">404</p>
</div>
<div class="col-sm-6">
<div class="section-single-main-content">
<h6 class="title-decorated title-decorated-lg">Page was not found</h6>
<p><span class="text-width-2">You may have mistyped the address or the page may have moved.</span></p><a class="button button-lg button-primary button-winona" href="index.html">Back to home page</a>
</div>
</div>
</div>
</div>
</div>
<div class="footer-minimal section-single-footer">
<div class="container">
<div class="footer-minimal-inner"><a class="brand" href="index.html"><img src="images/logo-inverse-151x44.png" alt="" width="151" height="44" srcset="images/logo-inverse-151x44.png 2x"/></a>
<!-- Rights-->
<p class="rights"><span>&copy;&nbsp;</span><span class="copyright-year"></span><span>&nbsp;</span><span>All Rights Reserved.</span><span>&nbsp;</span><br class="d-sm-none"/><a href="#">Terms of Use</a><span> and</span><span>&nbsp;</span><a href="privacy-policy.html">Privacy Policy</a></p>
</div>
</div>
</div>
</div>
</section>
</div>
<div class="preloader">
<div class="preloader-logo"><img src="images/logo-default-151x44.png" alt="" width="151" height="44" srcset="images/logo-default-151x44.png 2x"/>
</div>
<div class="preloader-body">
<div id="loadingProgressG">
<div class="loadingProgressG" id="loadingProgressG_1"></div>
</div>
</div>
</div>
<!-- Global Mailform Output-->
<div class="snackbars" id="form-output-global"></div>
<!-- Javascript-->
<script src="js/core.min.js"></script>
<script src="js/script.js"></script>
</body>
</html>
+67
View File
@@ -0,0 +1,67 @@
<!DOCTYPE html>
<html class="wide wow-animation" lang="en">
<head>
<title>503 Page</title>
<meta name="format-detection" content="telephone=no">
<meta name="viewport" content="width=device-width height=device-height initial-scale=1.0 maximum-scale=1.0 user-scalable=0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta charset="utf-8">
<link rel="icon" href="images/favicon.ico" type="image/x-icon">
<!-- Stylesheets-->
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700,800%7CPoppins:300,400,700">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/fonts.css">
<link rel="stylesheet" href="css/style.css" id="main-styles-link">
<!--[if lt IE 10]>
<div style="background: #212121; padding: 10px 0; box-shadow: 3px 3px 5px 0 rgba(0,0,0,.3); clear: both; text-align:center; position: relative; z-index:1;"><a href="http://windows.microsoft.com/en-US/internet-explorer/"><img src="images/ie8-panel/warning_bar_0000_us.jpg" border="0" height="42" width="820" alt="You are using an outdated browser. For a faster, safer browsing experience, upgrade for free today."></a></div>
<script src="js/html5shiv.min.js"></script>
<![endif]-->
</head>
<body>
<div class="page">
<!-- Page content-->
<section class="section section-single bg-gray-800 primary-overlay" style="background-image: url(images/bg-image-6.jpg);">
<div class="section-single-inner">
<div class="section-single-dummy"></div>
<div class="section-single-main">
<div class="container">
<div class="row row-30">
<div class="col-sm-6 text-center text-sm-left">
<p class="text-extra-large">503</p>
</div>
<div class="col-sm-6">
<div class="section-single-main-content">
<h6 class="title-decorated title-decorated-lg">Service is temporary unavailable</h6>
<p>Sorry, we're offline right now to make our site even better.<br>Please, come back later and check what we've been up to.</p><a class="button button-lg button-primary button-winona" href="index.html">Back to home page</a>
</div>
</div>
</div>
</div>
</div>
<div class="footer-minimal section-single-footer">
<div class="container">
<div class="footer-minimal-inner"><a class="brand" href="index.html"><img src="images/logo-inverse-151x44.png" alt="" width="151" height="44" srcset="images/logo-inverse-151x44.png 2x"/></a>
<!-- Rights-->
<p class="rights"><span>&copy;&nbsp;</span><span class="copyright-year"></span><span>&nbsp;</span><span>All Rights Reserved.</span><span>&nbsp;</span><br class="d-sm-none"/><a href="#">Terms of Use</a><span> and</span><span>&nbsp;</span><a href="privacy-policy.html">Privacy Policy</a></p>
</div>
</div>
</div>
</div>
</section>
</div>
<div class="preloader">
<div class="preloader-logo"><img src="images/logo-default-151x44.png" alt="" width="151" height="44" srcset="images/logo-default-151x44.png 2x"/>
</div>
<div class="preloader-body">
<div id="loadingProgressG">
<div class="loadingProgressG" id="loadingProgressG_1"></div>
</div>
</div>
</div>
<!-- Global Mailform Output-->
<div class="snackbars" id="form-output-global"></div>
<!-- Javascript-->
<script src="js/core.min.js"></script>
<script src="js/script.js"></script>
</body>
</html>
+388
View File
@@ -0,0 +1,388 @@
<!DOCTYPE html>
<html class="wide wow-animation" lang="en">
<head>
<title>About us</title>
<meta name="format-detection" content="telephone=no">
<meta name="viewport" content="width=device-width height=device-height initial-scale=1.0 maximum-scale=1.0 user-scalable=0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta charset="utf-8">
<link rel="icon" href="images/favicon.ico" type="image/x-icon">
<!-- Stylesheets-->
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700,800%7CPoppins:300,400,700">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/fonts.css">
<link rel="stylesheet" href="css/style.css" id="main-styles-link">
<!--[if lt IE 10]>
<div style="background: #212121; padding: 10px 0; box-shadow: 3px 3px 5px 0 rgba(0,0,0,.3); clear: both; text-align:center; position: relative; z-index:1;"><a href="http://windows.microsoft.com/en-US/internet-explorer/"><img src="images/ie8-panel/warning_bar_0000_us.jpg" border="0" height="42" width="820" alt="You are using an outdated browser. For a faster, safer browsing experience, upgrade for free today."></a></div>
<script src="js/html5shiv.min.js"></script>
<![endif]-->
</head>
<body>
<div class="page">
<!-- Page Header-->
<header class="section page-header">
<!-- RD Navbar-->
<div class="rd-navbar-wrap">
<nav class="rd-navbar rd-navbar-corporate" data-layout="rd-navbar-fixed" data-sm-layout="rd-navbar-fixed" data-md-layout="rd-navbar-fixed" data-md-device-layout="rd-navbar-fixed" data-lg-layout="rd-navbar-static" data-lg-device-layout="rd-navbar-static" data-lg-stick-up="true" data-lg-stick-up-offset="118px" data-xl-layout="rd-navbar-static" data-xl-device-layout="rd-navbar-static" data-xl-stick-up="true" data-xl-stick-up-offset="118px" data-xxl-layout="rd-navbar-static" data-xxl-device-layout="rd-navbar-static" data-xxl-stick-up-offset="118px" data-xxl-stick-up="true">
<div class="rd-navbar-aside-outer">
<div class="rd-navbar-aside">
<!-- RD Navbar Panel-->
<div class="rd-navbar-panel">
<!-- RD Navbar Toggle-->
<button class="rd-navbar-toggle" data-rd-navbar-toggle="#rd-navbar-nav-wrap-1"><span></span></button>
<!-- RD Navbar Brand--><a class="rd-navbar-brand" href="index.html"><img src="images/logo-default-151x44.png" alt="" width="151" height="44" srcset="images/logo-default-151x44.png 2x"/></a>
</div>
<div class="rd-navbar-collapse">
<button class="rd-navbar-collapse-toggle rd-navbar-fixed-element-1" data-rd-navbar-toggle="#rd-navbar-collapse-content-1"><span></span></button>
<div class="rd-navbar-collapse-content" id="rd-navbar-collapse-content-1">
<article class="unit align-items-center">
<div class="unit-left"><span class="icon icon-md icon-modern mdi mdi-phone"></span></div>
<div class="unit-body">
<ul class="list-0">
<li><a class="link-default" href="tel:#">1-800-1234-567</a></li>
<li><a class="link-default" href="tel:#">1-800-8763-765</a></li>
</ul>
</div>
</article>
<article class="unit align-items-center">
<div class="unit-left"><span class="icon icon-md icon-modern mdi mdi-map-marker"></span></div>
<div class="unit-body"><a class="link-default" href="tel:#">2130 Fulton Street <br> San Diego, CA 94117-1080</a></div>
</article><a class="button button-gray-bordered button-winona" href="#">Request a call</a>
</div>
</div>
</div>
</div>
<div class="rd-navbar-main-outer">
<div class="rd-navbar-main">
<div class="rd-navbar-nav-wrap" id="rd-navbar-nav-wrap-1">
<!-- RD Navbar Search-->
<div class="rd-navbar-search" id="rd-navbar-search-1">
<button class="rd-navbar-search-toggle" data-rd-navbar-toggle="#rd-navbar-search-1"><span></span></button>
<form class="rd-search" action="search-results.html" data-search-live="rd-search-results-live-1" method="GET">
<div class="form-wrap">
<label class="form-label" for="rd-navbar-search-form-input-1">Search...</label>
<input class="form-input rd-navbar-search-form-input" id="rd-navbar-search-form-input-1" type="text" name="s" autocomplete="off">
<div class="rd-search-results-live" id="rd-search-results-live-1"></div>
</div>
<button class="rd-search-form-submit fa-search" type="submit"></button>
</form>
</div>
<!-- RD Navbar Nav-->
<ul class="rd-navbar-nav">
<li class="rd-nav-item"><a class="rd-nav-link" href="index.html">Home</a>
</li>
<li class="rd-nav-item active"><a class="rd-nav-link" href="about-us.html">About us</a>
<!-- RD Navbar Dropdown-->
<ul class="rd-menu rd-navbar-dropdown">
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="our-team.html">Our Team</a></li>
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="testimonials.html">Testimonials</a></li>
</ul>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="properties.html">Properties</a>
<!-- RD Navbar Dropdown-->
<ul class="rd-menu rd-navbar-dropdown">
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="single-property.html">Single Property</a></li>
</ul>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="#">Blog</a>
<!-- RD Navbar Dropdown-->
<ul class="rd-menu rd-navbar-dropdown">
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="grid-blog.html">Grid Blog</a></li>
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="sidebar-blog.html">Sidebar Blog</a></li>
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="single-blog-post.html">Single Blog Post</a></li>
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="blog-layouts.html">Blog Layouts</a></li>
</ul>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="#">Pages</a>
<!-- RD Navbar Megamenu-->
<ul class="rd-menu rd-navbar-megamenu">
<li class="rd-megamenu-item">
<ul class="rd-megamenu-list">
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="typography.html">Typography</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="buttons.html">Buttons</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="forms.html">Forms</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="progress-bars.html">Progress bars</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="tabs.html">Tabs</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="tables.html">Tables</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="accordions.html">Accordions</a></li>
</ul>
</li>
<li class="rd-megamenu-item">
<ul class="rd-megamenu-list">
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="small-features.html">Small Features</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="large-features.html">Large Features</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="careers.html">Careers</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="search-results.html">Search results</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="single-job.html">Single Job</a></li>
</ul>
</li>
<li class="rd-megamenu-item">
<ul class="rd-megamenu-list">
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="404-page.html">404 Page</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="503-page.html">503 Page</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="coming-soon.html">Coming Soon</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="privacy-policy.html">Privacy policy</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="under-construction.html">Under Construction</a></li>
</ul>
</li>
</ul>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="contacts.html">Contacts</a>
</li>
</ul>
</div>
</div>
</div>
</nav>
</div>
</header>
<!-- Breadcrumbs -->
<section class="breadcrumbs-custom bg-image context-dark" style="background-image: url(images/breadcrumbs-image-1.jpg);">
<div class="breadcrumbs-custom-inner">
<div class="container breadcrumbs-custom-container">
<div class="breadcrumbs-custom-main">
<h6 class="breadcrumbs-custom-subtitle title-decorated">About us</h6>
<h2 class="text-uppercase breadcrumbs-custom-title">About us</h2>
</div>
<ul class="breadcrumbs-custom-path">
<li><a href="index.html">Home</a></li>
<li class="active">About us</li>
</ul>
</div>
</div>
</section>
<!-- Working at CaseCraft-->
<section class="section section-lg">
<div class="container">
<div class="row row-50 justify-content-center justify-content-lg-between flex-lg-row-reverse">
<div class="col-md-10 col-lg-6 col-xl-5">
<h3 class="text-uppercase">Who We Are</h3>
<p class="about-subtitle">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostru eiusmod tempor incididunt ut labore et.</p><a class="button button-lg button-primary button-winona" href="about-us.html">View properties</a>
</div>
<div class="col-md-10 col-lg-6 col-xl-6"><img class="img-responsive" src="images/careers-1-570x388.jpg" alt="" width="570" height="388"/>
</div>
</div>
</div>
</section>
<!-- Advantages and Achievements-->
<section class="section section-md text-center bg-gray-100">
<div class="container">
<h3 class="text-uppercase wow-outer"><span class="wow slideInUp">Why people Choose Us</span></h3>
<p class="wow-outer"><span class="text-width-1 wow slideInDown">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</span></p>
<div class="row row-50">
<div class="col-6 col-md-3 wow-outer">
<!-- Counter Minimal-->
<article class="counter-minimal wow slideInUp" data-wow-delay=".1s">
<div class="counter-minimal-icon box-chloe__icon linearicons-users2"></div>
<div class="counter-minimal-main">
<div class="counter">12</div>
</div>
<h5 class="counter-minimal-title">National Partners</h5>
</article>
</div>
<div class="col-6 col-md-3 wow-outer">
<!-- Counter Minimal-->
<article class="counter-minimal wow slideInUp" data-wow-delay=".1s">
<div class="counter-minimal-icon box-chloe__icon linearicons-home-icon3"></div>
<div class="counter-minimal-main">
<div class="counter">238</div>
</div>
<h5 class="counter-minimal-title">Properties</h5>
</article>
</div>
<div class="col-6 col-md-3 wow-outer">
<!-- Counter Minimal-->
<article class="counter-minimal wow slideInUp" data-wow-delay=".1s">
<div class="counter-minimal-icon box-chloe__icon linearicons-star"></div>
<div class="counter-minimal-main">
<div class="counter">19</div>
</div>
<h5 class="counter-minimal-title">Years of Experience</h5>
</article>
</div>
<div class="col-6 col-md-3 wow-outer">
<!-- Counter Minimal-->
<article class="counter-minimal wow slideInUp" data-wow-delay=".1s">
<div class="counter-minimal-icon box-chloe__icon linearicons-apartment"></div>
<div class="counter-minimal-main">
<div class="counter">54</div>
</div>
<h5 class="counter-minimal-title">Qualified Brokers</h5>
</article>
</div>
</div>
</div>
</section>
<section class="section section-lg text-center">
<div class="container">
<h3 class="text-uppercase wow-outer"><span class="wow slideInUp">Our Team</span></h3>
<div class="row row-50 row-xxl-70 justify-content-center justify-content-lg-start">
<div class="col-md-10 col-lg-6 wow-outer">
<!-- Profile Creative-->
<article class="profile-creative wow slideInLeft">
<figure class="profile-creative-figure"><img class="profile-creative-image" src="images/team-1-270x273.jpg" alt="" width="270" height="273"/>
</figure>
<div class="profile-creative-main">
<h5 class="profile-creative-title"><a href="#">Nathalie Porter</a></h5>
<p class="profile-creative-position">Founder, Broker</p>
<div class="profile-creative-contacts">
<div class="object-inline"><span class="icon icon-md mdi mdi-phone"></span><a href="tel:#">1-800-1324-567</a></div>
</div>
<p>Ms. Porter founded our company in 1989 with a vision to help guests and residents of the USA to easily find and buy or rent real estate in all 50 states.</p>
</div>
</article>
</div>
<div class="col-md-10 col-lg-6 wow-outer">
<!-- Profile Creative-->
<article class="profile-creative wow slideInLeft" data-wow-delay=".2s">
<figure class="profile-creative-figure"><img class="profile-creative-image" src="images/team-2-270x273.jpg" alt="" width="270" height="273"/>
</figure>
<div class="profile-creative-main">
<h5 class="profile-creative-title"><a href="#">John Thompson</a></h5>
<p class="profile-creative-position">Sales Associate</p>
<div class="profile-creative-contacts">
<div class="object-inline"><span class="icon icon-md mdi mdi-phone"></span><a href="tel:#">1-800-1324-567</a></div>
</div>
<p>John has been in sales and marketing for the past 15 years. He has excellent knowledge about the local market both residential and commercial.</p>
</div>
</article>
</div>
<div class="col-md-10 col-lg-6 wow-outer">
<!-- Profile Creative-->
<article class="profile-creative wow slideInLeft">
<figure class="profile-creative-figure"><img class="profile-creative-image" src="images/team-3-270x273.jpg" alt="" width="270" height="273"/>
</figure>
<div class="profile-creative-main">
<h5 class="profile-creative-title"><a href="#">Brian Payne</a></h5>
<p class="profile-creative-position">Realtor</p>
<div class="profile-creative-contacts">
<div class="object-inline"><span class="icon icon-md mdi mdi-phone"></span><a href="tel:#">1-800-1324-567</a></div>
</div>
<p>Brian is not only a Licensed Realtor but also holds the Title Producers and Mortgage Licenses, which makes him a very knowledgeable real estate expert.</p>
</div>
</article>
</div>
<div class="col-md-10 col-lg-6 wow-outer">
<!-- Profile Creative-->
<article class="profile-creative wow slideInLeft" data-wow-delay=".2s">
<figure class="profile-creative-figure"><img class="profile-creative-image" src="images/team-4-270x273.jpg" alt="" width="270" height="273"/>
</figure>
<div class="profile-creative-main">
<h5 class="profile-creative-title"><a href="#">Marie Fernandez</a></h5>
<p class="profile-creative-position">Broker</p>
<div class="profile-creative-contacts">
<div class="object-inline"><span class="icon icon-md mdi mdi-phone"></span><a href="tel:#">1-800-1324-567</a></div>
</div>
<p>Maries goal is to provide clients with the highest level of marketing expertise and customer service to help them reach their uppermost real estate goals.</p>
</div>
</article>
</div>
</div>
</div>
</section>
<!-- Page Footer-->
<footer class="section footer-advanced bg-gray-700">
<div class="footer-advanced-main">
<div class="container">
<div class="row row-50">
<div class="col-lg-4">
<h5 class="font-weight-bold text-uppercase text-white">About Us</h5>
<p class="footer-advanced-text">inHouse is the largest full-service real estate and property management company. We offer expertise in the marketing and sale of a wide range of properties, including residential real estate, farms and lifestyle blocks, as well as commercial and industrial properties that we hope may interest you.</p>
</div>
<div class="col-sm-7 col-md-5 col-lg-4">
<h5 class="font-weight-bold text-uppercase text-white">Recent Blog Posts</h5>
<!-- Post Inline-->
<article class="post-inline">
<p class="post-inline-title"><a href="single-blog-post.html">Real Estate Guide: 7 Important Tips for Buying a Home</a></p>
<ul class="post-inline-meta">
<li>by Mike Barnes</li>
<li><a href="single-blog-post.html">2 days ago</a></li>
</ul>
</article>
<!-- Post Inline-->
<article class="post-inline">
<p class="post-inline-title"><a href="single-blog-post.html">Single-Family Homes as a Housing Option for Young Families</a></p>
<ul class="post-inline-meta">
<li>by Mike Barnes</li>
<li><a href="single-blog-post.html">2 days ago</a></li>
</ul>
</article>
</div>
<div class="col-sm-5 col-md-7 col-lg-4">
<h5 class="font-weight-bold text-uppercase text-white">Gallery</h5>
<div class="row row-x-10" data-lightgallery="group">
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-1.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-1-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-2.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-2-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-3.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-3-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-4.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-4-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-5.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-5-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-6.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-6-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"> </div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-7.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-7-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-8.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-8-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
</div>
</div>
</div>
</div>
</div>
<div class="footer-advanced-aside">
<div class="container">
<div class="footer-advanced-layout">
<div>
<ul class="list-nav">
<li><a href="index.html">Home</a></li>
<li><a href="about-us.html">About</a></li>
<li><a href="properties.html">Properties</a></li>
<li><a href="grid-blog.html">Blog</a></li>
<li><a href="contacts.html">Contacts</a></li>
</ul>
</div>
<div>
<ul class="foter-social-links list-inline list-inline-md">
<li><a class="icon icon-sm link-default mdi mdi-facebook" href="#"></a></li>
<li><a class="icon icon-sm link-default mdi mdi-twitter" href="#"></a></li>
<li><a class="icon icon-sm link-default mdi mdi-instagram" href="#"></a></li>
<li><a class="icon icon-sm link-default mdi mdi-google" href="#"></a></li>
<li><a class="icon icon-sm link-default mdi mdi-linkedin" href="#"></a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="container">
<hr>
</div>
<div class="footer-advanced-aside">
<div class="container">
<div class="footer-advanced-layout"><a class="brand" href="index.html"><img src="images/logo-light-115x34.png" alt="" width="115" height="34" srcset="images/logo-light-115x34.png 2x"/></a>
<!-- Rights-->
<p class="rights"><span>&copy;&nbsp;</span><span class="copyright-year"></span><span>&nbsp;</span><span>All Rights Reserved.</span><span>&nbsp;</span><br class="d-sm-none"/><a href="#">Terms of Use</a><span> and</span><span>&nbsp;</span><a href="privacy-policy.html">Privacy Policy</a></p>
</div>
</div>
</div>
</footer>
</div>
<div class="preloader">
<div class="preloader-logo"><img src="images/logo-default-151x44.png" alt="" width="151" height="44" srcset="images/logo-default-151x44.png 2x"/>
</div>
<div class="preloader-body">
<div id="loadingProgressG">
<div class="loadingProgressG" id="loadingProgressG_1"></div>
</div>
</div>
</div>
<!-- Global Mailform Output-->
<div class="snackbars" id="form-output-global"></div>
<!-- Javascript-->
<script src="js/core.min.js"></script>
<script src="js/script.js"></script>
</body>
</html>
+432
View File
@@ -0,0 +1,432 @@
<!DOCTYPE html>
<html class="wide wow-animation" lang="en">
<head>
<title>Accordions</title>
<meta name="format-detection" content="telephone=no">
<meta name="viewport" content="width=device-width height=device-height initial-scale=1.0 maximum-scale=1.0 user-scalable=0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta charset="utf-8">
<link rel="icon" href="images/favicon.ico" type="image/x-icon">
<!-- Stylesheets-->
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700,800%7CPoppins:300,400,700">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/fonts.css">
<link rel="stylesheet" href="css/style.css" id="main-styles-link">
<!--[if lt IE 10]>
<div style="background: #212121; padding: 10px 0; box-shadow: 3px 3px 5px 0 rgba(0,0,0,.3); clear: both; text-align:center; position: relative; z-index:1;"><a href="http://windows.microsoft.com/en-US/internet-explorer/"><img src="images/ie8-panel/warning_bar_0000_us.jpg" border="0" height="42" width="820" alt="You are using an outdated browser. For a faster, safer browsing experience, upgrade for free today."></a></div>
<script src="js/html5shiv.min.js"></script>
<![endif]-->
</head>
<body>
<div class="page">
<!-- Page Header-->
<header class="section page-header">
<!-- RD Navbar-->
<div class="rd-navbar-wrap">
<nav class="rd-navbar rd-navbar-corporate" data-layout="rd-navbar-fixed" data-sm-layout="rd-navbar-fixed" data-md-layout="rd-navbar-fixed" data-md-device-layout="rd-navbar-fixed" data-lg-layout="rd-navbar-static" data-lg-device-layout="rd-navbar-static" data-lg-stick-up="true" data-lg-stick-up-offset="118px" data-xl-layout="rd-navbar-static" data-xl-device-layout="rd-navbar-static" data-xl-stick-up="true" data-xl-stick-up-offset="118px" data-xxl-layout="rd-navbar-static" data-xxl-device-layout="rd-navbar-static" data-xxl-stick-up-offset="118px" data-xxl-stick-up="true">
<div class="rd-navbar-aside-outer">
<div class="rd-navbar-aside">
<!-- RD Navbar Panel-->
<div class="rd-navbar-panel">
<!-- RD Navbar Toggle-->
<button class="rd-navbar-toggle" data-rd-navbar-toggle="#rd-navbar-nav-wrap-1"><span></span></button>
<!-- RD Navbar Brand--><a class="rd-navbar-brand" href="index.html"><img src="images/logo-default-151x44.png" alt="" width="151" height="44" srcset="images/logo-default-151x44.png 2x"/></a>
</div>
<div class="rd-navbar-collapse">
<button class="rd-navbar-collapse-toggle rd-navbar-fixed-element-1" data-rd-navbar-toggle="#rd-navbar-collapse-content-1"><span></span></button>
<div class="rd-navbar-collapse-content" id="rd-navbar-collapse-content-1">
<article class="unit align-items-center">
<div class="unit-left"><span class="icon icon-md icon-modern mdi mdi-phone"></span></div>
<div class="unit-body">
<ul class="list-0">
<li><a class="link-default" href="tel:#">1-800-1234-567</a></li>
<li><a class="link-default" href="tel:#">1-800-8763-765</a></li>
</ul>
</div>
</article>
<article class="unit align-items-center">
<div class="unit-left"><span class="icon icon-md icon-modern mdi mdi-map-marker"></span></div>
<div class="unit-body"><a class="link-default" href="tel:#">2130 Fulton Street <br> San Diego, CA 94117-1080</a></div>
</article><a class="button button-gray-bordered button-winona" href="#">Request a call</a>
</div>
</div>
</div>
</div>
<div class="rd-navbar-main-outer">
<div class="rd-navbar-main">
<div class="rd-navbar-nav-wrap" id="rd-navbar-nav-wrap-1">
<!-- RD Navbar Search-->
<div class="rd-navbar-search" id="rd-navbar-search-1">
<button class="rd-navbar-search-toggle" data-rd-navbar-toggle="#rd-navbar-search-1"><span></span></button>
<form class="rd-search" action="search-results.html" data-search-live="rd-search-results-live-1" method="GET">
<div class="form-wrap">
<label class="form-label" for="rd-navbar-search-form-input-1">Search...</label>
<input class="form-input rd-navbar-search-form-input" id="rd-navbar-search-form-input-1" type="text" name="s" autocomplete="off">
<div class="rd-search-results-live" id="rd-search-results-live-1"></div>
</div>
<button class="rd-search-form-submit fa-search" type="submit"></button>
</form>
</div>
<!-- RD Navbar Nav-->
<ul class="rd-navbar-nav">
<li class="rd-nav-item"><a class="rd-nav-link" href="index.html">Home</a>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="about-us.html">About us</a>
<!-- RD Navbar Dropdown-->
<ul class="rd-menu rd-navbar-dropdown">
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="our-team.html">Our Team</a></li>
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="testimonials.html">Testimonials</a></li>
</ul>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="properties.html">Properties</a>
<!-- RD Navbar Dropdown-->
<ul class="rd-menu rd-navbar-dropdown">
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="single-property.html">Single Property</a></li>
</ul>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="#">Blog</a>
<!-- RD Navbar Dropdown-->
<ul class="rd-menu rd-navbar-dropdown">
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="grid-blog.html">Grid Blog</a></li>
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="sidebar-blog.html">Sidebar Blog</a></li>
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="single-blog-post.html">Single Blog Post</a></li>
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="blog-layouts.html">Blog Layouts</a></li>
</ul>
</li>
<li class="rd-nav-item active"><a class="rd-nav-link" href="#">Pages</a>
<!-- RD Navbar Megamenu-->
<ul class="rd-menu rd-navbar-megamenu">
<li class="rd-megamenu-item">
<ul class="rd-megamenu-list">
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="typography.html">Typography</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="buttons.html">Buttons</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="forms.html">Forms</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="progress-bars.html">Progress bars</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="tabs.html">Tabs</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="tables.html">Tables</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="accordions.html">Accordions</a></li>
</ul>
</li>
<li class="rd-megamenu-item">
<ul class="rd-megamenu-list">
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="small-features.html">Small Features</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="large-features.html">Large Features</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="careers.html">Careers</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="search-results.html">Search results</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="single-job.html">Single Job</a></li>
</ul>
</li>
<li class="rd-megamenu-item">
<ul class="rd-megamenu-list">
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="404-page.html">404 Page</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="503-page.html">503 Page</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="coming-soon.html">Coming Soon</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="privacy-policy.html">Privacy policy</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="under-construction.html">Under Construction</a></li>
</ul>
</li>
</ul>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="contacts.html">Contacts</a>
</li>
</ul>
</div>
</div>
</div>
</nav>
</div>
</header>
<!-- Breadcrumbs -->
<section class="breadcrumbs-custom bg-image context-dark" style="background-image: url(images/breadcrumbs-image-1.jpg);">
<div class="breadcrumbs-custom-inner">
<div class="container breadcrumbs-custom-container">
<div class="breadcrumbs-custom-main">
<h6 class="breadcrumbs-custom-subtitle title-decorated">Pages</h6>
<h2 class="text-uppercase breadcrumbs-custom-title">Accordions</h2>
</div>
<ul class="breadcrumbs-custom-path">
<li><a href="index.html">Home</a></li>
<li><a href="#">Pages</a></li>
<li class="active">Accordions</li>
</ul>
</div>
</div>
</section>
<!-- Accordion & skill bars-->
<section class="section section-lg">
<div class="container">
<h6>Accordion & skill bars</h6>
<div class="row row-50 justify-content-lg-between offset-top-1">
<div class="col-lg-7 col-xl-6">
<h3 class="wow-outer"><span class="wow slideInDown">Frequently Asked Questions</span></h3>
<!-- Bootstrap collapse-->
<div class="card-group-custom card-group-corporate wow-outer" id="accordion1" role="tablist" aria-multiselectable="false">
<!-- Bootstrap card-->
<article class="card card-custom card-corporate wow fadeInDown" data-wow-delay=".05s">
<div class="card-header" id="accordion1-heading-1" role="tab">
<div class="card-title"><a role="button" data-toggle="collapse" data-parent="#accordion1" href="#accordion1-collapse-1" aria-controls="accordion1-collapse-1" aria-expanded="true">What are the advantages of purchasing a website template?
<div class="card-arrow"></div></a></div>
</div>
<div class="collapse show" id="accordion1-collapse-1" role="tabpanel" aria-labelledby="accordion1-heading-1">
<div class="card-body">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris</p>
</div>
</div>
</article>
<!-- Bootstrap card-->
<article class="card card-custom card-corporate wow fadeInDown" data-wow-delay=".1s">
<div class="card-header" id="accordion1-heading-2" role="tab">
<div class="card-title"><a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion1" href="#accordion1-collapse-2" aria-controls="accordion1-collapse-2" aria-expanded="false">Do you provide any scripts with your templates or could you do some custom programming?
<div class="card-arrow"></div></a></div>
</div>
<div class="collapse" id="accordion1-collapse-2" role="tabpanel" aria-labelledby="accordion1-heading-2">
<div class="card-body">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris</p>
</div>
</div>
</article>
<!-- Bootstrap card-->
<article class="card card-custom card-corporate wow fadeInDown" data-wow-delay=".15s">
<div class="card-header" id="accordion1-heading-3" role="tab">
<div class="card-title"><a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion1" href="#accordion1-collapse-3" aria-controls="accordion1-collapse-3" aria-expanded="false">What do I receive when I order a template from Zemez?
<div class="card-arrow"></div></a></div>
</div>
<div class="collapse" id="accordion1-collapse-3" role="tabpanel" aria-labelledby="accordion1-heading-3">
<div class="card-body">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris</p>
</div>
</div>
</article>
<!-- Bootstrap card-->
<article class="card card-custom card-corporate wow fadeInDown" data-wow-delay=".2s">
<div class="card-header" id="accordion1-heading-4" role="tab">
<div class="card-title"><a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion1" href="#accordion1-collapse-4" aria-controls="accordion1-collapse-4" aria-expanded="false">In what formats are your templates available?
<div class="card-arrow"></div></a></div>
</div>
<div class="collapse" id="accordion1-collapse-4" role="tabpanel" aria-labelledby="accordion1-heading-4">
<div class="card-body">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris</p>
</div>
</div>
</article>
</div>
</div>
<div class="col-lg-5">
<h3 class="wow-outer"><span class="wow slideInDown">Skill Bars</span></h3>
<div class="progress-linear-outer wow-outer">
<!-- Linear progress bar-->
<article class="progress-linear wow slideInDown" data-wow-delay=".05s">
<div class="progress-header">
<p>Dedication</p><span class="progress-value">90</span>
</div>
<div class="progress-bar-linear-wrap">
<div class="progress-bar-linear"></div>
</div>
</article>
</div>
<div class="progress-linear-outer wow-outer">
<!-- Linear progress bar-->
<article class="progress-linear wow slideInDown" data-wow-delay=".1s">
<div class="progress-header">
<p>Knowledge</p><span class="progress-value">65</span>
</div>
<div class="progress-bar-linear-wrap">
<div class="progress-bar-linear"></div>
</div>
</article>
</div>
<div class="progress-linear-outer wow-outer">
<!-- Linear progress bar-->
<article class="progress-linear wow slideInDown" data-wow-delay=".15s">
<div class="progress-header">
<p>Professionalism</p><span class="progress-value">100</span>
</div>
<div class="progress-bar-linear-wrap">
<div class="progress-bar-linear"></div>
</div>
</article>
</div>
<div class="progress-linear-outer wow-outer">
<!-- Linear progress bar-->
<article class="progress-linear wow slideInDown" data-wow-delay=".2s">
<div class="progress-header">
<p>Expertise</p><span class="progress-value">75</span>
</div>
<div class="progress-bar-linear-wrap">
<div class="progress-bar-linear"></div>
</div>
</article>
</div>
</div>
</div>
</div>
</section>
<!-- Accordion & photo-->
<section class="section section-md">
<div class="container">
<h6>Accordion & photo</h6>
<div class="row row-50 justify-content-lg-between flex-lg-row-reverse offset-top-1">
<div class="col-lg-7 col-xl-6">
<h3 class="wow-outer"><span class="wow slideInDown">Frequently Asked Questions</span></h3>
<!-- Bootstrap collapse-->
<div class="card-group-custom card-group-corporate wow-outer" id="accordion2" role="tablist" aria-multiselectable="false">
<!-- Bootstrap card-->
<article class="card card-custom card-corporate wow fadeInDown" data-wow-delay=".05s">
<div class="card-header" id="accordion2-heading-1" role="tab">
<div class="card-title"><a role="button" data-toggle="collapse" data-parent="#accordion2" href="#accordion2-collapse-1" aria-controls="accordion2-collapse-1" aria-expanded="true">What are the advantages of purchasing a website template?
<div class="card-arrow"></div></a></div>
</div>
<div class="collapse show" id="accordion2-collapse-1" role="tabpanel" aria-labelledby="accordion2-heading-1">
<div class="card-body">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam</p>
</div>
</div>
</article>
<!-- Bootstrap card-->
<article class="card card-custom card-corporate wow fadeInDown" data-wow-delay=".1s">
<div class="card-header" id="accordion2-heading-2" role="tab">
<div class="card-title"><a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion2" href="#accordion2-collapse-2" aria-controls="accordion2-collapse-2" aria-expanded="false">Do you provide any scripts with your templates or could you do some custom programming?
<div class="card-arrow"></div></a></div>
</div>
<div class="collapse" id="accordion2-collapse-2" role="tabpanel" aria-labelledby="accordion2-heading-2">
<div class="card-body">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam</p>
</div>
</div>
</article>
<!-- Bootstrap card-->
<article class="card card-custom card-corporate wow fadeInDown" data-wow-delay=".15s">
<div class="card-header" id="accordion2-heading-3" role="tab">
<div class="card-title"><a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion2" href="#accordion2-collapse-3" aria-controls="accordion2-collapse-3" aria-expanded="false">What do I receive when I order a template from Zemez?
<div class="card-arrow"></div></a></div>
</div>
<div class="collapse" id="accordion2-collapse-3" role="tabpanel" aria-labelledby="accordion2-heading-3">
<div class="card-body">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam</p>
</div>
</div>
</article>
<!-- Bootstrap card-->
<article class="card card-custom card-corporate wow fadeInDown" data-wow-delay=".2s">
<div class="card-header" id="accordion2-heading-4" role="tab">
<div class="card-title"><a class="collapsed" role="button" data-toggle="collapse" data-parent="#accordion2" href="#accordion2-collapse-4" aria-controls="accordion2-collapse-4" aria-expanded="false">In what formats are your templates available?
<div class="card-arrow"></div></a></div>
</div>
<div class="collapse" id="accordion2-collapse-4" role="tabpanel" aria-labelledby="accordion2-heading-4">
<div class="card-body">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam</p>
</div>
</div>
</article>
</div>
</div>
<div class="col-lg-5 wow-outer"><img class="wow slideInLeft" src="images/accordions-1-470x368.jpg" alt="" width="470" height="368"/>
</div>
</div>
</div>
</section>
<!-- Page Footer-->
<footer class="section footer-advanced bg-gray-700">
<div class="footer-advanced-main">
<div class="container">
<div class="row row-50">
<div class="col-lg-4">
<h5 class="font-weight-bold text-uppercase text-white">About Us</h5>
<p class="footer-advanced-text">inHouse is the largest full-service real estate and property management company. We offer expertise in the marketing and sale of a wide range of properties, including residential real estate, farms and lifestyle blocks, as well as commercial and industrial properties that we hope may interest you.</p>
</div>
<div class="col-sm-7 col-md-5 col-lg-4">
<h5 class="font-weight-bold text-uppercase text-white">Recent Blog Posts</h5>
<!-- Post Inline-->
<article class="post-inline">
<p class="post-inline-title"><a href="single-blog-post.html">Real Estate Guide: 7 Important Tips for Buying a Home</a></p>
<ul class="post-inline-meta">
<li>by Mike Barnes</li>
<li><a href="single-blog-post.html">2 days ago</a></li>
</ul>
</article>
<!-- Post Inline-->
<article class="post-inline">
<p class="post-inline-title"><a href="single-blog-post.html">Single-Family Homes as a Housing Option for Young Families</a></p>
<ul class="post-inline-meta">
<li>by Mike Barnes</li>
<li><a href="single-blog-post.html">2 days ago</a></li>
</ul>
</article>
</div>
<div class="col-sm-5 col-md-7 col-lg-4">
<h5 class="font-weight-bold text-uppercase text-white">Gallery</h5>
<div class="row row-x-10" data-lightgallery="group">
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-1.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-1-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-2.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-2-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-3.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-3-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-4.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-4-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-5.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-5-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-6.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-6-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"> </div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-7.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-7-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-8.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-8-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
</div>
</div>
</div>
</div>
</div>
<div class="footer-advanced-aside">
<div class="container">
<div class="footer-advanced-layout">
<div>
<ul class="list-nav">
<li><a href="index.html">Home</a></li>
<li><a href="about-us.html">About</a></li>
<li><a href="properties.html">Properties</a></li>
<li><a href="grid-blog.html">Blog</a></li>
<li><a href="contacts.html">Contacts</a></li>
</ul>
</div>
<div>
<ul class="foter-social-links list-inline list-inline-md">
<li><a class="icon icon-sm link-default mdi mdi-facebook" href="#"></a></li>
<li><a class="icon icon-sm link-default mdi mdi-twitter" href="#"></a></li>
<li><a class="icon icon-sm link-default mdi mdi-instagram" href="#"></a></li>
<li><a class="icon icon-sm link-default mdi mdi-google" href="#"></a></li>
<li><a class="icon icon-sm link-default mdi mdi-linkedin" href="#"></a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="container">
<hr>
</div>
<div class="footer-advanced-aside">
<div class="container">
<div class="footer-advanced-layout"><a class="brand" href="index.html"><img src="images/logo-light-115x34.png" alt="" width="115" height="34" srcset="images/logo-light-115x34.png 2x"/></a>
<!-- Rights-->
<p class="rights"><span>&copy;&nbsp;</span><span class="copyright-year"></span><span>&nbsp;</span><span>All Rights Reserved.</span><span>&nbsp;</span><br class="d-sm-none"/><a href="#">Terms of Use</a><span> and</span><span>&nbsp;</span><a href="privacy-policy.html">Privacy Policy</a></p>
</div>
</div>
</div>
</footer>
</div>
<div class="preloader">
<div class="preloader-logo"><img src="images/logo-default-151x44.png" alt="" width="151" height="44" srcset="images/logo-default-151x44.png 2x"/>
</div>
<div class="preloader-body">
<div id="loadingProgressG">
<div class="loadingProgressG" id="loadingProgressG_1"></div>
</div>
</div>
</div>
<!-- Global Mailform Output-->
<div class="snackbars" id="form-output-global"></div>
<!-- Javascript-->
<script src="js/core.min.js"></script>
<script src="js/script.js"></script>
</body>
</html>
+97
View File
@@ -0,0 +1,97 @@
<?php
/**
* This is a PHP library that handles calling reCAPTCHA.
*
* @copyright Copyright (c) 2015, Google Inc.
* @link http://www.google.com/recaptcha
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
namespace ReCaptcha;
/**
* reCAPTCHA client.
*/
class ReCaptcha
{
/**
* Version of this client library.
* @const string
*/
const VERSION = 'php_1.1.2';
/**
* Shared secret for the site.
* @var type string
*/
private $secret;
/**
* Method used to communicate with service. Defaults to POST request.
* @var RequestMethod
*/
private $requestMethod;
/**
* Create a configured instance to use the reCAPTCHA service.
*
* @param string $secret shared secret between site and reCAPTCHA server.
* @param RequestMethod $requestMethod method used to send the request. Defaults to POST.
*/
public function __construct($secret, RequestMethod $requestMethod = null)
{
if (empty($secret)) {
throw new \RuntimeException('No secret provided');
}
if (!is_string($secret)) {
throw new \RuntimeException('The provided secret must be a string');
}
$this->secret = $secret;
if (!is_null($requestMethod)) {
$this->requestMethod = $requestMethod;
} else {
$this->requestMethod = new RequestMethod\Post();
}
}
/**
* Calls the reCAPTCHA siteverify API to verify whether the user passes
* CAPTCHA test.
*
* @param string $response The value of 'g-recaptcha-response' in the submitted form.
* @param string $remoteIp The end user's IP address.
* @return Response Response from the service.
*/
public function verify($response, $remoteIp = null)
{
// Discard empty solution submissions
if (empty($response)) {
$recaptchaResponse = new Response(false, array('missing-input-response'));
return $recaptchaResponse;
}
$params = new RequestParameters($this->secret, $response, $remoteIp, self::VERSION);
$rawResponse = $this->requestMethod->submit($params);
return Response::fromJson($rawResponse);
}
}
@@ -0,0 +1,42 @@
<?php
/**
* This is a PHP library that handles calling reCAPTCHA.
*
* @copyright Copyright (c) 2015, Google Inc.
* @link http://www.google.com/recaptcha
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
namespace ReCaptcha;
/**
* Method used to send the request to the service.
*/
interface RequestMethod
{
/**
* Submit the request with the specified parameters.
*
* @param RequestParameters $params Request parameters
* @return string Body of the reCAPTCHA response
*/
public function submit(RequestParameters $params);
}
@@ -0,0 +1,74 @@
<?php
/**
* This is a PHP library that handles calling reCAPTCHA.
*
* @copyright Copyright (c) 2015, Google Inc.
* @link http://www.google.com/recaptcha
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
namespace ReCaptcha\RequestMethod;
/**
* Convenience wrapper around the cURL functions to allow mocking.
*/
class Curl
{
/**
* @see http://php.net/curl_init
* @param string $url
* @return resource cURL handle
*/
public function init($url = null)
{
return curl_init($url);
}
/**
* @see http://php.net/curl_setopt_array
* @param resource $ch
* @param array $options
* @return bool
*/
public function setoptArray($ch, array $options)
{
return curl_setopt_array($ch, $options);
}
/**
* @see http://php.net/curl_exec
* @param resource $ch
* @return mixed
*/
public function exec($ch)
{
return curl_exec($ch);
}
/**
* @see http://php.net/curl_close
* @param resource $ch
*/
public function close($ch)
{
curl_close($ch);
}
}
@@ -0,0 +1,88 @@
<?php
/**
* This is a PHP library that handles calling reCAPTCHA.
*
* @copyright Copyright (c) 2015, Google Inc.
* @link http://www.google.com/recaptcha
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
namespace ReCaptcha\RequestMethod;
use ReCaptcha\RequestMethod;
use ReCaptcha\RequestParameters;
/**
* Sends cURL request to the reCAPTCHA service.
* Note: this requires the cURL extension to be enabled in PHP
* @see http://php.net/manual/en/book.curl.php
*/
class CurlPost implements RequestMethod
{
/**
* URL to which requests are sent via cURL.
* @const string
*/
const SITE_VERIFY_URL = 'https://www.google.com/recaptcha/api/siteverify';
/**
* Curl connection to the reCAPTCHA service
* @var Curl
*/
private $curl;
public function __construct(Curl $curl = null)
{
if (!is_null($curl)) {
$this->curl = $curl;
} else {
$this->curl = new Curl();
}
}
/**
* Submit the cURL request with the specified parameters.
*
* @param RequestParameters $params Request parameters
* @return string Body of the reCAPTCHA response
*/
public function submit(RequestParameters $params)
{
$handle = $this->curl->init(self::SITE_VERIFY_URL);
$options = array(
CURLOPT_POST => true,
CURLOPT_POSTFIELDS => $params->toQueryString(),
CURLOPT_HTTPHEADER => array(
'Content-Type: application/x-www-form-urlencoded'
),
CURLINFO_HEADER_OUT => false,
CURLOPT_HEADER => false,
CURLOPT_RETURNTRANSFER => true,
CURLOPT_SSL_VERIFYPEER => true
);
$this->curl->setoptArray($handle, $options);
$response = $this->curl->exec($handle);
$this->curl->close($handle);
return $response;
}
}
@@ -0,0 +1,70 @@
<?php
/**
* This is a PHP library that handles calling reCAPTCHA.
*
* @copyright Copyright (c) 2015, Google Inc.
* @link http://www.google.com/recaptcha
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
namespace ReCaptcha\RequestMethod;
use ReCaptcha\RequestMethod;
use ReCaptcha\RequestParameters;
/**
* Sends POST requests to the reCAPTCHA service.
*/
class Post implements RequestMethod
{
/**
* URL to which requests are POSTed.
* @const string
*/
const SITE_VERIFY_URL = 'https://www.google.com/recaptcha/api/siteverify';
/**
* Submit the POST request with the specified parameters.
*
* @param RequestParameters $params Request parameters
* @return string Body of the reCAPTCHA response
*/
public function submit(RequestParameters $params)
{
/**
* PHP 5.6.0 changed the way you specify the peer name for SSL context options.
* Using "CN_name" will still work, but it will raise deprecated errors.
*/
$peer_key = version_compare(PHP_VERSION, '5.6.0', '<') ? 'CN_name' : 'peer_name';
$options = array(
'http' => array(
'header' => "Content-type: application/x-www-form-urlencoded\r\n",
'method' => 'POST',
'content' => $params->toQueryString(),
// Force the peer to validate (not needed in 5.6.0+, but still works
'verify_peer' => true,
// Force the peer validation to use www.google.com
$peer_key => 'www.google.com',
),
);
$context = stream_context_create($options);
return file_get_contents(self::SITE_VERIFY_URL, false, $context);
}
}
@@ -0,0 +1,104 @@
<?php
/**
* This is a PHP library that handles calling reCAPTCHA.
*
* @copyright Copyright (c) 2015, Google Inc.
* @link http://www.google.com/recaptcha
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
namespace ReCaptcha\RequestMethod;
/**
* Convenience wrapper around native socket and file functions to allow for
* mocking.
*/
class Socket
{
private $handle = null;
/**
* fsockopen
*
* @see http://php.net/fsockopen
* @param string $hostname
* @param int $port
* @param int $errno
* @param string $errstr
* @param float $timeout
* @return resource
*/
public function fsockopen($hostname, $port = -1, &$errno = 0, &$errstr = '', $timeout = null)
{
$this->handle = fsockopen($hostname, $port, $errno, $errstr, (is_null($timeout) ? ini_get("default_socket_timeout") : $timeout));
if ($this->handle != false && $errno === 0 && $errstr === '') {
return $this->handle;
}
return false;
}
/**
* fwrite
*
* @see http://php.net/fwrite
* @param string $string
* @param int $length
* @return int | bool
*/
public function fwrite($string, $length = null)
{
return fwrite($this->handle, $string, (is_null($length) ? strlen($string) : $length));
}
/**
* fgets
*
* @see http://php.net/fgets
* @param int $length
* @return string
*/
public function fgets($length = null)
{
return fgets($this->handle, $length);
}
/**
* feof
*
* @see http://php.net/feof
* @return bool
*/
public function feof()
{
return feof($this->handle);
}
/**
* fclose
*
* @see http://php.net/fclose
* @return bool
*/
public function fclose()
{
return fclose($this->handle);
}
}
@@ -0,0 +1,121 @@
<?php
/**
* This is a PHP library that handles calling reCAPTCHA.
*
* @copyright Copyright (c) 2015, Google Inc.
* @link http://www.google.com/recaptcha
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
namespace ReCaptcha\RequestMethod;
use ReCaptcha\RequestMethod;
use ReCaptcha\RequestParameters;
/**
* Sends a POST request to the reCAPTCHA service, but makes use of fsockopen()
* instead of get_file_contents(). This is to account for people who may be on
* servers where allow_furl_open is disabled.
*/
class SocketPost implements RequestMethod
{
/**
* reCAPTCHA service host.
* @const string
*/
const RECAPTCHA_HOST = 'www.google.com';
/**
* @const string reCAPTCHA service path
*/
const SITE_VERIFY_PATH = '/recaptcha/api/siteverify';
/**
* @const string Bad request error
*/
const BAD_REQUEST = '{"success": false, "error-codes": ["invalid-request"]}';
/**
* @const string Bad response error
*/
const BAD_RESPONSE = '{"success": false, "error-codes": ["invalid-response"]}';
/**
* Socket to the reCAPTCHA service
* @var Socket
*/
private $socket;
/**
* Constructor
*
* @param \ReCaptcha\RequestMethod\Socket $socket optional socket, injectable for testing
*/
public function __construct(Socket $socket = null)
{
if (!is_null($socket)) {
$this->socket = $socket;
} else {
$this->socket = new Socket();
}
}
/**
* Submit the POST request with the specified parameters.
*
* @param RequestParameters $params Request parameters
* @return string Body of the reCAPTCHA response
*/
public function submit(RequestParameters $params)
{
$errno = 0;
$errstr = '';
if (false === $this->socket->fsockopen('ssl://' . self::RECAPTCHA_HOST, 443, $errno, $errstr, 30)) {
return self::BAD_REQUEST;
}
$content = $params->toQueryString();
$request = "POST " . self::SITE_VERIFY_PATH . " HTTP/1.1\r\n";
$request .= "Host: " . self::RECAPTCHA_HOST . "\r\n";
$request .= "Content-Type: application/x-www-form-urlencoded\r\n";
$request .= "Content-length: " . strlen($content) . "\r\n";
$request .= "Connection: close\r\n\r\n";
$request .= $content . "\r\n\r\n";
$this->socket->fwrite($request);
$response = '';
while (!$this->socket->feof()) {
$response .= $this->socket->fgets(4096);
}
$this->socket->fclose();
if (0 !== strpos($response, 'HTTP/1.1 200 OK')) {
return self::BAD_RESPONSE;
}
$parts = preg_split("#\n\s*\n#Uis", $response);
return $parts[1];
}
}
@@ -0,0 +1,103 @@
<?php
/**
* This is a PHP library that handles calling reCAPTCHA.
*
* @copyright Copyright (c) 2015, Google Inc.
* @link http://www.google.com/recaptcha
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
namespace ReCaptcha;
/**
* Stores and formats the parameters for the request to the reCAPTCHA service.
*/
class RequestParameters
{
/**
* Site secret.
* @var string
*/
private $secret;
/**
* Form response.
* @var string
*/
private $response;
/**
* Remote user's IP address.
* @var string
*/
private $remoteIp;
/**
* Client version.
* @var string
*/
private $version;
/**
* Initialise parameters.
*
* @param string $secret Site secret.
* @param string $response Value from g-captcha-response form field.
* @param string $remoteIp User's IP address.
* @param string $version Version of this client library.
*/
public function __construct($secret, $response, $remoteIp = null, $version = null)
{
$this->secret = $secret;
$this->response = $response;
$this->remoteIp = $remoteIp;
$this->version = $version;
}
/**
* Array representation.
*
* @return array Array formatted parameters.
*/
public function toArray()
{
$params = array('secret' => $this->secret, 'response' => $this->response);
if (!is_null($this->remoteIp)) {
$params['remoteip'] = $this->remoteIp;
}
if (!is_null($this->version)) {
$params['version'] = $this->version;
}
return $params;
}
/**
* Query string representation for HTTP request.
*
* @return string Query string formatted parameters.
*/
public function toQueryString()
{
return http_build_query($this->toArray(), '', '&');
}
}
+102
View File
@@ -0,0 +1,102 @@
<?php
/**
* This is a PHP library that handles calling reCAPTCHA.
*
* @copyright Copyright (c) 2015, Google Inc.
* @link http://www.google.com/recaptcha
*
* Permission is hereby granted, free of charge, to any person obtaining a copy
* of this software and associated documentation files (the "Software"), to deal
* in the Software without restriction, including without limitation the rights
* to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
* copies of the Software, and to permit persons to whom the Software is
* furnished to do so, subject to the following conditions:
*
* The above copyright notice and this permission notice shall be included in
* all copies or substantial portions of the Software.
*
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
* THE SOFTWARE.
*/
namespace ReCaptcha;
/**
* The response returned from the service.
*/
class Response
{
/**
* Succes or failure.
* @var boolean
*/
private $success = false;
/**
* Error code strings.
* @var array
*/
private $errorCodes = array();
/**
* Build the response from the expected JSON returned by the service.
*
* @param string $json
* @return \ReCaptcha\Response
*/
public static function fromJson($json)
{
$responseData = json_decode($json, true);
if (!$responseData) {
return new Response(false, array('invalid-json'));
}
if (isset($responseData['success']) && $responseData['success'] == true) {
return new Response(true);
}
if (isset($responseData['error-codes']) && is_array($responseData['error-codes'])) {
return new Response(false, $responseData['error-codes']);
}
return new Response(false);
}
/**
* Constructor.
*
* @param boolean $success
* @param array $errorCodes
*/
public function __construct($success, array $errorCodes = array())
{
$this->success = $success;
$this->errorCodes = $errorCodes;
}
/**
* Is success?
*
* @return boolean
*/
public function isSuccess()
{
return $this->success;
}
/**
* Get error codes.
*
* @return array
*/
public function getErrorCodes()
{
return $this->errorCodes;
}
}
+30
View File
@@ -0,0 +1,30 @@
<?php
/* An autoloader for ReCaptcha\Foo classes. This should be required()
* by the user before attempting to instantiate any of the ReCaptcha
* classes.
*/
spl_autoload_register(function ($class) {
if (substr($class, 0, 10) !== 'ReCaptcha\\') {
/* If the class does not lie under the "ReCaptcha" namespace,
* then we can exit immediately.
*/
return;
}
/* All of the classes have names like "ReCaptcha\Foo", so we need
* to replace the backslashes with frontslashes if we want the
* name to map directly to a location in the filesystem.
*/
$class = str_replace('\\', '/', $class);
/* First, check under the current directory. It is important that
* we look here first, so that we don't waste time searching for
* test classes in the common case.
*/
$path = $class.'.php';
if (is_readable($path)) {
require_once $path;
}
});
@@ -0,0 +1,49 @@
<?php
/**
* PHPMailer SPL autoloader.
* PHP Version 5
* @package PHPMailer
* @link https://github.com/PHPMailer/PHPMailer/ The PHPMailer GitHub project
* @author Marcus Bointon (Synchro/coolbru) <phpmailer@synchromedia.co.uk>
* @author Jim Jagielski (jimjag) <jimjag@gmail.com>
* @author Andy Prevost (codeworxtech) <codeworxtech@users.sourceforge.net>
* @author Brent R. Matzelle (original founder)
* @copyright 2012 - 2014 Marcus Bointon
* @copyright 2010 - 2012 Jim Jagielski
* @copyright 2004 - 2009 Andy Prevost
* @license http://www.gnu.org/copyleft/lesser.html GNU Lesser General Public License
* @note This program is distributed in the hope that it will be useful - WITHOUT
* ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
* FITNESS FOR A PARTICULAR PURPOSE.
*/
/**
* PHPMailer SPL autoloader.
* @param string $classname The name of the class to load
*/
function PHPMailerAutoload($classname)
{
//Can't use __DIR__ as it's only in PHP 5.3+
$filename = dirname(__FILE__).DIRECTORY_SEPARATOR.'class.'.strtolower($classname).'.php';
if (is_readable($filename)) {
require $filename;
}
}
if (version_compare(PHP_VERSION, '5.1.2', '>=')) {
//SPL autoloading was introduced in PHP 5.1.2
if (version_compare(PHP_VERSION, '5.3.0', '>=')) {
spl_autoload_register('PHPMailerAutoload', true, true);
} else {
spl_autoload_register('PHPMailerAutoload');
}
} else {
/**
* Fall back to traditional autoload for old PHP versions
* @param string $classname The name of the class to load
*/
function __autoload($classname)
{
PHPMailerAutoload($classname);
}
}
File diff suppressed because it is too large Load Diff
+397
View File
@@ -0,0 +1,397 @@
<?php
/**
* PHPMailer POP-Before-SMTP Authentication Class.
* PHP Version 5
* @package PHPMailer
* @link https://github.com/PHPMailer/PHPMailer/
* @author Marcus Bointon (Synchro/coolbru) <phpmailer@synchromedia.co.uk>
* @author Jim Jagielski (jimjag) <jimjag@gmail.com>
* @author Andy Prevost (codeworxtech) <codeworxtech@users.sourceforge.net>
* @author Brent R. Matzelle (original founder)
* @copyright 2012 - 2014 Marcus Bointon
* @copyright 2010 - 2012 Jim Jagielski
* @copyright 2004 - 2009 Andy Prevost
* @license http://www.gnu.org/copyleft/lesser.html GNU Lesser General Public License
* @note This program is distributed in the hope that it will be useful - WITHOUT
* ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or
* FITNESS FOR A PARTICULAR PURPOSE.
*/
/**
* PHPMailer POP-Before-SMTP Authentication Class.
* Specifically for PHPMailer to use for RFC1939 POP-before-SMTP authentication.
* Does not support APOP.
* @package PHPMailer
* @author Richard Davey (original author) <rich@corephp.co.uk>
* @author Marcus Bointon (Synchro/coolbru) <phpmailer@synchromedia.co.uk>
* @author Jim Jagielski (jimjag) <jimjag@gmail.com>
* @author Andy Prevost (codeworxtech) <codeworxtech@users.sourceforge.net>
*/
class POP3
{
/**
* The POP3 PHPMailer Version number.
* @type string
* @access public
*/
public $Version = '5.2.9';
/**
* Default POP3 port number.
* @type integer
* @access public
*/
public $POP3_PORT = 110;
/**
* Default timeout in seconds.
* @type integer
* @access public
*/
public $POP3_TIMEOUT = 30;
/**
* POP3 Carriage Return + Line Feed.
* @type string
* @access public
* @deprecated Use the constant instead
*/
public $CRLF = "\r\n";
/**
* Debug display level.
* Options: 0 = no, 1+ = yes
* @type integer
* @access public
*/
public $do_debug = 0;
/**
* POP3 mail server hostname.
* @type string
* @access public
*/
public $host;
/**
* POP3 port number.
* @type integer
* @access public
*/
public $port;
/**
* POP3 Timeout Value in seconds.
* @type integer
* @access public
*/
public $tval;
/**
* POP3 username
* @type string
* @access public
*/
public $username;
/**
* POP3 password.
* @type string
* @access public
*/
public $password;
/**
* Resource handle for the POP3 connection socket.
* @type resource
* @access private
*/
private $pop_conn;
/**
* Are we connected?
* @type boolean
* @access private
*/
private $connected = false;
/**
* Error container.
* @type array
* @access private
*/
private $errors = array();
/**
* Line break constant
*/
const CRLF = "\r\n";
/**
* Simple static wrapper for all-in-one POP before SMTP
* @param $host
* @param boolean $port
* @param boolean $tval
* @param string $username
* @param string $password
* @param integer $debug_level
* @return boolean
*/
public static function popBeforeSmtp(
$host,
$port = false,
$tval = false,
$username = '',
$password = '',
$debug_level = 0
) {
$pop = new POP3;
return $pop->authorise($host, $port, $tval, $username, $password, $debug_level);
}
/**
* Authenticate with a POP3 server.
* A connect, login, disconnect sequence
* appropriate for POP-before SMTP authorisation.
* @access public
* @param string $host The hostname to connect to
* @param integer|boolean $port The port number to connect to
* @param integer|boolean $timeout The timeout value
* @param string $username
* @param string $password
* @param integer $debug_level
* @return boolean
*/
public function authorise($host, $port = false, $timeout = false, $username = '', $password = '', $debug_level = 0)
{
$this->host = $host;
// If no port value provided, use default
if (false === $port) {
$this->port = $this->POP3_PORT;
} else {
$this->port = (integer)$port;
}
// If no timeout value provided, use default
if (false === $timeout) {
$this->tval = $this->POP3_TIMEOUT;
} else {
$this->tval = (integer)$timeout;
}
$this->do_debug = $debug_level;
$this->username = $username;
$this->password = $password;
// Reset the error log
$this->errors = array();
// connect
$result = $this->connect($this->host, $this->port, $this->tval);
if ($result) {
$login_result = $this->login($this->username, $this->password);
if ($login_result) {
$this->disconnect();
return true;
}
}
// We need to disconnect regardless of whether the login succeeded
$this->disconnect();
return false;
}
/**
* Connect to a POP3 server.
* @access public
* @param string $host
* @param integer|boolean $port
* @param integer $tval
* @return boolean
*/
public function connect($host, $port = false, $tval = 30)
{
// Are we already connected?
if ($this->connected) {
return true;
}
//On Windows this will raise a PHP Warning error if the hostname doesn't exist.
//Rather than suppress it with @fsockopen, capture it cleanly instead
set_error_handler(array($this, 'catchWarning'));
if (false === $port) {
$port = $this->POP3_PORT;
}
// connect to the POP3 server
$this->pop_conn = fsockopen(
$host, // POP3 Host
$port, // Port #
$errno, // Error Number
$errstr, // Error Message
$tval
); // Timeout (seconds)
// Restore the error handler
restore_error_handler();
// Did we connect?
if (false === $this->pop_conn) {
// It would appear not...
$this->setError(array(
'error' => "Failed to connect to server $host on port $port",
'errno' => $errno,
'errstr' => $errstr
));
return false;
}
// Increase the stream time-out
stream_set_timeout($this->pop_conn, $tval, 0);
// Get the POP3 server response
$pop3_response = $this->getResponse();
// Check for the +OK
if ($this->checkResponse($pop3_response)) {
// The connection is established and the POP3 server is talking
$this->connected = true;
return true;
}
return false;
}
/**
* Log in to the POP3 server.
* Does not support APOP (RFC 2828, 4949).
* @access public
* @param string $username
* @param string $password
* @return boolean
*/
public function login($username = '', $password = '')
{
if (!$this->connected) {
$this->setError('Not connected to POP3 server');
}
if (empty($username)) {
$username = $this->username;
}
if (empty($password)) {
$password = $this->password;
}
// Send the Username
$this->sendString("USER $username" . self::CRLF);
$pop3_response = $this->getResponse();
if ($this->checkResponse($pop3_response)) {
// Send the Password
$this->sendString("PASS $password" . self::CRLF);
$pop3_response = $this->getResponse();
if ($this->checkResponse($pop3_response)) {
return true;
}
}
return false;
}
/**
* Disconnect from the POP3 server.
* @access public
*/
public function disconnect()
{
$this->sendString('QUIT');
//The QUIT command may cause the daemon to exit, which will kill our connection
//So ignore errors here
try {
@fclose($this->pop_conn);
} catch (Exception $e) {
//Do nothing
};
}
/**
* Get a response from the POP3 server.
* $size is the maximum number of bytes to retrieve
* @param integer $size
* @return string
* @access private
*/
private function getResponse($size = 128)
{
$response = fgets($this->pop_conn, $size);
if ($this->do_debug >= 1) {
echo "Server -> Client: $response";
}
return $response;
}
/**
* Send raw data to the POP3 server.
* @param string $string
* @return integer
* @access private
*/
private function sendString($string)
{
if ($this->pop_conn) {
if ($this->do_debug >= 2) { //Show client messages when debug >= 2
echo "Client -> Server: $string";
}
return fwrite($this->pop_conn, $string, strlen($string));
}
return 0;
}
/**
* Checks the POP3 server response.
* Looks for for +OK or -ERR.
* @param string $string
* @return boolean
* @access private
*/
private function checkResponse($string)
{
if (substr($string, 0, 3) !== '+OK') {
$this->setError(array(
'error' => "Server reported an error: $string",
'errno' => 0,
'errstr' => ''
));
return false;
} else {
return true;
}
}
/**
* Add an error to the internal error store.
* Also display debug output if it's enabled.
* @param $error
*/
private function setError($error)
{
$this->errors[] = $error;
if ($this->do_debug >= 1) {
echo '<pre>';
foreach ($this->errors as $error) {
print_r($error);
}
echo '</pre>';
}
}
/**
* POP3 connection error handler.
* @param integer $errno
* @param string $errstr
* @param string $errfile
* @param integer $errline
* @access private
*/
private function catchWarning($errno, $errstr, $errfile, $errline)
{
$this->setError(array(
'error' => "Connecting to the POP3 server raised a PHP warning: ",
'errno' => $errno,
'errstr' => $errstr,
'errfile' => $errfile,
'errline' => $errline
));
}
}
File diff suppressed because it is too large Load Diff
@@ -0,0 +1,8 @@
{
"useSmtp": false,
"host": "stmp.gmail.com",
"port": 465,
"username": "demo@gmail.com",
"password": "demopassword",
"recipientEmail": "demo@gmail.com"
}
+146
View File
@@ -0,0 +1,146 @@
<?php
$formConfigFile = file_get_contents("rd-mailform.config.json");
$formConfig = json_decode($formConfigFile, true);
date_default_timezone_set('Etc/UTC');
try {
require './phpmailer/PHPMailerAutoload.php';
$recipients = $formConfig['recipientEmail'];
preg_match_all("/([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)/", $recipients, $addresses, PREG_OFFSET_CAPTURE);
if (!count($addresses[0])) {
die('MF001');
}
function getRemoteIPAddress() {
if (!empty($_SERVER['HTTP_CLIENT_IP'])) {
return $_SERVER['HTTP_CLIENT_IP'];
} else if (!empty($_SERVER['HTTP_X_FORWARDED_FOR'])) {
return $_SERVER['HTTP_X_FORWARDED_FOR'];
}
return $_SERVER['REMOTE_ADDR'];
}
if (preg_match('/^(127\.|192\.168\.)/', getRemoteIPAddress())) {
die('MF002');
}
$template = file_get_contents('rd-mailform.tpl');
if (isset($_POST['form-type'])) {
switch ($_POST['form-type']){
case 'contact':
$subject = 'A message from your site visitor';
break;
case 'subscribe':
$subject = 'Subscribe request';
break;
case 'order':
$subject = 'Order request';
break;
default:
$subject = 'A message from your site visitor';
break;
}
}else{
die('MF004');
}
if (isset($_POST['email'])) {
$template = str_replace(
array("<!-- #{FromState} -->", "<!-- #{FromEmail} -->"),
array("Email:", $_POST['email']),
$template);
}
if (isset($_POST['message'])) {
$template = str_replace(
array("<!-- #{MessageState} -->", "<!-- #{MessageDescription} -->"),
array("Message:", $_POST['message']),
$template);
}
preg_match("/(<!-- #\{BeginInfo\} -->)(.|\s)*?(<!-- #\{EndInfo\} -->)/", $template, $tmp, PREG_OFFSET_CAPTURE);
foreach ($_POST as $key => $value) {
if ($key != "counter" && $key != "email" && $key != "message" && $key != "form-type" && $key != "g-recaptcha-response" && !empty($value)){
$info = str_replace(
array("<!-- #{BeginInfo} -->", "<!-- #{InfoState} -->", "<!-- #{InfoDescription} -->"),
array("", ucfirst($key) . ':', $value),
$tmp[0][0]);
$template = str_replace("<!-- #{EndInfo} -->", $info, $template);
}
}
$template = str_replace(
array("<!-- #{Subject} -->", "<!-- #{SiteName} -->"),
array($subject, $_SERVER['SERVER_NAME']),
$template);
$mail = new PHPMailer();
if ($formConfig['useSmtp']) {
//Tell PHPMailer to use SMTP
$mail->isSMTP();
//Enable SMTP debugging
// 0 = off (for production use)
// 1 = client messages
// 2 = client and server messages
$mail->SMTPDebug = 0;
$mail->Debugoutput = 'html';
// Set the hostname of the mail server
$mail->Host = $formConfig['host'];
// Set the SMTP port number - likely to be 25, 465 or 587
$mail->Port = $formConfig['port'];
// Whether to use SMTP authentication
$mail->SMTPAuth = true;
$mail->SMTPSecure = "ssl";
// Username to use for SMTP authentication
$mail->Username = $formConfig['username'];
// Password to use for SMTP authentication
$mail->Password = $formConfig['password'];
}
$mail->From = $addresses[0][0][0];
# Attach file
if (isset($_FILES['file']) &&
$_FILES['file']['error'] == UPLOAD_ERR_OK) {
$mail->AddAttachment($_FILES['file']['tmp_name'],
$_FILES['file']['name']);
}
if (isset($_POST['name'])){
$mail->FromName = $_POST['name'];
}else{
$mail->FromName = "Site Visitor";
}
foreach ($addresses[0] as $key => $value) {
$mail->addAddress($value[0]);
}
$mail->CharSet = 'utf-8';
$mail->Subject = $subject;
$mail->MsgHTML($template);
$mail->send();
die('MF000');
} catch (phpmailerException $e) {
die('MF254');
} catch (Exception $e) {
die('MF255');
}
+196
View File
@@ -0,0 +1,196 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="initial-scale=1.0" />
<meta name="format-detection" content="telephone=no" />
<title><!-- #{Subject} --></title>
<style type="text/css">
#outlook a {
padding: 0;
}
body {
width: 100% !important;
-webkit-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
margin: 0;
padding: 0;
}
.ExternalClass {
width: 100%;
}
.ExternalClass,
.ExternalClass span,
.ExternalClass font,
.ExternalClass td,
.ExternalClass div {
line-height: 100%;
}
.ExternalClass p {
line-height: inherit;
}
#body-layout {
margin: 0;
padding: 0;
width: 100% !important;
line-height: 100% !important;
}
img {
display: block;
outline: none;
text-decoration: none;
-ms-interpolation-mode: bicubic;
}
a img {
border: none;
}
table td {
border-collapse: collapse;
}
table {
border-collapse: collapse;
mso-table-lspace: 0pt;
mso-table-rspace: 0pt;
}
a {
color: orange;
outline: none;
}
</style>
</head>
<body id="body-layout" style="background: #406c8d;">
<table width="100%" align="center" cellpadding="0" cellspacing="0" border="0">
<tr>
<td align="center" valign="top" style="padding: 0 15px;background: #406c8d;">
<table align="center" cellpadding="0" cellspacing="0" border="0">
<tr>
<td height="15" style="height: 15px; line-height:15px;"></td>
</tr>
<tr>
<td width="600" align="center" valign="top" style="border-radius: 4px; overflow: hidden; box-shadow: 3px 3px 6px 0 rgba(0,0,0,0.2);background: #dde1e6;">
<table width="100%" align="center" cellpadding="0" cellspacing="0" border="0">
<tr>
<td align="center" valign="top" style="border-top-left-radius: 4px; border-top-right-radius: 4px; overflow: hidden; padding: 0 20px;background: #302f35;">
<table width="100%" align="center" cellpadding="0" cellspacing="0" border="0">
<tr>
<td height="30" style="height: 30px; line-height:30px;"></td>
</tr>
<tr>
<td align="left" valign="top" style="font-family: Arial, sans-serif; font-size: 32px; mso-line-height-rule: exactly; line-height: 32px; font-weight: 400; letter-spacing: 1px;color: #ffffff;">Notification</td>
</tr>
<tr>
<td height="30" style="height: 30px; line-height:30px;"></td>
</tr>
</table>
</td>
</tr>
<tr>
<td align="center" valign="top" style="padding: 0 20px;">
<table width="100%" align="center" cellpadding="0" cellspacing="0" border="0">
<tr>
<td height="30" style="height: 30px; line-height:30px;"></td>
</tr>
<tr>
<td align="left" valign="top" style="font-family: Arial, sans-serif; font-size: 14px; mso-line-height-rule: exactly; line-height: 22px; font-weight: 400;color: #302f35;">Hi, someone left a message for you at <!-- #{SiteName} --></td>
</tr>
<tr>
<td height="20" style="height: 20px; line-height:20px;"></td>
</tr>
<tr>
<td align="center" valign="top">
<table width="100%" align="center" cellpadding="0" cellspacing="0" border="0">
<tr>
<td align="center" valign="top" style="background: #d1d5da;">
<table width="100%" align="center" cellpadding="0" cellspacing="0" border="0">
<tr>
<td height="1" style="height: 1px; line-height:1px;"></td>
</tr>
</table>
</td>
</tr>
<tr>
<td align="center" valign="top" style="background: #e4e6e9;">
<table width="100%" align="center" cellpadding="0" cellspacing="0" border="0">
<tr>
<td height="2" style="height: 2px; line-height:2px;"></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="20" style="height: 20px; line-height:20px;"></td>
</tr>
<tr>
<td align="left" valign="top" style="font-family: Arial, sans-serif; font-size: 24px; mso-line-height-rule: exactly; line-height: 30px; font-weight: 700;color: #302f35;">
<!-- #{Subject} -->
</td>
</tr>
<tr>
<td height="20" style="height: 20px; line-height:20px;"></td>
</tr>
<tr>
<td align="center" valign="top">
<table width="100%" align="center" cellpadding="0" cellspacing="0" border="0">
<tr>
<td align="center" valign="top">
<table width="100%" align="center" cellpadding="0" cellspacing="0" border="0">
<tr>
<td width="110" align="left" valign="top" style="padding: 0 10px 0 0;font-family: Arial, sans-serif; font-size: 14px; mso-line-height-rule: exactly; line-height: 20px; font-weight: 400;color: #302f35;font-weight: 700;"><!-- #{FromState} --></td>
<td align="left" valign="top" style="font-family: Arial, sans-serif; font-size: 14px; mso-line-height-rule: exactly; line-height: 20px; font-weight: 400;color: #302f35;"><!-- #{FromEmail} --></td>
</tr>
<!-- #{BeginInfo} -->
<tr>
<td width="110" align="left" valign="top" style="padding: 0 10px 0 0;font-family: Arial, sans-serif; font-size: 14px; mso-line-height-rule: exactly; line-height: 20px; font-weight: 400;color: #302f35;font-weight: 700;"><!-- #{InfoState} --></td>
<td align="left" valign="top" style="font-family: Arial, sans-serif; font-size: 14px; mso-line-height-rule: exactly; line-height: 20px; font-weight: 400;color: #302f35;"><!-- #{InfoDescription} --></td>
</tr>
<!-- #{EndInfo} -->
</table>
</td>
</tr>
<tr>
<td height="12" style="height: 12px; line-height:12px;"></td>
</tr>
<tr>
<td align="left" valign="top" style="font-family: Arial, sans-serif; font-size: 14px; mso-line-height-rule: exactly; line-height: 20px; font-weight: 400;color: #302f35;font-weight: 700;"><!-- #{MessageState} --></td>
</tr>
<tr>
<td align="left" valign="top" style="font-family: Arial, sans-serif; font-size: 14px; mso-line-height-rule: exactly; line-height: 20px; font-weight: 400;color: #302f35;">
<!-- #{MessageDescription} -->
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="40" style="height: 40px; line-height:40px;"></td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="20" style="height: 20px; line-height:20px;"></td>
</tr>
<tr>
<td width="600" align="center" valign="top">
<table width="100%" align="center" cellpadding="0" cellspacing="0" border="0">
<tr>
<td align="center" valign="top" style="font-family: Arial, sans-serif; font-size: 12px; mso-line-height-rule: exactly; line-height: 18px; font-weight: 400;color: #a1b4c4;">This is an automatically generated email, please do not reply.</td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="20" style="height: 20px; line-height:20px;"></td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
+217
View File
@@ -0,0 +1,217 @@
<?php
if (!isset($_GET['s'])) {
die('You must define a search term!');
}
$highlight = true;//highlight results or not
$search_in = array('html', 'htm');//allowable filetypes to search in
$search_dir = '..';//starting directory
$recursive = true;//should it search recursively or not
define('SIDE_CHARS', 15);
$file_count = 0;
$search_term = mb_strtolower($_GET['s'], 'UTF-8');
if ($search_term == "?s=") {
$search_term = "";
}
$search_term = preg_replace('/^\/$/', '"/"', $search_term);
$search_term = preg_replace('/\+/', ' ', $search_term);
$search_term_length = strlen($search_term);
if (isset($_GET['liveCount'])){
$search_live_count = $_GET['liveCount'];
}
$final_result = array();
$search_filter_init = $_GET['filter'];
$search_filter = preg_replace("/\*/", ".*", $search_filter_init);
$search_template = preg_replace('/\+/', ' ', $_GET['template']);
preg_match_all("/\#\{((?!title|href|token|count)[a-z]*)\}/", $search_template, $template_tokens);
$template_tokens = $template_tokens[1];
$files = list_files($search_dir);
foreach ($files as $file) {
if (0 == filesize($file)) {
continue;
}
if (!preg_match("/" . $search_filter . "/", $file)) {
continue;
}
$contents = file_get_contents($file);
preg_match("/\<title\>(.*)\<\/title\>/", $contents, $page_title); //getting page title
if (preg_match("#\<body.*\>(.*)\<\/body\>#si", $contents, $body_content)) { //getting content only between <body></body> tags
$clean_content = strip_tags($body_content[0]); //remove html tags
$clean_content = preg_replace('/\s+/', ' ', $clean_content); //remove duplicate whitespaces, carriage returns, tabs, etc
$found = strpos_recursive(mb_strtolower($clean_content, 'UTF-8'), $search_term);
$final_result[$file_count]['page_title'][] = $page_title[1];
$final_result[$file_count]['file_name'][] = preg_replace("/^.{3}/", "\\1", $file);
}
for ($j = 0; $j < count($template_tokens); $j++) {
if (preg_match("/\<meta\s+name=[\'|\"]" . $template_tokens[$j] . "[\'|\"]\s+content=[\'|\"](.*)[\'|\"]\>/", $contents, $res)) {
$final_result[$file_count][$template_tokens[$j]] = $res[1];
}
}
if ($found && !empty($found)) {
for ($z = 0; $z < count($found[0]); $z++) {
$pos = $found[0][$z][1];
$side_chars = SIDE_CHARS;
if ($pos < SIDE_CHARS) {
$side_chars = $pos;
if (isset($_GET['liveSearch']) and $_GET['liveSearch'] != "") {
$pos_end = SIDE_CHARS + $search_term_length + 15;
} else {
$pos_end = SIDE_CHARS * 9 + $search_term_length;
}
} else {
if (isset($_GET['liveSearch']) and $_GET['liveSearch'] != "") {
$pos_end = SIDE_CHARS + $search_term_length + 15;
} else {
$pos_end = SIDE_CHARS * 9 + $search_term_length;
}
}
$pos_start = $pos - $side_chars;
$str = substr($clean_content, $pos_start, $pos_end);
$result = preg_replace('#' . $search_term . '#ui', '<span class="search">\0</span>', $str);
//$result = preg_replace('#'.$search_term.'#ui', '<span class="search">'.$search_term.'</span>', $str);
$final_result[$file_count]['search_result'][] = $result;
}
} else {
$final_result[$file_count]['search_result'][] = '';
}
$file_count++;
}
if ($file_count > 0) {
//Sort final result
foreach ($final_result as $key => $row) {
$search_result[$key] = $row['search_result'];
}
array_multisort($search_result, SORT_DESC, $final_result);
}
?>
<div id="search-results">
<?php if (count($final_result) > 0 and isset($_GET['liveSearch']) and $_GET['liveSearch'] != "") {
echo "<div class='search-quick-result'>Quick Results</div>";
} ?>
<ol class="search-list">
<?php
$sum_of_results = 0;
$match_count = 0;
for ($i = 0; $i < count($final_result); $i++) {
if (!empty($final_result[$i]['search_result'][0]) || $final_result[$i]['search_result'][0] !== '') {
$match_count++;
$sum_of_results += count($final_result[$i]['search_result']);
if (isset($_GET['liveSearch']) and $_GET['liveSearch'] != "" and $i >= $search_live_count) {
} else {
?>
<li class="search-list-item">
<?php
$replacement = [$final_result[$i]['page_title'][0],
$final_result[$i]['file_name'][0],
$final_result[$i]['search_result'][0],
count($final_result[$i]['search_result'])
];
$template = preg_replace(["/#{title}/","/#{href}/","/#{token}/","/#{count}/"],$replacement, $search_template);
for ($k = 0; $k < count($template_tokens); $k++){
if (isset($final_result[$i][$template_tokens[$k]])){
$template = preg_replace("/#{" . $template_tokens[$k] . "}/", $final_result[$i][$template_tokens[$k]], $template);
}else{
$template = preg_replace("/#{" . $template_tokens[$k] . "}/", " ", $template);
}
}
echo $template; ?>
</li>
<?php
}
}
}
if ($match_count == 0) {
echo '<li><div class="search-error">No results found for "<span class="search">' . $search_term . '</span>"<div/></li>';
}
?>
<?php
if (isset($_GET['liveSearch']) and $_GET['liveSearch'] != "" and $match_count != 0) {
?>
<li class="search-list-item-all">
<a href='search-results.html?s=<?php echo $_GET['s']; ?>&amp;filter=<?php echo $search_filter_init; ?>' class="search-submit">
<?php
echo "See other ";
echo $sum_of_results;
echo $sum_of_results < 2 ? " result on " : " results";
?>
</a>
</li>
<?php
}
?>
</ol>
</div>
<?php
//lists all the files in the directory given (and sub-directories if it is enabled)
function list_files($dir)
{
global $recursive, $search_in;
$result = array();
if (is_dir($dir)) {
if ($dh = opendir($dir)) {
while (($file = readdir($dh)) !== false) {
if (!($file == '.' || $file == '..')) {
$file = $dir . '/' . $file;
if (is_dir($file) && $recursive == true && $file != './.' && $file != './..') {
$result = array_merge($result, list_files($file));
} else if (!is_dir($file)) {
if (in_array(get_file_extension($file), $search_in)) {
$result[] = $file;
}
}
}
}
}
}
return $result;
}
//returns the extention of a file
function get_file_extension($filename)
{
$result = '';
$parts = explode('.', $filename);
if (is_array($parts) && count($parts) > 1) {
$result = end($parts);
}
return $result;
}
function strpos_recursive($haystack, $needle, $offset = 0, &$results = array())
{
$offset = stripos($haystack, $needle, $offset);
if ($offset === false) {
return $results;
} else {
$pattern = '/' . $needle . '/ui';
preg_match_all($pattern, $haystack, $results, PREG_OFFSET_CAPTURE);
return $results;
}
}
?>
+34
View File
@@ -0,0 +1,34 @@
<?php
// Initiate the autoloader.
require_once 'ReCaptcha/autoload.php';
// Register You API keys at https://www.google.com/recaptcha/admin
// And write it here
$siteKey = '6LfZlSETAAAAAC5VW4R4tQP8Am_to4bM3dddxkEt';
$secret = '6LfZlSETAAAAAOi4lh7GHcSOO0pbXnAMJRhnsr7O';
// reCAPTCHA supported 40+ languages listed here: https://developers.google.com/recaptcha/docs/language
$lang = 'en';
// If No key
if ($siteKey === '' || $secret === ''):
die('CPT001');
elseif (isset($_POST['g-recaptcha-response'])):
// If the form submission includes the "g-captcha-response" field
// Create an instance of the service using your secret
$recaptcha = new \ReCaptcha\ReCaptcha($secret);
// Make the call to verify the response and also pass the user's IP address
$resp = $recaptcha->verify($_POST['g-recaptcha-response'], $_SERVER['REMOTE_ADDR']);
if ($resp->isSuccess()):
// If the response is a success, that's it!
die('CPT000');
else:
// Something wrong
die('CPT002');
endif;
endif;
?>
+432
View File
@@ -0,0 +1,432 @@
<!DOCTYPE html>
<html class="wide wow-animation" lang="en">
<head>
<title>Blog Layouts</title>
<meta name="format-detection" content="telephone=no">
<meta name="viewport" content="width=device-width height=device-height initial-scale=1.0 maximum-scale=1.0 user-scalable=0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta charset="utf-8">
<link rel="icon" href="images/favicon.ico" type="image/x-icon">
<!-- Stylesheets-->
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700,800%7CPoppins:300,400,700">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/fonts.css">
<link rel="stylesheet" href="css/style.css" id="main-styles-link">
<!--[if lt IE 10]>
<div style="background: #212121; padding: 10px 0; box-shadow: 3px 3px 5px 0 rgba(0,0,0,.3); clear: both; text-align:center; position: relative; z-index:1;"><a href="http://windows.microsoft.com/en-US/internet-explorer/"><img src="images/ie8-panel/warning_bar_0000_us.jpg" border="0" height="42" width="820" alt="You are using an outdated browser. For a faster, safer browsing experience, upgrade for free today."></a></div>
<script src="js/html5shiv.min.js"></script>
<![endif]-->
</head>
<body>
<div class="page">
<!-- Page Header-->
<header class="section page-header">
<!-- RD Navbar-->
<div class="rd-navbar-wrap">
<nav class="rd-navbar rd-navbar-corporate" data-layout="rd-navbar-fixed" data-sm-layout="rd-navbar-fixed" data-md-layout="rd-navbar-fixed" data-md-device-layout="rd-navbar-fixed" data-lg-layout="rd-navbar-static" data-lg-device-layout="rd-navbar-static" data-lg-stick-up="true" data-lg-stick-up-offset="118px" data-xl-layout="rd-navbar-static" data-xl-device-layout="rd-navbar-static" data-xl-stick-up="true" data-xl-stick-up-offset="118px" data-xxl-layout="rd-navbar-static" data-xxl-device-layout="rd-navbar-static" data-xxl-stick-up-offset="118px" data-xxl-stick-up="true">
<div class="rd-navbar-aside-outer">
<div class="rd-navbar-aside">
<!-- RD Navbar Panel-->
<div class="rd-navbar-panel">
<!-- RD Navbar Toggle-->
<button class="rd-navbar-toggle" data-rd-navbar-toggle="#rd-navbar-nav-wrap-1"><span></span></button>
<!-- RD Navbar Brand--><a class="rd-navbar-brand" href="index.html"><img src="images/logo-default-151x44.png" alt="" width="151" height="44" srcset="images/logo-default-151x44.png 2x"/></a>
</div>
<div class="rd-navbar-collapse">
<button class="rd-navbar-collapse-toggle rd-navbar-fixed-element-1" data-rd-navbar-toggle="#rd-navbar-collapse-content-1"><span></span></button>
<div class="rd-navbar-collapse-content" id="rd-navbar-collapse-content-1">
<article class="unit align-items-center">
<div class="unit-left"><span class="icon icon-md icon-modern mdi mdi-phone"></span></div>
<div class="unit-body">
<ul class="list-0">
<li><a class="link-default" href="tel:#">1-800-1234-567</a></li>
<li><a class="link-default" href="tel:#">1-800-8763-765</a></li>
</ul>
</div>
</article>
<article class="unit align-items-center">
<div class="unit-left"><span class="icon icon-md icon-modern mdi mdi-map-marker"></span></div>
<div class="unit-body"><a class="link-default" href="tel:#">2130 Fulton Street <br> San Diego, CA 94117-1080</a></div>
</article><a class="button button-gray-bordered button-winona" href="#">Request a call</a>
</div>
</div>
</div>
</div>
<div class="rd-navbar-main-outer">
<div class="rd-navbar-main">
<div class="rd-navbar-nav-wrap" id="rd-navbar-nav-wrap-1">
<!-- RD Navbar Search-->
<div class="rd-navbar-search" id="rd-navbar-search-1">
<button class="rd-navbar-search-toggle" data-rd-navbar-toggle="#rd-navbar-search-1"><span></span></button>
<form class="rd-search" action="search-results.html" data-search-live="rd-search-results-live-1" method="GET">
<div class="form-wrap">
<label class="form-label" for="rd-navbar-search-form-input-1">Search...</label>
<input class="form-input rd-navbar-search-form-input" id="rd-navbar-search-form-input-1" type="text" name="s" autocomplete="off">
<div class="rd-search-results-live" id="rd-search-results-live-1"></div>
</div>
<button class="rd-search-form-submit fa-search" type="submit"></button>
</form>
</div>
<!-- RD Navbar Nav-->
<ul class="rd-navbar-nav">
<li class="rd-nav-item"><a class="rd-nav-link" href="index.html">Home</a>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="about-us.html">About us</a>
<!-- RD Navbar Dropdown-->
<ul class="rd-menu rd-navbar-dropdown">
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="our-team.html">Our Team</a></li>
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="testimonials.html">Testimonials</a></li>
</ul>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="properties.html">Properties</a>
<!-- RD Navbar Dropdown-->
<ul class="rd-menu rd-navbar-dropdown">
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="single-property.html">Single Property</a></li>
</ul>
</li>
<li class="rd-nav-item active"><a class="rd-nav-link" href="#">Blog</a>
<!-- RD Navbar Dropdown-->
<ul class="rd-menu rd-navbar-dropdown">
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="grid-blog.html">Grid Blog</a></li>
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="sidebar-blog.html">Sidebar Blog</a></li>
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="single-blog-post.html">Single Blog Post</a></li>
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="blog-layouts.html">Blog Layouts</a></li>
</ul>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="#">Pages</a>
<!-- RD Navbar Megamenu-->
<ul class="rd-menu rd-navbar-megamenu">
<li class="rd-megamenu-item">
<ul class="rd-megamenu-list">
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="typography.html">Typography</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="buttons.html">Buttons</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="forms.html">Forms</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="progress-bars.html">Progress bars</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="tabs.html">Tabs</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="tables.html">Tables</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="accordions.html">Accordions</a></li>
</ul>
</li>
<li class="rd-megamenu-item">
<ul class="rd-megamenu-list">
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="small-features.html">Small Features</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="large-features.html">Large Features</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="careers.html">Careers</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="search-results.html">Search results</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="single-job.html">Single Job</a></li>
</ul>
</li>
<li class="rd-megamenu-item">
<ul class="rd-megamenu-list">
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="404-page.html">404 Page</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="503-page.html">503 Page</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="coming-soon.html">Coming Soon</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="privacy-policy.html">Privacy policy</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="under-construction.html">Under Construction</a></li>
</ul>
</li>
</ul>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="contacts.html">Contacts</a>
</li>
</ul>
</div>
</div>
</div>
</nav>
</div>
</header>
<!-- Breadcrumbs -->
<section class="breadcrumbs-custom bg-image context-dark" style="background-image: url(images/breadcrumbs-image-1.jpg);">
<div class="breadcrumbs-custom-inner">
<div class="container breadcrumbs-custom-container">
<div class="breadcrumbs-custom-main">
<h6 class="breadcrumbs-custom-subtitle title-decorated">Blog</h6>
<h2 class="text-uppercase breadcrumbs-custom-title">Blog Layouts</h2>
</div>
<ul class="breadcrumbs-custom-path">
<li><a href="index.html">Home</a></li>
<li><a href="#">Blog</a></li>
<li class="active">Blog Layouts</li>
</ul>
</div>
</div>
</section>
<!-- 3 Column Layout-->
<section class="section section-lg bg-gray-100 text-center">
<div class="container">
<h3>3 Column Layout</h3>
<div class="row row-50">
<div class="col-sm-6 col-lg-4 wow-outer">
<!-- Post Classic-->
<article class="post-classic wow slideInLeft"><a class="post-classic-media" href="single-blog-post.html"><img src="images/sidebar-blog-1-370x264.jpg" alt="" width="370" height="264"/></a>
<ul class="post-classic-meta">
<li><a class="button-winona" href="#">News</a></li>
<li>
<time datetime="2018">Apr 21, 2018 at 12:05 pm</time>
</li>
</ul>
<h4 class="post-classic-title"><a class="post-modern-title" href="single-blog-post.html">Real Estate Guide: 7 Important Tips for Buying a Home</a></h4>
</article>
</div>
<div class="col-sm-6 col-lg-4 wow-outer">
<!-- Post Classic-->
<article class="post-classic wow slideInLeft" data-wow-delay=".05s"><a class="post-classic-media" href="single-blog-post.html"><img src="images/sidebar-blog-2-370x264.jpg" alt="" width="370" height="264"/></a>
<ul class="post-classic-meta">
<li><a class="button-winona" href="#">Tips</a></li>
<li>
<time datetime="2018">Apr 21, 2018 at 12:05 pm</time>
</li>
</ul>
<h4 class="post-classic-title"><a class="post-modern-title" href="single-blog-post.html">Start These Habits Now If You Want to Buy a Home Next Year</a></h4>
</article>
</div>
<div class="col-sm-6 col-lg-4 wow-outer">
<!-- Post Classic-->
<article class="post-classic wow slideInLeft" data-wow-delay=".1s"><a class="post-classic-media" href="single-blog-post.html"><img src="images/sidebar-blog-3-370x264.jpg" alt="" width="370" height="264"/></a>
<ul class="post-classic-meta">
<li><a class="button-winona" href="#">News</a></li>
<li>
<time datetime="2018">Apr 21, 2018 at 12:05 pm</time>
</li>
</ul>
<h4 class="post-classic-title"><a class="post-modern-title" href="single-blog-post.html">7 Signs the Home Youre Buying Will Have Good Resale Value</a></h4>
</article>
</div>
</div>
<div class="wow-outer button-outer"><a class="button button-lg button-primary button-winona wow slideInUp" href="grid-blog.html">View all Blog posts</a></div>
</div>
</section>
<!-- 2 Column Layout-->
<section class="section section-lg text-center">
<div class="container">
<h3>2 Column Layout</h3>
<div class="row row-50">
<div class="col-md-6 wow-outer">
<!-- Post Modern-->
<article class="post-modern wow slideInLeft"><a class="post-modern-media" href="single-blog-post.html"><img src="images/grid-blog-1-571x353.jpg" alt="" width="571" height="353"/></a>
<h4 class="post-modern-title"><a class="post-modern-title" href="single-blog-post.html">5619 Walnut Hill Ln, Dallas, TX 75229</a></h4>
<ul class="post-modern-meta">
<li><a class="button-winona" href="#">$1500/mon</a></li>
<li>30 Sq. Ft.</li>
<li>3 Bedrooms</li>
</ul>
<p>A comfortable residential property located in a quiet and cozy area.</p>
</article>
</div>
<div class="col-md-6 wow-outer">
<!-- Post Modern-->
<article class="post-modern wow slideInLeft"><a class="post-modern-media" href="single-blog-post.html"><img src="images/grid-blog-2-571x353.jpg" alt="" width="571" height="353"/></a>
<h4 class="post-modern-title"><a class="post-modern-title" href="single-blog-post.html">1808 Bolingbroke Pl, Fort Worth, TX 76140</a></h4>
<ul class="post-modern-meta">
<li><a class="button-winona" href="#">$1300/mon</a></li>
<li>40 Sq. Ft.</li>
<li>2 Bedrooms</li>
</ul>
<p>Perfect for those who love both city life and the countryside.</p>
</article>
</div>
</div><a class="button button-primary-outline button-winona" href="grid-blog.html">View all</a>
</div>
</section>
<!-- News Posts Layout-->
<section class="section section-lg bg-gray-100">
<div class="container">
<h3 class="text-center">News Posts Layout</h3>
<div class="row row-50 justify-content-center justify-content-lg-start">
<div class="col-md-10 col-lg-7 wow-outer">
<!-- Post Block-->
<article class="post-block bg-gray-700"><img class="post-block-image" src="images/blog-layouts-5-637x456.jpg" alt="" width="637" height="456"/>
<div class="post-block-caption">
<ul class="post-block-meta">
<li class="wow-outer"><span class="wow slideInLeft">by Theresa Barnes</span></li>
<li class="wow-outer"><a class="button-winona wow slideInLeft" href="#">News</a></li>
<li class="wow-outer">
<time class="wow slideInLeft" datetime="2018">April 2, 2018</time>
</li>
</ul>
<h4 class="post-block-title"><a href="single-blog-post.html">7 Important Tips for Buying a Home</a></h4>
</div>
<div class="post-block-dummy"></div>
</article>
</div>
<div class="col-md-10 col-lg-5">
<div class="post-light-group wow-outer">
<!-- Post Light-->
<article class="post-light wow slideInLeft">
<time class="post-light-time" datetime="2018"><span class="post-light-time-big">29</span><span class="post-light-time-small">April</span></time>
<div class="post-light-main">
<h4 class="post-light-title"><a href="single-blog-post.html">Useful Habits for Potential Home Buyers</a></h4>
<ul class="post-light-meta">
<li>by Mike Barnes</li>
<li><a class="button-winona" href="#">News</a></li>
</ul>
</div>
</article>
<!-- Post Light-->
<article class="post-light wow slideInLeft">
<time class="post-light-time" datetime="2018"><span class="post-light-time-big">30</span><span class="post-light-time-small">April</span></time>
<div class="post-light-main">
<h4 class="post-light-title"><a href="single-blog-post.html">7 Signs of Your Home's Good Resale Value</a></h4>
<ul class="post-light-meta">
<li>by Mike Barnes</li>
<li><a class="button-winona" href="#">News</a></li>
</ul>
</div>
</article>
<!-- Post Light-->
<article class="post-light wow slideInLeft">
<time class="post-light-time" datetime="2018"><span class="post-light-time-big">2</span><span class="post-light-time-small">May</span></time>
<div class="post-light-main">
<h4 class="post-light-title"><a href="single-blog-post.html">Single-Family Homes as a Housing Option</a></h4>
<ul class="post-light-meta">
<li>by Mike Barnes</li>
<li><a class="button-winona" href="#">News</a></li>
</ul>
</div>
</article>
</div>
<div class="wow-outer button-outer"><a class="button button-primary button-winona wow slideInDown" href="grid-blog.html">View all posts</a></div>
</div>
</div>
</div>
</section>
<!-- Residential property categories-->
<section class="section-lg text-center">
<div class="container">
<h3 class="text-uppercase">Residential property categories</h3>
<p><span class="text-width-1">At our agency, we work with various types of residential real estate property. You can find out more about our properties by browsing our website.</span></p>
<div class="row row-50 row-xxl-70 offset-top-2">
<div class="col-sm-6 col-lg-3">
<!-- Thumbnail Light-->
<article class="thumbnail-light"><a class="thumbnail-light-media" href="single-property.html"><img class="thumbnail-light-image" src="images/service-thumbnail-1-270x300.jpg" alt="" width="270" height="300"/></a>
<h4 class="thumbnail-light-title"><a href="single-property.html">Single-Family Homes</a></h4>
</article>
</div>
<div class="col-sm-6 col-lg-3">
<!-- Thumbnail Light-->
<article class="thumbnail-light"><a class="thumbnail-light-media" href="single-property.html"><img class="thumbnail-light-image" src="images/service-thumbnail-2-270x300.jpg" alt="" width="270" height="300"/></a>
<h4 class="thumbnail-light-title"><a href="single-property.html">Townhouses</a></h4>
</article>
</div>
<div class="col-sm-6 col-lg-3">
<!-- Thumbnail Light-->
<article class="thumbnail-light"><a class="thumbnail-light-media" href="single-property.html"><img class="thumbnail-light-image" src="images/service-thumbnail-3-270x300.jpg" alt="" width="270" height="300"/></a>
<h4 class="thumbnail-light-title"><a href="single-property.html">Multi-Family Homes</a></h4>
</article>
</div>
<div class="col-sm-6 col-lg-3">
<!-- Thumbnail Light-->
<article class="thumbnail-light"><a class="thumbnail-light-media" href="single-property.html"><img class="thumbnail-light-image" src="images/service-thumbnail-4-270x300.jpg" alt="" width="270" height="300"/></a>
<h4 class="thumbnail-light-title"><a href="single-property.html">Condominiums</a></h4>
</article>
</div>
<div class="col-md-12 wow-outer"><a class="button button-primary-outline button-winona" href="grid-blog.html">View all</a></div>
</div>
</div>
</section>
<!-- Page Footer-->
<footer class="section footer-advanced bg-gray-700">
<div class="footer-advanced-main">
<div class="container">
<div class="row row-50">
<div class="col-lg-4">
<h5 class="font-weight-bold text-uppercase text-white">About Us</h5>
<p class="footer-advanced-text">inHouse is the largest full-service real estate and property management company. We offer expertise in the marketing and sale of a wide range of properties, including residential real estate, farms and lifestyle blocks, as well as commercial and industrial properties that we hope may interest you.</p>
</div>
<div class="col-sm-7 col-md-5 col-lg-4">
<h5 class="font-weight-bold text-uppercase text-white">Recent Blog Posts</h5>
<!-- Post Inline-->
<article class="post-inline">
<p class="post-inline-title"><a href="single-blog-post.html">Real Estate Guide: 7 Important Tips for Buying a Home</a></p>
<ul class="post-inline-meta">
<li>by Mike Barnes</li>
<li><a href="single-blog-post.html">2 days ago</a></li>
</ul>
</article>
<!-- Post Inline-->
<article class="post-inline">
<p class="post-inline-title"><a href="single-blog-post.html">Single-Family Homes as a Housing Option for Young Families</a></p>
<ul class="post-inline-meta">
<li>by Mike Barnes</li>
<li><a href="single-blog-post.html">2 days ago</a></li>
</ul>
</article>
</div>
<div class="col-sm-5 col-md-7 col-lg-4">
<h5 class="font-weight-bold text-uppercase text-white">Gallery</h5>
<div class="row row-x-10" data-lightgallery="group">
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-1.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-1-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-2.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-2-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-3.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-3-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-4.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-4-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-5.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-5-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-6.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-6-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"> </div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-7.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-7-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-8.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-8-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
</div>
</div>
</div>
</div>
</div>
<div class="footer-advanced-aside">
<div class="container">
<div class="footer-advanced-layout">
<div>
<ul class="list-nav">
<li><a href="index.html">Home</a></li>
<li><a href="about-us.html">About</a></li>
<li><a href="properties.html">Properties</a></li>
<li><a href="grid-blog.html">Blog</a></li>
<li><a href="contacts.html">Contacts</a></li>
</ul>
</div>
<div>
<ul class="foter-social-links list-inline list-inline-md">
<li><a class="icon icon-sm link-default mdi mdi-facebook" href="#"></a></li>
<li><a class="icon icon-sm link-default mdi mdi-twitter" href="#"></a></li>
<li><a class="icon icon-sm link-default mdi mdi-instagram" href="#"></a></li>
<li><a class="icon icon-sm link-default mdi mdi-google" href="#"></a></li>
<li><a class="icon icon-sm link-default mdi mdi-linkedin" href="#"></a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="container">
<hr>
</div>
<div class="footer-advanced-aside">
<div class="container">
<div class="footer-advanced-layout"><a class="brand" href="index.html"><img src="images/logo-light-115x34.png" alt="" width="115" height="34" srcset="images/logo-light-115x34.png 2x"/></a>
<!-- Rights-->
<p class="rights"><span>&copy;&nbsp;</span><span class="copyright-year"></span><span>&nbsp;</span><span>All Rights Reserved.</span><span>&nbsp;</span><br class="d-sm-none"/><a href="#">Terms of Use</a><span> and</span><span>&nbsp;</span><a href="privacy-policy.html">Privacy Policy</a></p>
</div>
</div>
</div>
</footer>
</div>
<div class="preloader">
<div class="preloader-logo"><img src="images/logo-default-151x44.png" alt="" width="151" height="44" srcset="images/logo-default-151x44.png 2x"/>
</div>
<div class="preloader-body">
<div id="loadingProgressG">
<div class="loadingProgressG" id="loadingProgressG_1"></div>
</div>
</div>
</div>
<!-- Global Mailform Output-->
<div class="snackbars" id="form-output-global"></div>
<!-- Javascript-->
<script src="js/core.min.js"></script>
<script src="js/script.js"></script>
</body>
</html>
+302
View File
@@ -0,0 +1,302 @@
<!DOCTYPE html>
<html class="wide wow-animation" lang="en">
<head>
<title>Buttons</title>
<meta name="format-detection" content="telephone=no">
<meta name="viewport" content="width=device-width height=device-height initial-scale=1.0 maximum-scale=1.0 user-scalable=0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta charset="utf-8">
<link rel="icon" href="images/favicon.ico" type="image/x-icon">
<!-- Stylesheets-->
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700,800%7CPoppins:300,400,700">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/fonts.css">
<link rel="stylesheet" href="css/style.css" id="main-styles-link">
<!--[if lt IE 10]>
<div style="background: #212121; padding: 10px 0; box-shadow: 3px 3px 5px 0 rgba(0,0,0,.3); clear: both; text-align:center; position: relative; z-index:1;"><a href="http://windows.microsoft.com/en-US/internet-explorer/"><img src="images/ie8-panel/warning_bar_0000_us.jpg" border="0" height="42" width="820" alt="You are using an outdated browser. For a faster, safer browsing experience, upgrade for free today."></a></div>
<script src="js/html5shiv.min.js"></script>
<![endif]-->
</head>
<body>
<div class="page">
<!-- Page Header-->
<header class="section page-header">
<!-- RD Navbar-->
<div class="rd-navbar-wrap">
<nav class="rd-navbar rd-navbar-corporate" data-layout="rd-navbar-fixed" data-sm-layout="rd-navbar-fixed" data-md-layout="rd-navbar-fixed" data-md-device-layout="rd-navbar-fixed" data-lg-layout="rd-navbar-static" data-lg-device-layout="rd-navbar-static" data-lg-stick-up="true" data-lg-stick-up-offset="118px" data-xl-layout="rd-navbar-static" data-xl-device-layout="rd-navbar-static" data-xl-stick-up="true" data-xl-stick-up-offset="118px" data-xxl-layout="rd-navbar-static" data-xxl-device-layout="rd-navbar-static" data-xxl-stick-up-offset="118px" data-xxl-stick-up="true">
<div class="rd-navbar-aside-outer">
<div class="rd-navbar-aside">
<!-- RD Navbar Panel-->
<div class="rd-navbar-panel">
<!-- RD Navbar Toggle-->
<button class="rd-navbar-toggle" data-rd-navbar-toggle="#rd-navbar-nav-wrap-1"><span></span></button>
<!-- RD Navbar Brand--><a class="rd-navbar-brand" href="index.html"><img src="images/logo-default-151x44.png" alt="" width="151" height="44" srcset="images/logo-default-151x44.png 2x"/></a>
</div>
<div class="rd-navbar-collapse">
<button class="rd-navbar-collapse-toggle rd-navbar-fixed-element-1" data-rd-navbar-toggle="#rd-navbar-collapse-content-1"><span></span></button>
<div class="rd-navbar-collapse-content" id="rd-navbar-collapse-content-1">
<article class="unit align-items-center">
<div class="unit-left"><span class="icon icon-md icon-modern mdi mdi-phone"></span></div>
<div class="unit-body">
<ul class="list-0">
<li><a class="link-default" href="tel:#">1-800-1234-567</a></li>
<li><a class="link-default" href="tel:#">1-800-8763-765</a></li>
</ul>
</div>
</article>
<article class="unit align-items-center">
<div class="unit-left"><span class="icon icon-md icon-modern mdi mdi-map-marker"></span></div>
<div class="unit-body"><a class="link-default" href="tel:#">2130 Fulton Street <br> San Diego, CA 94117-1080</a></div>
</article><a class="button button-gray-bordered button-winona" href="#">Request a call</a>
</div>
</div>
</div>
</div>
<div class="rd-navbar-main-outer">
<div class="rd-navbar-main">
<div class="rd-navbar-nav-wrap" id="rd-navbar-nav-wrap-1">
<!-- RD Navbar Search-->
<div class="rd-navbar-search" id="rd-navbar-search-1">
<button class="rd-navbar-search-toggle" data-rd-navbar-toggle="#rd-navbar-search-1"><span></span></button>
<form class="rd-search" action="search-results.html" data-search-live="rd-search-results-live-1" method="GET">
<div class="form-wrap">
<label class="form-label" for="rd-navbar-search-form-input-1">Search...</label>
<input class="form-input rd-navbar-search-form-input" id="rd-navbar-search-form-input-1" type="text" name="s" autocomplete="off">
<div class="rd-search-results-live" id="rd-search-results-live-1"></div>
</div>
<button class="rd-search-form-submit fa-search" type="submit"></button>
</form>
</div>
<!-- RD Navbar Nav-->
<ul class="rd-navbar-nav">
<li class="rd-nav-item"><a class="rd-nav-link" href="index.html">Home</a>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="about-us.html">About us</a>
<!-- RD Navbar Dropdown-->
<ul class="rd-menu rd-navbar-dropdown">
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="our-team.html">Our Team</a></li>
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="testimonials.html">Testimonials</a></li>
</ul>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="properties.html">Properties</a>
<!-- RD Navbar Dropdown-->
<ul class="rd-menu rd-navbar-dropdown">
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="single-property.html">Single Property</a></li>
</ul>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="#">Blog</a>
<!-- RD Navbar Dropdown-->
<ul class="rd-menu rd-navbar-dropdown">
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="grid-blog.html">Grid Blog</a></li>
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="sidebar-blog.html">Sidebar Blog</a></li>
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="single-blog-post.html">Single Blog Post</a></li>
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="blog-layouts.html">Blog Layouts</a></li>
</ul>
</li>
<li class="rd-nav-item active"><a class="rd-nav-link" href="#">Pages</a>
<!-- RD Navbar Megamenu-->
<ul class="rd-menu rd-navbar-megamenu">
<li class="rd-megamenu-item">
<ul class="rd-megamenu-list">
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="typography.html">Typography</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="buttons.html">Buttons</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="forms.html">Forms</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="progress-bars.html">Progress bars</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="tabs.html">Tabs</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="tables.html">Tables</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="accordions.html">Accordions</a></li>
</ul>
</li>
<li class="rd-megamenu-item">
<ul class="rd-megamenu-list">
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="small-features.html">Small Features</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="large-features.html">Large Features</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="careers.html">Careers</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="search-results.html">Search results</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="single-job.html">Single Job</a></li>
</ul>
</li>
<li class="rd-megamenu-item">
<ul class="rd-megamenu-list">
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="404-page.html">404 Page</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="503-page.html">503 Page</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="coming-soon.html">Coming Soon</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="privacy-policy.html">Privacy policy</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="under-construction.html">Under Construction</a></li>
</ul>
</li>
</ul>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="contacts.html">Contacts</a>
</li>
</ul>
</div>
</div>
</div>
</nav>
</div>
</header>
<!-- Breadcrumbs -->
<section class="breadcrumbs-custom bg-image context-dark" style="background-image: url(images/breadcrumbs-image-1.jpg);">
<div class="breadcrumbs-custom-inner">
<div class="container breadcrumbs-custom-container">
<div class="breadcrumbs-custom-main">
<h6 class="breadcrumbs-custom-subtitle title-decorated">Pages</h6>
<h2 class="text-uppercase breadcrumbs-custom-title">Buttons</h2>
</div>
<ul class="breadcrumbs-custom-path">
<li><a href="index.html">Home</a></li>
<li><a href="#">Pages</a></li>
<li class="active">Buttons</li>
</ul>
</div>
</div>
</section>
<!-- Button Sizes-->
<section class="section section-sm section-first">
<div class="container">
<h6>Button Sizes</h6>
<div class="group group-middle">
<div class="button button-lg button-primary button-winona">Large button</div>
<div class="button button-lg button-primary-outline button-winona">Light Large </div>
</div>
<div class="group group-middle">
<div class="button button-primary button-winona">Medium button</div>
<div class="button button-primary-outline button-winona">Light Medium</div>
</div>
<div class="group group-middle">
<div class="button button-sm button-primary button-winona">Small button</div>
<div class="button button-sm button-primary-outline button-winona">Light Small</div>
</div>
</div>
</section>
<!-- Icon buttons-->
<section class="section section-sm">
<div class="container">
<h6>Icon buttons</h6>
<div class="group group-middle">
<div class="button button-icon button-icon-left button-lg button-primary button-winona"><span class="icon mdi mdi-magnify"></span>Search</div>
<div class="button button-icon button-icon-left button-lg button-primary-outline button-winona"><span class="icon mdi mdi-magnify"></span>Search </div>
</div>
<div class="group group-middle">
<div class="button button-icon button-icon-left button-primary button-winona"><span class="icon mdi mdi-magnify"></span>Search</div>
<div class="button button-icon button-icon-left button-primary-outline button-winona"><span class="icon mdi mdi-magnify"></span>Search</div>
</div>
<div class="group group-middle">
<div class="button button-icon button-icon-left button-sm button-primary button-winona"><span class="icon mdi mdi-magnify"></span>Search</div>
<div class="button button-icon button-icon-left button-sm button-primary-outline button-winona"><span class="icon mdi mdi-magnify"></span>Search</div>
</div>
</div>
</section>
<!-- Social buttons-->
<section class="section section-sm section-last">
<div class="container">
<h6>Social buttons</h6>
<div class="group group-xs group-middle"><a class="icon icon-sm icon-creative mdi mdi-facebook" href="#"></a><a class="icon icon-sm icon-creative mdi mdi-twitter" href="#"></a><a class="icon icon-sm icon-creative mdi mdi-instagram" href="#"></a><a class="icon icon-sm icon-creative mdi mdi-google" href="#"></a><a class="icon icon-sm icon-creative mdi mdi-linkedin" href="#"></a></div>
</div>
</section>
<!-- Page Footer-->
<footer class="section footer-advanced bg-gray-700">
<div class="footer-advanced-main">
<div class="container">
<div class="row row-50">
<div class="col-lg-4">
<h5 class="font-weight-bold text-uppercase text-white">About Us</h5>
<p class="footer-advanced-text">inHouse is the largest full-service real estate and property management company. We offer expertise in the marketing and sale of a wide range of properties, including residential real estate, farms and lifestyle blocks, as well as commercial and industrial properties that we hope may interest you.</p>
</div>
<div class="col-sm-7 col-md-5 col-lg-4">
<h5 class="font-weight-bold text-uppercase text-white">Recent Blog Posts</h5>
<!-- Post Inline-->
<article class="post-inline">
<p class="post-inline-title"><a href="single-blog-post.html">Real Estate Guide: 7 Important Tips for Buying a Home</a></p>
<ul class="post-inline-meta">
<li>by Mike Barnes</li>
<li><a href="single-blog-post.html">2 days ago</a></li>
</ul>
</article>
<!-- Post Inline-->
<article class="post-inline">
<p class="post-inline-title"><a href="single-blog-post.html">Single-Family Homes as a Housing Option for Young Families</a></p>
<ul class="post-inline-meta">
<li>by Mike Barnes</li>
<li><a href="single-blog-post.html">2 days ago</a></li>
</ul>
</article>
</div>
<div class="col-sm-5 col-md-7 col-lg-4">
<h5 class="font-weight-bold text-uppercase text-white">Gallery</h5>
<div class="row row-x-10" data-lightgallery="group">
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-1.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-1-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-2.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-2-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-3.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-3-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-4.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-4-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-5.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-5-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-6.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-6-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"> </div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-7.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-7-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-8.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-8-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
</div>
</div>
</div>
</div>
</div>
<div class="footer-advanced-aside">
<div class="container">
<div class="footer-advanced-layout">
<div>
<ul class="list-nav">
<li><a href="index.html">Home</a></li>
<li><a href="about-us.html">About</a></li>
<li><a href="properties.html">Properties</a></li>
<li><a href="grid-blog.html">Blog</a></li>
<li><a href="contacts.html">Contacts</a></li>
</ul>
</div>
<div>
<ul class="foter-social-links list-inline list-inline-md">
<li><a class="icon icon-sm link-default mdi mdi-facebook" href="#"></a></li>
<li><a class="icon icon-sm link-default mdi mdi-twitter" href="#"></a></li>
<li><a class="icon icon-sm link-default mdi mdi-instagram" href="#"></a></li>
<li><a class="icon icon-sm link-default mdi mdi-google" href="#"></a></li>
<li><a class="icon icon-sm link-default mdi mdi-linkedin" href="#"></a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="container">
<hr>
</div>
<div class="footer-advanced-aside">
<div class="container">
<div class="footer-advanced-layout"><a class="brand" href="index.html"><img src="images/logo-light-115x34.png" alt="" width="115" height="34" srcset="images/logo-light-115x34.png 2x"/></a>
<!-- Rights-->
<p class="rights"><span>&copy;&nbsp;</span><span class="copyright-year"></span><span>&nbsp;</span><span>All Rights Reserved.</span><span>&nbsp;</span><br class="d-sm-none"/><a href="#">Terms of Use</a><span> and</span><span>&nbsp;</span><a href="privacy-policy.html">Privacy Policy</a></p>
</div>
</div>
</div>
</footer>
</div>
<div class="preloader">
<div class="preloader-logo"><img src="images/logo-default-151x44.png" alt="" width="151" height="44" srcset="images/logo-default-151x44.png 2x"/>
</div>
<div class="preloader-body">
<div id="loadingProgressG">
<div class="loadingProgressG" id="loadingProgressG_1"></div>
</div>
</div>
</div>
<!-- Global Mailform Output-->
<div class="snackbars" id="form-output-global"></div>
<!-- Javascript-->
<script src="js/core.min.js"></script>
<script src="js/script.js"></script>
</body>
</html>
+365
View File
@@ -0,0 +1,365 @@
<!DOCTYPE html>
<html class="wide wow-animation" lang="en">
<head>
<title>Careers</title>
<meta name="format-detection" content="telephone=no">
<meta name="viewport" content="width=device-width height=device-height initial-scale=1.0 maximum-scale=1.0 user-scalable=0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta charset="utf-8">
<link rel="icon" href="images/favicon.ico" type="image/x-icon">
<!-- Stylesheets-->
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700,800%7CPoppins:300,400,700">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/fonts.css">
<link rel="stylesheet" href="css/style.css" id="main-styles-link">
<!--[if lt IE 10]>
<div style="background: #212121; padding: 10px 0; box-shadow: 3px 3px 5px 0 rgba(0,0,0,.3); clear: both; text-align:center; position: relative; z-index:1;"><a href="http://windows.microsoft.com/en-US/internet-explorer/"><img src="images/ie8-panel/warning_bar_0000_us.jpg" border="0" height="42" width="820" alt="You are using an outdated browser. For a faster, safer browsing experience, upgrade for free today."></a></div>
<script src="js/html5shiv.min.js"></script>
<![endif]-->
</head>
<body>
<div class="page">
<!-- Page Header-->
<header class="section page-header">
<!-- RD Navbar-->
<div class="rd-navbar-wrap">
<nav class="rd-navbar rd-navbar-corporate" data-layout="rd-navbar-fixed" data-sm-layout="rd-navbar-fixed" data-md-layout="rd-navbar-fixed" data-md-device-layout="rd-navbar-fixed" data-lg-layout="rd-navbar-static" data-lg-device-layout="rd-navbar-static" data-lg-stick-up="true" data-lg-stick-up-offset="118px" data-xl-layout="rd-navbar-static" data-xl-device-layout="rd-navbar-static" data-xl-stick-up="true" data-xl-stick-up-offset="118px" data-xxl-layout="rd-navbar-static" data-xxl-device-layout="rd-navbar-static" data-xxl-stick-up-offset="118px" data-xxl-stick-up="true">
<div class="rd-navbar-aside-outer">
<div class="rd-navbar-aside">
<!-- RD Navbar Panel-->
<div class="rd-navbar-panel">
<!-- RD Navbar Toggle-->
<button class="rd-navbar-toggle" data-rd-navbar-toggle="#rd-navbar-nav-wrap-1"><span></span></button>
<!-- RD Navbar Brand--><a class="rd-navbar-brand" href="index.html"><img src="images/logo-default-151x44.png" alt="" width="151" height="44" srcset="images/logo-default-151x44.png 2x"/></a>
</div>
<div class="rd-navbar-collapse">
<button class="rd-navbar-collapse-toggle rd-navbar-fixed-element-1" data-rd-navbar-toggle="#rd-navbar-collapse-content-1"><span></span></button>
<div class="rd-navbar-collapse-content" id="rd-navbar-collapse-content-1">
<article class="unit align-items-center">
<div class="unit-left"><span class="icon icon-md icon-modern mdi mdi-phone"></span></div>
<div class="unit-body">
<ul class="list-0">
<li><a class="link-default" href="tel:#">1-800-1234-567</a></li>
<li><a class="link-default" href="tel:#">1-800-8763-765</a></li>
</ul>
</div>
</article>
<article class="unit align-items-center">
<div class="unit-left"><span class="icon icon-md icon-modern mdi mdi-map-marker"></span></div>
<div class="unit-body"><a class="link-default" href="tel:#">2130 Fulton Street <br> San Diego, CA 94117-1080</a></div>
</article><a class="button button-gray-bordered button-winona" href="#">Request a call</a>
</div>
</div>
</div>
</div>
<div class="rd-navbar-main-outer">
<div class="rd-navbar-main">
<div class="rd-navbar-nav-wrap" id="rd-navbar-nav-wrap-1">
<!-- RD Navbar Search-->
<div class="rd-navbar-search" id="rd-navbar-search-1">
<button class="rd-navbar-search-toggle" data-rd-navbar-toggle="#rd-navbar-search-1"><span></span></button>
<form class="rd-search" action="search-results.html" data-search-live="rd-search-results-live-1" method="GET">
<div class="form-wrap">
<label class="form-label" for="rd-navbar-search-form-input-1">Search...</label>
<input class="form-input rd-navbar-search-form-input" id="rd-navbar-search-form-input-1" type="text" name="s" autocomplete="off">
<div class="rd-search-results-live" id="rd-search-results-live-1"></div>
</div>
<button class="rd-search-form-submit fa-search" type="submit"></button>
</form>
</div>
<!-- RD Navbar Nav-->
<ul class="rd-navbar-nav">
<li class="rd-nav-item"><a class="rd-nav-link" href="index.html">Home</a>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="about-us.html">About us</a>
<!-- RD Navbar Dropdown-->
<ul class="rd-menu rd-navbar-dropdown">
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="our-team.html">Our Team</a></li>
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="testimonials.html">Testimonials</a></li>
</ul>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="properties.html">Properties</a>
<!-- RD Navbar Dropdown-->
<ul class="rd-menu rd-navbar-dropdown">
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="single-property.html">Single Property</a></li>
</ul>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="#">Blog</a>
<!-- RD Navbar Dropdown-->
<ul class="rd-menu rd-navbar-dropdown">
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="grid-blog.html">Grid Blog</a></li>
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="sidebar-blog.html">Sidebar Blog</a></li>
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="single-blog-post.html">Single Blog Post</a></li>
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="blog-layouts.html">Blog Layouts</a></li>
</ul>
</li>
<li class="rd-nav-item active"><a class="rd-nav-link" href="#">Pages</a>
<!-- RD Navbar Megamenu-->
<ul class="rd-menu rd-navbar-megamenu">
<li class="rd-megamenu-item">
<ul class="rd-megamenu-list">
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="typography.html">Typography</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="buttons.html">Buttons</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="forms.html">Forms</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="progress-bars.html">Progress bars</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="tabs.html">Tabs</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="tables.html">Tables</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="accordions.html">Accordions</a></li>
</ul>
</li>
<li class="rd-megamenu-item">
<ul class="rd-megamenu-list">
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="small-features.html">Small Features</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="large-features.html">Large Features</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="careers.html">Careers</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="search-results.html">Search results</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="single-job.html">Single Job</a></li>
</ul>
</li>
<li class="rd-megamenu-item">
<ul class="rd-megamenu-list">
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="404-page.html">404 Page</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="503-page.html">503 Page</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="coming-soon.html">Coming Soon</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="privacy-policy.html">Privacy policy</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="under-construction.html">Under Construction</a></li>
</ul>
</li>
</ul>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="contacts.html">Contacts</a>
</li>
</ul>
</div>
</div>
</div>
</nav>
</div>
</header>
<!-- Breadcrumbs -->
<section class="breadcrumbs-custom bg-image context-dark" style="background-image: url(images/breadcrumbs-image-1.jpg);">
<div class="breadcrumbs-custom-inner">
<div class="container breadcrumbs-custom-container">
<div class="breadcrumbs-custom-main">
<h6 class="breadcrumbs-custom-subtitle title-decorated">Pages</h6>
<h2 class="text-uppercase breadcrumbs-custom-title">Careers</h2>
</div>
<ul class="breadcrumbs-custom-path">
<li><a href="index.html">Home</a></li>
<li><a href="#">Pages</a></li>
<li class="active">Careers</li>
</ul>
</div>
</div>
</section>
<!-- Working at CaseCraft-->
<section class="section section-lg">
<div class="container">
<div class="row row-50 justify-content-center justify-content-lg-between flex-lg-row-reverse">
<div class="col-md-10 col-lg-6 col-xl-5">
<h3>Working at inHouse</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Donec et odio pellentesque diam. Tortor pretium viverra suspendisse potenti nullam ac tortor vitae. Tellus elementum sagittis vitae et leo duis ut diam. Vitae ultricies leo integer malesuada nunc vel risus.</p><a class="button button-lg button-primary button-winona" href="about-us.html">Learn more</a>
</div>
<div class="col-md-10 col-lg-6 col-xl-6"><img class="img-responsive" src="images/careers-1-570x368.jpg" alt="" width="570" height="368"/>
</div>
</div>
</div>
</section>
<!-- Available Vacancies-->
<section class="section section-lg bg-gray-100 text-center">
<div class="container">
<h3>Available Vacancies</h3>
<div class="row row-45">
<div class="col-md-6 col-lg-4">
<!-- Career Classic-->
<article class="career-classic">
<h4 class="career-classic-title"><a class="post-modern-title" href="single-job.html">Residential Broker</a></h4>
<div class="career-classic-divider"></div>
<ul class="career-classic-list">
<li><span class="icon mdi mdi-calendar-clock"></span><span>Full Time</span></li>
<li><span class="icon mdi mdi-map-marker"></span><span>San Diego</span></li>
</ul>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</article>
</div>
<div class="col-md-6 col-lg-4">
<!-- Career Classic-->
<article class="career-classic">
<h4 class="career-classic-title"><a class="post-modern-title" href="single-job.html">Residential Appraiser</a></h4>
<div class="career-classic-divider"></div>
<ul class="career-classic-list">
<li><span class="icon mdi mdi-calendar-clock"></span><span>Full Time</span></li>
<li><span class="icon mdi mdi-map-marker"></span><span>San Diego</span></li>
</ul>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</article>
</div>
<div class="col-md-6 col-lg-4">
<!-- Career Classic-->
<article class="career-classic">
<h4 class="career-classic-title"><a class="post-modern-title" href="single-job.html">Real Estate Agent</a></h4>
<div class="career-classic-divider"></div>
<ul class="career-classic-list">
<li><span class="icon mdi mdi-calendar-clock"></span><span>Full Time</span></li>
<li><span class="icon mdi mdi-map-marker"></span><span>San Diego</span></li>
</ul>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</article>
</div>
<div class="col-md-6 col-lg-4">
<!-- Career Classic-->
<article class="career-classic">
<h4 class="career-classic-title"><a class="post-modern-title" href="single-job.html">Property Manager</a></h4>
<div class="career-classic-divider"></div>
<ul class="career-classic-list">
<li><span class="icon mdi mdi-calendar-clock"></span><span>Full Time</span></li>
<li><span class="icon mdi mdi-map-marker"></span><span>San Diego</span></li>
</ul>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</article>
</div>
<div class="col-md-6 col-lg-4">
<!-- Career Classic-->
<article class="career-classic">
<h4 class="career-classic-title"><a class="post-modern-title" href="single-job.html">Leasing Consultant</a></h4>
<div class="career-classic-divider"></div>
<ul class="career-classic-list">
<li><span class="icon mdi mdi-calendar-clock"></span><span>Full Time</span></li>
<li><span class="icon mdi mdi-map-marker"></span><span>San Diego</span></li>
</ul>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</article>
</div>
<div class="col-md-6 col-lg-4">
<!-- Career Classic-->
<article class="career-classic">
<h4 class="career-classic-title"><a class="post-modern-title" href="single-job.html">Commercial Broker</a></h4>
<div class="career-classic-divider"></div>
<ul class="career-classic-list">
<li><span class="icon mdi mdi-calendar-clock"></span><span>Full Time</span></li>
<li><span class="icon mdi mdi-map-marker"></span><span>San Diego</span></li>
</ul>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
</article>
</div>
</div><a class="button button-lg button-primary button-winona" href="#">Join Us</a>
</div>
</section>
<!-- Thin CTA-->
<section class="section section-xs bg-primary-darker text-center">
<div class="container">
<div class="row justify-content-center">
<div class="col-sm-10 col-md-12">
<div class="box-cta-thin">
<h4 class="wow-outer"><span class="wow slideInRight">Learn the Cost of your <span class="font-weight-bold">Next Property</span> Right Now!</span></h4>
<div class="wow-outer button-outer"><a class="button button-primary button-winona wow slideInLeft" href="#">View all pricing</a></div>
</div>
</div>
</div>
</div>
</section>
<!-- Page Footer-->
<footer class="section footer-advanced bg-gray-700">
<div class="footer-advanced-main">
<div class="container">
<div class="row row-50">
<div class="col-lg-4">
<h5 class="font-weight-bold text-uppercase text-white">About Us</h5>
<p class="footer-advanced-text">inHouse is the largest full-service real estate and property management company. We offer expertise in the marketing and sale of a wide range of properties, including residential real estate, farms and lifestyle blocks, as well as commercial and industrial properties that we hope may interest you.</p>
</div>
<div class="col-sm-7 col-md-5 col-lg-4">
<h5 class="font-weight-bold text-uppercase text-white">Recent Blog Posts</h5>
<!-- Post Inline-->
<article class="post-inline">
<p class="post-inline-title"><a href="single-blog-post.html">Real Estate Guide: 7 Important Tips for Buying a Home</a></p>
<ul class="post-inline-meta">
<li>by Mike Barnes</li>
<li><a href="single-blog-post.html">2 days ago</a></li>
</ul>
</article>
<!-- Post Inline-->
<article class="post-inline">
<p class="post-inline-title"><a href="single-blog-post.html">Single-Family Homes as a Housing Option for Young Families</a></p>
<ul class="post-inline-meta">
<li>by Mike Barnes</li>
<li><a href="single-blog-post.html">2 days ago</a></li>
</ul>
</article>
</div>
<div class="col-sm-5 col-md-7 col-lg-4">
<h5 class="font-weight-bold text-uppercase text-white">Gallery</h5>
<div class="row row-x-10" data-lightgallery="group">
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-1.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-1-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-2.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-2-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-3.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-3-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-4.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-4-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-5.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-5-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-6.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-6-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"> </div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-7.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-7-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-8.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-8-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
</div>
</div>
</div>
</div>
</div>
<div class="footer-advanced-aside">
<div class="container">
<div class="footer-advanced-layout">
<div>
<ul class="list-nav">
<li><a href="index.html">Home</a></li>
<li><a href="about-us.html">About</a></li>
<li><a href="properties.html">Properties</a></li>
<li><a href="grid-blog.html">Blog</a></li>
<li><a href="contacts.html">Contacts</a></li>
</ul>
</div>
<div>
<ul class="foter-social-links list-inline list-inline-md">
<li><a class="icon icon-sm link-default mdi mdi-facebook" href="#"></a></li>
<li><a class="icon icon-sm link-default mdi mdi-twitter" href="#"></a></li>
<li><a class="icon icon-sm link-default mdi mdi-instagram" href="#"></a></li>
<li><a class="icon icon-sm link-default mdi mdi-google" href="#"></a></li>
<li><a class="icon icon-sm link-default mdi mdi-linkedin" href="#"></a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="container">
<hr>
</div>
<div class="footer-advanced-aside">
<div class="container">
<div class="footer-advanced-layout"><a class="brand" href="index.html"><img src="images/logo-light-115x34.png" alt="" width="115" height="34" srcset="images/logo-light-115x34.png 2x"/></a>
<!-- Rights-->
<p class="rights"><span>&copy;&nbsp;</span><span class="copyright-year"></span><span>&nbsp;</span><span>All Rights Reserved.</span><span>&nbsp;</span><br class="d-sm-none"/><a href="#">Terms of Use</a><span> and</span><span>&nbsp;</span><a href="privacy-policy.html">Privacy Policy</a></p>
</div>
</div>
</div>
</footer>
</div>
<div class="preloader">
<div class="preloader-logo"><img src="images/logo-default-151x44.png" alt="" width="151" height="44" srcset="images/logo-default-151x44.png 2x"/>
</div>
<div class="preloader-body">
<div id="loadingProgressG">
<div class="loadingProgressG" id="loadingProgressG_1"></div>
</div>
</div>
</div>
<!-- Global Mailform Output-->
<div class="snackbars" id="form-output-global"></div>
<!-- Javascript-->
<script src="js/core.min.js"></script>
<script src="js/script.js"></script>
</body>
</html>
+78
View File
@@ -0,0 +1,78 @@
<!DOCTYPE html>
<html class="wide wow-animation" lang="en">
<head>
<title>Coming Soon</title>
<meta name="format-detection" content="telephone=no">
<meta name="viewport" content="width=device-width height=device-height initial-scale=1.0 maximum-scale=1.0 user-scalable=0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta charset="utf-8">
<link rel="icon" href="images/favicon.ico" type="image/x-icon">
<!-- Stylesheets-->
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700,800%7CPoppins:300,400,700">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/fonts.css">
<link rel="stylesheet" href="css/style.css" id="main-styles-link">
<!--[if lt IE 10]>
<div style="background: #212121; padding: 10px 0; box-shadow: 3px 3px 5px 0 rgba(0,0,0,.3); clear: both; text-align:center; position: relative; z-index:1;"><a href="http://windows.microsoft.com/en-US/internet-explorer/"><img src="images/ie8-panel/warning_bar_0000_us.jpg" border="0" height="42" width="820" alt="You are using an outdated browser. For a faster, safer browsing experience, upgrade for free today."></a></div>
<script src="js/html5shiv.min.js"></script>
<![endif]-->
</head>
<body>
<div class="page">
<!-- Page content-->
<section class="section section-single bg-gray-800" style="background-image: url(images/bg-image-5.jpg);">
<div class="section-single-inner">
<div class="section-single-dummy"></div>
<div class="section-single-main">
<div class="container">
<div class="row row-30 justify-content-center justify-content-sm-start">
<div class="col-sm-10 col-md-9 col-lg-7 col-xl-6">
<h6 class="title-decorated title-decorated-lg">We're getting ready to launch in</h6>
<!-- TimeCircles-->
<div class="countdown-wrap">
<div class="DateCountdown" data-type="until" data-date="2019-12-31 00:00:00" data-format="wdhms" data-color="#4854ed" data-bg="rgba(245, 245, 245, 1)" data-width="0.02"></div>
</div>
<p>Our website is under construction, we are working very hard to give you the best experience on our new web site.</p>
<div class="rd-mailform-wrap">
<!-- RD Mailform-->
<form class="rd-form rd-mailform form-inline" data-form-output="form-output-global" data-form-type="subscribe" method="post" action="bat/rd-mailform.php">
<div class="form-wrap">
<input class="form-input" id="subscribe-form-1-email" type="email" name="email" data-constraints="@Email @Required">
<label class="form-label" for="subscribe-form-1-email">Your e-mail</label>
</div>
<div class="form-button">
<button class="button button-primary button-winona" type="submit">Subscribe</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<div class="footer-minimal section-single-footer">
<div class="container">
<div class="footer-minimal-inner"><a class="brand" href="index.html"><img src="images/logo-inverse-151x44.png" alt="" width="151" height="44" srcset="images/logo-inverse-151x44.png 2x"/></a>
<!-- Rights-->
<p class="rights"><span>&copy;&nbsp;</span><span class="copyright-year"></span><span>&nbsp;</span><span>All Rights Reserved.</span><span>&nbsp;</span><br class="d-sm-none"/><a href="#">Terms of Use</a><span> and</span><span>&nbsp;</span><a href="privacy-policy.html">Privacy Policy</a></p>
</div>
</div>
</div>
</div>
</section>
</div>
<div class="preloader">
<div class="preloader-logo"><img src="images/logo-default-151x44.png" alt="" width="151" height="44" srcset="images/logo-default-151x44.png 2x"/>
</div>
<div class="preloader-body">
<div id="loadingProgressG">
<div class="loadingProgressG" id="loadingProgressG_1"></div>
</div>
</div>
</div>
<!-- Global Mailform Output-->
<div class="snackbars" id="form-output-global"></div>
<!-- Javascript-->
<script src="js/core.min.js"></script>
<script src="js/script.js"></script>
</body>
</html>
+348
View File
@@ -0,0 +1,348 @@
<!DOCTYPE html>
<html class="wide wow-animation" lang="en">
<head>
<title>Contacts</title>
<meta name="format-detection" content="telephone=no">
<meta name="viewport" content="width=device-width height=device-height initial-scale=1.0 maximum-scale=1.0 user-scalable=0">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta charset="utf-8">
<link rel="icon" href="images/favicon.ico" type="image/x-icon">
<!-- Stylesheets-->
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Work+Sans:300,400,500,700,800%7CPoppins:300,400,700">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/fonts.css">
<link rel="stylesheet" href="css/style.css" id="main-styles-link">
<!--[if lt IE 10]>
<div style="background: #212121; padding: 10px 0; box-shadow: 3px 3px 5px 0 rgba(0,0,0,.3); clear: both; text-align:center; position: relative; z-index:1;"><a href="http://windows.microsoft.com/en-US/internet-explorer/"><img src="images/ie8-panel/warning_bar_0000_us.jpg" border="0" height="42" width="820" alt="You are using an outdated browser. For a faster, safer browsing experience, upgrade for free today."></a></div>
<script src="js/html5shiv.min.js"></script>
<![endif]-->
</head>
<body>
<div class="page">
<!-- Page Header-->
<header class="section page-header">
<!-- RD Navbar-->
<div class="rd-navbar-wrap">
<nav class="rd-navbar rd-navbar-corporate" data-layout="rd-navbar-fixed" data-sm-layout="rd-navbar-fixed" data-md-layout="rd-navbar-fixed" data-md-device-layout="rd-navbar-fixed" data-lg-layout="rd-navbar-static" data-lg-device-layout="rd-navbar-static" data-lg-stick-up="true" data-lg-stick-up-offset="118px" data-xl-layout="rd-navbar-static" data-xl-device-layout="rd-navbar-static" data-xl-stick-up="true" data-xl-stick-up-offset="118px" data-xxl-layout="rd-navbar-static" data-xxl-device-layout="rd-navbar-static" data-xxl-stick-up-offset="118px" data-xxl-stick-up="true">
<div class="rd-navbar-aside-outer">
<div class="rd-navbar-aside">
<!-- RD Navbar Panel-->
<div class="rd-navbar-panel">
<!-- RD Navbar Toggle-->
<button class="rd-navbar-toggle" data-rd-navbar-toggle="#rd-navbar-nav-wrap-1"><span></span></button>
<!-- RD Navbar Brand--><a class="rd-navbar-brand" href="index.html"><img src="images/logo-default-151x44.png" alt="" width="151" height="44" srcset="images/logo-default-151x44.png 2x"/></a>
</div>
<div class="rd-navbar-collapse">
<button class="rd-navbar-collapse-toggle rd-navbar-fixed-element-1" data-rd-navbar-toggle="#rd-navbar-collapse-content-1"><span></span></button>
<div class="rd-navbar-collapse-content" id="rd-navbar-collapse-content-1">
<article class="unit align-items-center">
<div class="unit-left"><span class="icon icon-md icon-modern mdi mdi-phone"></span></div>
<div class="unit-body">
<ul class="list-0">
<li><a class="link-default" href="tel:#">1-800-1234-567</a></li>
<li><a class="link-default" href="tel:#">1-800-8763-765</a></li>
</ul>
</div>
</article>
<article class="unit align-items-center">
<div class="unit-left"><span class="icon icon-md icon-modern mdi mdi-map-marker"></span></div>
<div class="unit-body"><a class="link-default" href="tel:#">2130 Fulton Street <br> San Diego, CA 94117-1080</a></div>
</article><a class="button button-gray-bordered button-winona" href="#">Request a call</a>
</div>
</div>
</div>
</div>
<div class="rd-navbar-main-outer">
<div class="rd-navbar-main">
<div class="rd-navbar-nav-wrap" id="rd-navbar-nav-wrap-1">
<!-- RD Navbar Search-->
<div class="rd-navbar-search" id="rd-navbar-search-1">
<button class="rd-navbar-search-toggle" data-rd-navbar-toggle="#rd-navbar-search-1"><span></span></button>
<form class="rd-search" action="search-results.html" data-search-live="rd-search-results-live-1" method="GET">
<div class="form-wrap">
<label class="form-label" for="rd-navbar-search-form-input-1">Search...</label>
<input class="form-input rd-navbar-search-form-input" id="rd-navbar-search-form-input-1" type="text" name="s" autocomplete="off">
<div class="rd-search-results-live" id="rd-search-results-live-1"></div>
</div>
<button class="rd-search-form-submit fa-search" type="submit"></button>
</form>
</div>
<!-- RD Navbar Nav-->
<ul class="rd-navbar-nav">
<li class="rd-nav-item"><a class="rd-nav-link" href="index.html">Home</a>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="about-us.html">About us</a>
<!-- RD Navbar Dropdown-->
<ul class="rd-menu rd-navbar-dropdown">
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="our-team.html">Our Team</a></li>
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="testimonials.html">Testimonials</a></li>
</ul>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="properties.html">Properties</a>
<!-- RD Navbar Dropdown-->
<ul class="rd-menu rd-navbar-dropdown">
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="single-property.html">Single Property</a></li>
</ul>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="#">Blog</a>
<!-- RD Navbar Dropdown-->
<ul class="rd-menu rd-navbar-dropdown">
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="grid-blog.html">Grid Blog</a></li>
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="sidebar-blog.html">Sidebar Blog</a></li>
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="single-blog-post.html">Single Blog Post</a></li>
<li class="rd-dropdown-item"><a class="rd-dropdown-link" href="blog-layouts.html">Blog Layouts</a></li>
</ul>
</li>
<li class="rd-nav-item"><a class="rd-nav-link" href="#">Pages</a>
<!-- RD Navbar Megamenu-->
<ul class="rd-menu rd-navbar-megamenu">
<li class="rd-megamenu-item">
<ul class="rd-megamenu-list">
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="typography.html">Typography</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="buttons.html">Buttons</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="forms.html">Forms</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="progress-bars.html">Progress bars</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="tabs.html">Tabs</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="tables.html">Tables</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="accordions.html">Accordions</a></li>
</ul>
</li>
<li class="rd-megamenu-item">
<ul class="rd-megamenu-list">
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="small-features.html">Small Features</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="large-features.html">Large Features</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="careers.html">Careers</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="search-results.html">Search results</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="single-job.html">Single Job</a></li>
</ul>
</li>
<li class="rd-megamenu-item">
<ul class="rd-megamenu-list">
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="404-page.html">404 Page</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="503-page.html">503 Page</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="coming-soon.html">Coming Soon</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="privacy-policy.html">Privacy policy</a></li>
<li class="rd-megamenu-list-item"><a class="rd-megamenu-list-link" href="under-construction.html">Under Construction</a></li>
</ul>
</li>
</ul>
</li>
<li class="rd-nav-item active"><a class="rd-nav-link" href="contacts.html">Contacts</a>
</li>
</ul>
</div>
</div>
</div>
</nav>
</div>
</header>
<!-- Breadcrumbs -->
<section class="breadcrumbs-custom bg-image context-dark" style="background-image: url(images/breadcrumbs-image-1.jpg);">
<div class="breadcrumbs-custom-inner">
<div class="container breadcrumbs-custom-container">
<div class="breadcrumbs-custom-main">
<h6 class="breadcrumbs-custom-subtitle title-decorated">Contacts</h6>
<h2 class="text-uppercase breadcrumbs-custom-title">Contacts</h2>
</div>
<ul class="breadcrumbs-custom-path">
<li><a href="index.html">Home</a></li>
<li class="active">Contacts</li>
</ul>
</div>
</div>
</section>
<section class="section section-sm">
<div class="container">
<div class="layout-bordered">
<div class="layout-bordered-item wow-outer">
<div class="layout-bordered-item-inner wow slideInUp">
<div class="icon icon-lg mdi mdi-phone text-primary"></div>
<ul class="list-0">
<li><a class="link-default" href="tel:#">1-800-1234-678</a></li>
<li><a class="link-default" href="tel:#">1-800-9876-098</a></li>
</ul>
</div>
</div>
<div class="layout-bordered-item wow-outer">
<div class="layout-bordered-item-inner wow slideInUp">
<div class="icon icon-lg mdi mdi-email text-primary"></div><a class="link-default" href="mailto:#">info@demolink.org</a>
</div>
</div>
<div class="layout-bordered-item wow-outer">
<div class="layout-bordered-item-inner wow slideInUp">
<div class="icon icon-lg mdi mdi-map-marker text-primary"></div><a class="link-default" href="#">2130 Fulton Street San Diego, CA 94117-1080 USA</a>
</div>
</div>
</div>
</div>
</section>
<section class="section bg-gray-100">
<div class="range justify-content-xl-between">
<div class="cell-xl-6 align-self-center container">
<div class="row">
<div class="col-lg-9 cell-inner">
<div class="section-lg">
<h3 class="text-uppercase wow-outer"><span class="wow slideInDown">Contact Us</span></h3>
<!-- RD Mailform-->
<form class="rd-form rd-mailform" data-form-output="form-output-global" data-form-type="contact" method="post" action="bat/rd-mailform.php">
<div class="row row-10">
<div class="col-md-6 wow-outer">
<div class="form-wrap wow fadeSlideInUp">
<label class="form-label-outside" for="contact-first-name">First Name</label>
<input class="form-input" id="contact-first-name" type="text" name="name" data-constraints="@Required">
</div>
</div>
<div class="col-md-6 wow-outer">
<div class="form-wrap wow fadeSlideInUp">
<label class="form-label-outside" for="contact-last-name">Last Name</label>
<input class="form-input" id="contact-last-name" type="text" name="name" data-constraints="@Required">
</div>
</div>
<div class="col-md-6 wow-outer">
<div class="form-wrap wow fadeSlideInUp">
<label class="form-label-outside" for="contact-email">E-mail</label>
<input class="form-input" id="contact-email" type="email" name="email" data-constraints="@Email @Required">
</div>
</div>
<div class="col-md-6 wow-outer">
<div class="form-wrap wow fadeSlideInUp">
<label class="form-label-outside" for="contact-phone">Phone</label>
<input class="form-input" id="contact-phone" type="text" name="phone" data-constraints="@PhoneNumber">
</div>
</div>
<div class="col-12 wow-outer">
<div class="form-wrap wow fadeSlideInUp">
<label class="form-label-outside" for="contact-message">Your Message</label>
<textarea class="form-input" id="contact-message" name="message" data-constraints="@Required"></textarea>
</div>
</div>
</div>
<div class="group group-middle">
<div class="wow-outer">
<button class="button button-primary button-winona wow slideInRight" type="submit">Send Message</button>
</div>
<p>or use</p>
<div class="wow-outer"><a class="button button-primary-outline button-icon button-icon-left button-winona wow slideInLeft" href="#"><span class="icon text-primary mdi mdi-facebook-messenger"></span>Messenger</a></div>
</div>
</form>
</div>
</div>
</div>
</div>
<div class="cell-xl-5 height-fill wow fadeIn">
<section class="section">
<div class="google-map-container" data-center="9870 St Vincent Place, Glasgow, DC 45 Fr 45." data-styles="[{&quot;featureType&quot;:&quot;water&quot;,&quot;elementType&quot;:&quot;geometry&quot;,&quot;stylers&quot;:[{&quot;color&quot;:&quot;#e9e9e9&quot;},{&quot;lightness&quot;:17}]},{&quot;featureType&quot;:&quot;landscape&quot;,&quot;elementType&quot;:&quot;geometry&quot;,&quot;stylers&quot;:[{&quot;color&quot;:&quot;#f5f5f5&quot;},{&quot;lightness&quot;:20}]},{&quot;featureType&quot;:&quot;road.highway&quot;,&quot;elementType&quot;:&quot;geometry.fill&quot;,&quot;stylers&quot;:[{&quot;color&quot;:&quot;#ffffff&quot;},{&quot;lightness&quot;:17}]},{&quot;featureType&quot;:&quot;road.highway&quot;,&quot;elementType&quot;:&quot;geometry.stroke&quot;,&quot;stylers&quot;:[{&quot;color&quot;:&quot;#ffffff&quot;},{&quot;lightness&quot;:29},{&quot;weight&quot;:0.2}]},{&quot;featureType&quot;:&quot;road.arterial&quot;,&quot;elementType&quot;:&quot;geometry&quot;,&quot;stylers&quot;:[{&quot;color&quot;:&quot;#ffffff&quot;},{&quot;lightness&quot;:18}]},{&quot;featureType&quot;:&quot;road.local&quot;,&quot;elementType&quot;:&quot;geometry&quot;,&quot;stylers&quot;:[{&quot;color&quot;:&quot;#ffffff&quot;},{&quot;lightness&quot;:16}]},{&quot;featureType&quot;:&quot;poi&quot;,&quot;elementType&quot;:&quot;geometry&quot;,&quot;stylers&quot;:[{&quot;color&quot;:&quot;#f5f5f5&quot;},{&quot;lightness&quot;:21}]},{&quot;featureType&quot;:&quot;poi.park&quot;,&quot;elementType&quot;:&quot;geometry&quot;,&quot;stylers&quot;:[{&quot;color&quot;:&quot;#dedede&quot;},{&quot;lightness&quot;:21}]},{&quot;elementType&quot;:&quot;labels.text.stroke&quot;,&quot;stylers&quot;:[{&quot;visibility&quot;:&quot;on&quot;},{&quot;color&quot;:&quot;#ffffff&quot;},{&quot;lightness&quot;:16}]},{&quot;elementType&quot;:&quot;labels.text.fill&quot;,&quot;stylers&quot;:[{&quot;saturation&quot;:36},{&quot;color&quot;:&quot;#333333&quot;},{&quot;lightness&quot;:40}]},{&quot;elementType&quot;:&quot;labels.icon&quot;,&quot;stylers&quot;:[{&quot;visibility&quot;:&quot;off&quot;}]},{&quot;featureType&quot;:&quot;transit&quot;,&quot;elementType&quot;:&quot;geometry&quot;,&quot;stylers&quot;:[{&quot;color&quot;:&quot;#f2f2f2&quot;},{&quot;lightness&quot;:19}]},{&quot;featureType&quot;:&quot;administrative&quot;,&quot;elementType&quot;:&quot;geometry.fill&quot;,&quot;stylers&quot;:[{&quot;color&quot;:&quot;#fefefe&quot;},{&quot;lightness&quot;:20}]},{&quot;featureType&quot;:&quot;administrative&quot;,&quot;elementType&quot;:&quot;geometry.stroke&quot;,&quot;stylers&quot;:[{&quot;color&quot;:&quot;#fefefe&quot;},{&quot;lightness&quot;:17},{&quot;weight&quot;:1.2}]}]">
<div class="google-map"></div>
<ul class="google-map-markers">
<li data-location="9870 St Vincent Place, Glasgow, DC 45 Fr 45." data-description="9870 St Vincent Place, Glasgow" data-icon="images/gmap_marker.png" data-icon-active="images/gmap_marker.png"></li>
</ul>
</div>
</section>
</div>
</div>
</section>
<!-- Page Footer-->
<footer class="section footer-advanced bg-gray-700">
<div class="footer-advanced-main">
<div class="container">
<div class="row row-50">
<div class="col-lg-4">
<h5 class="font-weight-bold text-uppercase text-white">About Us</h5>
<p class="footer-advanced-text">inHouse is the largest full-service real estate and property management company. We offer expertise in the marketing and sale of a wide range of properties, including residential real estate, farms and lifestyle blocks, as well as commercial and industrial properties that we hope may interest you.</p>
</div>
<div class="col-sm-7 col-md-5 col-lg-4">
<h5 class="font-weight-bold text-uppercase text-white">Recent Blog Posts</h5>
<!-- Post Inline-->
<article class="post-inline">
<p class="post-inline-title"><a href="single-blog-post.html">Real Estate Guide: 7 Important Tips for Buying a Home</a></p>
<ul class="post-inline-meta">
<li>by Mike Barnes</li>
<li><a href="single-blog-post.html">2 days ago</a></li>
</ul>
</article>
<!-- Post Inline-->
<article class="post-inline">
<p class="post-inline-title"><a href="single-blog-post.html">Single-Family Homes as a Housing Option for Young Families</a></p>
<ul class="post-inline-meta">
<li>by Mike Barnes</li>
<li><a href="single-blog-post.html">2 days ago</a></li>
</ul>
</article>
</div>
<div class="col-sm-5 col-md-7 col-lg-4">
<h5 class="font-weight-bold text-uppercase text-white">Gallery</h5>
<div class="row row-x-10" data-lightgallery="group">
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-1.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-1-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-2.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-2-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-3.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-3-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-4.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-4-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-5.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-5-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-6.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-6-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"> </div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-7.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-7-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
<div class="col-3 col-sm-4 col-md-3"><a class="thumbnail-minimal" href="images/gallery-original-8.jpg" data-lightgallery="item"><img class="thumbnail-minimal-image" src="images/footer-gallery-8-85x85.jpg" alt="">
<div class="thumbnail-minimal-caption"></div></a></div>
</div>
</div>
</div>
</div>
</div>
<div class="footer-advanced-aside">
<div class="container">
<div class="footer-advanced-layout">
<div>
<ul class="list-nav">
<li><a href="index.html">Home</a></li>
<li><a href="about-us.html">About</a></li>
<li><a href="properties.html">Properties</a></li>
<li><a href="grid-blog.html">Blog</a></li>
<li><a href="contacts.html">Contacts</a></li>
</ul>
</div>
<div>
<ul class="foter-social-links list-inline list-inline-md">
<li><a class="icon icon-sm link-default mdi mdi-facebook" href="#"></a></li>
<li><a class="icon icon-sm link-default mdi mdi-twitter" href="#"></a></li>
<li><a class="icon icon-sm link-default mdi mdi-instagram" href="#"></a></li>
<li><a class="icon icon-sm link-default mdi mdi-google" href="#"></a></li>
<li><a class="icon icon-sm link-default mdi mdi-linkedin" href="#"></a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="container">
<hr>
</div>
<div class="footer-advanced-aside">
<div class="container">
<div class="footer-advanced-layout"><a class="brand" href="index.html"><img src="images/logo-light-115x34.png" alt="" width="115" height="34" srcset="images/logo-light-115x34.png 2x"/></a>
<!-- Rights-->
<p class="rights"><span>&copy;&nbsp;</span><span class="copyright-year"></span><span>&nbsp;</span><span>All Rights Reserved.</span><span>&nbsp;</span><br class="d-sm-none"/><a href="#">Terms of Use</a><span> and</span><span>&nbsp;</span><a href="privacy-policy.html">Privacy Policy</a></p>
</div>
</div>
</div>
</footer>
</div>
<div class="preloader">
<div class="preloader-logo"><img src="images/logo-default-151x44.png" alt="" width="151" height="44" srcset="images/logo-default-151x44.png 2x"/>
</div>
<div class="preloader-body">
<div id="loadingProgressG">
<div class="loadingProgressG" id="loadingProgressG_1"></div>
</div>
</div>
</div>
<!-- Global Mailform Output-->
<div class="snackbars" id="form-output-global"></div>
<!-- Javascript-->
<script src="js/core.min.js"></script>
<script src="js/script.js"></script>
</body>
</html>
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Binary file not shown.
Binary file not shown.
File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 1.5 MiB

Binary file not shown.
Binary file not shown.
Binary file not shown.
File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 270 KiB

Some files were not shown because too many files have changed in this diff Show More