aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorSyndamia <kamen.d.mladenov@protonmail.com>2021-05-06 19:38:51 +0300
committerSyndamia <kamen.d.mladenov@protonmail.com>2021-05-06 19:38:51 +0300
commit985d0a6f6dcfffaa227c117aaa184b4846009c0a (patch)
treef80370308f7492e9df0f5dc3e113659ae63d839a
parent53921ccea49bd8a7840d5bbc71c57c8691ed92bf (diff)
downloadit-kariera-exam-template-985d0a6f6dcfffaa227c117aaa184b4846009c0a.tar
it-kariera-exam-template-985d0a6f6dcfffaa227c117aaa184b4846009c0a.tar.gz
it-kariera-exam-template-985d0a6f6dcfffaa227c117aaa184b4846009c0a.zip
Moved nabvar to it's own cshtml and simplified it a lot; Removed most of the default css and js from wwwroot; Implemented a very simple custom styling that mimmics the default asp.net bootstrap one
Diffstat
-rw-r--r--.gitignore1
-rw-r--r--ExamTemplate/Web/Views/Shared/_Layout.cshtml39
-rw-r--r--ExamTemplate/Web/Views/Shared/_Navbar.cshtml14
-rw-r--r--ExamTemplate/Web/wwwroot/css/site.css79
-rw-r--r--ExamTemplate/Web/wwwroot/css/styles.css89
-rw-r--r--ExamTemplate/Web/wwwroot/favicon.icobin0 -> 32038 bytes
6 files changed, 191 insertions, 31 deletions
diff --git a/.gitignore b/.gitignore
index 3c5eb50..f8e6d33 100644
--- a/.gitignore
+++ b/.gitignore
@@ -213,7 +213,6 @@ project.lock.json
# Output folder used by Webpack or other FE stuff
**/node_modules/*
-**/wwwroot/*
# SpecFlow specific
*.feature.cs
diff --git a/ExamTemplate/Web/Views/Shared/_Layout.cshtml b/ExamTemplate/Web/Views/Shared/_Layout.cshtml
index 8ae73f3..470bba7 100644
--- a/ExamTemplate/Web/Views/Shared/_Layout.cshtml
+++ b/ExamTemplate/Web/Views/Shared/_Layout.cshtml
@@ -4,45 +4,24 @@
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>@ViewData["Title"] - Web</title>
- <link rel="stylesheet" href="~/lib/bootstrap/dist/css/bootstrap.min.css" />
<link rel="stylesheet" href="~/css/site.css" />
+ <link rel="stylesheet" href="~/css/styles.css" />
</head>
<body>
<header>
- <nav class="navbar navbar-expand-sm navbar-toggleable-sm navbar-light bg-white border-bottom box-shadow mb-3">
- <div class="container">
- <a class="navbar-brand" asp-area="" asp-controller="Home" asp-action="Index">Web</a>
- <button class="navbar-toggler" type="button" data-toggle="collapse" data-target=".navbar-collapse" aria-controls="navbarSupportedContent"
- aria-expanded="false" aria-label="Toggle navigation">
- <span class="navbar-toggler-icon"></span>
- </button>
- <div class="navbar-collapse collapse d-sm-inline-flex flex-sm-row-reverse">
- <ul class="navbar-nav flex-grow-1">
- <li class="nav-item">
- <a class="nav-link text-dark" asp-area="" asp-controller="Home" asp-action="Index">Home</a>
- </li>
- <li class="nav-item">
- <a class="nav-link text-dark" asp-area="" asp-controller="Home" asp-action="Privacy">Privacy</a>
- </li>
- </ul>
- </div>
- </div>
- </nav>
+ <partial name="_Navbar.cshtml" />
</header>
- <div class="container">
- <main role="main" class="pb-3">
+
+ <main class="main">
+ <div class="middle-content-container">
@RenderBody()
- </main>
- </div>
+ </div>
+ </main>
- <footer class="border-top footer text-muted">
- <div class="container">
+ <footer class="border-top box-shadow">
+ <div class="middle-content-container">
&copy; 2021 - Web - <a asp-area="" asp-controller="Home" asp-action="Privacy">Privacy</a>
</div>
</footer>
- <script src="~/lib/jquery/dist/jquery.min.js"></script>
- <script src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
- <script src="~/js/site.js" asp-append-version="true"></script>
- @RenderSection("Scripts", required: false)
</body>
</html>
diff --git a/ExamTemplate/Web/Views/Shared/_Navbar.cshtml b/ExamTemplate/Web/Views/Shared/_Navbar.cshtml
new file mode 100644
index 0000000..f81d082
--- /dev/null
+++ b/ExamTemplate/Web/Views/Shared/_Navbar.cshtml
@@ -0,0 +1,14 @@
+<nav class="navbar border-bottom box-shadow">
+ <div class="middle-content-container navbar-contents">
+ <section>
+ <b>
+ <a asp-controller="Home" asp-action="Index">Web</a>
+ </b>
+ </section>
+ <div class="flex-spacer"></div>
+ <section>
+ <a asp-controller="Home" asp-action="Index">Home</a>
+ <a asp-controller="Home" asp-action="Privacy">Privacy</a>
+ </section>
+ </div>
+</nav>
diff --git a/ExamTemplate/Web/wwwroot/css/site.css b/ExamTemplate/Web/wwwroot/css/site.css
new file mode 100644
index 0000000..5923427
--- /dev/null
+++ b/ExamTemplate/Web/wwwroot/css/site.css
@@ -0,0 +1,79 @@
+/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification
+for details on configuring this project to bundle and minify static web assets. */
+
+a.navbar-brand {
+ white-space: normal;
+ text-align: center;
+ word-break: break-all;
+}
+
+/* Provide sufficient contrast against white background */
+a {
+ color: #0366d6;
+}
+
+.btn-primary {
+ color: #fff;
+ background-color: #1b6ec2;
+ border-color: #1861ac;
+}
+
+.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
+ color: #fff;
+ background-color: #1b6ec2;
+ border-color: #1861ac;
+}
+
+/* Sticky footer styles
+-------------------------------------------------- */
+html {
+ font-size: 14px;
+}
+@media (min-width: 768px) {
+ html {
+ font-size: 16px;
+ }
+}
+
+.border-top {
+ border-top: 1px solid #e5e5e5;
+}
+.border-bottom {
+ border-bottom: 1px solid #e5e5e5;
+}
+
+.box-shadow {
+ box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .05);
+}
+
+button.accept-policy {
+ font-size: 1rem;
+ line-height: inherit;
+}
+
+/* Sticky footer styles
+-------------------------------------------------- */
+html {
+ position: relative;
+ min-height: 100%;
+ line-height: 1.15;
+}
+
+body {
+ min-height: 100vh;
+ margin: 0;
+ font-size: 1.15em;
+ background-color: white;
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+}
+
+/* The following is kinda dirty, that's why it's separated */
+
+body {
+ display: flex;
+ flex-direction: column;
+}
+
+body > main {
+ flex: 1;
+}
diff --git a/ExamTemplate/Web/wwwroot/css/styles.css b/ExamTemplate/Web/wwwroot/css/styles.css
new file mode 100644
index 0000000..51631c0
--- /dev/null
+++ b/ExamTemplate/Web/wwwroot/css/styles.css
@@ -0,0 +1,89 @@
+
+/* Change the maximum width of content (stuff inside pages and navbar),
+ * depending on width of browser window.
+ * Configuration copied from default Bootstrap
+ */
+
+@media (min-width: 576px) {
+ :root {
+ --max-content-width: 540px;
+ }
+}
+
+@media (min-width: 768px) {
+ :root {
+ --max-content-width: 720px;
+ }
+}
+
+@media (min-width: 992px) {
+ :root {
+ --max-content-width: 960px;
+ }
+}
+
+@media (min-width: 1200px) {
+ :root {
+ --max-content-width: 1140px;
+ }
+}
+
+/* Main */
+
+.main {
+ width: 100%;
+ height: 100%;
+}
+
+ /* Stuff that you need in the middle portion
+ * of the screen (like the stuff inside the
+ * navbar and footer) should be inside
+ * an element with this tag
+ */
+.middle-content-container {
+ max-width: var(--max-content-width);
+ margin-left: auto;
+ margin-right: auto;
+}
+
+/* Navbar and footer */
+
+.navbar {
+ width: 100%;
+ background-color: white;
+}
+
+.navbar, footer {
+ padding-top: 8px;
+ padding-bottom: 8px;
+}
+
+.navbar a {
+ padding-left: 5px;
+ padding-right: 5px;
+ text-decoration: none;
+ color: #343a40;
+}
+
+.navbar a:hover {
+ color: black;
+}
+
+.navbar-contents {
+ width: 100%;
+ display: flex;
+ padding-right: 15px;
+ padding-left: 15px;
+}
+
+.navbar-contents > * {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+}
+
+/* Other general stuff */
+
+.flex-spacer {
+ flex: 1;
+}
diff --git a/ExamTemplate/Web/wwwroot/favicon.ico b/ExamTemplate/Web/wwwroot/favicon.ico
new file mode 100644
index 0000000..a3a7999
--- /dev/null
+++ b/ExamTemplate/Web/wwwroot/favicon.ico
Binary files differ
generated by cgit v1.2.3 (git 2.46.0) at 2026-04-14 18:42:31 +0000