Skip to content

Commit

Permalink
Redesigned entire website
Browse files Browse the repository at this point in the history
  • Loading branch information
@noahcussatti
noahcussatti committed Oct 29, 2023
1 parent ced31fe commit 8fd9316
Show file tree
Hide file tree
Showing 15 changed files with 193 additions and 417 deletions.
6 changes: 3 additions & 3 deletions ACMAS/app/ACMAS_Web/components/button/button.html
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<span class="button-component pt-2">
<span class="button-component">
{% if component_type == "primary" %}
<button type="submit" class="px-4 py-2 rounded-xl text-white text-semibold text-lg bg-blue-600 hover:bg-blue-700 transition ease-in duration-200" value="{{ value }}" name="{{ name }}">{{ text }}</button>
<button type="submit" class="px-5 py-3 rounded-xl text-white font-semibold text-lg bg-blue-600 hover:bg-blue-700 transition ease-in duration-200" value="{{ value }}" name="{{ name }}">{{ text }}</button>
{% elif component_type == "secondary" %}
<button type="submit" class="px-4 py-2 rounded-xl text-gray-700 text-semibold border border-gray-300 text-lg bg-white hover:bg-gray-100 transition ease-in duration-200" value="{{ value }}" name="{{ name }}">{{ text }}</button>
<button type="submit" class="px-5 py-3 rounded-xl text-gray-700 font-semibold border border-gray-300 text-lg bg-white hover:bg-gray-100 transition ease-in duration-200" value="{{ value }}" name="{{ name }}">{{ text }}</button>
{% endif %}
</span>
13 changes: 9 additions & 4 deletions ACMAS/app/ACMAS_Web/components/field/field.html
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,12 @@
<div class="field-component p-0.5">
{% load component_tags %}

<div class="field-component flex bg-gray-100 p-4 h-14 space-x-4 rounded-lg w-full items-center">
{% if component_type == "input" %}
<input type="file" class="block w-full text-sm text-gray-900 border border-gray-300 rounded-lg cursor-pointer bg-gray-50 focus:outline-none" name="{{ name }}">
{% else %}
<input type="text" class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5" name="{{ name }}" placeholder="{{ placeholder }}">
<input type="file" class="block w-full text-sm text-gray-900 border border-gray-300 rounded-lg cursor-pointer bg-gray-50 focus:outline-none" name="{{ name }}">
{% else %}
{% if icon_name != "" %}
{% component "icon" icon=icon_name icon_type="mini" icon_class="w-6 h-6 flex-shrink-0 text-gray-400" %}
{% endif %}
<input type="{{ component_type }}" class="bg-gray-100 outline-none border-0 w-full ring-0 focus:ring-0" name="{{ name }}" placeholder="{{ placeholder }}" />
{% endif %}
</div>
3 changes: 2 additions & 1 deletion ACMAS/app/ACMAS_Web/components/field/field.py
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,9 +5,10 @@
class Field(component.Component):
template_name = "field/field.html"

def get_context_data(self, placeholder, name, component_type):
def get_context_data(self, placeholder, name, component_type, icon_name):
return {
"placeholder": placeholder,
"name": name,
"component_type": component_type,
"icon_name": icon_name,
}
Binary file added ACMAS/app/ACMAS_Web/static/img/github.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
31 changes: 13 additions & 18 deletions ACMAS/app/ACMAS_Web/templates/_base.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -138,7 +138,6 @@
</li>
{% endblock %}
{% endif %}
<li><a class="block py-2 pl-3 pr-4 text-gray-900 rounded md:hover:bg-gray-100 md:hover:bg-transparent md:border-0 hover:text-gray-500" href="https://github.com/ACMAS/ACMAS-Frontend">GitHub</a></li>
{% if user.is_authenticated %}
{% block user %}
<!-- Logout -->
Expand All @@ -158,27 +157,23 @@
</div>
</div>
</nav>


