103 lines
5.3 KiB
Plaintext
103 lines
5.3 KiB
Plaintext
@model QRRapidoApp.Models.ViewModels.ArticleViewModel
|
|
@{
|
|
ViewData["Title"] = Model.Metadata.Title + " — QRRapido Docs";
|
|
Layout = "~/Views/Shared/_Layout.cshtml";
|
|
|
|
var isEn = (ViewBag.Culture as string) == "en";
|
|
var isEs = (ViewBag.Culture as string) == "es";
|
|
var devBase = isEn ? "/en/Developer" : isEs ? "/es/Developer" : "/Developer";
|
|
var slug = ViewBag.Slug as string;
|
|
|
|
string T(string pt, string es, string en) => isEn ? en : isEs ? es : pt;
|
|
}
|
|
|
|
<div class="container mt-4 mb-5">
|
|
|
|
<nav aria-label="breadcrumb" class="mb-4">
|
|
<ol class="breadcrumb">
|
|
<li class="breadcrumb-item"><a href="@devBase">@T("Portal do Desenvolvedor", "Portal del Desarrollador", "Developer Portal")</a></li>
|
|
<li class="breadcrumb-item"><a href="@devBase/docs">Docs</a></li>
|
|
<li class="breadcrumb-item active" aria-current="page">@Model.Metadata.Title</li>
|
|
</ol>
|
|
</nav>
|
|
|
|
<div class="row">
|
|
|
|
<article class="col-lg-8">
|
|
<header class="mb-4">
|
|
<h1 class="mb-3">@Model.Metadata.Title</h1>
|
|
<p class="text-muted small">
|
|
<i class="fas fa-clock me-1"></i> @Model.Metadata.ReadingTimeMinutes @T("min de leitura", "min de lectura", "min read")
|
|
·
|
|
<i class="fas fa-calendar me-1"></i> @Model.Metadata.Date.ToString("dd/MM/yyyy")
|
|
</p>
|
|
<p class="lead text-muted">@Model.Metadata.Description</p>
|
|
<hr>
|
|
</header>
|
|
|
|
<div class="article-content">
|
|
@Html.Raw(Model.HtmlContent)
|
|
</div>
|
|
|
|
<footer class="mt-5 pt-3 border-top">
|
|
<small class="text-muted">@T("Última atualização:", "Última actualización:", "Last updated:") @Model.Metadata.LastMod.ToString("dd/MM/yyyy")</small>
|
|
</footer>
|
|
</article>
|
|
|
|
<aside class="col-lg-4">
|
|
|
|
<div class="card border-0 shadow-sm mb-4">
|
|
<div class="card-header bg-primary text-white py-2">
|
|
<h6 class="mb-0"><i class="fas fa-rocket me-2"></i>@T("Links Rápidos", "Links Pya'e", "Quick Links")</h6>
|
|
</div>
|
|
<div class="list-group list-group-flush">
|
|
<a href="@devBase" class="list-group-item list-group-item-action small">
|
|
<i class="fas fa-key me-2 text-primary"></i>@T("Minhas Chaves de API", "Mis Claves de API", "My API Keys")
|
|
</a>
|
|
<a href="/api/docs" target="_blank" class="list-group-item list-group-item-action small">
|
|
<i class="fas fa-code me-2 text-success"></i>Swagger / OpenAPI
|
|
</a>
|
|
<a href="@devBase/Pricing" class="list-group-item list-group-item-action small">
|
|
<i class="fas fa-arrow-up me-2 text-warning"></i>@T("Planos de API", "Planes de API", "API Plans")
|
|
</a>
|
|
<a href="@devBase/docs" class="list-group-item list-group-item-action small">
|
|
<i class="fas fa-book me-2 text-info"></i>@T("Todos os Tutoriais", "Todos los Tutoriales", "All Tutorials")
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
@if (Model.RelatedArticles.Any())
|
|
{
|
|
<div class="card border-0 shadow-sm">
|
|
<div class="card-header bg-white py-2">
|
|
<h6 class="mb-0"><i class="fas fa-bookmark me-2 text-secondary"></i>@T("Outros Tutoriais", "Otros Tutoriales", "Other Tutorials")</h6>
|
|
</div>
|
|
<div class="list-group list-group-flush">
|
|
@foreach (var related in Model.RelatedArticles)
|
|
{
|
|
<a href="@devBase/docs/@related.Slug" class="list-group-item list-group-item-action">
|
|
<div class="fw-semibold small">@related.Title</div>
|
|
<div class="text-muted" style="font-size:0.8rem;">@related.Description</div>
|
|
</a>
|
|
}
|
|
</div>
|
|
</div>
|
|
}
|
|
</aside>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<style>
|
|
.article-content { font-size: 1.05rem; line-height: 1.8; }
|
|
.article-content h2 { margin-top: 2rem; margin-bottom: 0.75rem; font-weight: 600; border-bottom: 1px solid #dee2e6; padding-bottom: 0.3rem; }
|
|
.article-content h3 { margin-top: 1.5rem; margin-bottom: 0.5rem; font-weight: 600; }
|
|
.article-content pre { background: #1e1e1e; color: #d4d4d4; padding: 1rem 1.25rem; border-radius: 6px; overflow-x: auto; font-size: 0.875rem; }
|
|
.article-content code { background: #f4f4f4; padding: 0.15rem 0.4rem; border-radius: 3px; font-size: 0.875em; color: #d63384; }
|
|
.article-content pre code { background: transparent; color: inherit; padding: 0; }
|
|
.article-content blockquote { border-left: 4px solid #0d6efd; padding: 0.5rem 1rem; margin-left: 0; background: #f8f9ff; border-radius: 0 4px 4px 0; color: #495057; }
|
|
.article-content table { width: 100%; border-collapse: collapse; margin: 1rem 0; }
|
|
.article-content th, .article-content td { border: 1px solid #dee2e6; padding: 0.5rem 0.75rem; }
|
|
.article-content th { background: #f8f9fa; font-weight: 600; }
|
|
</style>
|