| @import "./variables.css"; |
|
|
| .container { |
| display: grid; |
| grid-template-columns: repeat(12, 1fr); |
| gap: 2rem; |
| } |
|
|
| .task-container { |
| border-radius: 0.25rem; |
| background-color: #fff; |
| padding: 1rem; |
| } |
|
|
| .task-title { |
| font-weight: bold; |
| font-size: 1.25rem; |
| } |
|
|
| .task-deadline { |
| font-size: 0.875rem; |
| } |
|
|
| .task-description { |
| font-size: 0.875rem; |
| } |
|
|
| .task-field { |
| width: 100%; |
| outline: none; |
| background-color: #f5f5f5; |
| padding: 0.5rem; |
| border: none; |
| border-radius: 0.25rem; |
| text-align: center; |
| } |
|
|
| .task-button { |
| display: inline-block; |
| width: 100%; |
| font-size: 1.25rem; |
| background-color: #3498db; |
| color: #fff; |
| border: none; |
| cursor: pointer; |
| padding: 1rem; |
| transition: background-color 0.3s ease; |
| } |
|
|
| .task-button:hover { |
| background-color: #555; |
| color: #fafafa; |
| } |
