Reorganize sidebar: move schedules under respective sections, minimal styling with bullets/arrows, cyan active color, larger fonts

This commit is contained in:
Omnicscient
2025-12-17 20:47:35 +03:00
parent cc8b79c226
commit 7735491092
3 changed files with 152 additions and 72 deletions

View File

@@ -38,18 +38,32 @@ public class MainController {
@FXML
private Button scheduleBtn;
// Sub-menus
@FXML
private VBox scheduleSubMenu;
private VBox studentsSubMenu;
@FXML
private Button calendarBtn;
private VBox coursesSubMenu;
@FXML
private VBox classroomsSubMenu;
// Sub-menu buttons
@FXML
private Button studentListBtn;
@FXML
private Button studentScheduleBtn;
@FXML
private Button courseListBtn;
@FXML
private Button courseScheduleBtn;
@FXML
private Button classroomListBtn;
@FXML
private Button classroomScheduleBtn;
@@ -61,7 +75,11 @@ public class MainController {
private DataManager dataManager;
private boolean isDarkMode = false;
private boolean scheduleMenuOpen = false;
// Track which sub-menus are open
private boolean studentsMenuOpen = false;
private boolean coursesMenuOpen = false;
private boolean classroomsMenuOpen = false;
// Cached views
private Node importView;
@@ -174,43 +192,81 @@ public class MainController {
showView(importView, importBtn);
}
@FXML
private void onShowStudents() {
showView(studentsView, studentsBtn);
}
@FXML
private void onShowCourses() {
showView(coursesView, coursesBtn);
}
@FXML
private void onShowClassrooms() {
showView(classroomsView, classroomsBtn);
}
/**
* Toggle schedule submenu visibility and show Calendar View by default
* Toggle students submenu visibility
*/
@FXML
private void onToggleScheduleMenu() {
if (!scheduleMenuOpen) {
// First time opening - show Calendar View and expand submenu
scheduleMenuOpen = true;
scheduleSubMenu.setVisible(true);
scheduleSubMenu.setManaged(true);
showView(calendarView, calendarBtn);
private void onToggleStudentsMenu() {
if (!studentsMenuOpen) {
studentsMenuOpen = true;
studentsSubMenu.setVisible(true);
studentsSubMenu.setManaged(true);
// Show student list by default when opening
showView(studentsView, studentListBtn);
} else {
// Toggle submenu visibility
scheduleMenuOpen = false;
scheduleSubMenu.setVisible(false);
scheduleSubMenu.setManaged(false);
studentsMenuOpen = false;
studentsSubMenu.setVisible(false);
studentsSubMenu.setManaged(false);
}
}
@FXML
private void onShowStudents() {
showView(studentsView, studentListBtn);
}
/**
* Toggle courses submenu visibility
*/
@FXML
private void onToggleCoursesMenu() {
if (!coursesMenuOpen) {
coursesMenuOpen = true;
coursesSubMenu.setVisible(true);
coursesSubMenu.setManaged(true);
// Show course list by default when opening
showView(coursesView, courseListBtn);
} else {
coursesMenuOpen = false;
coursesSubMenu.setVisible(false);
coursesSubMenu.setManaged(false);
}
}
@FXML
private void onShowCourses() {
showView(coursesView, courseListBtn);
}
/**
* Toggle classrooms submenu visibility
*/
@FXML
private void onToggleClassroomsMenu() {
if (!classroomsMenuOpen) {
classroomsMenuOpen = true;
classroomsSubMenu.setVisible(true);
classroomsSubMenu.setManaged(true);
// Show classroom list by default when opening
showView(classroomsView, classroomListBtn);
} else {
classroomsMenuOpen = false;
classroomsSubMenu.setVisible(false);
classroomsSubMenu.setManaged(false);
}
}
@FXML
private void onShowClassrooms() {
showView(classroomsView, classroomListBtn);
}
/**
* Show Calendar View directly when Schedule is clicked
*/
@FXML
private void onShowCalendar() {
showView(calendarView, calendarBtn);
showView(calendarView, scheduleBtn);
}
@FXML

View File

@@ -622,18 +622,20 @@
/* ===== Sidebar Navigation ===== */
.sidebar-button {
-fx-background-color: transparent;
-fx-text-fill: rgba(255, 255, 255, 0.8);
-fx-font-size: 13px;
-fx-font-weight: 600;
-fx-padding: 12 16;
-fx-background-radius: 8;
-fx-border-radius: 8;
-fx-border-color: transparent;
-fx-border-width: 0;
-fx-text-fill: rgba(255, 255, 255, 0.75);
-fx-font-size: 15px;
-fx-font-weight: 500;
-fx-padding: 10 4;
-fx-background-radius: 0;
-fx-border-radius: 0;
-fx-alignment: CENTER_LEFT;
-fx-cursor: hand;
}
.sidebar-button:hover {
-fx-background-color: rgba(255, 255, 255, 0.1);
-fx-background-color: transparent;
-fx-text-fill: white;
}
@@ -643,33 +645,37 @@
}
.sidebar-button-active {
-fx-background-color: rgba(255, 255, 255, 0.15);
-fx-text-fill: white;
-fx-border-color: rgba(255, 255, 255, 0.3);
-fx-border-width: 0 0 0 3;
-fx-background-color: transparent;
-fx-text-fill: #5eead4;
-fx-font-weight: 600;
-fx-border-color: transparent;
-fx-border-width: 0;
}
/* Sidebar Sub-buttons (indented) */
.sidebar-button-sub {
-fx-background-color: transparent;
-fx-text-fill: rgba(255, 255, 255, 0.7);
-fx-font-size: 12px;
-fx-font-weight: 500;
-fx-padding: 8 12;
-fx-background-radius: 6;
-fx-border-radius: 6;
-fx-border-color: transparent;
-fx-border-width: 0;
-fx-text-fill: rgba(255, 255, 255, 0.6);
-fx-font-size: 13px;
-fx-font-weight: 400;
-fx-padding: 6 4;
-fx-background-radius: 0;
-fx-border-radius: 0;
-fx-alignment: CENTER_LEFT;
-fx-cursor: hand;
}
.sidebar-button-sub:hover {
-fx-background-color: rgba(255, 255, 255, 0.08);
-fx-background-color: transparent;
-fx-text-fill: white;
}
.sidebar-button-sub.sidebar-button-active {
-fx-background-color: rgba(79, 70, 229, 0.3);
-fx-text-fill: white;
-fx-border-color: #6366F1;
-fx-border-width: 0 0 0 2;
-fx-background-color: transparent;
-fx-text-fill: #5eead4;
-fx-font-weight: 500;
-fx-border-color: transparent;
-fx-border-width: 0;
}

View File

@@ -32,36 +32,54 @@
<Insets top="10" right="10" bottom="10" left="10"/>
</padding>
<Button fx:id="importBtn" text="📁 Import Data" onAction="#onShowImport"
<Button fx:id="importBtn" text=" Import Data" onAction="#onShowImport"
maxWidth="Infinity" styleClass="sidebar-button"/>
<Button fx:id="studentsBtn" text="👤 Students" onAction="#onShowStudents"
<Button fx:id="studentsBtn" text=" Students" onAction="#onToggleStudentsMenu"
maxWidth="Infinity" styleClass="sidebar-button" disable="true"/>
<Button fx:id="coursesBtn" text="📚 Courses" onAction="#onShowCourses"
maxWidth="Infinity" styleClass="sidebar-button" disable="true"/>
<Button fx:id="classroomsBtn" text="🏛️ Classrooms" onAction="#onShowClassrooms"
maxWidth="Infinity" styleClass="sidebar-button" disable="true"/>
<Button fx:id="scheduleBtn" text="📅 Schedule" onAction="#onToggleScheduleMenu"
maxWidth="Infinity" styleClass="sidebar-button" disable="true"/>
<!-- Schedule Sub-menu (initially hidden) -->
<VBox fx:id="scheduleSubMenu" spacing="2" managed="false" visible="false">
<!-- Students Sub-menu (initially hidden) -->
<VBox fx:id="studentsSubMenu" spacing="2" managed="false" visible="false">
<padding>
<Insets left="15"/>
</padding>
<Button fx:id="calendarBtn" text="📆 Calendar View" onAction="#onShowCalendar"
<Button fx:id="studentListBtn" text="→ Student List" onAction="#onShowStudents"
maxWidth="Infinity" styleClass="sidebar-button-sub"/>
<Button fx:id="studentScheduleBtn" text="👤 Student Schedule" onAction="#onShowStudentSchedule"
maxWidth="Infinity" styleClass="sidebar-button-sub"/>
<Button fx:id="courseScheduleBtn" text="📚 Course Schedule" onAction="#onShowCourseSchedule"
maxWidth="Infinity" styleClass="sidebar-button-sub"/>
<Button fx:id="classroomScheduleBtn" text="🏛️ Classroom Schedule" onAction="#onShowClassroomSchedule"
<Button fx:id="studentScheduleBtn" text=" Student Schedule" onAction="#onShowStudentSchedule"
maxWidth="Infinity" styleClass="sidebar-button-sub"/>
</VBox>
<Button fx:id="coursesBtn" text="• Courses" onAction="#onToggleCoursesMenu"
maxWidth="Infinity" styleClass="sidebar-button" disable="true"/>
<!-- Courses Sub-menu (initially hidden) -->
<VBox fx:id="coursesSubMenu" spacing="2" managed="false" visible="false">
<padding>
<Insets left="15"/>
</padding>
<Button fx:id="courseListBtn" text="→ Course List" onAction="#onShowCourses"
maxWidth="Infinity" styleClass="sidebar-button-sub"/>
<Button fx:id="courseScheduleBtn" text="→ Course Schedule" onAction="#onShowCourseSchedule"
maxWidth="Infinity" styleClass="sidebar-button-sub"/>
</VBox>
<Button fx:id="classroomsBtn" text="• Classrooms" onAction="#onToggleClassroomsMenu"
maxWidth="Infinity" styleClass="sidebar-button" disable="true"/>
<!-- Classrooms Sub-menu (initially hidden) -->
<VBox fx:id="classroomsSubMenu" spacing="2" managed="false" visible="false">
<padding>
<Insets left="15"/>
</padding>
<Button fx:id="classroomListBtn" text="→ Classroom List" onAction="#onShowClassrooms"
maxWidth="Infinity" styleClass="sidebar-button-sub"/>
<Button fx:id="classroomScheduleBtn" text="→ Classroom Schedule" onAction="#onShowClassroomSchedule"
maxWidth="Infinity" styleClass="sidebar-button-sub"/>
</VBox>
<Button fx:id="scheduleBtn" text="• Schedule" onAction="#onShowCalendar"
maxWidth="Infinity" styleClass="sidebar-button" disable="true"/>
<Region VBox.vgrow="ALWAYS"/>
<Label text="Navigation" style="-fx-text-fill: rgba(255,255,255,0.5); -fx-font-size: 10px;"/>