<div class="">
<div>
{% block content %}
{% endblock content %}
</div>
{% comment %} <div class="ocean" id="hide-mobile">
<div class="wave"></div>
<div class="wave"></div>
</div> {% endcomment %}
<!--
<div class="custom-shape-divider-bottom-1669508581" id="hide-mobile">
<svg data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 120" preserveAspectRatio="none">
<path
d="M321.39,56.44c58-10.79,114.16-30.13,172-41.86,82.39-16.72,168.19-17.73,250.45-.39C823.78,31,906.67,72,985.66,92.83c70.05,18.48,146.53,26.09,214.34,3V0H0V27.35A600.21,600.21,0,0,0,321.39,56.44Z"
class="shape-fill">
</path>
/svg>
</div>
-->
</body>

<footer class="fixed bottom-0 left-0 z-20 w-full p-4 bg-white md:flex md:items-center md:justify-between md:p-6">
<span class="text-sm text-gray-500 sm:text-center dark:text-gray-400"></span>
<ul class="flex flex-wrap items-center justify-items-center mt-3 text-sm font-medium text-gray-500 dark:text-gray-400 sm:mt-0">
<li class="mr-6">
<a href="https://github.com/ACMAS/ACMAS-Frontend"><img class="xl:h-6 h-4 text-gray-500" src="../static/img/github.png" alt="github"></a>
</li>
<li class="mr-4 filter invert">
<a href="https://new.rcos.io/"><img class="xl:h-6 h-4 text-gray-500" src="../static/img/RCOS.png" alt="RCOS"></a>
</li>
</ul>
</footer>
{% endblock body %}

</html>
93 changes: 15 additions & 78 deletions ACMAS/app/ACMAS_Web/templates/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,6 @@ <h2 class="text-3xl text-white mb-24" style="color: #327796">Automated Course Ma
</div>
</div>
</div>

