Skip to content

.2350076982984809:2137f6200c741220b86343e0443cd055_69e19fee4729af53a2c5ee93.69e1a0194729af53a2c5ee97.69e1a018539b0f5417043bd2:Trae CN.T(2026/4/17 10:51:05) #1

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
tyro880 wants to merge 1 commit into
base: main
Choose a base branch
from
Open

.2350076982984809:2137f6200c741220b86343e0443cd055_69e19fee4729af53a2c5ee93.69e1a0194729af53a2c5ee97.69e1a018539b0f5417043bd2:Trae CN.T(2026/4/17 10:51:05) #1

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
46 changes: 46 additions & 0 deletions css/style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -156,6 +156,52 @@ section{
max-height: 450px;
}

.kategorije-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 20px;
padding: 20px;
margin-top: 20px;
}

.kategorija-kartica {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 25px 15px;
border-radius: 15px;
background-color: rgba(255, 255, 255, 0.15);
border: 2px solid rgba(255, 255, 255, 0.3);
cursor: pointer;
transition: all 0.3s ease;
min-height: 140px;
}

.kategorija-kartica:hover {
transform: scale(1.08);
background-color: rgba(255, 255, 255, 0.25);
border-color: var(--zuta);
box-shadow: 0 8px 25px rgba(0, 0, 0, 0.2);
}

.kategorija-kartica .emoji {
font-size: 48px;
margin-bottom: 10px;
}

.kategorija-kartica h3 {
margin: 5px 0;
font-size: 1.3em;
color: var(--wrapper_pozadina);
}

.kategorija-kartica .broj-pitanja {
margin: 5px 0 0 0;
font-size: 0.85em;
color: rgba(255, 255, 255, 0.8);
}

