Homework 1
- repository and subdirectories created inside - basic project structure created (/public/*.html, /public/static/css/style.css, /public/static/js/script.js) - bootstrap library connected locally (/public/static/css/bootstrap.min.css) (not used yet, connected for future) - permissions configured (protected main branch + merge only via PR - 1) - .gitignore configured (based on python template) - - base.html, index.html, question.html, ask.html, login.html, signup.html, and profile.html are all set up
This commit is contained in:
redtea committed
1 parent
d17d541a89
commit
97d0a2748b
17 files changed
+1153
-1
No files matched your search
+7
-1
@@ -186,7 +186,7 @@ cython_debug/
|
|||||||
# that can be found at https://github.com/github/gitignore/blob/main/Global/VisualStudioCode.gitignore
|
# that can be found at https://github.com/github/gitignore/blob/main/Global/VisualStudioCode.gitignore
|
||||||
# and can be added to the global gitignore or merged into this file. However, if you prefer,
|
# and can be added to the global gitignore or merged into this file. However, if you prefer,
|
||||||
# you could uncomment the following to ignore the entire vscode folder
|
# you could uncomment the following to ignore the entire vscode folder
|
||||||
# .vscode/
|
.vscode/
|
||||||
|
|
||||||
# Ruff stuff:
|
# Ruff stuff:
|
||||||
.ruff_cache/
|
.ruff_cache/
|
||||||
@@ -205,3 +205,9 @@ cython_debug/
|
|||||||
marimo/_static/
|
marimo/_static/
|
||||||
marimo/_lsp/
|
marimo/_lsp/
|
||||||
__marimo__/
|
__marimo__/
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.DS_Store
|
||||||
|
*.log
|
||||||
|
*.sqlite3
|
||||||
@@ -1,2 +1,14 @@
|
|||||||
# 2026-VK-EDU-Web-12-Istratov-D
|
# 2026-VK-EDU-Web-12-Istratov-D
|
||||||
VK Education
|
VK Education
|
||||||
|
|
||||||
|
## Инструкция к запуску
|
||||||
|
Индекс-файл (открыть в браузере): `/public/index.html`
|
||||||
|
|
||||||
|
## HW-1:
|
||||||
|
- создан репозиторий и подкаталоги внутри
|
||||||
|
- создана базовая структура проекта (/public/*.html, /public/static/css/style.css, /public/static/js/script.js)
|
||||||
|
- подключена библиотека bootstrap локально (/public/static/css/bootstrap.min.css) (пока не использовалась, подключена на будущее)
|
||||||
|
- настроены права (protected main branch + merge только через PR — 1)
|
||||||
|
- настроен .gitignore (за основу взят шаблон для python)
|
||||||
|
- сверстаны
|
||||||
|
- сверстаны base.html, index.html, question.html, ask.html, login.html, signup.html, profile.html
|
||||||
Whitespace-only changes.
@@ -0,0 +1,83 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>VkDesk | Ask a Question</title>
|
||||||
|
<meta name="description" content="VkDesk Q&A">
|
||||||
|
<link rel="stylesheet" href="./static/css/style.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header class="site-header">
|
||||||
|
<div class="logo">VkDesk</div>
|
||||||
|
<form class="search">
|
||||||
|
<input type="text" placeholder="Search">
|
||||||
|
<a class="button button--ask" href="index.html">ASK IT</a>
|
||||||
|
</form>
|
||||||
|
<div class="user-auth">
|
||||||
|
<a href="login.html">Sign In</a>
|
||||||
|
<a href="signup.html">register</a>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<div class="content">
|
||||||
|
<main>
|
||||||
|
<div class="main-title">
|
||||||
|
<h1>Ask a Question</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<form class="form">
|
||||||
|
<div class="form-row">
|
||||||
|
<label for="title">Title</label>
|
||||||
|
<input id="title" type="text" value="How to build a moon park ?">
|
||||||
|
</div>
|
||||||
|
<div class="form-row">
|
||||||
|
<label for="text">Text</label>
|
||||||
|
<textarea id="text">Really, how ? Have no idea about it</textarea>
|
||||||
|
</div>
|
||||||
|
<div class="form-row">
|
||||||
|
<label for="tags">Tags</label>
|
||||||
|
<input id="tags" type="text" value="moon, park, puzzle">
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<button class="button" type="button">ASK IT</button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<aside class="sidebar">
|
||||||
|
<div class="sidebar-section">
|
||||||
|
<h2>Trending Tags</h2>
|
||||||
|
<div class="tag-cloud">
|
||||||
|
<span>perl</span>
|
||||||
|
<span class="tag-red">python</span>
|
||||||
|
<span>TechnoPark</span>
|
||||||
|
<span class="tag-red">MySQL</span>
|
||||||
|
<span class="tag-green">django</span>
|
||||||
|
<span>Mail.Ru</span>
|
||||||
|
<span>Voloshin</span>
|
||||||
|
<span class="tag-orange">Firefox</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="sidebar-section">
|
||||||
|
<h2>Top Members</h2>
|
||||||
|
<div class="member-list">
|
||||||
|
<a href="#">Mr. Freeman</a>
|
||||||
|
<a href="#">Dr. House</a>
|
||||||
|
<a href="#">Bender</a>
|
||||||
|
<a href="#">Queen Victoria</a>
|
||||||
|
<a href="#">V. Pupkin</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</aside>
|
||||||
|
</div>
|
||||||
|
<footer class="footer">2026</footer>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@@ -0,0 +1,140 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>VkDesk | Fresh Questions</title>
|
||||||
|
<meta name="description" content="VkDesk Q&A">
|
||||||
|
<link rel="stylesheet" href="./static/css/style.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header class="site-header">
|
||||||
|
<div class="logo">VkDesk</div>
|
||||||
|
<form class="search">
|
||||||
|
<input type="text" placeholder="Search">
|
||||||
|
<a class="button button--ask" href="index.html">ASK IT</a>
|
||||||
|
</form>
|
||||||
|
<div class="user-block">
|
||||||
|
<div class="avatar-box small">avatar</div>
|
||||||
|
<div class="user-links">
|
||||||
|
<div class="user-name">Dr. Pepper</div>
|
||||||
|
<div>
|
||||||
|
<a href="profile.html">settings</a>
|
||||||
|
<a href="login.html">log out</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<div class="content">
|
||||||
|
<main>
|
||||||
|
<div class="main-title">
|
||||||
|
<h1>Fresh Questions</h1>
|
||||||
|
<a href="#">Top Today</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<article class="card">
|
||||||
|
<div>
|
||||||
|
<div class="avatar-box">avatar</div>
|
||||||
|
<div class="vote-box">
|
||||||
|
<span>5</span>
|
||||||
|
<span class="vote-arrows">^<span>'</span></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<a class="question-title" href="question.html">How to build a moon park ?</a>
|
||||||
|
<p>Guys, i have trouble with a moon park. Cant find the black-jack...</p>
|
||||||
|
<div class="meta">
|
||||||
|
<a href="question.html">answer (3)</a>
|
||||||
|
<span>Tags:</span>
|
||||||
|
<a class="tag" href="#">black-jack</a>
|
||||||
|
<a class="tag" href="#">bender</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<article class="card">
|
||||||
|
<div>
|
||||||
|
<div class="avatar-box">avatar</div>
|
||||||
|
<div class="vote-box">
|
||||||
|
<span>5</span>
|
||||||
|
<span class="vote-arrows">^<span>'</span></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<a class="question-title" href="question.html">How to build a moon park ?</a>
|
||||||
|
<p>Guys, i have trouble with a moon park. Can't find the black-jack...</p>
|
||||||
|
<div class="meta">
|
||||||
|
<a href="question.html">answer (3)</a>
|
||||||
|
<span>Tags:</span>
|
||||||
|
<a class="tag" href="#">black-jack</a>
|
||||||
|
<a class="tag" href="#">bender</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<article class="card">
|
||||||
|
<div>
|
||||||
|
<div class="avatar-box">avatar</div>
|
||||||
|
<div class="vote-box">
|
||||||
|
<span>5</span>
|
||||||
|
<span class="vote-arrows">^<span>'</span></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<a class="question-title" href="question.html">How to build a moon park ?</a>
|
||||||
|
<p>Guys, i have trouble with a moon park. Can't find the black-jack...</p>
|
||||||
|
<div class="meta">
|
||||||
|
<a href="question.html">answer (3)</a>
|
||||||
|
<span>Tags:</span>
|
||||||
|
<a class="tag" href="#">black-jack</a>
|
||||||
|
<a class="tag" href="#">bender</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<nav class="pagination">
|
||||||
|
<a class="page-link" href="#">1</a>
|
||||||
|
<a class="page-link" href="#">2</a>
|
||||||
|
<a class="page-link" href="#">3</a>
|
||||||
|
<span class="page-link">...</span>
|
||||||
|
<a class="page-link" href="#">53</a>
|
||||||
|
</nav>
|
||||||
|
</main>
|
||||||
|
|
||||||
|
<aside class="sidebar">
|
||||||
|
<div class="sidebar-section">
|
||||||
|
<h2>Trending Tags</h2>
|
||||||
|
<div class="tag-cloud">
|
||||||
|
<span>perl</span>
|
||||||
|
<span class="tag-red">c++</span>
|
||||||
|
<span>TechnoPark</span>
|
||||||
|
<span class="tag-red">RUST</span>
|
||||||
|
<span class="tag-green">django</span>
|
||||||
|
<span>Mail.Ru</span>
|
||||||
|
<span>Java</span>
|
||||||
|
<span class="tag-orange">TS</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="sidebar-section">
|
||||||
|
<h2>Top Members</h2>
|
||||||
|
<div class="member-list">
|
||||||
|
<a href="#">Mr. Freeman</a>
|
||||||
|
<a href="#">Dr. House</a>
|
||||||
|
<a href="#">Bender</a>
|
||||||
|
<a href="#">Queen Victoria</a>
|
||||||
|
<a href="#">V. Pupkin</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</aside>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<footer class="footer">2026</footer>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@@ -0,0 +1,137 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>VkDesk | Fresh Questions</title>
|
||||||
|
<meta name="description" content="VkDesk Q&A">
|
||||||
|
<link rel="stylesheet" href="./static/css/style.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header class="site-header">
|
||||||
|
<div class="logo">VkDesk</div>
|
||||||
|
<form class="search">
|
||||||
|
<input type="text" placeholder="Search">
|
||||||
|
<a class="button button--ask" href="index.html">ASK IT</a>
|
||||||
|
</form>
|
||||||
|
<div class="user-block">
|
||||||
|
<div class="avatar-box small">avatar</div>
|
||||||
|
<div class="user-links">
|
||||||
|
<div class="user-name">Dr. Pepper</div>
|
||||||
|
<div>
|
||||||
|
<a href="profile.html">settings</a>
|
||||||
|
<a href="login.html">log out</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<div class="content">
|
||||||
|
<main>
|
||||||
|
<div class="main-title">
|
||||||
|
<h1>Fresh Questions</h1>
|
||||||
|
<a href="#">Top Today</a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<article class="card">
|
||||||
|
<div>
|
||||||
|
<div class="avatar-box">avatar</div>
|
||||||
|
<div class="vote-box">
|
||||||
|
<span>5</span>
|
||||||
|
<span class="vote-arrows">^<span>'</span></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<a class="question-title" href="question.html">How to build a moon park ?</a>
|
||||||
|
<p>Guys, i have trouble with a moon park. Can't find the black-jack...</p>
|
||||||
|
<div class="meta">
|
||||||
|
<a href="question.html">answer (3)</a>
|
||||||
|
<span>Tags:</span>
|
||||||
|
<a class="tag" href="#">black-jack</a>
|
||||||
|
<a class="tag" href="#">bender</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<article class="card">
|
||||||
|
<div>
|
||||||
|
<div class="avatar-box">avatar</div>
|
||||||
|
<div class="vote-box">
|
||||||
|
<span>5</span>
|
||||||
|
<span class="vote-arrows">^<span>'</span></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<a class="question-title" href="question.html">How to build a moon park ?</a>
|
||||||
|
<p>Guys, i have trouble with a moon park. Can't find the black-jack...</p>
|
||||||
|
<div class="meta">
|
||||||
|
<a href="question.html">answer (3)</a>
|
||||||
|
<span>Tags:</span>
|
||||||
|
<a class="tag" href="#">black-jack</a>
|
||||||
|
<a class="tag" href="#">bender</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<article class="card">
|
||||||
|
<div>
|
||||||
|
<div class="avatar-box">avatar</div>
|
||||||
|
<div class="vote-box">
|
||||||
|
<span>5</span>
|
||||||
|
<span class="vote-arrows">^<span>'</span></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<a class="question-title" href="question.html">How to build a moon park ?</a>
|
||||||
|
<p>Guys, i have trouble with a moon park. Can't find the black-jack...</p>
|
||||||
|
<div class="meta">
|
||||||
|
<a href="question.html">answer (3)</a>
|
||||||
|
<span>Tags:</span>
|
||||||
|
<a class="tag" href="#">black-jack</a>
|
||||||
|
<a class="tag" href="#">bender</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<nav class="pagination">
|
||||||
|
<a class="page-link" href="#">1</a>
|
||||||
|
<a class="page-link" href="#">2</a>
|
||||||
|
<a class="page-link" href="#">3</a>
|
||||||
|
<span class="page-link">...</span>
|
||||||
|
<a class="page-link" href="#">53</a>
|
||||||
|
</nav>
|
||||||
|
</main>
|
||||||
|
<aside class="sidebar">
|
||||||
|
<div class="sidebar-section">
|
||||||
|
<h2>Trending Tags</h2>
|
||||||
|
<div class="tag-cloud">
|
||||||
|
<span>perl</span>
|
||||||
|
<span class="tag-red">python</span>
|
||||||
|
<span>TechnoPark</span>
|
||||||
|
<span class="tag-red">MySQL</span>
|
||||||
|
<span class="tag-green">django</span>
|
||||||
|
<span>Mail.Ru</span>
|
||||||
|
<span>Voloshin</span>
|
||||||
|
<span class="tag-orange">Firefox</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="sidebar-section">
|
||||||
|
<h2>Top Members</h2>
|
||||||
|
<div class="member-list">
|
||||||
|
<a href="#">Mr. Freeman</a>
|
||||||
|
<a href="#">Dr. House</a>
|
||||||
|
<a href="#">Bender</a>
|
||||||
|
<a href="#">Queen Victoria</a>
|
||||||
|
<a href="#">V. Pupkin</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</aside>
|
||||||
|
</div>
|
||||||
|
<footer class="footer">2026</footer>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@@ -0,0 +1,80 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>VkDesk ' Sign In</title>
|
||||||
|
<meta name="description" content="VkDesk Q&A">
|
||||||
|
<link rel="stylesheet" href="./static/css/style.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header class="site-header">
|
||||||
|
<div class="logo">VkDesk</div>
|
||||||
|
<form class="search">
|
||||||
|
<input type="text" placeholder="Search">
|
||||||
|
<a class="button button--ask" href="index.html">ASK IT</a>
|
||||||
|
</form>
|
||||||
|
<div class="user-auth">
|
||||||
|
<a href="login.html">Sign In</a>
|
||||||
|
<a href="signup.html">register</a>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<div class="content">
|
||||||
|
<main>
|
||||||
|
<div class="main-title">
|
||||||
|
<h1>Sign In</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p class="error">Sorry, wrong password!</p>
|
||||||
|
|
||||||
|
<form class="form">
|
||||||
|
<div class="form-row">
|
||||||
|
<label for="login">Login</label>
|
||||||
|
<input id="login" type="text" placeholder="Enter your login here">
|
||||||
|
</div>
|
||||||
|
<div class="form-row">
|
||||||
|
<label for="password">Password</label>
|
||||||
|
<input id="password" type="password" value="********">
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<button class="button" type="button">Sign In!</button>
|
||||||
|
</div>
|
||||||
|
<a href="signup.html">create new account</a>
|
||||||
|
</form>
|
||||||
|
</main>
|
||||||
|
<aside class="sidebar">
|
||||||
|
<div class="sidebar-section">
|
||||||
|
<h2>Trending Tags</h2>
|
||||||
|
<div class="tag-cloud">
|
||||||
|
<span>perl</span>
|
||||||
|
<span class="tag-red">python</span>
|
||||||
|
<span>TechnoPark</span>
|
||||||
|
<span class="tag-red">MySQL</span>
|
||||||
|
<span class="tag-green">django</span>
|
||||||
|
<span>Mail.Ru</span>
|
||||||
|
<span>Voloshin</span>
|
||||||
|
<span class="tag-orange">Firefox</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="sidebar-section">
|
||||||
|
<h2>Top Members</h2>
|
||||||
|
<div class="member-list">
|
||||||
|
<a href="#">Mr. Freeman</a>
|
||||||
|
<a href="#">Dr. House</a>
|
||||||
|
<a href="#">Bender</a>
|
||||||
|
<a href="#">Queen Victoria</a>
|
||||||
|
<a href="#">V. Pupkin</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</aside>
|
||||||
|
</div>
|
||||||
|
<footer class="footer">2026</footer>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@@ -0,0 +1,94 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>VkDesk | Settings</title>
|
||||||
|
<meta name="description" content="VkDesk Q&A">
|
||||||
|
<link rel="stylesheet" href="./static/css/style.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header class="site-header">
|
||||||
|
<div class="logo">VkDesk</div>
|
||||||
|
<form class="search">
|
||||||
|
<input type="text" placeholder="Search">
|
||||||
|
<a class="button button--ask" href="index.html">ASK IT</a>
|
||||||
|
</form>
|
||||||
|
<div class="user-block">
|
||||||
|
<div class="avatar-box small">avatar</div>
|
||||||
|
<div class="user-links">
|
||||||
|
<div class="user-name">Dr. Pepper</div>
|
||||||
|
<div>
|
||||||
|
<a href="profile.html">settings</a>
|
||||||
|
<a href="login.html">log out</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<div class="content">
|
||||||
|
<main>
|
||||||
|
<div class="main-title">
|
||||||
|
<h1>Profile: Dr. Pepper</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<form class="form">
|
||||||
|
<div class="form-row">
|
||||||
|
<label for="login">Login</label>
|
||||||
|
<input id="login" type="text" value="dr_pepper">
|
||||||
|
</div>
|
||||||
|
<div class="form-row">
|
||||||
|
<label for="email">Email</label>
|
||||||
|
<input id="email" type="email" value="drpepper@mail.ru">
|
||||||
|
</div>
|
||||||
|
<div class="form-row">
|
||||||
|
<label for="nickname">NickName</label>
|
||||||
|
<input id="nickname" type="text" value="Dr. Pepper">
|
||||||
|
</div>
|
||||||
|
<div class="form-row">
|
||||||
|
<label>Upload avatar</label>
|
||||||
|
<div class="avatar-box">avatar</div>
|
||||||
|
</div>
|
||||||
|
<div class="form-row">
|
||||||
|
<span></span>
|
||||||
|
<input type="file">
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<button class="button" type="button">Save</button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</main>
|
||||||
|
<aside class="sidebar">
|
||||||
|
<div class="sidebar-section">
|
||||||
|
<h2>Trending Tags</h2>
|
||||||
|
<div class="tag-cloud">
|
||||||
|
<span>perl</span>
|
||||||
|
<span class="tag-red">python</span>
|
||||||
|
<span>TechnoPark</span>
|
||||||
|
<span class="tag-red">MySQL</span>
|
||||||
|
<span class="tag-green">django</span>
|
||||||
|
<span>Mail.Ru</span>
|
||||||
|
<span>Voloshin</span>
|
||||||
|
<span class="tag-orange">Firefox</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="sidebar-section">
|
||||||
|
<h2>Top Members</h2>
|
||||||
|
<div class="member-list">
|
||||||
|
<a href="#">Mr. Freeman</a>
|
||||||
|
<a href="#">Dr. House</a>
|
||||||
|
<a href="#">Bender</a>
|
||||||
|
<a href="#">Queen Victoria</a>
|
||||||
|
<a href="#">V. Pupkin</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</aside>
|
||||||
|
</div>
|
||||||
|
<footer class="footer">2026</footer>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@@ -0,0 +1,117 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>VkDesk | Question</title>
|
||||||
|
<meta name="description" content="VkDesk Q&A">
|
||||||
|
<link rel="stylesheet" href="./static/css/style.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header class="site-header">
|
||||||
|
<div class="logo">VkDesk</div>
|
||||||
|
<form class="search">
|
||||||
|
<input type="text" placeholder="Search">
|
||||||
|
<a class="button button--ask" href="index.html">ASK IT</a>
|
||||||
|
</form>
|
||||||
|
<div class="user-auth">
|
||||||
|
<a href="login.html">Sign In</a>
|
||||||
|
<a href="signup.html">register</a>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<div class="content">
|
||||||
|
<main>
|
||||||
|
<article class="card">
|
||||||
|
<div>
|
||||||
|
<div class="avatar-box">avatar</div>
|
||||||
|
<div class="vote-box">
|
||||||
|
<span>5</span>
|
||||||
|
<span class="vote-arrows">^<span>'</span></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<div class="question-title">How to build a moon park ?</div>
|
||||||
|
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
|
||||||
|
<div class="meta">
|
||||||
|
<span>Tags:</span>
|
||||||
|
<a class="tag" href="#">black-jack</a>
|
||||||
|
<a class="tag" href="#">bender</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<article class="answer-card">
|
||||||
|
<div>
|
||||||
|
<div class="avatar-box">avatar</div>
|
||||||
|
<div class="vote-box">
|
||||||
|
<span>5</span>
|
||||||
|
<span class="vote-arrows">^<span>'</span></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p>First of all I would like to thank you for the invitation to participate in such a ... Russia is the huge territory which in many respects needs to be render habitable.</p>
|
||||||
|
<div class="answer-controls">
|
||||||
|
<input type="checkbox" checked>
|
||||||
|
<span>Correct!</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<article class="answer-card">
|
||||||
|
<div>
|
||||||
|
<div class="avatar-box">avatar</div>
|
||||||
|
<div class="vote-box">
|
||||||
|
<span>3</span>
|
||||||
|
<span class="vote-arrows">^<span>'</span></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<p>First of all I would like to thank you for the invitation to participate in such a ... Russia is the huge territory which in many respects needs to be render habitable.</p>
|
||||||
|
<div class="answer-controls">
|
||||||
|
<input type="checkbox">
|
||||||
|
<span>Correct!</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
|
||||||
|
<form class="form">
|
||||||
|
<label for="answer">Enter your answer here..</label>
|
||||||
|
<textarea id="answer"></textarea>
|
||||||
|
<button class="button" type="button">Answer</button>
|
||||||
|
</form>
|
||||||
|
</main>
|
||||||
|
<aside class="sidebar">
|
||||||
|
<div class="sidebar-section">
|
||||||
|
<h2>Trending Tags</h2>
|
||||||
|
<div class="tag-cloud">
|
||||||
|
<span>perl</span>
|
||||||
|
<span class="tag-red">python</span>
|
||||||
|
<span>TechnoPark</span>
|
||||||
|
<span class="tag-red">MySQL</span>
|
||||||
|
<span class="tag-green">django</span>
|
||||||
|
<span>Mail.Ru</span>
|
||||||
|
<span>Voloshin</span>
|
||||||
|
<span class="tag-orange">Firefox</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="sidebar-section">
|
||||||
|
<h2>Top Members</h2>
|
||||||
|
<div class="member-list">
|
||||||
|
<a href="#">Mr. Freeman</a>
|
||||||
|
<a href="#">Dr. House</a>
|
||||||
|
<a href="#">Bender</a>
|
||||||
|
<a href="#">Queen Victoria</a>
|
||||||
|
<a href="#">V. Pupkin</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</aside>
|
||||||
|
</div>
|
||||||
|
<footer class="footer">2026</footer>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
@@ -0,0 +1,94 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>VkDesk | Create Account</title>
|
||||||
|
<meta name="description" content="VkDesk Q&A">
|
||||||
|
<link rel="stylesheet" href="./static/css/style.css">
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<header class="site-header">
|
||||||
|
<div class="logo">VkDesk</div>
|
||||||
|
<form class="search">
|
||||||
|
<input type="text" placeholder="Search">
|
||||||
|
<a class="button button--ask" href="index.html">ASK IT</a>
|
||||||
|
</form>
|
||||||
|
<div class="user-auth">
|
||||||
|
<a href="login.html">Sign In</a>
|
||||||
|
<a href="signup.html">register</a>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<div class="content">
|
||||||
|
<main>
|
||||||
|
<div class="main-title">
|
||||||
|
<h1>Create Account</h1>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<p class="error">Sorry, this email address already registered!</p>
|
||||||
|
|
||||||
|
<form class="form">
|
||||||
|
<div class="form-row">
|
||||||
|
<label for="login">Login</label>
|
||||||
|
<input id="login" type="text" value="dr_pepper">
|
||||||
|
</div>
|
||||||
|
<div class="form-row">
|
||||||
|
<label for="email">Email</label>
|
||||||
|
<input id="email" type="email" value="drpepper@mail.ru">
|
||||||
|
</div>
|
||||||
|
<div class="form-row">
|
||||||
|
<label for="nickname">NickName</label>
|
||||||
|
<input id="nickname" type="text" value="Dr. Pepper">
|
||||||
|
</div>
|
||||||
|
<div class="form-row">
|
||||||
|
<label for="password">Password</label>
|
||||||
|
<input id="password" type="password" value="********">
|
||||||
|
</div>
|
||||||
|
<div class="form-row">
|
||||||
|
<label for="repeat">Repeat password</label>
|
||||||
|
<input id="repeat" type="password" value="********">
|
||||||
|
</div>
|
||||||
|
<div class="form-row">
|
||||||
|
<label>Upload avatar</label>
|
||||||
|
<input type="file">
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<button class="button" type="button">Register!</button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</main>
|
||||||
|
<aside class="sidebar">
|
||||||
|
<div class="sidebar-section">
|
||||||
|
<h2>Trending Tags</h2>
|
||||||
|
<div class="tag-cloud">
|
||||||
|
<span>perl</span>
|
||||||
|
<span class="tag-red">python</span>
|
||||||
|
<span>TechnoPark</span>
|
||||||
|
<span class="tag-red">MySQL</span>
|
||||||
|
<span class="tag-green">django</span>
|
||||||
|
<span>Mail.Ru</span>
|
||||||
|
<span>Voloshin</span>
|
||||||
|
<span class="tag-orange">Firefox</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="sidebar-section">
|
||||||
|
<h2>Top Members</h2>
|
||||||
|
<div class="member-list">
|
||||||
|
<a href="#">Mr. Freeman</a>
|
||||||
|
<a href="#">Dr. House</a>
|
||||||
|
<a href="#">Bender</a>
|
||||||
|
<a href="#">Queen Victoria</a>
|
||||||
|
<a href="#">V. Pupkin</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</aside>
|
||||||
|
</div>
|
||||||
|
<footer class="footer">2026</footer>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
Vendored
+6
@@ -0,0 +1,6 @@
|
|||||||
|
@charset "UTF-8";/*!
|
||||||
|
* Bootstrap v5.3.8 (https://getbootstrap.com/)
|
||||||
|
* Copyright 2011-2025 The Bootstrap Authors
|
||||||
|
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
|
||||||
|
*/:root,[data-bs-theme=light]{--bs-blue:#0d6efd;--bs-indigo:#6610f2;--bs-purple:#6f42c1;--bs-pink:#d63384;--bs-red:#dc3545;--bs-orange:#fd7e14;--bs-yellow:#ffc107;--bs-green:#198754;--bs-teal:#20c997;--bs-cyan:#0dcaf0;--bs-black:#000;--bs-white:#fff;--bs-gray:#6c757d;--bs-gray-dark:#343a40;--bs-gray-100:#f8f9fa;--bs-gray-200:#e9ecef;--bs-gray-300:#dee2e6;--bs-gray-400:#ced4da;--bs-gray-500:#adb5bd;--bs-gray-600:#6c757d;--bs-gray-700:#495057;--bs-gray-800:#343a40;--bs-gray-900:#212529;--bs-primary:#0d6efd;--bs-secondary:#6c757d;--bs-success:#198754;--bs-info:#0dcaf0;--bs-warning:#ffc107;--bs-danger:#dc3545;--bs-light:#f8f9fa;--bs-dark:#212529;--bs-primary-rgb:13,110,253;--bs-secondary-rgb:108,117,125;--bs-success-rgb:25,135,84;--bs-info-rgb:13,202,240;--bs-warning-rgb:255,193,7;--bs-danger-rgb:220,53,69;--bs-light-rgb:248,249,250;--bs-dark-rgb:33,37,41;--bs-primary-text-emphasis:#052c65;--bs-secondary-text-emphasis:#2b2f32;--bs-success-text-emphasis:#0a3622;--bs-info-text-emphasis:#055160;--bs-warning-text-emphasis:#664d03;--bs-danger-text-emphasis:#58151c;--bs-light-text-emphasis:#495057;--bs-dark-text-emphasis:#495057;--bs-primary-bg-subtle:#cfe2ff;--bs-secondary-bg-subtle:#e2e3e5;--bs-success-bg-subtle:#d1e7dd;--bs-info-bg-subtle:#cff4fc;--bs-warning-bg-subtle:#fff3cd;--bs-danger-bg-subtle:#f8d7da;--bs-light-bg-subtle:#fcfcfd;--bs-dark-bg-subtle:#ced4da;--bs-primary-border-subtle:#9ec5fe;--bs-secondary-border-subtle:#c4c8cb;--bs-success-border-subtle:#a3cfbb;--bs-info-border-subtle:#9eeaf9;--bs-warning-border-subtle:#ffe69c;--bs-danger-border-subtle:#f1aeb5;--bs-light-border-subtle:#e9ecef;--bs-dark-border-subtle:#adb5bd;--bs-white-rgb:255,255,255;--bs-black-rgb:0,0,0;--bs-font-sans-serif:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue","Noto Sans","Liberation Sans",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--bs-font-monospace:SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--bs-gradient:linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));--bs-body-font-family:var(--bs-font-sans-serif);--bs-body-font-size:1rem;--bs-body-font-weight:400;--bs-body-line-height:1.5;--bs-body-color:#212529;--bs-body-color-rgb:33,37,41;--bs-body-bg:#fff;--bs-body-bg-rgb:255,255,255;--bs-emphasis-color:#000;--bs-emphasis-color-rgb:0,0,0;--bs-secondary-color:rgba(33, 37, 41, 0.75);--bs-secondary-color-rgb:33,37,41;--bs-secondary-bg:#e9ecef;--bs-secondary-bg-rgb:233,236,239;--bs-tertiary-color:rgba(33, 37, 41, 0.5);--bs-tertiary-color-rgb:33,37,41;--bs-tertiary-bg:#f8f9fa;--bs-tertiary-bg-rgb:248,249,250;--bs-heading-color:inherit;--bs-link-color:#0d6efd;--bs-link-color-rgb:13,110,253;--bs-link-decoration:underline;--bs-link-hover-color:#0a58ca;--bs-link-hover-color-rgb:10,88,202;--bs-code-color:#d63384;--bs-highlight-color:#212529;--bs-highlight-bg:#fff3cd;--bs-border-width:1px;--bs-border-style:solid;--bs-border-color:#dee2e6;--bs-border-color-translucent:rgba(0, 0, 0, 0.175);--bs-border-radius:0.375rem;--bs-border-radius-sm:0.25rem;--bs-border-radius-lg:0.5rem;--bs-border-radius-xl:1rem;--bs-border-radius-xxl:2rem;--bs-border-radius-2xl:var(--bs-border-radius-xxl);--bs-border-radius-pill:50rem;--bs-box-shadow:0 0.5rem 1rem rgba(0, 0, 0, 0.15);--bs-box-shadow-sm:0 0.125rem 0.25rem rgba(0, 0, 0, 0.075);--bs-box-shadow-lg:0 1rem 3rem rgba(0, 0, 0, 0.175);--bs-box-shadow-inset:inset 0 1px 2px rgba(0, 0, 0, 0.075);--bs-focus-ring-width:0.25rem;--bs-focus-ring-opacity:0.25;--bs-focus-ring-color:rgba(13, 110, 253, 0.25);--bs-form-valid-color:#198754;--bs-form-valid-border-color:#198754;--bs-form-invalid-color:#dc3545;--bs-form-invalid-border-color:#dc3545}[data-bs-theme=dark]{color-scheme:dark;--bs-body-color:#dee2e6;--bs-body-color-rgb:222,226,230;--bs-body-bg:#212529;--bs-body-bg-rgb:33,37,41;--bs-emphasis-color:#fff;--bs-emphasis-color-rgb:255,255,255;--bs-secondary-color:rgba(222, 226, 230, 0.75);--bs-secondary-color-rgb:222,226,230;--bs-secondary-bg:#343a40;--bs-secondary-bg-rgb:52,58,64;--bs-tertiary-color:rgba(222, 226, 230, 0.5);--bs-tertiary-color-rgb:222,226,230;--bs-tertiary-bg:#2b3035;--bs-tertiary-bg-rgb:43,48,53;--bs-primary-text-emphasis:#6ea8fe;--bs-secondary-text-emphasis:#a7acb1;--bs-success-text-emphasis:#75b798;--bs-info-text-emphasis:#6edff6;--bs-warning-text-emphasis:#ffda6a;--bs-danger-text-emphasis:#ea868f;--bs-light-text-emphasis:#f8f9fa;--bs-dark-text-emphasis:#dee2e6;--bs-primary-bg-subtle:#031633;--bs-secondary-bg-subtle:#161719;--bs-success-bg-subtle:#051b11;--bs-info-bg-subtle:#032830;--bs-warning-bg-subtle:#332701;--bs-danger-bg-subtle:#2c0b0e;--bs-light-bg-subtle:#343a40;--bs-dark-bg-subtle:#1a1d20;--bs-primary-border-subtle:#084298;--bs-secondary-border-subtle:#41464b;--bs-success-border-subtle:#0f5132;--bs-info-border-subtle:#087990;--bs-warning-border-subtle:#997404;--bs-danger-border-subtle:#842029;--bs-light-border-subtle:#495057;--bs-dark-border-subtle:#343a40;--bs-heading-color:inherLine truncated
|
||||||
|
/*# sourceMappingURL=bootstrap.min.css.map */
|
||||||
@@ -0,0 +1,383 @@
|
|||||||
|
* {
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
background: linear-gradient(135deg, #e8f0f7 0%, #f7f7f7 100%);
|
||||||
|
color: #1f2d3a;
|
||||||
|
font-family: Verdana, Arial, sans-serif;
|
||||||
|
min-height: 100vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: #1d57d4;
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
a:hover {
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.page {
|
||||||
|
width: 96%;
|
||||||
|
max-width: 60rem;
|
||||||
|
margin: 3vh auto;
|
||||||
|
background: #ffffff;
|
||||||
|
border: 0.125rem solid #1f2d3a;
|
||||||
|
border-radius: 0.9rem;
|
||||||
|
box-shadow: 0 0.75rem 1.5rem rgba(20, 40, 60, 0.12);
|
||||||
|
overflow: hidden;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
min-height: calc(100vh - 6vh);
|
||||||
|
}
|
||||||
|
|
||||||
|
.site-header {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 1rem 1.25rem;
|
||||||
|
border-bottom: 0.125rem solid #1f2d3a;
|
||||||
|
gap: 1rem;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
background: #f2f7f7;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo {
|
||||||
|
font-size: 1.6rem;
|
||||||
|
font-weight: 700;
|
||||||
|
letter-spacing: 0.03rem;
|
||||||
|
font-family: Verdana, Arial, sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 0.6rem;
|
||||||
|
flex: 1;
|
||||||
|
min-width: 40%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search input {
|
||||||
|
flex: 1;
|
||||||
|
min-width: 45%;
|
||||||
|
padding: 0.4rem 0.75rem;
|
||||||
|
border: 0.125rem solid #1f2d3a;
|
||||||
|
border-radius: 1.5rem;
|
||||||
|
background: #fff;
|
||||||
|
font-family: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button {
|
||||||
|
border: 0.125rem solid #1f2d3a;
|
||||||
|
background: #fff;
|
||||||
|
padding: 0.35rem 0.9rem;
|
||||||
|
font-weight: 700;
|
||||||
|
cursor: pointer;
|
||||||
|
text-transform: uppercase;
|
||||||
|
letter-spacing: 0.04rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button--ask {
|
||||||
|
background: #ff8a00;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-block {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 0.6rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-links {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 0.2rem;
|
||||||
|
font-size: 0.9rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-links a {
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-auth {
|
||||||
|
display: flex;
|
||||||
|
gap: 0.6rem;
|
||||||
|
font-size: 0.9rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 1fr 28%;
|
||||||
|
gap: 1.5rem;
|
||||||
|
padding: 1.1rem 1.25rem 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main-title {
|
||||||
|
display: flex;
|
||||||
|
align-items: baseline;
|
||||||
|
gap: 1rem;
|
||||||
|
margin: 0 0 0.8rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main-title h1 {
|
||||||
|
margin: 0;
|
||||||
|
font-size: 1.5rem;
|
||||||
|
font-family: Verdana, Arial, sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card {
|
||||||
|
border: 0.125rem solid #1f2d3a;
|
||||||
|
padding: 0.75rem;
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 18% 1fr;
|
||||||
|
gap: 0.75rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
background: #fcfcfc;
|
||||||
|
box-shadow: 0.25rem 0.25rem 0 rgba(31, 45, 58, 0.08);
|
||||||
|
}
|
||||||
|
|
||||||
|
.avatar-box {
|
||||||
|
width: 4.4rem;
|
||||||
|
height: 4.4rem;
|
||||||
|
border: 0.125rem solid #1f2d3a;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-size: 0.75rem;
|
||||||
|
text-transform: uppercase;
|
||||||
|
background: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.avatar-box.small {
|
||||||
|
width: 2.9rem;
|
||||||
|
height: 2.9rem;
|
||||||
|
font-size: 0.65rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.vote-box {
|
||||||
|
margin-top: 0.5rem;
|
||||||
|
border: 0.125rem solid #1f2d3a;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
gap: 0.4rem;
|
||||||
|
padding: 0.25rem 0.4rem;
|
||||||
|
width: fit-content;
|
||||||
|
background: #f2f7f7;
|
||||||
|
}
|
||||||
|
|
||||||
|
.vote-arrows {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
font-size: 0.65rem;
|
||||||
|
line-height: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.question-title {
|
||||||
|
font-size: 1.1rem;
|
||||||
|
font-weight: 700;
|
||||||
|
margin-bottom: 0.3rem;
|
||||||
|
display: inline-block;
|
||||||
|
color: #2b7a78;
|
||||||
|
}
|
||||||
|
|
||||||
|
.meta {
|
||||||
|
margin-top: 0.4rem;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 0.5rem;
|
||||||
|
font-size: 0.9rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tag {
|
||||||
|
color: #1d57d4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar {
|
||||||
|
background: #f2f7f7;
|
||||||
|
border: 0.125rem solid #1f2d3a;
|
||||||
|
padding: 0.75rem;
|
||||||
|
height: fit-content;
|
||||||
|
box-shadow: 0.25rem 0.25rem 0 rgba(31, 45, 58, 0.08);
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar h2 {
|
||||||
|
margin: 0 0 0.5rem;
|
||||||
|
font-size: 1.25rem;
|
||||||
|
font-family: Verdana, Arial, sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar-section {
|
||||||
|
margin-bottom: 1.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tag-cloud {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 0.5rem;
|
||||||
|
font-size: 0.9rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tag-cloud .tag-red {
|
||||||
|
color: #d4332f;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tag-cloud .tag-green {
|
||||||
|
color: #2f9e44;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tag-cloud .tag-orange {
|
||||||
|
color: #e67a2f;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
|
||||||
|
.member-list {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 0.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.form {
|
||||||
|
display: grid;
|
||||||
|
gap: 0.6rem;
|
||||||
|
max-width: 32rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-row {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 30% 1fr;
|
||||||
|
gap: 0.6rem;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.form input,
|
||||||
|
.form textarea {
|
||||||
|
padding: 0.4rem 0.6rem;
|
||||||
|
border: 0.125rem solid #1f2d3a;
|
||||||
|
font-family: inherit;
|
||||||
|
background: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.form textarea {
|
||||||
|
min-height: 9rem;
|
||||||
|
resize: vertical;
|
||||||
|
}
|
||||||
|
|
||||||
|
.error {
|
||||||
|
color: #d4332f;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pagination {
|
||||||
|
display: flex;
|
||||||
|
gap: 0.6rem;
|
||||||
|
margin: 0.6rem 0 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.page-link {
|
||||||
|
border: 0.125rem solid #1f2d3a;
|
||||||
|
padding: 0.2rem 0.5rem;
|
||||||
|
min-width: 1.6rem;
|
||||||
|
text-align: center;
|
||||||
|
color: #111;
|
||||||
|
text-decoration: none;
|
||||||
|
background: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.answer-card {
|
||||||
|
border: 0.125rem solid #1f2d3a;
|
||||||
|
padding: 0.6rem;
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 16% 1fr;
|
||||||
|
gap: 0.75rem;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
background: #fcfcfc;
|
||||||
|
box-shadow: 0.25rem 0.25rem 0 rgba(31, 45, 58, 0.08);
|
||||||
|
}
|
||||||
|
|
||||||
|
.answer-controls {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
gap: 0.4rem;
|
||||||
|
margin-top: 0.4rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer {
|
||||||
|
border-top: 0.125rem solid #1f2d3a;
|
||||||
|
padding: 0.6rem 1.1rem;
|
||||||
|
background: #f2f7f7;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 0.85rem;
|
||||||
|
margin-top: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@media (max-width: 768px) {
|
||||||
|
.content {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar {
|
||||||
|
order: 2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@media (max-width: 375px) {
|
||||||
|
.site-header {
|
||||||
|
padding: 0.8rem;
|
||||||
|
gap: 0.6rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo {
|
||||||
|
font-size: 1.3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search {
|
||||||
|
min-width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search input {
|
||||||
|
min-width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
padding: 0.8rem;
|
||||||
|
gap: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card,
|
||||||
|
.answer-card {
|
||||||
|
grid-template-columns: 1fr;
|
||||||
|
}
|
||||||
|
|
||||||
|
.avatar-box,
|
||||||
|
.avatar-box.small {
|
||||||
|
width: 3.2rem;
|
||||||
|
height: 3.2rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 1200px) {
|
||||||
|
.page {
|
||||||
|
max-width: 72rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
grid-template-columns: 1fr 24%;
|
||||||
|
gap: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.logo {
|
||||||
|
font-size: 1.8rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
File renamed without changes.
Whitespace-only changes.
Whitespace-only changes.
Whitespace-only changes.
Reference in new issue
Block a user