<div class="container mx-auto px-4 z-3 -mt-64 pt-24 relative w-8/12">
<div class="justify-center flex flex-wrap -mx-4">
<div class="bg-white rounded-xl shadow-lg">
Expand All @@ -40,67 +39,63 @@ <h2 class="text-3xl text-white mb-24" style="color: #327796">Automated Course Ma
class="px-6 rounded-xl relative w-full lg:w-3/12 w-full py-8 md:w-6/12 transition ease-in-out delay-50 hover:-translate-y-1 hover:scale-105 hover:bg-gray-50 duration-200 cursor-pointer"
onclick="window.location.href='searchByCourse';"
>
<div class="flex justify-center text-gray-700">
{% component "icon" icon="academic-cap" icon_type="mini" icon_class="w-5 h-5" %}
<div class="flex justify-center text-gray-600">
{% component "icon" icon="academic-cap" icon_type="mini" icon_class="w-6 h-6" %}
</div>
<div class="text-center py-2">
<h5 class="text-xl font-semibold text-center text-gray-700 mt-2 mb-1">Search by Course</h5>
<p class="text-gray-500 text-md">Blah blah blah blah</p>
</div>
</div>
<div
class="px-6 rounded-xl relative w-full lg:w-3/12 w-full py-8 md:w-6/12 transition ease-in-out delay-50 hover:-translate-y-1 hover:scale-105 hover:bg-gray-50 duration-200 cursor-pointer"
onclick="window.location.href='searchByQuestion';"
>
<div class="flex justify-center text-gray-700">
{% component "icon" icon="magnifying-glass" icon_type="mini" icon_class="w-5 h-5" %}
<div class="flex justify-center text-gray-600">
{% component "icon" icon="magnifying-glass" icon_type="mini" icon_class="w-6 h-6" %}
</div>
<div class="text-center py-2">
<h5 class="text-xl font-semibold text-center text-gray-700 mt-2 mb-1">Search by Question</h5>
<p class="text-gray-500 text-md">Blah blah blah blah</p>
</div>
</div>
{% if user.is_authenticated %}
<div
class="px-6 rounded-xl relative w-full lg:w-3/12 w-full py-8 md:w-6/12 transition ease-in-out delay-50 hover:-translate-y-1 hover:scale-105 hover:bg-gray-50 duration-200 cursor-pointer"
onclick="window.location.href='upload-file';"
>
<div class="flex justify-center text-gray-700">
{% component "icon" icon="document-arrow-up" icon_type="mini" icon_class="w-5 h-5" %}
<div class="flex justify-center text-gray-600">
{% component "icon" icon="document-arrow-up" icon_type="mini" icon_class="w-6 h-6" %}
</div>
<div class="text-center py-2">
<h5 class="text-xl font-semibold text-center text-gray-700 mt-2 mb-1">Upload<br>File</h5>
<p class="text-gray-500 text-md">Blah blah blah blah</p>
</div>
</div>
<div
class="px-6 rounded-xl relative w-full lg:w-3/12 w-full py-8 md:w-6/12 transition ease-in-out delay-50 hover:-translate-y-1 hover:scale-105 hover:bg-gray-50 duration-200 cursor-pointer"
onclick="window.location.href='upload-manually';"
>
<div class="flex justify-center text-gray-700">
{% component "icon" icon="cloud-arrow-up" icon_type="mini" icon_class="w-5 h-5" %}
<div class="flex justify-center text-gray-600">
{% component "icon" icon="cloud-arrow-up" icon_type="mini" icon_class="w-6 h-6" %}
</div>
<div class="text-center py-2">
<h5 class="text-xl font-semibold text-center text-gray-700 mt-2 mb-1">Upload Manually</h5>
<p class="text-gray-500 text-md">Blah blah blah blah</p>
<h5 class="text-xl font-semibold text-center text-gray-700 mt-2 mb-1">Upload<br>Manually</h5>
</div>
</div>
{% else %}
<div class="px-6 relative w-full lg:w-3/12 w-full py-8 md:w-6/12 bg-gray-100 opacity-75 cursor-not-allowed">
<div class="flex justify-center text-gray-700">
{% component "icon" icon="document-arrow-up" icon_type="mini" icon_class="w-5 h-5" %}
<div class="flex justify-center text-gray-600">
{% component "icon" icon="document-arrow-up" icon_type="mini" icon_class="w-6 h-6" %}
</div>
<div class="text-center py-2">
<h5 class="text-xl font-semibold text-center text-gray-700 mt-2 mb-1">Upload<br>File</h5>
<p class="text-gray-500 text-md">Login to upload</p>
</div>
</div>
<div class="px-6 lg:rounded-r-xl md:rounded-br-xl relative w-full lg:w-3/12 w-full py-8 md:w-6/12 bg-gray-100 opacity-75 cursor-not-allowed">
<div class="flex justify-center text-gray-700">
{% component "icon" icon="cloud-arrow-up" icon_type="mini" icon_class="w-5 h-5" %}
<div class="flex justify-center text-gray-600">
{% component "icon" icon="cloud-arrow-up" icon_type="mini" icon_class="w-6 h-6" %}
</div>
<div class="text-center py-2">
<h5 class="text-xl font-semibold text-center text-gray-700 mt-2 mb-1">Upload Manually</h5>
<h5 class="text-xl font-semibold text-center text-gray-700 mt-2 mb-1">Upload<br>Manually</h5>
<p class="text-gray-500 text-md">Login to upload</p>
</div>
</div>
Expand All @@ -110,15 +105,6 @@ <h5 class="text-xl font-semibold text-center text-gray-700 mt-2 mb-1">Upload Man
</div>
</div>

{% comment %} <div class="text-7xl" style="color: #327796; font-family: Inter, serif;">Simplify <br> studying with</div>
<div class="">
<a href="/">
<img
alt="ACMAS logo"
class="w-96 h-auto pt-4 pl-5"
src="../static/img/ACMAS_Logo.svg"
/>
</a> {% endcomment %}
{% endblock content %}

{% comment %} {% block content %} {% endcomment %}
Expand Down Expand Up @@ -146,54 +132,5 @@ <h5 class="text-xl font-semibold text-center text-gray-700 mt-2 mb-1">Upload Man
href="https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap"
crossorigin="anonymous"
/>
</head>

