документация.css 1.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  1. body {
  2. font-family: sans-serif;
  3. margin: 0;
  4. background-image: url('../картинки/фон.jpg');
  5. padding: 0;
  6. }
  7. .container {
  8. display: flex;
  9. height: 100vh;
  10. height: 1000px;
  11. background-color: #f1f1f1;
  12. }
  13. .sidebar {
  14. width: 250px;
  15. background-color: #dfdfdf;
  16. padding: 20px;
  17. overflow-y: auto;
  18. }
  19. .sidebar input[type="text"] {
  20. width: 100%;
  21. padding: 8px;
  22. border: 1px solid #ccc;
  23. border-radius: 4px;
  24. box-sizing: border-box;
  25. }
  26. .sidebar ul {
  27. list-style: none;
  28. padding: 0;
  29. margin-top: 20px;
  30. }
  31. .sidebar li {
  32. margin-bottom: 10px;
  33. }
  34. .sidebar a {
  35. display: block;
  36. padding: 10px;
  37. text-decoration: none;
  38. color: #333;
  39. }
  40. .sidebar a:hover {
  41. background-color: #c2c2c2;
  42. }
  43. .content {
  44. flex: 1;
  45. padding: 20px;
  46. overflow-y: auto;
  47. }
  48. /* Стили для результатов поиска */
  49. .search-results {
  50. margin-top: 20px;
  51. }
  52. .search-results li {
  53. margin-bottom: 10px;
  54. padding: 10px;
  55. border: 1px solid #ddd;
  56. border-radius: 4px;
  57. }
  58. .search-results li mark {
  59. background-color: yellow;
  60. }
  61. /* Стили для прелоадера */
  62. .loader {
  63. border: 5px solid #f3f3f3; /* Светло-серый */
  64. border-top: 5px solid #3498db; /* Синий */
  65. border-radius: 50%;
  66. width: 30px;
  67. height: 30px;
  68. animation: spin 2s linear infinite;
  69. margin: 20px auto; /* Центрируем прелоадер */
  70. display: none; /* Прячем прелоадер по умолчанию */
  71. }
  72. @keyframes spin {
  73. 0% { transform: rotate(0deg); }
  74. 100% { transform: rotate(360deg); }
  75. }