-
Notifications
You must be signed in to change notification settings - Fork 2
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
First iteration of site design (based on Bootstrap 5) (#10)
- Loading branch information
Showing
2 changed files
with
201 additions
and
5 deletions.
There are no files selected for viewing
This file contains 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
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,10 +1,206 @@ | ||
| <!DOCTYPE html> | ||
| <html> | ||
| <!doctype html> | ||
| <html lang="en" data-bs-theme="dark"> | ||
| <head> | ||
| <title>Document</title> | ||
|
|
||
| <meta charset="utf-8"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1"> | ||
| <meta name="description" content=""> | ||
| <meta name="author" content="Mark Otto, Jacob Thornton, and Bootstrap contributors"> | ||
| <meta name="generator" content="Hugo 0.122.0"> | ||
| <title>Starter Template · Bootstrap v5.3</title> | ||
|
|
||
| <link rel="canonical" href="https://larajournal.github.io/"> | ||
|
|
||
| <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@docsearch/css@3"> | ||
|
|
||
| <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" | ||
| integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous"> | ||
|
|
||
| <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"> | ||
|
|
||
| <!-- Favicons --> | ||
| <!-- <link rel="apple-touch-icon" href="/docs/5.3/assets/img/favicons/apple-touch-icon.png" sizes="180x180">--> | ||
| <!-- <link rel="icon" href="/docs/5.3/assets/img/favicons/favicon-32x32.png" sizes="32x32" type="image/png">--> | ||
| <!-- <link rel="icon" href="/docs/5.3/assets/img/favicons/favicon-16x16.png" sizes="16x16" type="image/png">--> | ||
| <!-- <link rel="manifest" href="/docs/5.3/assets/img/favicons/manifest.json">--> | ||
| <!-- <link rel="mask-icon" href="/docs/5.3/assets/img/favicons/safari-pinned-tab.svg" color="#712cf9">--> | ||
| <!-- <link rel="icon" href="/docs/5.3/assets/img/favicons/favicon.ico">--> | ||
| <meta name="theme-color" content="rgb(33, 37, 41)"> | ||
|
|
||
| <style> | ||
| @import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css"); | ||
|
|
||
| .container { | ||
| max-width: 960px; | ||
| } | ||
|
|
||
| .feature-icon-small { | ||
| width: 3rem; | ||
| height: 3rem; | ||
| } | ||
| </style> | ||
|
|
||
| </head> | ||
| <body> | ||
| <h1> This is a heading</h1> | ||
| <p>This is a paragraph</p> | ||
|
|
||
| <nav class="navbar navbar-expand-lg text-bg-primary bg-body-primary rounded"> | ||
| <div class="container-fluid"> | ||
| <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarsExample11" | ||
| aria-controls="navbarsExample11" aria-expanded="false" aria-label="Toggle navigation"> | ||
| <span class="navbar-toggler-icon"></span> | ||
| </button> | ||
|
|
||
| <div class="collapse navbar-collapse d-lg-flex" id="navbarsExample11"> | ||
| <a class="navbar-brand col-lg-3 me-0" href="#">LaraJournal</a> | ||
| <ul class="navbar-nav col-lg-6 justify-content-lg-center"> | ||
| <li class="nav-item"> | ||
| <a class="nav-link me-3" href="#">Home</a> | ||
| </li> | ||
| <li class="nav-item"> | ||
| <a class="nav-link me-3" href="#">Features</a> | ||
| </li> | ||
| <li class="nav-item"> | ||
| <a class="nav-link me-3" href="https://larajournal.github.io/docs" target="_blank">Documentation</a> | ||
| </li> | ||
| <li class="nav-item"> | ||
| <a class="nav-link me-3" href="https://larajournal.github.io/blog" target="_blank">Blog</a> | ||
| </li> | ||
| <li class="nav-item dropdown"> | ||
| <a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown" | ||
| aria-expanded="false">English</a> | ||
| <ul class="dropdown-menu"> | ||
| <li><a class="dropdown-item" href="#">English</a></li> | ||
| <li><a class="dropdown-item" href="#">Russian</a></li> | ||
| </ul> | ||
| </li> | ||
| </ul> | ||
| <div class="d-lg-flex col-lg-3 justify-content-lg-end"> | ||
| <a class="btn btn-primary" href="https://github.com/gomzyakov/larajournal" target="_blank">Star us on GitHub</a> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </nav> | ||
|
|
||
| <div class="text-bg-primary pt-3 px-3 pt-md-5 px-md-5 text-center overflow-hidden"> | ||
| <div class="col-lg-6 mx-lg-auto my-3 pt-4"> | ||
| <h2 class="display-5 fw-semibold">Simple blog app on Laravel</h2> | ||
| </div> | ||
| <div class="col-lg-6 mx-lg-auto mb-5 pb-4"> | ||
| <!-- Если вы ищите "блог на ларавель" то... --> | ||
| <p class="lead">The goal of this project is to showcase good PHP and Laravel development practices with a simple | ||
| blog application.</p> | ||
| </div> | ||
| <div class="bg-body-tertiary shadow-sm mx-auto" | ||
| style="width: 60%; height: 420px; border-radius: 21px 21px 0 0;"> | ||
| <img src="screenshot-main-page.png" style="max-width: 100%; border-radius: 8px 8px 0 0;" alt="ddd"> | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="container px-4 py-5"> | ||
|
|
||
| <div class="row row-cols-1 row-cols-md-2 align-items-md-center g-5 py-5"> | ||
| <div class="col-lg-8 d-flex flex-column align-items-start gap-2"> | ||
| <h2 class="fw-bold text-body-emphasis">Must-have features</h2> | ||
| <p class="text-body-secondary"> | ||
| Choosing the right blogging platform is crucial for the success and functionality of your blog. | ||
| LaraJournal has everything you need in a blogging app. | ||
| </p> | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="row row-cols-1 row-cols-md-3 g-4"> | ||
| <div class="col d-flex flex-column gap-2"> | ||
| <div class="feature-icon-small d-inline-flex align-items-center justify-content-center text-bg-primary bg-gradient fs-4 rounded-3"> | ||
| <i class="bi bi-gear"></i> | ||
| </div> | ||
| <h4 class="fw-semibold mb-0 text-body-emphasis">Easy to set up</h4> | ||
| <p class="text-body-secondary">Manage users, posts, categories and tags.</p> | ||
| </div> | ||
| <div class="col d-flex flex-column gap-2"> | ||
| <div class="feature-icon-small d-inline-flex align-items-center justify-content-center text-bg-primary bg-gradient fs-4 rounded-3"> | ||
| <i class="bi bi-file-earmark"></i> | ||
| </div> | ||
| <h4 class="fw-semibold mb-0 text-body-emphasis">Blog posts</h4> | ||
| <p class="text-body-secondary">Paragraph of text beneath the heading to explain the heading.</p> | ||
| </div> | ||
|
|
||
| <div class="col d-flex flex-column gap-2"> | ||
| <div class="feature-icon-small d-inline-flex align-items-center justify-content-center text-bg-primary bg-gradient fs-4 rounded-3"> | ||
| <i class="bi bi-bookmark-check"></i> | ||
| </div> | ||
| <h4 class="fw-semibold mb-0 text-body-emphasis">Categories</h4> | ||
| <p class="text-body-secondary">Paragraph of text beneath the heading to explain the heading.</p> | ||
| </div> | ||
|
|
||
| <div class="col d-flex flex-column gap-2"> | ||
| <div class="feature-icon-small d-inline-flex align-items-center justify-content-center text-bg-primary bg-gradient fs-4 rounded-3"> | ||
| <i class="bi bi-trophy"></i> | ||
| </div> | ||
| <h4 class="fw-semibold mb-0 text-body-emphasis">Popular posts</h4> | ||
| <p class="text-body-secondary">Paragraph of text beneath the heading to explain the heading.</p> | ||
| </div> | ||
|
|
||
| <div class="col d-flex flex-column gap-2"> | ||
| <div class="feature-icon-small d-inline-flex align-items-center justify-content-center text-bg-primary bg-gradient fs-4 rounded-3"> | ||
| <i class="bi bi-person-gear"></i> | ||
| </div> | ||
| <h4 class="fw-semibold mb-0 text-body-emphasis">Admin panel</h4> | ||
| <p class="text-body-secondary">Paragraph of text beneath the heading to explain the heading.</p> | ||
| </div> | ||
|
|
||
| <div class="col d-flex flex-column gap-2"> | ||
| <div class="feature-icon-small d-inline-flex align-items-center justify-content-center text-bg-primary bg-gradient fs-4 rounded-3"> | ||
| <i class="bi bi-trophy"></i> | ||
| </div> | ||
| <h4 class="fw-semibold mb-0 text-body-emphasis">Roles</h4> | ||
| <p class="text-body-people"> | ||
| Reader and administrator. | ||
| <span class="badge text-bg-warning">Coming soon</span> | ||
| </p> | ||
| </div> | ||
|
|
||
| <div class="col d-flex flex-column gap-2"> | ||
| <div class="feature-icon-small d-inline-flex align-items-center justify-content-center text-bg-primary bg-gradient fs-4 rounded-3"> | ||
| <i class="bi bi-chat-right-text"></i> | ||
| </div> | ||
| <h4 class="fw-semibold mb-0 text-body-emphasis">Comments and likes</h4> | ||
| <p class="text-body-secondary">Paragraph of text beneath the heading to explain the heading.</p> | ||
| </div> | ||
|
|
||
| <div class="col d-flex flex-column gap-2"> | ||
| <div class="feature-icon-small d-inline-flex align-items-center justify-content-center text-bg-primary bg-gradient fs-4 rounded-3"> | ||
| <i class="bi bi-pen"></i> | ||
| </div> | ||
| <h4 class="fw-semibold mb-0 text-body-emphasis">Post`s visual editor</h4> | ||
| <p class="text-body-secondary"> | ||
| Paragraph of text beneath the heading to explain the heading. | ||
| <span class="badge text-bg-warning">Coming soon</span> | ||
| </p> | ||
| </div> | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="container my-5"> | ||
| <div class="p-5 text-center bg-body-tertiary rounded-3"> | ||
| <h3 class="h1 text-body-emphasis fw-semibold">Need GitHub stars!</h3> | ||
| <p class="lead pb-4"> | ||
| We need your support, please go to the GitHub repository and give us a star. | ||
| </p> | ||
| <div class="d-grid gap-2 col-lg-4 mx-auto"> | ||
| <a class="btn btn-primary" href="https://github.com/gomzyakov/larajournal" target="_blank">Go to repository</a> | ||
| </div> | ||
| </div> | ||
| </div> | ||
|
|
||
| <div class="container my-5"> | ||
| <footer class="pt-5 my-5 text-body-secondary border-top"> | ||
| <p>LaraJournal — Simple blog app on Laravel.</p> | ||
| <p>Made with ♥ by <a href="https://github.com/gomzyakov" target="_blank">Alexander Gomzyakov</a> & <a href="https://github.com/gomzyakov/larajournal/graphs/contributors" target="_blank">contributors</a>.</p> | ||
| </footer> | ||
| </div> | ||
|
|
||
| <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" | ||
| integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" | ||
| crossorigin="anonymous"></script> | ||
| </body> | ||
| </html> |
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.