208 lines
8.1 KiB
HTML
208 lines
8.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="pt-BR">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Launchr</title>
|
|
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">
|
|
<style>
|
|
.modal-content {
|
|
border-radius: 1rem;
|
|
border: none;
|
|
box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
|
|
}
|
|
|
|
.modal-body {
|
|
padding: 2rem;
|
|
}
|
|
|
|
.btn {
|
|
padding: 0.75rem 1.5rem;
|
|
font-weight: 500;
|
|
border-radius: 0.5rem;
|
|
}
|
|
|
|
.btn-secondary {
|
|
background-color: #f3f4f6;
|
|
border: none;
|
|
color: #374151;
|
|
}
|
|
|
|
.btn-secondary:hover {
|
|
background-color: #e5e7eb;
|
|
color: #1f2937;
|
|
}
|
|
|
|
.btn-primary {
|
|
background-color: #4F46E5;
|
|
border: none;
|
|
}
|
|
|
|
.btn-primary:hover {
|
|
background-color: #4338CA;
|
|
}
|
|
|
|
.text-success {
|
|
color: #10B981 !important;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body class="bg-light" style="width: 400px; min-height: 500px;">
|
|
<!-- Área de Login -->
|
|
<div id="loginSection" class="container p-4">
|
|
<!-- Logo -->
|
|
<div class="d-flex align-items-center mb-4">
|
|
<img src=".src/assets/logo.png" alt="Launchr" height="32" class="me-2">
|
|
<small class="text-muted">Versão 1.3.6</small>
|
|
</div>
|
|
|
|
<h1 class="display-6 text-primary mb-4">Vamos começar</h1>
|
|
|
|
<form id="loginForm">
|
|
<div class="mb-3">
|
|
<label for="email" class="form-label">E-mail</label>
|
|
<div class="input-group">
|
|
<span class="input-group-text">
|
|
<i class="bi bi-envelope"></i>
|
|
</span>
|
|
<input type="email" class="form-control" id="email" required>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="mb-3">
|
|
<label for="password" class="form-label">Senha</label>
|
|
<div class="input-group">
|
|
<span class="input-group-text">
|
|
<i class="bi bi-lock"></i>
|
|
</span>
|
|
<input type="password" class="form-control" id="password" required>
|
|
<button class="btn btn-outline-secondary" type="button" id="togglePasswordBtn">
|
|
<i class="bi bi-eye"></i>
|
|
</button>
|
|
</div>
|
|
<a href="#" class="text-decoration-none small d-block mt-2">Esqueceu sua senha?</a>
|
|
</div>
|
|
|
|
<button type="submit" class="btn btn-primary w-100 py-2 mt-3">ENTRAR</button>
|
|
|
|
<div class="text-center mt-4">
|
|
<span class="text-muted">Novo por aqui? </span>
|
|
<a href="#" class="text-decoration-none">Criar uma conta</a>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
|
|
<!-- Área Logada -->
|
|
<div id="loggedInSection" class="d-none">
|
|
<!-- Navbar -->
|
|
<nav class="navbar navbar-expand navbar-light bg-white border-bottom px-3">
|
|
<div class="container-fluid px-0">
|
|
<!-- Logo -->
|
|
<a class="navbar-brand" href="#">
|
|
<img src="./src/assets/logo.png" alt="Launchr" height="32">
|
|
</a>
|
|
|
|
<!-- Links centralizados -->
|
|
<div class="navbar-nav mx-auto">
|
|
<button id="navSwipeFile" class="nav-link active fw-medium border-0 bg-transparent px-4">
|
|
SWIPE FILE
|
|
</button>
|
|
<button id="navNewPost" class="nav-link fw-medium border-0 bg-transparent px-4">
|
|
NOVO POST
|
|
</button>
|
|
</div>
|
|
|
|
<!-- Avatar do usuário com menu -->
|
|
<div class="navbar-nav">
|
|
<div class="nav-item dropdown">
|
|
<div class="rounded-circle bg-primary d-flex align-items-center justify-content-center"
|
|
style="width: 40px; height: 40px; cursor: pointer;"
|
|
id="userDropdown"
|
|
data-bs-toggle="dropdown"
|
|
aria-expanded="false">
|
|
<span class="text-white fw-medium">IL</span>
|
|
</div>
|
|
<ul class="dropdown-menu dropdown-menu-end py-2" style="min-width: 200px;" aria-labelledby="userDropdown">
|
|
<!-- Nome do Negócio -->
|
|
<li class="px-3 mb-2">
|
|
<small class="text-muted d-block mb-1">Negócio</small>
|
|
<span id="negocioNome" class="d-block text-truncate"></span>
|
|
</li>
|
|
<li><hr class="dropdown-divider"></li>
|
|
<li><button class="dropdown-item text-danger" id="logoutButton">Sair</button></li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<!-- Conteúdo Principal -->
|
|
<div class="container p-4">
|
|
<!-- Seção Swipe File -->
|
|
<div id="swipeFileSection">
|
|
<form id="postForm" class="bg-white p-4 rounded shadow-sm">
|
|
<div class="mb-3">
|
|
<label for="author" class="form-label">Autor</label>
|
|
<input type="text" class="form-control" id="author">
|
|
</div>
|
|
|
|
<div class="mb-3">
|
|
<label for="postLink" class="form-label">Link do Post</label>
|
|
<input type="url" class="form-control" id="postLink"
|
|
placeholder="https://www.linkedin.com/posts_...">
|
|
</div>
|
|
|
|
<div class="mb-3">
|
|
<label for="content" class="form-label">Conteúdo</label>
|
|
<textarea class="form-control" id="content" rows="4"></textarea>
|
|
</div>
|
|
|
|
<button type="button" id="saveSwipeFileButton" class="btn btn-primary w-100">
|
|
Salvar Post
|
|
</button>
|
|
</form>
|
|
</div>
|
|
|
|
<!-- Seção Novo Post -->
|
|
<div id="newPostSection" class="d-none">
|
|
<form id="newPostForm" class="bg-white p-4 rounded shadow-sm">
|
|
<div class="mb-3">
|
|
<label for="postTitle" class="form-label">Título do Post</label>
|
|
<input type="text" class="form-control" id="postTitle">
|
|
</div>
|
|
|
|
<div class="mb-3">
|
|
<label for="postEditor" class="form-label">Conteúdo do Post</label>
|
|
<textarea id="postEditor" class="form-control" rows="6"></textarea>
|
|
</div>
|
|
|
|
<button type="button" id="savePostButton" class="btn btn-primary w-100">
|
|
Publicar Post
|
|
</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Modal de Sucesso -->
|
|
<div class="modal fade" id="successModal" tabindex="-1" aria-labelledby="successModalLabel" aria-hidden="true">
|
|
<div class="modal-dialog modal-dialog-centered">
|
|
<div class="modal-content">
|
|
<div class="modal-body text-center p-4">
|
|
<div class="mb-4">
|
|
<i class="bi bi-check-circle-fill text-success" style="font-size: 3rem;"></i>
|
|
</div>
|
|
<h5 class="modal-title mb-3" id="successModalLabel">Seu Swipe File foi criado com sucesso</h5>
|
|
<div class="d-grid gap-2">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Fechar janela</button>
|
|
<a href="#" id="viewPostLink" class="btn btn-primary" target="_blank">Visualizar Post</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="lib/bootstrap.bundle.min.js"></script>
|
|
<script src="popup.js"></script>
|
|
</body>
|
|
</html> |