Last active
July 10, 2025 00:51
-
-
Save celsowm/e6cfd5f584a35cf5e456b75f9e82c21e to your computer and use it in GitHub Desktop.
nova caixa de entrada do pgedigital
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="pt-br"> | |
<head> | |
<meta charset="UTF-8"> | |
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
<title>PGE Digital - Caixa de Entrada</title> | |
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" integrity="sha512-SnH5WK+bZxgPHs44uWIX+LLJAJ9/2PkPKZ5QiAj6Ta86w+fsb2TkcmfRyVX3pBnMFcV7oQPJkl9QevSCWr3W6A==" crossorigin="anonymous" referrerpolicy="no-referrer" /> | |
<style> | |
:root { | |
--color-bg: #f6f8fa; --color-border: #d0d7de; --color-card-bg: #ffffff; | |
--color-text-primary: #1f2328; --color-text-secondary: #57606a; --color-text-link: #0969da; | |
--color-accent-blue: #0969da; --color-accent-orange: #d46a05; --color-accent-red: #d1242f; | |
--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif; | |
} | |
body { background-color: var(--color-bg); font-family: var(--font-family); margin: 0; padding: 2rem; color: var(--color-text-primary); } | |
.inbox-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 1.5rem; flex-wrap: wrap; gap: 1rem; } | |
.inbox-title { font-size: 1.75rem; font-weight: 600; } | |
.inbox-filters button { font-size: 0.9rem; padding: 0.5rem 1rem; border: 1px solid var(--color-border); background-color: var(--color-card-bg); cursor: pointer; } | |
.inbox-filters button:first-child { border-top-left-radius: 6px; border-bottom-left-radius: 6px; } | |
.inbox-filters button:last-child { border-top-right-radius: 6px; border-bottom-right-radius: 6px; } | |
.inbox-filters button.active { background-color: var(--color-accent-blue); color: white; border-color: var(--color-accent-blue); font-weight: 600; } | |
.inbox-alert { display: flex; align-items: center; gap: 0.5rem; background-color: rgba(209, 36, 47, 0.1); color: var(--color-accent-red); padding: 0.5rem 1rem; border-radius: 6px; font-weight: 500; } | |
.process-list { display: flex; flex-direction: column; gap: 2px; } | |
.process-item { display: flex; background-color: var(--color-card-bg); border: 1px solid var(--color-border); padding: 1rem; position: relative; transition: background-color 0.2s; } | |
.process-item:first-child { border-radius: 6px 6px 0 0; } | |
.process-item:last-child { border-radius: 0 0 6px 6px; } | |
.process-item:not(:last-child) { border-bottom: none; } | |
.process-item:hover { background-color: #fcfcfc; } | |
.process-item::before { content: ''; position: absolute; left: 0; top: 0; width: 4px; height: 100%; } | |
.process-item.status-intimation::before { background-color: var(--color-accent-blue); } | |
.process-item.status-citation::before { background-color: var(--color-accent-orange); } | |
.process-item.status-urgent::before { background-color: var(--color-accent-red); } | |
.item-selector { margin-right: 1rem; display: flex; align-items: center; } | |
.item-content { flex-grow: 1; display: flex; flex-direction: column; gap: 0.4rem; } | |
.content-row { display: flex; justify-content: space-between; align-items: center; gap: 1rem; } | |
.process-title { font-size: 1rem; font-weight: 600; margin: 0; } | |
.process-metadata { font-size: 0.8rem; color: var(--color-text-secondary); } | |
.process-tags { display: flex; gap: 0.5rem; flex-shrink: 0; } | |
.tag { font-size: 0.75rem; font-weight: 600; padding: 0.2rem 0.6rem; border-radius: 1rem; border: 1px solid; } | |
.tag.type-intimation { border-color: var(--color-accent-blue); color: var(--color-accent-blue); } | |
.tag.type-citation { border-color: var(--color-accent-orange); color: var(--color-accent-orange); } | |
.tag.class-strategic { border-color: var(--color-accent-red); color: var(--color-accent-red); background-color: rgba(209, 36, 47, 0.1); } | |
.tag.class-common { border-color: var(--color-border); color: var(--color-text-secondary); } | |
.process-info { font-size: 0.8rem; color: var(--color-text-secondary); } | |
.process-actions { display: flex; align-items: center; gap: 0.5rem; } | |
.cnj-identifier { font-family: monospace; font-size: 0.8rem; background-color: var(--color-bg); padding: 0.25rem 0.5rem; border-radius: 6px; border: 1px solid var(--color-border); color: var(--color-text-secondary); } | |
.action-button { background: none; border: none; padding: 0.25rem; cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--color-text-secondary); font-size: 16px; width: 24px; } | |
.action-button:hover { color: var(--color-text-link); } | |
</style> | |
</head> | |
<body> | |
<header class="inbox-header"> | |
<div> | |
<h2 class="inbox-title">Caixa de Entrada (81)</h2> | |
<div class="inbox-filters"> | |
<button class="active">Contencioso</button><button>Consultivo</button><button>Autocomposição</button> | |
</div> | |
</div> | |
<div class="inbox-alert"> | |
<i class="fa-solid fa-triangle-exclamation"></i> | |
<span>12 Prazos Vencidos</span> | |
</div> | |
</header> | |
<main class="process-list"> | |
<article class="process-item status-urgent"> | |
<div class="item-selector"><input type="checkbox"></div> | |
<div class="item-content"> | |
<div class="content-row"> | |
<div> | |
<!-- NOME ATUALIZADO AQUI --> | |
<h3 class="process-title">João da Silva x Rio Previdência</h3> | |
<div class="process-metadata">Vinicius George C. da S. Paes • há 3 horas • <strong>Prazo: 10/07/2024</strong></div> | |
</div> | |
<div class="process-tags"> | |
<span class="tag type-intimation">INTIMAÇÃO</span><span class="tag class-strategic">ESTRATÉGICO</span> | |
</div> | |
</div> | |
<div class="content-row"> | |
<div class="process-info">PGE/005.00026/2022 • R$ 32.316.965,00</div> | |
<div class="process-actions"> | |
<div class="cnj-identifier">0416469-29.2015.8.19.0001</div> | |
<button class="action-button" title="Copiar"><i class="fa-solid fa-copy"></i></button> | |
<button class="action-button" title="Minutar"><i class="fa-solid fa-pen-to-square"></i></button> | |
<button class="action-button" title="Mais"><i class="fa-solid fa-ellipsis-vertical"></i></button> | |
</div> | |
</div> | |
</div> | |
</article> | |
<article class="process-item status-citation"> | |
<div class="item-selector"><input type="checkbox"></div> | |
<div class="item-content"> | |
<div class="content-row"> | |
<div> | |
<!-- NOME ATUALIZADO AQUI --> | |
<h3 class="process-title">Maria da Silva x Estado do Rio</h3> | |
<div class="process-metadata">Sistema PCE Digital • há 2 horas • <strong>Prazo: 17/07/2024</strong></div> | |
</div> | |
<div class="process-tags"> | |
<span class="tag type-citation">CITAÇÃO</span><span class="tag class-common">COMUM</span> | |
</div> | |
</div> | |
<div class="content-row"> | |
<div class="process-info">PGE/005.00009/2024 • R$ 29.132,36</div> | |
<div class="process-actions"> | |
<div class="cnj-identifier">0000202-31.2023.8.19.0036</div> | |
<button class="action-button" title="Copiar"><i class="fa-solid fa-copy"></i></button> | |
<button class="action-button" title="Minutar"><i class="fa-solid fa-pen-to-square"></i></button> | |
<button class="action-button" title="Mais"><i class="fa-solid fa-ellipsis-vertical"></i></button> | |
</div> | |
</div> | |
</div> | |
</article> | |
</main> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment