diff --git a/static/css/style.css b/static/css/style.css index 916c865..a6dd492 100644 --- a/static/css/style.css +++ b/static/css/style.css @@ -1,25 +1,27 @@ -/* Подключаем шрифт Segoe UI */ -@import url('https://fonts.googleapis.com/css2?family=Segoe+UI:wght@300;400;600;700&display=swap'); - +/* Подключаем шрифт Verdana (стандартный, но добавим похожие для надежности) */ body { - font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; - background-color: #F4E8D3; + font-family: 'Verdana', 'Geneva', sans-serif; + background-color: #FAEBD7; /* Античный белый */ margin: 0; padding: 0; + color: #3e2723; } .main-container { background-color: #ffffff; min-height: 100vh; padding: 20px; + border-left: 5px solid #A0522D; /* Акцентная полоса слева */ } .header { - background: linear-gradient(135deg, #67BA80 0%, #4CAF50 100%); - padding: 20px; - border-radius: 10px; + /* Градиент от светло-коричневого к коричневому */ + background: linear-gradient(135deg, #DEB887 0%, #A0522D 100%); + padding: 25px; + border-radius: 4px; /* Более строгие углы для строительной тематики */ margin-bottom: 30px; color: white; + box-shadow: 0 4px 6px rgba(0,0,0,0.1); } .logo-container { @@ -28,252 +30,111 @@ body { gap: 20px; } -.logo { - height: 60px; - width: auto; - object-fit: contain; -} - .header-title { - font-size: 2.2em; - font-weight: 700; + font-size: 2em; + font-weight: bold; + text-transform: uppercase; + letter-spacing: 1px; margin: 0; - text-shadow: 2px 2px 4px rgba(0,0,0,0.3); -} - -.page-title { - color: #2c3e50; - font-weight: 600; } +/* Карточка поставщика или стройматериала */ .partner-card { - border: 2px solid #67BA80; - border-radius: 12px; + border: 1px solid #DEB887; + border-left: 8px solid #A0522D; /* Подчеркиваем статус материала */ + border-radius: 4px; padding: 20px; margin-bottom: 20px; background: #ffffff; - box-shadow: 0 4px 12px rgba(103, 186, 128, 0.15); + box-shadow: 2px 2px 8px rgba(160, 82, 45, 0.1); } .partner-header { display: flex; justify-content: space-between; align-items: center; - border-bottom: 2px solid #e9ecef; - padding-bottom: 15px; + border-bottom: 1px solid #FAEBD7; + padding-bottom: 12px; margin-bottom: 15px; } -.partner-name-line { - display: flex; - align-items: center; - gap: 12px; - flex-wrap: wrap; -} - .partner-type { - font-size: 1.3em; - font-weight: 600; - color: #6c757d; - background: #f8f9fa; - padding: 6px 14px; - border-radius: 20px; + font-size: 0.9em; + font-weight: bold; + color: #A0522D; + background: #FAEBD7; + padding: 4px 12px; + text-transform: uppercase; } .partner-name { - font-size: 1.4em; - font-weight: 700; - color: #2c3e50; - margin: 0; -} - -.divider { - color: #dee2e6; + font-size: 1.5em; font-weight: bold; - font-size: 1.4em; + color: #5D4037; } -.discount-info { - display: flex; - align-items: center; - gap: 15px; +/* Расчет стоимости и транспортных расходов */ +.volume-info { + background-color: #fcf8f2; + border: 1px dashed #DEB887; + padding: 12px; + border-radius: 4px; + margin-top: 15px; } -.discount-badge { - font-size: 1.1em; - padding: 8px 16px; - border-radius: 25px; - background-color: #67BA80; - color: white; +.volume-label { + font-weight: bold; + color: #A0522D; } -.sales-amount { - font-size: 1em; - color: #6c757d; - font-weight: 500; -} - -.partner-info-row { - margin-bottom: 0; - padding: 6px 0; - line-height: 1.4; -} - -.partner-label { - font-weight: 600; - color: #495057; - min-width: 100px; - display: inline-block; - font-size: 1em; -} - -.partner-value { - font-size: 1em; - color: #2c3e50; -} - -.partner-buttons-container { - display: flex; - gap: 12px; - justify-content: flex-start; - margin-top: 20px; - padding-top: 15px; - border-top: 2px solid #e9ecef; +.volume-value { + color: #2e1a12; + font-weight: bold; } +/* Кнопки действий */ .btn-action { - padding: 10px 20px; - font-size: 0.95em; - display: flex; - align-items: center; - gap: 8px; - min-width: 180px; - justify-content: center; + padding: 10px 22px; + font-family: 'Verdana', sans-serif; + font-size: 0.85em; + font-weight: bold; + text-transform: uppercase; border: none; - border-radius: 8px; - font-weight: 600; - transition: all 0.3s ease; + border-radius: 2px; + transition: all 0.2s ease; + cursor: pointer; } .btn-edit { - background-color: #67BA80; - color: white; -} - -.btn-add { - background-color: #6c757d; - color: white; + background-color: #DEB887; + color: #3e2723; } .btn-history { - background-color: #495057; + background-color: #A0522D; color: white; } .btn-action:hover { - transform: translateY(-2px); - box-shadow: 0 4px 12px rgba(0,0,0,0.2); - color: white; -} - -.btn-new-partner { - background-color: #67BA80; - color: white; - border: none; - padding: 12px 24px; - font-weight: 600; - border-radius: 8px; -} - -.btn-new-partner:hover { - background-color: #5aa870; - color: white; -} - -.rating-badge { - font-size: 0.9em; - padding: 6px 12px; - border-radius: 15px; -} - -.alert { - border-radius: 10px; - border: none; -} -.partner-info-row:last-child { - margin-bottom: 10px; -} - -.volume-info { - background-color: #f8f9fa; - padding: 8px 12px; - border-radius: 6px; - margin-top: 10px; -} - -.volume-label { - font-weight: 600; - color: #495057; -} - -.volume-value { - color: #2c3e50; - font-weight: 500; -} - -/* Стили для страницы истории продаж */ -/* Стили для таблицы продаж */ -.table-responsive { - border-radius: 8px; - overflow: hidden; -} - -.table { - margin-bottom: 0; + filter: brightness(90%); + box-shadow: 0 2px 4px rgba(0,0,0,0.2); } +/* Таблицы материалов и поставок */ .table th { - background-color: #67BA80; - color: white; - font-weight: 600; - padding: 12px; - text-align: center; -} - -.table td { - padding: 10px; - text-align: center; - vertical-align: middle; + background-color: #A0522D; + color: #FAEBD7; + text-transform: uppercase; + font-size: 0.9em; } .table-striped tbody tr:nth-of-type(odd) { - background-color: rgba(103, 186, 128, 0.05); + background-color: #FAF0E6; } -.table-striped tbody tr:hover { - background-color: rgba(103, 186, 128, 0.1); +.discount-badge { + background-color: #5D4037; /* Цвет для скидок/наценок */ + color: white; + padding: 5px 10px; + font-weight: bold; } - -.table tfoot { - background-color: #e8f5e8; - font-weight: 600; -} - -.table tfoot td { - border-top: 2px solid #67BA80; -} - -.text-end { - text-align: right !important; -} - -/* Адаптивность для таблицы */ -@media (max-width: 768px) { - .table-responsive { - font-size: 0.9em; - } - - .table th, .table td { - padding: 6px; - } -} \ No newline at end of file