<body>
{% comment %} <main> {% endcomment %}
{% comment %} <div class="p-6">
<div style="display:flex;">
<div class="home-display-text text-blue">Simplify <br> studying with</div>
<div class="home-logo-title">
<a href="/" >
<img
alt="ACMAS logo"
class="home-logo"
src="../static/img/ACMAS_Logo.svg"
/>
</a>
</div>
</div>

<div class="home-buttons-container gap-4">
<li class="dropdown-button home-text">
Search
<ul class="dropdown-opts dropdown-opts-animated">
<li><a href="/searchByQuestion">by Question</a></li>
<li><a href="/searchByCourse">by Course</a></li>
</ul>
</li>
{%if user.is_authenticated %}
{%block UploadOptions%}
<li class="dropdown-button home-text">
Upload
<ul class="dropdown-opts dropdown-opts-animated">
<li><a href="/upload-file">With a file</a></li>
<li><a href="/upload-manually">Manually</a></li>
</ul>
</li>
{%endblock%}
{% endif %}

</div>
</div>
</main>
<div class="custom-shape-divider-bottom-1669508581" id="hide-mobile">
<svg data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 120" preserveAspectRatio="none">
<path
d="M321.39,56.44c58-10.79,114.16-30.13,172-41.86,82.39-16.72,168.19-17.73,250.45-.39C823.78,31,906.67,72,985.66,92.83c70.05,18.48,146.53,26.09,214.34,3V0H0V27.35A600.21,600.21,0,0,0,321.39,56.44Z"
class="shape-fill">
</path>
</svg>
</div> {% endcomment %}
{% comment %} {% endblock %} {% endcomment %}
</head> {% endcomment %}
</html>
35 changes: 19 additions & 16 deletions ACMAS/app/ACMAS_Web/templates/pdf-reader.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,23 +15,26 @@
{% block facebook_url %}www.acmas.systems{% endblock %}

{% block content %}

<div class="flex flex-col mt-20 items-center justify-items-center">
<h1 class="text-5xl font-light text-gray-900 text-center pb-8" style="font-family: Inter, serif;">ACMAS Reader</h1>
<div class="h-96 w-2/3">
<div class="h-full w-full bg-white border border-black rounded-lg">
<embed src="{{directory}}" type="application/pdf" width="100%" height="100%" />
<div class="p-0 flex items-center overflow-hidden relative" style="height: 85vh;">
<div class="absolute w-full h-full" style="background: linear-gradient(-45deg, #f8f8f3, #f5f2d6, #dbebf3, #c6d6f7); background-size: 300% 300%; animation: gradient 65s ease infinite;"> </div>
<div class="container mx-auto px-4 z-3 relative lg:w-6/12">
<div class="justify-center flex flex-wrap flex-col -mx-4 text-center">
<div class="flex items-center space-x-6 p-6 bg-white rounded-xl shadow-lg hover:shadow-xl transition duration-500 xl:h-96 lg:h-80 md:h-48">
<div class="h-full w-full bg-gray-100 text-gray-600 rounded-lg">
<embed src="{{ directory }}" type="application/pdf" width="100%" height="100%" />
</div>
</div>
</div>
</div>

<span class="mt-6 flex gap-x-6">
<span onclick="window.location.href='searchByQuestion';">
{% component "button" text="Return to Homepage" component_type="primary" value="" %}
<span class="mt-4 flex justify-center items-center gap-x-4">
<form id="return-to-query" action="{% url 'returnQuery' %}">
{% component "button" text="Return to Query" component_type="primary" value="Return to Query" %}
</form>
<span onclick="window.location.href='/';">
{% component "button" text="Return to Homepage" component_type="secondary" value="" %}
</span>
</span>
<form id="return-to-query" action="{% url 'returnQuery' %}">
{% component "button" text="Return to Query" component_type="primary" value="Return to Query" %}
{% comment %} <input type="submit" class="home-button button content" value="Return to Query"> {% endcomment %}
</form>
</span>
</div>
</div>
<div class="w-full absolute text-white bottom-0 z-3 "></div>
</div>
{% endblock %}
32 changes: 21 additions & 11 deletions ACMAS/app/ACMAS_Web/templates/profile.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,16 +3,26 @@
{% block title %}Profile{% endblock %}

