From 031d22f77bdec997d40c42ca2e9dc9d067165e5e Mon Sep 17 00:00:00 2001 From: Yinan Zhou Date: Fri, 22 Sep 2023 15:12:07 -0400 Subject: [PATCH 01/38] =?UTF-8?q?=F0=9F=86=95=20Initialize=20templates?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../instruments/templates/instrument_list.html | 18 ------------------ .../templates/instruments/index.html | 17 +++++++++++++++++ .../apps/instruments/views/instrument_list.py | 6 ++++-- web-app/django/VIM/settings.py | 4 +++- web-app/django/templates/base.html | 13 +++++++++++++ 5 files changed, 37 insertions(+), 21 deletions(-) delete mode 100644 web-app/django/VIM/apps/instruments/templates/instrument_list.html create mode 100644 web-app/django/VIM/apps/instruments/templates/instruments/index.html create mode 100644 web-app/django/templates/base.html diff --git a/web-app/django/VIM/apps/instruments/templates/instrument_list.html b/web-app/django/VIM/apps/instruments/templates/instrument_list.html deleted file mode 100644 index 5251fae..0000000 --- a/web-app/django/VIM/apps/instruments/templates/instrument_list.html +++ /dev/null @@ -1,18 +0,0 @@ - - - - - -

Instrument List

