diff --git a/public/assets/css/admin-d.css b/public/assets/css/admin-d.css index 3043eb4..64683e5 100644 --- a/public/assets/css/admin-d.css +++ b/public/assets/css/admin-d.css @@ -1,5 +1,5 @@ body { - font-family: Arial, sans-serif; + font-family: 'Arial', sans-serif; margin: 0; padding: 0; background-color: #f4f4f4; @@ -13,17 +13,19 @@ body { /* Left Sidebar */ .sidebar-left { width: 20%; - background-color: #f2f2f2; - color: black; + background-color: #2c3e50; /* Darker background for better contrast */ + color: #ffffff; /* White text color */ padding: 20px; position: sticky; top: 70px; height: 100%; overflow-y: auto; - border-radius: 20px; + border-radius: 20px; /* Rounded corners */ margin: 10px; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Optional: Add shadow for depth */ } +/* Profile Section */ .sidebar-left .profile { text-align: center; margin-bottom: 20px; @@ -37,27 +39,37 @@ body { .sidebar-left .profile h3 { margin: 10px 0 0 0; + padding-bottom: 15px; /* Add padding at the bottom */ + border-bottom: 1px solid rgba(255, 255, 255, 0.3); /* Add border under the admin name */ } +/* Navigation Styles */ .sidebar-left nav ul { list-style: none; padding: 0; display: flex; - flex-direction: column !important; + flex-direction: column; } .sidebar-left nav ul li { - margin: 20px 0; + margin: 10px 0; /* Adjust spacing between items */ + padding: 8px; /* Adjust padding for each item */ + transition: background-color 0.3s ease; /* Smooth transition */ } .sidebar-left nav ul li a { - color: black; + color: #ffffff; /* White text color */ text-decoration: none; font-size: 18px; + display: block; + padding: 8px 10px; /* Adjust padding for anchor tags */ + transition: background-color 0.3s ease, color 0.3s ease; /* Smooth transition */ } .sidebar-left nav ul li a:hover { - text-decoration: underline; + background-color: rgba(255, 255, 255, 0.1); /* Subtle hover effect */ + color: #f4f4f4; /* Slightly lighter text on hover */ + border-radius: 8px; /* Add a bit of rounding on hover */ } /* Main Content Section */ @@ -68,15 +80,25 @@ body { .main-content section { margin-bottom: 40px; + background-color: rgba(255, 255, 255, 0.8); + backdrop-filter: blur(10px); + -webkit-backdrop-filter: blur(10px); + border-radius: 12px; + padding: 20px; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); } .main-content h1, .main-content h2 { margin-bottom: 20px; + font-weight: 600; + color: #000; + text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1); } .dashboard-overview { display: flex; justify-content: space-between; + gap: 20px; } .overview-card { @@ -84,8 +106,14 @@ body { background-color: #007bff; color: #fff; padding: 20px; - border-radius: 5px; + border-radius: 12px; text-align: center; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); + transition: transform 0.3s ease; +} + +.overview-card:hover { + transform: scale(1.05); } .search-filter { @@ -98,7 +126,13 @@ body { width: 80%; padding: 10px; border: 1px solid #ccc; - border-radius: 5px; + border-radius: 12px; + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); + transition: box-shadow 0.3s ease; +} + +.search-filter input:focus { + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); } .search-filter button { @@ -106,8 +140,13 @@ body { background-color: #007bff; color: #fff; border: none; - border-radius: 5px; + border-radius: 12px; cursor: pointer; + transition: background-color 0.3s ease; +} + +.search-filter button:hover { + background-color: #0056b3; } .student-list, .company-list, .job-list, .notification-list, .report-list { @@ -117,10 +156,10 @@ body { .student-card, .company-card, .job-card, .notification-card, .report-card { background-color: #fff; - border: 1px solid #ccc; - border-radius: 5px; + border-radius: 12px; padding: 15px; margin-bottom: 15px; + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } .student-card button, .company-card button, .job-card button, .report-card button { @@ -129,18 +168,35 @@ body { background-color: #007bff; color: #fff; border: none; - border-radius: 5px; + border-radius: 12px; cursor: pointer; + transition: background-color 0.3s ease; +} + +.student-card button:hover, .company-card button:hover, .job-card button:hover, .report-card button:hover { + background-color: #0056b3; +} + +/* Settings Options */ +.settings-options { + display: flex; + justify-content: space-between; + gap: 10px; + margin-top: 20px; } .settings-options button { - display: block; - margin: 10px 0; + flex: 1; padding: 15px; - width: 100%; background-color: #007bff; color: #fff; border: none; - border-radius: 5px; + border-radius: 12px; cursor: pointer; + transition: background-color 0.3s ease; + text-align: center; +} + +.settings-options button:hover { + background-color: #0056b3; } diff --git a/public/assets/css/company-d.css b/public/assets/css/company-d.css index 313b8fc..ac15eb8 100644 --- a/public/assets/css/company-d.css +++ b/public/assets/css/company-d.css @@ -1,8 +1,8 @@ body { - font-family: Arial, sans-serif; + font-family: 'Arial', sans-serif; margin: 0; padding: 0; - background-color: white; + background-color: #f4f4f4; } .company-dashboard { @@ -13,51 +13,63 @@ body { /* Left Sidebar */ .sidebar-left { width: 20%; - background-color: #f2f2f2; - color: black; + background-color: #2c3e50; /* Darker background for better contrast */ + color: #ffffff; /* White text color */ padding: 20px; position: sticky; top: 70px; height: 100%; overflow-y: auto; - border-radius: 20px; + border-radius: 20px; /* Rounded corners */ margin: 10px; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Optional: Add shadow for depth */ } +/* Profile Section */ .sidebar-left .profile { text-align: center; margin-bottom: 20px; } .sidebar-left .profile img { + border-radius: 50%; width: 100px; height: 100px; - border-radius: 50%; } .sidebar-left .profile h3 { margin: 10px 0 0 0; + padding-bottom: 15px; /* Add padding at the bottom */ + border-bottom: 1px solid rgba(255, 255, 255, 0.3); /* Add border under the admin name */ } +/* Navigation Styles */ .sidebar-left nav ul { list-style: none; padding: 0; display: flex; - flex-direction: column !important; + flex-direction: column; } .sidebar-left nav ul li { - margin: 20px 0; + margin: 10px 0; /* Adjust spacing between items */ + padding: 8px; /* Adjust padding for each item */ + transition: background-color 0.3s ease; /* Smooth transition */ } .sidebar-left nav ul li a { - color: black; + color: #ffffff; /* White text color */ text-decoration: none; font-size: 18px; + display: block; + padding: 8px 10px; /* Adjust padding for anchor tags */ + transition: background-color 0.3s ease, color 0.3s ease; /* Smooth transition */ } .sidebar-left nav ul li a:hover { - text-decoration: underline; + background-color: rgba(255, 255, 255, 0.1); /* Subtle hover effect */ + color: #f4f4f4; /* Slightly lighter text on hover */ + border-radius: 8px; /* Add a bit of rounding on hover */ } /* Main Content Section */ @@ -68,15 +80,25 @@ body { .main-content section { margin-bottom: 40px; + background-color: rgba(255, 255, 255, 0.8); + backdrop-filter: blur(10px); + -webkit-backdrop-filter: blur(10px); + border-radius: 12px; + padding: 20px; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); } .main-content h1, .main-content h2 { margin-bottom: 20px; + font-weight: 600; + color: #000; + text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1); } .dashboard-overview { display: flex; justify-content: space-between; + gap: 20px; } .overview-card { @@ -84,21 +106,31 @@ body { background-color: #007bff; color: #fff; padding: 20px; - border-radius: 5px; + border-radius: 12px; text-align: center; + box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); + transition: transform 0.3s ease; +} + +.overview-card:hover { + transform: scale(1.05); } .add-job-btn { display: inline-block; padding: 10px 20px; - background-color: #28a745; + background-color: #007bff; color: #fff; border: none; - border-radius: 5px; + border-radius: 12px; cursor: pointer; margin-bottom: 20px; } +.add-job-btn:hover { + background-color: #0056b3; +} + .job-list, .resume-list { display: flex; flex-direction: column; @@ -106,10 +138,10 @@ body { .job-card, .resume-card { background-color: #fff; - border: 1px solid #ccc; - border-radius: 5px; + border-radius: 12px; padding: 15px; margin-bottom: 15px; + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } .job-card button, .resume-card button { @@ -118,42 +150,35 @@ body { background-color: #007bff; color: #fff; border: none; - border-radius: 5px; + border-radius: 12px; cursor: pointer; + transition: background-color 0.3s ease; } -.profile-form label { - display: block; - margin-top: 10px; - font-weight: bold; +.job-card button:hover, .resume-card button:hover { + background-color: #0056b3; } -.profile-form input, .profile-form textarea { - width: 100%; - padding: 10px; - border: 1px solid #ccc; - border-radius: 5px; - margin-top: 5px; -} - -.profile-form button { +/* Settings Options */ +.settings-options { + display: flex; + justify-content: space-between; + gap: 10px; margin-top: 20px; - padding: 10px 15px; - background-color: #007bff; - color: #fff; - border: none; - border-radius: 5px; - cursor: pointer; } .settings-options button { - display: block; - margin: 10px 0; + flex: 1; padding: 15px; - width: 100%; background-color: #007bff; color: #fff; border: none; - border-radius: 5px; + border-radius: 12px; cursor: pointer; + transition: background-color 0.3s ease; + text-align: center; +} + +.settings-options button:hover { + background-color: #0056b3; }