zabawa kolorki i kilka funkcji
This commit is contained in:
parent
7e0dcc5287
commit
d3d04b837b
|
@ -11,6 +11,9 @@
|
|||
.category-buttons {
|
||||
margin: 10px 0;
|
||||
text-align: center;
|
||||
background-color: #A9A9A9;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.category-buttons button {
|
||||
|
@ -18,10 +21,12 @@
|
|||
padding: 10px 15px;
|
||||
font-size: 16px;
|
||||
cursor: pointer;
|
||||
background-color: #f2f2f2;
|
||||
border: 1px solid #ccc;
|
||||
background-color: lightgray;
|
||||
border: 1px solid black;
|
||||
border-radius: 4px;
|
||||
transition: background-color 0.3s, color 0.3s, border 0.3s;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.category-buttons button.active {
|
||||
|
@ -35,20 +40,21 @@ table {
|
|||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
margin-top: 20px;
|
||||
background-color: whitesmoke;
|
||||
}
|
||||
|
||||
th, td {
|
||||
border: 1px solid #ddd;
|
||||
border: 1px solid grey;
|
||||
padding: 8px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
th {
|
||||
background-color: #f2f2f2;
|
||||
background-color: whitesmoke;
|
||||
}
|
||||
|
||||
tr:nth-child(even) {
|
||||
background-color: #f9f9f9;
|
||||
background-color: whitesmoke;
|
||||
}
|
||||
|
||||
/* Stylizacja kontenera klasy */
|
||||
|
@ -127,6 +133,8 @@ footer.footer {
|
|||
margin: 5px 0;
|
||||
font-size: 14px;
|
||||
color: #333;
|
||||
|
||||
|
||||
}
|
||||
|
||||
/* Stylizacja przycisków ogólna */
|
||||
|
@ -150,3 +158,15 @@ input[type="checkbox"] {
|
|||
z-index: 1000; /* zapewnia, że będzie na wierzchu */
|
||||
border-bottom: 1px solid #ccc; /* opcjonalnie, aby oddzielić od treści */
|
||||
}
|
||||
|
||||
.dark-background {
|
||||
background-color: #2e2e2e; /* Ciemnoszare tło */
|
||||
color: #ffffff; /* Jasny kolor tekstu dla lepszej czytelności */
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
|
||||
.lead {
|
||||
background-color: #555;
|
||||
}
|
31
index.html
31
index.html
|
@ -12,16 +12,18 @@
|
|||
th {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
background-color: beige; /* Kolor tła nagłówka */
|
||||
background-color: lightgray; /* Kolor tła nagłówka */
|
||||
z-index: 10; /* Zapewnia, że nagłówek będzie nad innymi elementami */
|
||||
border: 1px solid #ddd; /* Opcjonalnie: Dodanie obramowania */
|
||||
padding: 8px;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<body class="dark-background">
|
||||
|
||||
<h1 class="lead" style="font-size: 48px;"><em>Ocena Zachowania</em></h1>
|
||||
|
||||
|
||||
<h1>Ocena Zachowania</h1>
|
||||
|
||||
<div>
|
||||
<button onclick="showTab('criteria')">Ocena z zachowania</button>
|
||||
|
@ -168,17 +170,20 @@
|
|||
<div id="stats-output"></div>
|
||||
</div>
|
||||
|
||||
<footer class="footer">
|
||||
<div class="footer-left">
|
||||
<p>B. Hrynowiecki</p>
|
||||
<p>K. Michalak</p>
|
||||
<p>F. Kowalski</p>
|
||||
</div>
|
||||
|
||||
<hr class="footer-line">
|
||||
<div class="footer-right">
|
||||
<p>Led and Authored by M. Pabiszczak</p>
|
||||
</div>
|
||||
</footer>
|
||||
<footer class="footer">
|
||||
<div class="footer-left">
|
||||
<p>B. Hrynowiecki</p>
|
||||
<p>K. Michalak</p>
|
||||
<p>F. Kowalski</p>
|
||||
<p>S. Ptak</p>
|
||||
<p>M. Marszalik</p>
|
||||
</div>
|
||||
<div class="footer-right">
|
||||
<p>M. Pabiszczak</p>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Przeniesienie skryptu na koniec body -->
|
||||
<script src="js/script.js"></script>
|
||||
|
|
Loading…
Reference in New Issue