.pitanja{
float: left;
width: 200px;
Expand Down
92 changes: 56 additions & 36 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="sr">
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Expand All @@ -8,46 +8,66 @@
<link href="https://fonts.googleapis.com/css2?family=Baloo+2:wght@400..800&family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&display=swap" rel="stylesheet">
<link rel="stylesheet" href="css/animations.css">
<link rel="stylesheet" href="css/style.css">
<title>Kviz</title>
<title>知识测验</title>
</head>
<body>

<div id="wrapper">
<section>
<header>
<h1><a href="index.html">KVIZ<sub>by GB</sub></a></h1>
<h1><a href="index.html">知识测验<sub>by GB</sub></a></h1>

</header>
<p id="togglePitanja">╰┈➤Izaberi oblast</p>
<p id="togglePitanja">╰┈➤选择分类</p>

<div id="setPitanja">
<h3 class="zatvori" onclick="zatvoriSet()">X</h3>
<div class="pitanja">
<h3 onclick="oblast(this)"><a href="oblasti/istorija/istorija.html">Istorija</a></h3>
</div>
<div class="pitanja">
<h3 onclick="oblast(this)"><a href="oblasti/geografija/geografija.html">Geografija</a></h3>
</div>
<div class="pitanja">
<h3 onclick="oblast(this)"><a href="#">Hemija</a></h3>
</div>
<div class="pitanja">
<h3 onclick="oblast(this)"><a href="#">Fizika</a></h3>
</div>
<div class="pitanja">
<h3 onclick="oblast(this)"><a href="#">Knjizevnost</a></h3>
</div>
<div class="pitanja">
<h3 onclick="oblast(this)"><a href="#">Biologija</a></h3>
</div>
<div class="pitanja">
<h3 onclick="oblast(this)"><a href="#">Sociologija</a></h3>
</div>
<div class="pitanja">
<h3 onclick="oblast(this)"><a href="#">Informatika</a></h3>
</div>
<div class="pitanja">
<h3 onclick="oblast(this)"><a href="#">Engleski</a></h3>
<div class="kategorije-grid">
<div class="kategorija-kartica" onclick="izaberiKategoriju(this, 'istorija')">
<span class="emoji">📜</span>
<h3>历史</h3>
<p class="broj-pitanja">（5题）</p>
</div>
<div class="kategorija-kartica" onclick="izaberiKategoriju(this, 'geografija')">
<span class="emoji">🌍</span>
<h3>地理</h3>
<p class="broj-pitanja">（5题）</p>
</div>
<div class="kategorija-kartica" onclick="izaberiKategoriju(this, 'hemija')">
<span class="emoji">🧪</span>
<h3>化学</h3>
<p class="broj-pitanja">（即将推出）</p>
</div>
<div class="kategorija-kartica" onclick="izaberiKategoriju(this, 'fizika')">
<span class="emoji">⚛️</span>
<h3>物理</h3>
<p class="broj-pitanja">（即将推出）</p>
</div>
<div class="kategorija-kartica" onclick="izaberiKategoriju(this, 'knjizevnost')">
<span class="emoji">📚</span>
<h3>文学</h3>
<p class="broj-pitanja">（即将推出）</p>
</div>
<div class="kategorija-kartica" onclick="izaberiKategoriju(this, 'biologija')">
<span class="emoji">🧬</span>
<h3>生物</h3>
<p class="broj-pitanja">（即将推出）</p>
</div>
<div class="kategorija-kartica" onclick="izaberiKategoriju(this, 'sociologija')">
<span class="emoji">👥</span>
<h3>社会学</h3>
<p class="broj-pitanja">（即将推出）</p>
</div>
<div class="kategorija-kartica" onclick="izaberiKategoriju(this, 'informatika')">
<span class="emoji">💻</span>
<h3>计算机</h3>
<p class="broj-pitanja">（即将推出）</p>
</div>
<div class="kategorija-kartica" onclick="izaberiKategoriju(this, 'engleski')">
<span class="emoji">🇬🇧</span>
<h3>英语</h3>
<p class="broj-pitanja">（即将推出）</p>
</div>
</div>
</div>
<br>
Expand All @@ -56,19 +76,19 @@ <h3 id="nije_dodato"></h3>
</section>

<footer onclick="footer()">
<p>Kviz napravio Goran Basic</p>
<p>作者：Goran Basic</p>
</footer>

<div class="overlay"></div>

</div>
<div id="modal">
<h2 id="zatvoriModal" onclick="zatvori()" class="zatvori">X</h2>
<h2>O autoru</h2>
<p>Zovem se Goran Basic imam 19 godina i student sam ITS – Visoke škole strukovnih studija za informacione tehnologije.</p>
<p>Ovaj kviz je nastao iz lične radoznalosti i želje da znanje stečeno na fakultetu primenim u praksi.</p>
<p>Kroz izradu projekta radio sam na logici pitanja, bodovanju i funkcionalnosti aplikacije, koristeći HTML, CSS i JavaScript.</p>
<p>Cilj mi je bio da kroz samostalni rad dodatno unapredim veštine web programiranja i testiram sopstvene ideje.</p>
<h2>关于作者</h2>
<p>我叫Goran Basic，19岁，是ITS - 高等信息技术职业学院的学生。</p>
<p>这个测验是出于个人好奇心和将在大学学到的知识应用于实践的愿望而创建的。</p>
<p>在项目开发过程中，我使用HTML、CSS和JavaScript研究了问题逻辑、评分和应用功能。</p>
<p>我的目标是通过独立工作进一步提高我的Web编程技能并测试我自己的想法。</p>
</div>


Expand Down
42 changes: 25 additions & 17 deletions js/script.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,24 +11,32 @@ toggle.addEventListener("click", () => {

});

oblast = (dugme) => {
let ispis = dugme.innerText;
let poslednje_slovo = ispis.substring(ispis.length - 1);
console.log(poslednje_slovo);
if(poslednje_slovo === 'a'){
ispis_final = ispis.substring(0, ispis.length-1);
nije_dodato.innerText = `Jos nije dodat kviz iz ${ispis_final}e`;

}
if(ispis === 'Engleski'){
nije_dodato.innerText = `Jos nije dodat kviz iz Engleskog`;
}else if(ispis === 'Knjizevnost'){
nije_dodato.innerText = `Jos nije dodat kviz iz Knjizevnosti`;
izaberiKategoriju = (element, kategorija) => {
const dostupneKategorije = {
'istorija': '历史',
'geografija': '地理'
};

if (dostupneKategorije[kategorija]) {
window.location.href = `oblasti/${kategorija}/${kategorija}.html`;
} else {
const kategorijaNazivi = {
'hemija': '化学',
'fizika': '物理',
'knjizevnost': '文学',
'biologija': '生物',
'sociologija': '社会学',
'informatika': '计算机',
'engleski': '英语'
};

const naziv = kategorijaNazivi[kategorija] || kategorija;
nije_dodato.innerText = `${naziv}分类的测验即将推出！`;

nije_dodato.style.animation = 'none';
void nije_dodato.offsetWidth;
nije_dodato.style.animation = 'shake 1s 1';
}

nije_dodato.style.animation = 'none';
void nije_dodato.offsetWidth;
nije_dodato.style.animation = 'shake 1s 1';
}

const zatvoriSet = () => {
Expand Down
26 changes: 13 additions & 13 deletions oblasti/geografija/geografija.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
<!DOCTYPE html>
<html lang="sr">
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Expand All @@ -8,16 +8,16 @@
<link href="https://fonts.googleapis.com/css2?family=Baloo+2:wght@400..800&family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&display=swap" rel="stylesheet">
<link rel="stylesheet" href="../../css/animations.css">
<link rel="stylesheet" href="../../css/style.css">
<title>Kviz</title>
<title>知识测验</title>
</head>
<body>

<div id="wrapper">
<section>
<h1><a href="geografija.html">KVIZ IZ GEOGRAFIJE</a></h1>
<h1><a href="geografija.html">地理知识测验</a></h1>
<div id="pocetak">
<input type="text" name="username" id="username" placeholder="Unesite username:">
<button id="pocni_kviz">Pocni kviz</button>
<input type="text" name="username" id="username" placeholder="请输入用户名：">
<button id="pocni_kviz">开始测验</button>
<p id="unesi_username"></p>
</div>
<img src="../../img/2-20001_earth-clipart-png-transparent-geography-certificate-template.png" alt="" id="slicica">
Expand All @@ -43,28 +43,28 @@ <h3 id="tacno_netacno"></h3>
<h3 id="igrac"></h3>
<h3 id="bodovi"></h3>
<h3 id="dodatak_bodova">+10</h3>
<a href="../../index.html" id="vrati">⬅Pocetna</a>
<a href="../../index.html" id="vrati">⬅返回首页</a>

</section>

<footer onclick="footer()">
<p>Kviz napravio Goran Basic</p>
<p>作者：Goran Basic</p>
</footer>

<div class="overlay"></div>
</div>

<div id="modal">
<h2 id="zatvoriModal" onclick="zatvori()" class="zatvori">X</h2>
<h2>O autoru</h2>
<p>Zovem se Goran Basic imam 19 godina i student sam ITS – Visoke škole strukovnih studija za informacione tehnologije.</p>
<p>Ovaj kviz je nastao iz lične radoznalosti i želje da znanje stečeno na fakultetu primenim u praksi.</p>
<p>Kroz izradu projekta radio sam na logici pitanja, bodovanju i funkcionalnosti aplikacije, koristeći HTML, CSS i JavaScript.</p>
<p>Cilj mi je bio da kroz samostalni rad dodatno unapredim veštine web programiranja i testiram sopstvene ideje.</p>
<h2>关于作者</h2>
<p>我叫Goran Basic，19岁，是ITS - 高等信息技术职业学院的学生。</p>
<p>这个测验是出于个人好奇心和将在大学学到的知识应用于实践的愿望而创建的。</p>
<p>在项目开发过程中，我使用HTML、CSS和JavaScript研究了问题逻辑、评分和应用功能。</p>
<p>我的目标是通过独立工作进一步提高我的Web编程技能并测试我自己的想法。</p>
</div>





<script src="geografija.js"></script>
Expand Down
Loading