- - - \ No newline at end of file diff --git a/web-app/django/VIM/apps/instruments/templates/instruments/index.html b/web-app/django/VIM/apps/instruments/templates/instruments/index.html new file mode 100644 index 0000000..14ea16e --- /dev/null +++ b/web-app/django/VIM/apps/instruments/templates/instruments/index.html @@ -0,0 +1,17 @@ +{% extends "base.html" %} + +{% block title %} + Instrument List +{% endblock %} + +{% block content %} + {% for instrument in instruments %} +
  • {{ instrument.id }}, + {% for instrumentname in instrument.instrumentname_set.all %} + {{ instrumentname.language.en_label }}:{{ instrumentname.name }} + {% endfor %} + +
    • + {% endfor %} + +{% endblock %} \ No newline at end of file diff --git a/web-app/django/VIM/apps/instruments/views/instrument_list.py b/web-app/django/VIM/apps/instruments/views/instrument_list.py index 3e6870b..3ee9f03 100644 --- a/web-app/django/VIM/apps/instruments/views/instrument_list.py +++ b/web-app/django/VIM/apps/instruments/views/instrument_list.py @@ -1,6 +1,7 @@ from django.views.generic import ListView from VIM.apps.instruments.models import Instrument + class InstrumentList(ListView): """ Provides a paginated list of all instruments in the database. @@ -8,7 +9,8 @@ class InstrumentList(ListView): Pass `page` and `paginate_by` as query parameters to control pagination. Defaults to 20 instruments per page. """ - template_name = "instrument_list.html" + + template_name = "instruments/index.html" context_object_name = "instruments" model = Instrument @@ -18,4 +20,4 @@ def get_paginate_by(self, queryset) -> int: paginate_by = int(pag_by_param) except ValueError: paginate_by = 20 - return paginate_by \ No newline at end of file + return paginate_by diff --git a/web-app/django/VIM/settings.py b/web-app/django/VIM/settings.py index 6991da1..8df2add 100644 --- a/web-app/django/VIM/settings.py +++ b/web-app/django/VIM/settings.py @@ -52,7 +52,9 @@ TEMPLATES = [ { "BACKEND": "django.template.backends.django.DjangoTemplates", - "DIRS": [], + "DIRS": [ + BASE_DIR / "templates", + ], "APP_DIRS": True, "OPTIONS": { "context_processors": [ diff --git a/web-app/django/templates/base.html b/web-app/django/templates/base.html new file mode 100644 index 0000000..8d8f30b --- /dev/null +++ b/web-app/django/templates/base.html @@ -0,0 +1,13 @@ + + + + + + {% block title %}{% endblock %} + {% block css_files %}{% endblock %} + + + {% block content %} {% endblock %} + + + \ No newline at end of file From 8ace63f21e6d76db153be147d89f3d9872ca6ee8 Mon Sep 17 00:00:00 2001 From: Yinan Zhou Date: Fri, 22 Sep 2023 16:17:10 -0400 Subject: [PATCH 02/38] =?UTF-8?q?=F0=9F=86=95=20Initialize=20css=20files?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../django/VIM/apps/instruments/static/instruments/index.css | 0 .../VIM/apps/instruments/templates/instruments/index.html | 5 +++++ web-app/django/VIM/settings.py | 4 ++++ web-app/django/static/app.css | 5 +++++ web-app/django/templates/base.html | 3 +++ 5 files changed, 17 insertions(+) create mode 100644 web-app/django/VIM/apps/instruments/static/instruments/index.css create mode 100644 web-app/django/static/app.css diff --git a/web-app/django/VIM/apps/instruments/static/instruments/index.css b/web-app/django/VIM/apps/instruments/static/instruments/index.css new file mode 100644 index 0000000..e69de29 diff --git a/web-app/django/VIM/apps/instruments/templates/instruments/index.html b/web-app/django/VIM/apps/instruments/templates/instruments/index.html index 14ea16e..a2a22d3 100644 --- a/web-app/django/VIM/apps/instruments/templates/instruments/index.html +++ b/web-app/django/VIM/apps/instruments/templates/instruments/index.html @@ -1,9 +1,14 @@ {% extends "base.html" %} +{% load static %} {% block title %} Instrument List {% endblock %} +{% block css_files %} + +{% endblock %} + {% block content %} {% for instrument in instruments %}
  • {{ instrument.id }}, diff --git a/web-app/django/VIM/settings.py b/web-app/django/VIM/settings.py index 8df2add..c4a890a 100644 --- a/web-app/django/VIM/settings.py +++ b/web-app/django/VIM/settings.py @@ -117,6 +117,10 @@ STATIC_URL = "static/" +STATICFILES_DIRS = [ + BASE_DIR / "static" +] + # Default primary key field type # https://docs.djangoproject.com/en/4.2/ref/settings/#default-auto-field diff --git a/web-app/django/static/app.css b/web-app/django/static/app.css new file mode 100644 index 0000000..f0b3ebf --- /dev/null +++ b/web-app/django/static/app.css @@ -0,0 +1,5 @@ +@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@300;400;700&display=swap'); + +html { + font-family: 'Noto Sans', sans-serif; +} \ No newline at end of file diff --git a/web-app/django/templates/base.html b/web-app/django/templates/base.html index 8d8f30b..ca298d3 100644 --- a/web-app/django/templates/base.html +++ b/web-app/django/templates/base.html @@ -1,9 +1,12 @@ +{% load static %} + {% block title %}{% endblock %} + {% block css_files %}{% endblock %} From 54c1ec184602db6f224d43be637e136142193dea Mon Sep 17 00:00:00 2001 From: Yinan Zhou Date: Fri, 22 Sep 2023 16:40:33 -0400 Subject: [PATCH 03/38] =?UTF-8?q?=F0=9F=86=95=20Create=20404=20page?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- web-app/django/templates/404.html | 10 ++++++++++ 1 file changed, 10 insertions(+) create mode 100644 web-app/django/templates/404.html diff --git a/web-app/django/templates/404.html b/web-app/django/templates/404.html new file mode 100644 index 0000000..6069969 --- /dev/null +++ b/web-app/django/templates/404.html @@ -0,0 +1,10 @@ +{% extends "base.html" %} + +{% block title %} + Oops +{% endblock %} + +{% block content %} +

    Oops

    +

    We can't seem to find the page you are looking for.

    +{% endblock%} \ No newline at end of file From e6f008c6560750eeb85f66640cf905a613e06149 Mon Sep 17 00:00:00 2001 From: Yinan Zhou Date: Sat, 23 Sep 2023 17:52:14 -0400 Subject: [PATCH 04/38] =?UTF-8?q?=F0=9F=9B=A0=EF=B8=8F=20Set=20up=20base?= =?UTF-8?q?=20navbar=20&=20footer?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- web-app/django/static/app.css | 5 --- web-app/django/static/css/app.css | 47 ++++++++++++++++++++ web-app/django/static/images/lab-logo.png | Bin 0 -> 5922 bytes web-app/django/static/images/logo.svg | 4 ++ web-app/django/templates/base.html | 50 +++++++++++++++++++++- 5 files changed, 99 insertions(+), 7 deletions(-) delete mode 100644 web-app/django/static/app.css create mode 100644 web-app/django/static/css/app.css create mode 100644 web-app/django/static/images/lab-logo.png create mode 100644 web-app/django/static/images/logo.svg diff --git a/web-app/django/static/app.css b/web-app/django/static/app.css deleted file mode 100644 index f0b3ebf..0000000 --- a/web-app/django/static/app.css +++ /dev/null @@ -1,5 +0,0 @@ -@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@300;400;700&display=swap'); - -html { - font-family: 'Noto Sans', sans-serif; -} \ No newline at end of file diff --git a/web-app/django/static/css/app.css b/web-app/django/static/css/app.css new file mode 100644 index 0000000..f0a5ff1 --- /dev/null +++ b/web-app/django/static/css/app.css @@ -0,0 +1,47 @@ +@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:wght@300;400;700&display=swap'); + +html { + font-family: 'Noto Sans', sans-serif; +} + +/* header */ +header { + background-color: #9EB384; +} + +.nav-home { + color:#435334; +} + +.nav-opt { + color: #FAF1E4; +} + +.nav-opt:hover, +.nav-opt:active { + color: #435334; +} + +.search-input { + background-color: #FAF1E4; +} + +.login-btn { + color: #FAF1E4; + border: 1px solid #FAF1E4; +} + +.login-btn:hover { + color: #435334; + border: 1px solid #FAF1E4; + background-color: #FAF1E4; +} + +.signup-btn { + color: #435334; +} + +/* main */ +main { + background-color: #FAF1E4; +} \ No newline at end of file diff --git a/web-app/django/static/images/lab-logo.png b/web-app/django/static/images/lab-logo.png new file mode 100644 index 0000000000000000000000000000000000000000..ed6d9ee679a93ed92fedc254adba9702fd444bb2 GIT binary patch literal 5922 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 literal 0 HcmV?d00001 diff --git a/web-app/django/static/images/logo.svg b/web-app/django/static/images/logo.svg new file mode 100644 index 0000000..a7d8233 --- /dev/null +++ b/web-app/django/static/images/logo.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/web-app/django/templates/base.html b/web-app/django/templates/base.html index ca298d3..928c00d 100644 --- a/web-app/django/templates/base.html +++ b/web-app/django/templates/base.html @@ -6,11 +6,57 @@ {% block title %}{% endblock %} - + + + + + {% block css_files %}{% endblock %} + + +
    +
    +
    + + vim icon + VIM + + + + + + +
    + + +
    + {% comment %} TODO: add language button {% endcomment %} +
    +
    +
    + +
    {% block content %} {% endblock %} - +
    + + + + \ No newline at end of file From 086d3ac7b79188e54fd1245d40731bd54eda99a1 Mon Sep 17 00:00:00 2001 From: Yinan Zhou Date: Mon, 25 Sep 2023 14:41:48 -0400 Subject: [PATCH 05/38] Add language button --- web-app/django/static/css/app.css | 21 +++++++++++++++++++++ web-app/django/templates/base.html | 8 ++++++++ 2 files changed, 29 insertions(+) diff --git a/web-app/django/static/css/app.css b/web-app/django/static/css/app.css index f0a5ff1..055c335 100644 --- a/web-app/django/static/css/app.css +++ b/web-app/django/static/css/app.css @@ -26,6 +26,12 @@ header { background-color: #FAF1E4; } +.search-input:focus { + background-color: #FAF1E4; + outline: none; /* Remove the outline */ + border: 1px solid #FAF1E4; +} + .login-btn { color: #FAF1E4; border: 1px solid #FAF1E4; @@ -41,6 +47,21 @@ header { color: #435334; } +.language-btn { + color:#435334; +} + +.language-btn:focus { + border-color:#435334; +} + +.dropdown-menu { + background-color: #FAF1E4; +} + +.dropdown-item:hover { + background-color: #CEDEBD; +} /* main */ main { background-color: #FAF1E4; diff --git a/web-app/django/templates/base.html b/web-app/django/templates/base.html index 928c00d..cda1ec2 100644 --- a/web-app/django/templates/base.html +++ b/web-app/django/templates/base.html @@ -42,6 +42,14 @@ {% comment %} TODO: add language button {% endcomment %} +
    + + +
    From cd8b312407c3835193c77d04dc7cf9ef3cb65883 Mon Sep 17 00:00:00 2001 From: Yinan Zhou Date: Mon, 25 Sep 2023 15:52:06 -0400 Subject: [PATCH 06/38] Minor style adjustment for base page --- web-app/django/static/css/app.css | 11 +++++++++++ web-app/django/templates/base.html | 13 ++++++------- 2 files changed, 17 insertions(+), 7 deletions(-) diff --git a/web-app/django/static/css/app.css b/web-app/django/static/css/app.css index 055c335..4557ab2 100644 --- a/web-app/django/static/css/app.css +++ b/web-app/django/static/css/app.css @@ -24,6 +24,11 @@ header { .search-input { background-color: #FAF1E4; + color: #435334; +} + +.search-input::placeholder{ + color: #435334; } .search-input:focus { @@ -62,7 +67,13 @@ header { .dropdown-item:hover { background-color: #CEDEBD; } + /* main */ main { background-color: #FAF1E4; +} + +/* footer */ +footer { + background-color: #FAF1E4; } \ No newline at end of file diff --git a/web-app/django/templates/base.html b/web-app/django/templates/base.html index cda1ec2..5008682 100644 --- a/web-app/django/templates/base.html +++ b/web-app/django/templates/base.html @@ -17,20 +17,19 @@ -
    +
    - + vim icon VIM
    • -
    + -
    From 65803c0c83d940fdc30e6b93aaa43e5446031e45 Mon Sep 17 00:00:00 2001 From: Yinan Zhou Date: Thu, 28 Sep 2023 16:56:16 -0400 Subject: [PATCH 21/38] Rename content-container to body-container --- .../VIM/apps/instruments/static/instruments/css/index.css | 4 ++-- .../VIM/apps/instruments/templates/instruments/index.html | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/web-app/django/VIM/apps/instruments/static/instruments/css/index.css b/web-app/django/VIM/apps/instruments/static/instruments/css/index.css index d84f22b..fdfb6f5 100644 --- a/web-app/django/VIM/apps/instruments/static/instruments/css/index.css +++ b/web-app/django/VIM/apps/instruments/static/instruments/css/index.css @@ -42,8 +42,8 @@ hr { color: #9EB384; } -/* content */ -.content-container { +/* body */ +.body-container { background-color: white; border: 3px solid #9EB384; border-radius: 30px; diff --git a/web-app/django/VIM/apps/instruments/templates/instruments/index.html b/web-app/django/VIM/apps/instruments/templates/instruments/index.html index 3948cda..af1b95e 100644 --- a/web-app/django/VIM/apps/instruments/templates/instruments/index.html +++ b/web-app/django/VIM/apps/instruments/templates/instruments/index.html @@ -92,7 +92,7 @@

    #####

    -
    +

    INSTRUMENT LIST

    From f8c4317909ec558e2e3108692e7193f7a6bc562d Mon Sep 17 00:00:00 2001 From: Yinan Zhou Date: Thu, 28 Sep 2023 17:36:45 -0400 Subject: [PATCH 22/38] =?UTF-8?q?=E2=99=BB=EF=B8=8FUpdate=20ImagesLoaded?= =?UTF-8?q?=20&=20Masonry?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../static/instruments/js/masonry.js | 22 ++++++++++--------- .../templates/instruments/index.html | 2 +- 2 files changed, 13 insertions(+), 11 deletions(-) diff --git a/web-app/django/VIM/apps/instruments/static/instruments/js/masonry.js b/web-app/django/VIM/apps/instruments/static/instruments/js/masonry.js index dfa7212..d1b70b5 100644 --- a/web-app/django/VIM/apps/instruments/static/instruments/js/masonry.js +++ b/web-app/django/VIM/apps/instruments/static/instruments/js/masonry.js @@ -1,14 +1,16 @@ -function initMasonry() { - var masonryGrid = document.getElementById('masonry-grid'); - +// Wait for the DOM to be fully loaded +document.addEventListener("DOMContentLoaded", function () { + // Initialize Masonry + var masonryGrid = document.getElementById("masonry-grid"); var masonry = new Masonry(masonryGrid, { - itemSelector: '.col', - columnWidth: '.col', - percentPosition: true, + percentPosition: true, }); -} -var masonryGrid = document.getElementById('masonry-grid'); -imagesLoaded(masonryGrid, initMasonry); + // Initialize ImagesLoaded + var imgLoad = imagesLoaded(masonryGrid); -window.addEventListener('resize', initMasonry); \ No newline at end of file + // When all images are loaded, relayout Masonry + imgLoad.on("always", function () { + masonry.layout(); + }); +}); diff --git a/web-app/django/VIM/apps/instruments/templates/instruments/index.html b/web-app/django/VIM/apps/instruments/templates/instruments/index.html index af1b95e..a260ccf 100644 --- a/web-app/django/VIM/apps/instruments/templates/instruments/index.html +++ b/web-app/django/VIM/apps/instruments/templates/instruments/index.html @@ -164,6 +164,6 @@

    INSTRUMENT LIST

    {% block script %} - + {% endblock %} \ No newline at end of file From 5121cc7d4dd51519c6d0305f8d87fd949dd78096 Mon Sep 17 00:00:00 2001 From: Yinan Zhou Date: Thu, 28 Sep 2023 18:52:23 -0400 Subject: [PATCH 23/38] Add masonry display button --- .../apps/instruments/static/instruments/css/index.css | 10 ++++++++++ .../apps/instruments/templates/instruments/index.html | 9 +++++++-- 2 files changed, 17 insertions(+), 2 deletions(-) diff --git a/web-app/django/VIM/apps/instruments/static/instruments/css/index.css b/web-app/django/VIM/apps/instruments/static/instruments/css/index.css index fdfb6f5..95ff951 100644 --- a/web-app/django/VIM/apps/instruments/static/instruments/css/index.css +++ b/web-app/django/VIM/apps/instruments/static/instruments/css/index.css @@ -49,6 +49,16 @@ hr { border-radius: 30px; } +.display-btn { + font-weight: bold; + color: #435334; + font-size: 20px; +} + +.display-btn:focus { + border-color:#435334; +} + .card { background-color: #FAF1E4; } diff --git a/web-app/django/VIM/apps/instruments/templates/instruments/index.html b/web-app/django/VIM/apps/instruments/templates/instruments/index.html index a260ccf..6ec5fee 100644 --- a/web-app/django/VIM/apps/instruments/templates/instruments/index.html +++ b/web-app/django/VIM/apps/instruments/templates/instruments/index.html @@ -92,8 +92,13 @@

    #####

    -
    -

    INSTRUMENT LIST

    +
    +
    +

    INSTRUMENT LIST

    + +
    From d5ff3268bf3707ac018e0255ef5d0b93e5713539 Mon Sep 17 00:00:00 2001 From: Yinan Zhou Date: Fri, 29 Sep 2023 10:42:23 -0400 Subject: [PATCH 24/38] Add display switch functionality --- .../static/instruments/js/display.js | 25 +++++++++++++++++++ .../templates/instruments/index.html | 7 ++++++ 2 files changed, 32 insertions(+) create mode 100644 web-app/django/VIM/apps/instruments/static/instruments/js/display.js diff --git a/web-app/django/VIM/apps/instruments/static/instruments/js/display.js b/web-app/django/VIM/apps/instruments/static/instruments/js/display.js new file mode 100644 index 0000000..367973c --- /dev/null +++ b/web-app/django/VIM/apps/instruments/static/instruments/js/display.js @@ -0,0 +1,25 @@ + +const masonryBtn = document.getElementById("masonry-btn"); +const listBtn = document.getElementById("list-btn"); +const stdBtn = document.getElementById("std-btn"); + + +masonryBtn.addEventListener("click", () => { + masonryBtn.style.display = "none"; + listBtn.style.display = ""; + stdBtn.style.display = "none"; +}); + + +listBtn.addEventListener("click", () => { + masonryBtn.style.display = "none"; + listBtn.style.display = "none"; + stdBtn.style.display = ""; +}); + + +stdBtn.addEventListener("click", () => { + masonryBtn.style.display = ""; + listBtn.style.display = "none"; + stdBtn.style.display = "none"; +}); diff --git a/web-app/django/VIM/apps/instruments/templates/instruments/index.html b/web-app/django/VIM/apps/instruments/templates/instruments/index.html index 6ec5fee..37f910b 100644 --- a/web-app/django/VIM/apps/instruments/templates/instruments/index.html +++ b/web-app/django/VIM/apps/instruments/templates/instruments/index.html @@ -98,6 +98,12 @@

    INSTRUMENT LIST

    + +
    @@ -171,4 +177,5 @@

    INSTRUMENT LIST

    + {% endblock %} \ No newline at end of file From e6a14b5ea085daacf2b54a27c16b6dde11f18927 Mon Sep 17 00:00:00 2001 From: Yinan Zhou Date: Fri, 29 Sep 2023 10:58:36 -0400 Subject: [PATCH 25/38] Adjust layout style --- .../instruments/templates/instruments/index.html | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/web-app/django/VIM/apps/instruments/templates/instruments/index.html b/web-app/django/VIM/apps/instruments/templates/instruments/index.html index 37f910b..0b7af97 100644 --- a/web-app/django/VIM/apps/instruments/templates/instruments/index.html +++ b/web-app/django/VIM/apps/instruments/templates/instruments/index.html @@ -94,26 +94,26 @@

    #####

    -

    INSTRUMENT LIST

    - - -
    -
    +
    {% for instrument in instruments %} -
    +
    -
    +
    instrument image -
    +

    {% for instrumentname in instrument.instrumentname_set.all %} {% if instrumentname.language.en_label == "english" %} From 21356593de753a6b51afdf48fdbc3ae2c6e755e5 Mon Sep 17 00:00:00 2001 From: Yinan Zhou Date: Fri, 29 Sep 2023 18:07:01 -0400 Subject: [PATCH 26/38] =?UTF-8?q?=F0=9F=AA=84=20Add=20list=20view?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../static/instruments/css/index.css | 30 ++++++++++++++++- .../static/instruments/js/display.js | 14 +++++--- .../static/instruments/js/masonry.js | 2 +- .../templates/instruments/index.html | 25 +++------------ .../templates/instruments/listView.html | 32 +++++++++++++++++++ .../templates/instruments/masonryView.html | 20 ++++++++++++ .../templates/instruments/stdView.html | 3 ++ 7 files changed, 99 insertions(+), 27 deletions(-) create mode 100644 web-app/django/VIM/apps/instruments/templates/instruments/listView.html create mode 100644 web-app/django/VIM/apps/instruments/templates/instruments/masonryView.html create mode 100644 web-app/django/VIM/apps/instruments/templates/instruments/stdView.html diff --git a/web-app/django/VIM/apps/instruments/static/instruments/css/index.css b/web-app/django/VIM/apps/instruments/static/instruments/css/index.css index 95ff951..384b221 100644 --- a/web-app/django/VIM/apps/instruments/static/instruments/css/index.css +++ b/web-app/django/VIM/apps/instruments/static/instruments/css/index.css @@ -7,6 +7,10 @@ h4 { font-weight: 700; } +h5 { + color: #435334; +} + hr { border: 1.5px solid #435334; margin-top: 0; @@ -63,7 +67,7 @@ hr { background-color: #FAF1E4; } -.card-text { +.card-title { color: #435334; } @@ -78,4 +82,28 @@ hr { .page-number, .page-link:hover { color: #9EB384; +} + +/* list view */ +.list-item-container { + min-height: 200px; + max-height: 300px; + overflow: hidden; +} + +.square-image-container img { + width: 100%; + height: auto; +} + +.card-title h5:hover { + color: #9EB384; +} + +.more-info { + color: #435334; +} + +.more-info:hover { + border: 1px solid #435334; } \ No newline at end of file diff --git a/web-app/django/VIM/apps/instruments/static/instruments/js/display.js b/web-app/django/VIM/apps/instruments/static/instruments/js/display.js index 367973c..efe887d 100644 --- a/web-app/django/VIM/apps/instruments/static/instruments/js/display.js +++ b/web-app/django/VIM/apps/instruments/static/instruments/js/display.js @@ -3,23 +3,29 @@ const masonryBtn = document.getElementById("masonry-btn"); const listBtn = document.getElementById("list-btn"); const stdBtn = document.getElementById("std-btn"); +const masonryView = document.getElementById('masonry-view'); +const listView = document.getElementById('list-view'); +const stdView = document.getElementById('std-view'); masonryBtn.addEventListener("click", () => { masonryBtn.style.display = "none"; listBtn.style.display = ""; - stdBtn.style.display = "none"; + masonryView.style.display = "none"; + listView.style.display = ""; }); listBtn.addEventListener("click", () => { - masonryBtn.style.display = "none"; listBtn.style.display = "none"; stdBtn.style.display = ""; + listView.style.display = "none"; + stdView.style.display = ""; }); stdBtn.addEventListener("click", () => { masonryBtn.style.display = ""; - listBtn.style.display = "none"; stdBtn.style.display = "none"; -}); + masonryView.style.display = ""; + stdView.style.display = "none"; +}); \ No newline at end of file diff --git a/web-app/django/VIM/apps/instruments/static/instruments/js/masonry.js b/web-app/django/VIM/apps/instruments/static/instruments/js/masonry.js index d1b70b5..3dcec22 100644 --- a/web-app/django/VIM/apps/instruments/static/instruments/js/masonry.js +++ b/web-app/django/VIM/apps/instruments/static/instruments/js/masonry.js @@ -1,7 +1,7 @@ // Wait for the DOM to be fully loaded document.addEventListener("DOMContentLoaded", function () { // Initialize Masonry - var masonryGrid = document.getElementById("masonry-grid"); + var masonryGrid = document.getElementById("masonry-view"); var masonry = new Masonry(masonryGrid, { percentPosition: true, }); diff --git a/web-app/django/VIM/apps/instruments/templates/instruments/index.html b/web-app/django/VIM/apps/instruments/templates/instruments/index.html index 0b7af97..b30ca7c 100644 --- a/web-app/django/VIM/apps/instruments/templates/instruments/index.html +++ b/web-app/django/VIM/apps/instruments/templates/instruments/index.html @@ -106,27 +106,10 @@

    INSTRUMENT LIST

    -
    - +
    + {% include "instruments/masonryView.html" %} + {% include "instruments/listView.html" %} + {% include "instruments/stdView.html" %}
    diff --git a/web-app/django/VIM/apps/instruments/templates/instruments/listView.html b/web-app/django/VIM/apps/instruments/templates/instruments/listView.html new file mode 100644 index 0000000..b503b99 --- /dev/null +++ b/web-app/django/VIM/apps/instruments/templates/instruments/listView.html @@ -0,0 +1,32 @@ + \ No newline at end of file diff --git a/web-app/django/VIM/apps/instruments/templates/instruments/masonryView.html b/web-app/django/VIM/apps/instruments/templates/instruments/masonryView.html new file mode 100644 index 0000000..7c6b894 --- /dev/null +++ b/web-app/django/VIM/apps/instruments/templates/instruments/masonryView.html @@ -0,0 +1,20 @@ + \ No newline at end of file diff --git a/web-app/django/VIM/apps/instruments/templates/instruments/stdView.html b/web-app/django/VIM/apps/instruments/templates/instruments/stdView.html new file mode 100644 index 0000000..6f7d013 --- /dev/null +++ b/web-app/django/VIM/apps/instruments/templates/instruments/stdView.html @@ -0,0 +1,3 @@ + \ No newline at end of file From 94f77437a847c954d812af1c039804646aa7bcaa Mon Sep 17 00:00:00 2001 From: Yinan Zhou Date: Mon, 2 Oct 2023 11:29:24 -0400 Subject: [PATCH 27/38] Align image center --- .../VIM/apps/instruments/templates/instruments/listView.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/web-app/django/VIM/apps/instruments/templates/instruments/listView.html b/web-app/django/VIM/apps/instruments/templates/instruments/listView.html index b503b99..33beda5 100644 --- a/web-app/django/VIM/apps/instruments/templates/instruments/listView.html +++ b/web-app/django/VIM/apps/instruments/templates/instruments/listView.html @@ -1,7 +1,7 @@