Packet-Fence/admin/css/role_list.css
2025-06-28 06:23:17 +05:30

122 lines
2.4 KiB
CSS

.role_container {
display: flex;
margin-left: 220px; /* Adjust if necessary to match sidebar width */
padding: 20px;
margin-top: 6rem; /* Adjust if necessary to account for fixed navbar */
width: calc(100% - 250px); /* Adjust to leave space for sidebar */
border-radius: 2rem;
height: auto; /* Change height to auto to fit content */
padding-bottom: 3rem;
}
.user_container {
display: flex;
justify-content: center;
align-items: center; /* Center vertically */
padding: 80px;
margin-left: 90px;
}
.user_container > maincontent {
display: flex;
justify-content: center;
align-items: center;
width: 80%;
}
.usertable {
background-color: #ffffffda;
padding: 20px;
border-radius: 8px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.8);
width: 80%;
max-width: 1000px; /* Increase maximum width for larger container */
}
/* Role Tree Styling */
.role_tree {
list-style-type: none;
padding: 0;
margin: 0;
}
.role_tree ul {
padding-left: 20px; /* Adjust indentation for child levels */
margin: 0;
}
.role_tree li {
position: relative;
margin: 5px 0;
padding: 5px 0;
}
.role_tree li::before {
content: "";
position: absolute;
left: -10px; /* Adjust to fit with padding */
top: 0;
border-left: 2px solid #000; /* Line connecting parent to child */
height: 100%;
width: 10px; /* Adjust to match with padding */
}
.role_tree li::after {
content: "";
position: absolute;
left: -10px;
top: 20px; /* Adjust to connect lines to children */
border-top: 2px solid #000; /* Line connecting child to its children */
width: 10px;
}
.role_tree li:last-child::before {
height: 20px; /* Adjust height for the last item */
}
.role_item {
display: flex;
align-items: center;
padding-left: 20px; /* Indentation for tree structure */
}
.role_id, .role_notes, .role_parent_id, .role_max_nodes {
margin-right: 10px; /* Spacing between role details */
}
/* Modify and Delete buttons styling */
.btn_modify, .btn_delete {
padding: 8px 16px;
border: none;
border-radius: 4px;
color: #fff;
cursor: pointer;
transition: background-color 0.3s;
}
.btn_modify {
background-color: #4c7555;
}
.btn_modify:hover {
background-color: #116022;
}
.btn_delete {
background-color: #dc3b4b;
}
.btn_delete:hover {
background-color: #720813;
}