add: ...

style.css

@@ -0,0 +1,41 @@
+/* CSS для генерации индекса файлов в каталоге */
+body { font-family: monospace; }
+h1#indextitle {  text-align: left; }
+
+table { border-collapse: collapse; min-width: 60%}
+
+th { background-color: gray; padding: .5ex 1em; text-align: left}
+td { padding: .5ex 1em; }
+
+tr.odd td {
+  background-color: whitesmoke;
+  transition: background-color 0.8s ease; /* Плавный переход для фона */
+}
+tr.even td {
+  background-color: silver;
+  transition: background-color 0.8s ease; /* Плавный переход для фона */
+}
+
+a {text-decoration: none; color: black; border-bottom: 1px dotted black;}
+a:hover { color: orange; border-bottom: 1px solid darkorange; transition: 0.8s; }
+a:not(:hover) { transition: 1.8s } /* Этот transition сработает при убирании курсора */
+
+/* Изменяем фон всех ячеек <td> в строке <tr>,
+   когда на любую ссылку <a> внутри этой строки наведен курсор.
+   Это создаст эффект подсветки всей строки. */
+tr.odd:has(a:hover) td {
+  background-color: #2222F5;
+  color: orange;
+}
+tr.even:has(a:hover) td {
+  background-color: #222295;
+  color: orange;
+}
+
+/* черточка между строками */
+hr {
+  border: 0; height: 1px;
+  background-color: transparent;
+  margin: 0; padding: 0;
+}
+