employeeService/src/app/components/mitarbeiter-form/mitarbeiter-form.component.css

120 lines
1.7 KiB
CSS

body {
font-family: sans-serif;
margin: 0;
padding: 20px;
background-color: #f0f0f0;
}
.container {
width: 100%;
max-width: 800px;
margin: 0 auto;
padding: 20px;
background-color: #fff;
}
h1, h2 {
font-size: 2rem;
margin-bottom: 20px;
}
.back-button {
background-color: #ccc;
color: #333;
border: none;
padding: 8px 12px;
border-radius: 3px;
margin-bottom: 15px;
}
.user-info {
display: grid;
grid-template-columns: 1fr 1fr;
grid-gap: 20px;
margin-bottom: 20px;
}
.form-group {
display: flex;
flex-direction: column;
}
label {
margin-bottom: 5px;
}
input[type="text"] {
padding: 10px;
border: 1px solid #ddd;
border-radius: 3px;
}
input[type="text"]::placeholder {
color: #999;
}
.save-button {
background-color: #007bff;
color: #fff;
padding: 10px 15px;
border: none;
border-radius: 3px;
cursor: pointer;
margin-top: 10px;
width: 100%;
}
.skills-container {
border: 1px solid #ccc;
padding: 20px;
border-radius: 3px;
}
.skill-controls select {
padding: 10px 10px;
border: none;
border-radius: 3px;
background-color: #007bff;
color: #fff;
cursor: pointer;
}
.skill-list {
list-style: none;
padding: 0;
}
.skill-list li {
display: flex;
align-items: center;
margin-bottom: 5px;
}
.skill-icon {
margin-right: 5px;
}
.delete-skill-button {
color: #fff;
padding: 5px 8px;
border: none;
cursor: pointer;
margin-left: 10px;
border-radius: 3px;
}
.delete-skill-button img {
width: 15px;
height: 15px;
}
.add-skill-button{
background-color: #06a63b;
color: #fff;
padding: 8px 10px;
border: none;
border-radius: 3px;
cursor: pointer;
margin-left: 10px;
}