{% block content %}
<div class="flex flex-col mt-20">
<h1 class="text-3xl font-light text-gray-900 text-center mb-8" style="font-family: Inter, serif;">Hello {{user.username}}!</h1>
<div class="w-full flex items-center justify-center pt-2">
<br/> <br/>
<p class="mt-8">
Want to change it up?
<a href="{% url 'password_change' %}">
{% component "button" text="Change Password" component_type="secondary" value="" %}
</a>
</p>
</div>
<div class="p-0 flex items-center overflow-hidden relative" style="height: 85vh;">
<div class="absolute w-full h-full" style="background: linear-gradient(-45deg, #f8f8f3, #f5f2d6, #dbebf3, #c6d6f7); background-size: 300% 300%; animation: gradient 65s ease infinite;"> </div>
<div class="container mx-auto px-4 z-3 relative lg:w-3/12">
<div class="justify-center flex flex-wrap flex-col -mx-4 text-center">
<div class="flex items-center space-x-6 p-6 bg-white rounded-xl shadow-lg hover:shadow-xl transition duration-500">
<div class="flex-col flex space-y-4 w-full">
<div class="flex justify-center text-gray-600">
{% component "icon" icon="user" icon_type="mini" icon_class="w-20 h-20" %}
</div>
<div class="text-center py-2">
<h2 class="text-4xl font-semibold text-center text-gray-700 mt-2 mb-1">{{ user.username }}</h2>
<p class="text-gray-500 text-md">{{ user.email }}</p>
</div>
<a href="{% url 'password_change' %}">
{% component "button" text="Change Password" component_type="secondary" value="" %}
</a>
</div>
</div>
</div>
</div>
<div class="w-full absolute text-white bottom-0 z-3 "></div>
</div>
{% endblock%}
24 changes: 19 additions & 5 deletions ACMAS/app/ACMAS_Web/templates/register.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,14 +3,28 @@
{% block title %} Create an Account {% endblock %}

{% block content %}
<div class="flex flex-col mt-20">
<div class="w-full flex items-center justify-center">
<div class="p-0 flex items-center overflow-hidden relative" style="height: 85vh;">
<div class="absolute w-full h-full" style="background: linear-gradient(-45deg, #f8f8f3, #f5f2d6, #dbebf3, #c6d6f7); background-size: 300% 300%; animation: gradient 65s ease infinite;"> </div>
<div class="container mx-auto px-4 z-3 relative lg:w-6/12">
<div class="justify-center flex flex-wrap flex-col -mx-4 text-center">
<h1 class="text-5xl font-semibold text-white leading-tight -mt-8 mb-6" style="color: #327796">Register</h1>
<form method="POST" class="form-group"> {% csrf_token %}
{{ form }}
<div class="flex items-center justify-items-center justify-center mt-2">
{% component "button" text="Register" component_type="primary" value="submit" %}
<div class="flex items-center space-x-6 p-6 bg-white rounded-xl shadow-lg hover:shadow-xl transition duration-500">
<div class="flex-col flex space-y-4 w-full">
<div class="grid gap-6 md:grid-cols-2 w-full">
{% component "field" component_type="text" placeholder="Enter username..." name="username" icon_name="academic-cap" %}
{% component "field" component_type="text" placeholder="Enter email..." name="email" icon_name="academic-cap" %}
{% component "field" component_type="password" placeholder="Enter password..." name="password" icon_name="academic-cap" %}
{% component "field" component_type="password" placeholder="Confirm password..." name="password" icon_name="academic-cap" %}
</div>
</div>
<div class="mx-auto">
{% component "button" text="Register" component_type="primary" value="submit" %}
</div>
</div>
</form>
</div>
</div>
<div class="w-full absolute text-white bottom-0 z-3 "></div>
</div>
{% endblock %}
Loading

0 comments on commit 8fd9316

Please sign in to comment.