
tabs_outside {
    width = 64,
    height = parent_height,
    x = 0,
    y = 0,
}
tabs_inside {
    width = 64,
    height = parent_height,
    x = -48,
    y = 0,
    align_width = false,
    align_height = false,
}

page_tab(index=index, tab=tab) {
    height = 118,
    width = 59,
    image = tab,
    x = 0,
    y = 5 + 128 * index,
    can_hover = true,
    on_mouse_down = "init#return true",
    on_mouse_up = "init#return true",
    on_mouse_move = "init#return true",
    on_mouse_move_out = "init#return true",
    shadow = shadow(2.0, 2.0, rgba(0, 0, 0, 0.3), 3.0, 0.0, "outset"),
}

page_tab(on_click=click) {
    on_mouse_up = list(click, "init#
        audio.play_sound('click')
        return true
    "),
}

tabs_outside > page_tab(hover=true) {
    x = -10,
}

window > content(style="student_info") {
    layout = "center",
    x = 48,
    width = 400,
}

window > content(style="student_info") > buttons {
    align_height = false,
    y = parent_height - 70,
    width = parent_width - 50,
    height = 72,
    layout = "grid",
    columns = 2,
    rows = 1,

    margin = 16,
    spacing = 50,
}

window > content(style="student_info") > name {
    align_height = false,
    y = 44,
    layout = "lined",
    line_height = 30,
}

window > content(style="student_info") > name > @text {
    font_size = 30,
    font_color = rgb(0, 10, 120),
}

content(style="student_info") > timetable {
    layout = "grid",
    columns = 7,
    rows = 1,

    align_height = false,
    x = 0,
    y = 100,
    width = 300,
    height = 100,
    spacing = 1,
}

timetable > course_day {
    background_color = rgba(0, 0, 0, 0.2),

    layout = "grid",
    rows = 5,
    spacing = 2,
    margin = 0,
}

timetable > course_day > center > label {
    layout = "lined",
}
timetable > course_day > center > label > @text {
    font_size = 10,
}
timetable > course_day(weekend=true) > center > label > @text {
    font_color = rgb(50, 50, 0),
}

timetable > course_day(weekend=true) {
    background_color = rgba(120, 0, 0, 0.2),
}


timetable > course_day > course_period {
    background_color = rgba(120, 120, 120, 0.5),
}
timetable > course_day > course_period(booked=true) {
    background_color = rgba(255, 255, 255, 1.0),
    border_width = border_width(1.0),
    border = border(bside("#000000", "solid")),
}
timetable > course_day > course_period(booked=true, grade="A") {
    background_color = rgb(0, 255, 0),
}
timetable > course_day > course_period(booked=true, grade="B") {
    background_color = rgb(51, 204, 0),
}
timetable > course_day > course_period(booked=true, grade="C") {
    background_color = rgb(102, 153, 0),
}
timetable > course_day > course_period(booked=true, grade="D") {
    background_color = rgb(153, 102, 0),
}
timetable > course_day > course_period(booked=true, grade="E") {
    background_color = rgb(204, 51, 0),
}
timetable > course_day > course_period(booked=true, grade="F") {
    background_color = rgb(255, 0, 0),
}

timetable > timetable_entry > @text {
    x = 5,
    y = 3,
    width = 200,
    height = 30,
    font_size = 20,
    font_color = rgb(0, 0, 0),
}

search_icon {
    x = parent_width - 25,
    image = "ui/search",
    width = 25,
    height = 25,
}

search_icon(on_click=on_click) {
    on_mouse_up = on_click,
}

content(style="student_info") > skills {
    layout = "rows",
    align_height = false,
    x = 0,
    y = 220,
    width = 300,
}

content(style="student_info") > debug_local {
    layout = "lined",
    y = parent_height - 100,
    align_height = false,
}
content(style="student_info") > debug_local > @text {
    font_size = 17,
}
content(style="student_info") > debug_remote {
    layout = "lined",
    y = parent_height - 80,
    align_height = false,
}
content(style="student_info") > debug_remote > @text {
    font_size = 17,
}

student_history {
    width = parent_width - 100,
    height = parent_height - 175,
    layout = "rows",
    align_height = false,
    y = 105,
}

student_history > history_entry {
    width = parent_width,
    height = 20,
    line_height = 20,
}
student_history > history_entry > name {
    layout = "lined",
    line_height = 20,
    width = parent_width,
    y = 0,
    x = 0,
}
student_history > history_entry > name > @text {
    font_size = 17,
}
student_history > history_entry > grade {
    layout = "lined",
    line_height = 20,
    width = 20,
    y = 0,
    x = parent_width - 20,
}
student_history > history_entry > grade > @text {
    font_size = 17,
    font_color = rgb(120, 120, 0),
}