diff --git a/src/mainapp/templates/teams.html b/src/mainapp/templates/teams.html index 9173135..f7cac51 100644 --- a/src/mainapp/templates/teams.html +++ b/src/mainapp/templates/teams.html @@ -6,7 +6,7 @@ {% block content %}
- Back + Back
@@ -16,43 +16,43 @@
- -
- - +
-
    +
    • -

      Sort teams by

      +

      Sort groups by

      - +
      - +
      • -
    • +

    • Sort members by

      - +
      diff --git a/src/mainapp/views.py b/src/mainapp/views.py index 17620e0..d024353 100644 --- a/src/mainapp/views.py +++ b/src/mainapp/views.py @@ -75,7 +75,8 @@ def get_teams(request): "last": member.last_name, "id": member.id, "team": team.team_number, - "peg": member.peg_number + "peg": member.peg_number, + "section": team.section_letter if team.section_letter else None } for member in team.members.order_by(sort_members).all() ] diff --git a/src/static/css/custom.css b/src/static/css/custom.css index a971403..840d149 100644 --- a/src/static/css/custom.css +++ b/src/static/css/custom.css @@ -39,4 +39,83 @@ .team-column { opacity: 0; transition: 5s opacity ease-in; +} + +.fixed-badge { + min-width: 22px; + height: 22px; +} + +.font-montserrat { + font-family: Montserrat; +} + +.font-raleway { + font-family: Raleway; +} + +.font-ssp { + font-family: "Source Sans Pro"; +} + +.pencil-btn { + width: 32px; + height: 32px; +} + +.force-contents-center { + display: flex; + justify-content: center; + align-items: center; +} + +.md-shadow-on-hover:hover { + box-shadow: rgba(0, 0, 0, 0.15) 0px 8px 16px 0px !important; +} + +.text-company { + color: #04385c; +} + +.company-bg { + background-color: #04385c !important; +} + +.underline-company { + text-decoration: underline solid #04385c; +} + +.border-company { + border-color: #04385c !important; +} + +.btn-company { + color: white; + background-color: #04385c; +} + +.btn-company:hover { + color: white; + background-color: #002d51; +} + +.btn-outline-company { + border: 1px solid #04385c; +} + +.btn-outline-company:hover { + color: white; + background-color: #04385c; + border: 1px solid #04385c; +} + + +.hover-only-bg:not(:hover) { + background-color: transparent !important; +} + +input[type='radio']:checked { + background-color: #04385c; + border: 1px solid #04385c; + box-shadow: none; } \ No newline at end of file diff --git a/src/static/css/index.css b/src/static/css/index.css index 41afdd0..7691a02 100644 --- a/src/static/css/index.css +++ b/src/static/css/index.css @@ -1,6 +1,6 @@ -body { +/* body { background-color: #0d5979; -} +} */ .bd-placeholder-img { font-size: 1.125rem; diff --git a/src/static/js/custom.js b/src/static/js/custom.js index 6304b64..c0aa691 100644 --- a/src/static/js/custom.js +++ b/src/static/js/custom.js @@ -5,18 +5,45 @@ $(document).ready(() => { + activateTooltips(); + pageLoadMotionEffects(); +}); + + +function activateTooltips() { // Enable all tooltips on the page const tooltipTriggerList = document.querySelectorAll('[data-bs-toggle="tooltip"]') const tooltipList = [...tooltipTriggerList].map(tooltipTriggerEl => new bootstrap.Tooltip(tooltipTriggerEl)) -}); - +} /** * Returns boolean if the string is empty or only contains whitespace. * * @param {string} string - The string to check against. * @returns {boolean} - The result as boolean - */ +*/ function isEmptyOrSpaces(string) { return string === null || string.match(/^ *$/) !== null; } + +function pageLoadMotionEffects() { + var useMotion = localStorage.getItem("motion"); + + if (useMotion === null) { + useMotion = true + } + + setMotionEffects(useMotion); +} + +function setMotionEffects(enable) { + + localStorage.setItem("motion", enable) + + if (enable) { + $(".fluid-hover-zoom-off").addClass("fluid-hover-zoom").removeClass("fluid-hover-zoom-off"); + } + else { + $(".fluid-hover-zoom").addClass("fluid-hover-zoom-off").removeClass("fluid-hover-zoom"); + } +} \ No newline at end of file diff --git a/src/static/js/teams.js b/src/static/js/teams.js index 1778abe..f4d2ceb 100644 --- a/src/static/js/teams.js +++ b/src/static/js/teams.js @@ -87,7 +87,7 @@ function loadTeams(teams, highlightText="") { $("#teamsContainer").append( `

      @@ -95,11 +95,7 @@ function loadTeams(teams, highlightText="") { TEAM ${team.team_number} - - SECTION - ${team.section_letter} - -

      @@ -114,7 +110,7 @@ function loadTeams(teams, highlightText="") { const fullname = member.first + " " + member.last; $("#teamsContainer").find(".team-members").last().append( - `
    • + `
    • -
      - +
      +
      ${member.peg} - - +
      +
      + ${member.section} +
      +
      ${fullname} - +
      -
      @@ -139,11 +138,13 @@ function loadTeams(teams, highlightText="") { }); }); + activateTooltips(); // activate the new tooltips + // Highlight all instances where the text matches the search critera if (!isEmptyOrSpaces(highlightText)) { $("#teamsContainer").find('.team-member-fullname').each(function() { var regex = new RegExp(highlightText, 'gi'); - $(this).html($(this).text().replace(regex, '$&')); + $(this).html($(this).text().replace(regex, '$&')); }); } @@ -185,7 +186,7 @@ function fetchAndLoadTeams(search="", sortTeams="", sortMembers="") { "sortTeams": sortTeams, "sortMembers": sortMembers }, - error: (xhr, textStatus, errorThrown) => { alert(errorThrown); }, + error: (xhr, textStatus, errorThrown) => { alert(xhr + " " + textStatus + " " + errorThrown); }, success: (result) => { teamsLoading(false); loadTeams(result.teams, search); @@ -294,7 +295,7 @@ function saveEditMemberModal(memberId) { "pegNumber": pegNumber, "search": !isEmptyOrSpaces(search) ? search : null }, - error: (xhr, textStatus, errorThrown) => { alert(errorThrown); }, + error: (xhr, textStatus, errorThrown) => { alert(xhr + " " + textStatus + " " + errorThrown); }, success: (result) => { teamsLoading(false); loadTeams(result.teams, search);