forked from AcaMate/AcaMate_Web
[✨] 서버 반영
1. 쿠키 delete 추가 2. about 페이지 v.0.1 추가
This commit is contained in:
parent
899a563aac
commit
c1fdf2773d
|
@ -1,7 +1,4 @@
|
|||
using System.Net;
|
||||
using System.Net.Http.Json;
|
||||
using Microsoft.AspNetCore.Components;
|
||||
using Microsoft.JSInterop;
|
||||
|
||||
using Front.Program.Models;
|
||||
using Front.Program.Services;
|
||||
|
|
|
@ -26,7 +26,6 @@
|
|||
</ItemGroup>
|
||||
|
||||
<ItemGroup>
|
||||
<Folder Include="Program\Models\" />
|
||||
<Folder Include="Program\ViewModels\" />
|
||||
<Folder Include="Program\Views\Academy\" />
|
||||
<Folder Include="wwwroot\Resources\" />
|
||||
|
|
|
@ -24,7 +24,7 @@
|
|||
<div class="min-h-screen flex flex-col bg-gray-50 text-gray-900">
|
||||
|
||||
<!-- Top 영역 -->
|
||||
<TopBanner />
|
||||
@* <TopBanner /> *@
|
||||
<TopNav />
|
||||
|
||||
<!-- 본문 영역 -->
|
||||
|
@ -36,7 +36,8 @@
|
|||
@* </div> *@
|
||||
|
||||
<!-- 본문 컨텐츠 -->
|
||||
<main class="flex-1 p-4 sm:p-6 md:p-8">
|
||||
@* <main class="flex-1 p-4 sm:p-6 md:p-8"> *@
|
||||
<main class="flex-1">
|
||||
@Body
|
||||
</main>
|
||||
</div>
|
||||
|
|
|
@ -21,4 +21,9 @@ public class CookieService
|
|||
{
|
||||
return await _js.InvokeAsync<string>("getCookie", key);
|
||||
}
|
||||
|
||||
public async Task DeleteCookieAsync(string key)
|
||||
{
|
||||
await _js.InvokeVoidAsync("deleteCookie", key);
|
||||
}
|
||||
}
|
|
@ -1,16 +1,136 @@
|
|||
@page "/about"
|
||||
|
||||
<div class="bg-blue-500 text-white p-4">
|
||||
<h2 class="text-2xl font-bold">About Us</h2>
|
||||
<p class="mt-2">We are a team of passionate developers.</p>
|
||||
<p>이건 그냥 일반 텍스트야</p>
|
||||
|
||||
@* 클릭시 onClick 이벤트 발생 *@
|
||||
|
||||
|
||||
<button class="bg-blue-700 text-white px-4 py-2 rounded hover:bg-blue-800"
|
||||
@onclick="OnClickEvent">
|
||||
Click Me
|
||||
</button>
|
||||
|
||||
</div>
|
||||
@* <div class="bg-blue-500 text-white p-4"> *@
|
||||
@* <h2 class="text-2xl font-bold">About Us</h2> *@
|
||||
@* <p class="mt-2">We are a team of passionate developers.</p> *@
|
||||
@* <p>이건 그냥 일반 텍스트텍스트텍스트텍스트텍스트</p> *@
|
||||
@* *@
|
||||
@* $1$ 클릭시 onClick 이벤트 발생 #1# *@
|
||||
@* *@
|
||||
@* *@
|
||||
@* <button class="bg-blue-700 text-white px-4 py-2 rounded hover:bg-blue-800" *@
|
||||
@* @onclick="OnClickEvent"> *@
|
||||
@* Click Me *@
|
||||
@* </button> *@
|
||||
@* *@
|
||||
@* </div> *@
|
||||
|
||||
@* <html> *@
|
||||
@* <head> *@
|
||||
@* <link rel="preconnect" href="https://fonts.gstatic.com/" crossorigin="" /> *@
|
||||
@* <link *@
|
||||
@* rel="stylesheet" *@
|
||||
@* as="style" *@
|
||||
@* onload="this.rel='stylesheet'" *@
|
||||
@* href="https://fonts.googleapis.com/css2?display=swap&family=Noto+Sans%3Awght%40400%3B500%3B700%3B900&family=Plus+Jakarta+Sans%3Awght%40400%3B500%3B700%3B800" *@
|
||||
@* /> *@
|
||||
@* *@
|
||||
@* <title>Stitch Design</title> *@
|
||||
@* <link rel="icon" type="image/x-icon" href="data:image/x-icon;base64," /> *@
|
||||
@* *@
|
||||
@* <script src="https://cdn.tailwindcss.com?plugins=forms,container-queries"></script> *@
|
||||
@* </head> *@
|
||||
|
||||
@* <body> *@
|
||||
<div class="relative flex size-full min-h-screen flex-col bg-white group/design-root overflow-x-hidden" style='font-family: "Plus Jakarta Sans", "Noto Sans", sans-serif;'>
|
||||
<div class="layout-container flex h-full grow flex-col">
|
||||
<div class="flex flex-1 justify-center">
|
||||
<div class="layout-content-container flex flex-col max-w-[960px] flex-1">
|
||||
<div class="container">
|
||||
<div class="[480px]:p-4">
|
||||
<div
|
||||
class="flex min-h-[480px] flex-col gap-6 bg-cover bg-center bg-no-repeat [480px]:gap-8 [480px]:rounded-lg items-start justify-end px-4 pb-10 [480px]:px-10"
|
||||
style='background-image: linear-gradient(rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.4) 100%), url("https://lh3.googleusercontent.com/aida-public/AB6AXuDffY0eohqZnXKdWwIoiHloiYxZ1igyaJWtn7zdpfeze7pDhQuxV3MqvGueO1m-a38SDlXVEZUkd8es8cB8YvKHf8J-FIzTPFEHU4UnTNRBnX0XGv0EoZGrutA0kHnI_IA0k0SLtlU7NUK_7EcLabUHzALRgVZhcP98Bd-2GZl85-6ODqSHpe11pHXpyMz3RDDEzhDuHAwBBfJJaJG7zFC22X8Cc0K_V97Vf7jXfs-WYJ5CCrKAE3JpT2RUbdEJfiJHOkDh9yGWU1TB");'
|
||||
>
|
||||
<div class="flex flex-col gap-2 text-left">
|
||||
<h1
|
||||
class="text-white text-4xl font-black leading-tight tracking-[-0.033em] [480px]:text-5xl [480px]:font-black [480px]:leading-tight [480px]:tracking-[-0.033em] outline-none"
|
||||
>
|
||||
Empowering Education, Together
|
||||
</h1>
|
||||
<h2 class="text-white text-sm font-normal leading-normal [480px]:text-base [480px]:font-normal [480px]:leading-normal">
|
||||
AcaMate is your all-in-one platform for managing your academy, connecting with parents, and supporting student success.
|
||||
</h2>
|
||||
</div>
|
||||
<button
|
||||
class="flex min-w-[84px] max-w-[480px] cursor-pointer items-center justify-center overflow-hidden rounded-lg h-10 px-4 [480px]:h-12 [480px]:px-5 bg-[#0c7ff2] text-white text-sm font-bold leading-normal tracking-[0.015em] [480px]:text-base [480px]:font-bold [480px]:leading-normal [480px]:tracking-[0.015em]"
|
||||
>
|
||||
<span class="truncate">Get Started</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-col gap-10 px-4 py-10 container">
|
||||
<div class="flex flex-col gap-4">
|
||||
<h1
|
||||
class="text-[#111418] tracking-light text-[32px] font-bold leading-tight [480px]:text-4xl [480px]:font-black [480px]:leading-tight [480px]:tracking-[-0.033em] max-w-[720px]"
|
||||
>
|
||||
Streamline Your Academy Management
|
||||
</h1>
|
||||
<p class="text-[#111418] text-base font-normal leading-normal max-w-[720px]">
|
||||
AcaMate offers a comprehensive suite of tools designed to simplify administrative tasks, enhance communication, and foster a collaborative learning environment.
|
||||
</p>
|
||||
</div>
|
||||
<div class="grid grid-cols-[repeat(auto-fit,minmax(158px,1fr))] gap-3 p-0">
|
||||
<div class="flex flex-1 gap-3 rounded-lg border border-[#dbe0e6] bg-white p-4 flex-col">
|
||||
<div class="text-[#111418]" data-icon="Users" data-size="24px" data-weight="regular">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" fill="currentColor" viewBox="0 0 256 256">
|
||||
<path
|
||||
d="M117.25,157.92a60,60,0,1,0-66.5,0A95.83,95.83,0,0,0,3.53,195.63a8,8,0,1,0,13.4,8.74,80,80,0,0,1,134.14,0,8,8,0,0,0,13.4-8.74A95.83,95.83,0,0,0,117.25,157.92ZM40,108a44,44,0,1,1,44,44A44.05,44.05,0,0,1,40,108Zm210.14,98.7a8,8,0,0,1-11.07-2.33A79.83,79.83,0,0,0,172,168a8,8,0,0,1,0-16,44,44,0,1,0-16.34-84.87,8,8,0,1,1-5.94-14.85,60,60,0,0,1,55.53,105.64,95.83,95.83,0,0,1,47.22,37.71A8,8,0,0,1,250.14,206.7Z"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="flex flex-col gap-1">
|
||||
<h2 class="text-[#111418] text-base font-bold leading-tight">Manage Users</h2>
|
||||
<p class="text-[#60758a] text-sm font-normal leading-normal">
|
||||
Easily manage students, teachers, and administrators with intuitive user profiles and access controls.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-1 gap-3 rounded-lg border border-[#dbe0e6] bg-white p-4 flex-col">
|
||||
<div class="text-[#111418]" data-icon="Calendar" data-size="24px" data-weight="regular">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" fill="currentColor" viewBox="0 0 256 256">
|
||||
<path
|
||||
d="M208,32H184V24a8,8,0,0,0-16,0v8H88V24a8,8,0,0,0-16,0v8H48A16,16,0,0,0,32,48V208a16,16,0,0,0,16,16H208a16,16,0,0,0,16-16V48A16,16,0,0,0,208,32ZM72,48v8a8,8,0,0,0,16,0V48h80v8a8,8,0,0,0,16,0V48h24V80H48V48ZM208,208H48V96H208V208Zm-96-88v64a8,8,0,0,1-16,0V132.94l-4.42,2.22a8,8,0,0,1-7.16-14.32l16-8A8,8,0,0,1,112,120Zm59.16,30.45L152,176h16a8,8,0,0,1,0,16H136a8,8,0,0,1-6.4-12.8l28.78-38.37A8,8,0,1,0,145.07,132a8,8,0,1,1-13.85-8A24,24,0,0,1,176,136,23.76,23.76,0,0,1,171.16,150.45Z"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="flex flex-col gap-1">
|
||||
<h2 class="text-[#111418] text-base font-bold leading-tight">Schedule Classes</h2>
|
||||
<p class="text-[#60758a] text-sm font-normal leading-normal">Organize and schedule classes, workshops, and events with a user-friendly calendar interface.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="flex flex-1 gap-3 rounded-lg border border-[#dbe0e6] bg-white p-4 flex-col">
|
||||
<div class="text-[#111418]" data-icon="Presentation" data-size="24px" data-weight="regular">
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" fill="currentColor" viewBox="0 0 256 256">
|
||||
<path
|
||||
d="M216,40H136V24a8,8,0,0,0-16,0V40H40A16,16,0,0,0,24,56V176a16,16,0,0,0,16,16H79.36L57.75,219a8,8,0,0,0,12.5,10l29.59-37h56.32l29.59,37a8,8,0,1,0,12.5-10l-21.61-27H216a16,16,0,0,0,16-16V56A16,16,0,0,0,216,40Zm0,136H40V56H216V176Z"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
<div class="flex flex-col gap-1">
|
||||
<h2 class="text-[#111418] text-base font-bold leading-tight">Track Progress</h2>
|
||||
<p class="text-[#60758a] text-sm font-normal leading-normal">Monitor student performance, attendance, and assignments to ensure academic success.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<footer class="flex justify-center">
|
||||
<div class="flex max-w-[960px] flex-1 flex-col">
|
||||
<footer class="flex flex-col gap-6 px-5 py-10 text-center container">
|
||||
<div class="flex flex-wrap items-center justify-center gap-6 [480px]:flex-row [480px]:justify-around">
|
||||
<a class="text-[#60758a] text-base font-normal leading-normal min-w-40" href="#">Terms of Service</a>
|
||||
<a class="text-[#60758a] text-base font-normal leading-normal min-w-40" href="#">Privacy Policy</a>
|
||||
<a class="text-[#60758a] text-base font-normal leading-normal min-w-40" href="#">Contact Us</a>
|
||||
</div>
|
||||
<p class="text-[#60758a] text-base font-normal leading-normal">© 2024 AcaMate. All rights reserved.</p>
|
||||
</footer>
|
||||
</div>
|
||||
</footer>
|
||||
</div>
|
||||
</div>
|
||||
@* </body> *@
|
||||
@* </html> *@
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
using Microsoft.AspNetCore.Components;
|
||||
using Front.Program.Services;
|
||||
|
||||
namespace Front.Program.Views.Project;
|
||||
|
||||
|
@ -6,10 +7,10 @@ public partial class About : ComponentBase
|
|||
{
|
||||
[Inject]
|
||||
NavigationManager NavigationManager { get; set; } = default!;
|
||||
|
||||
private void OnClickEvent()
|
||||
private async Task OnClickEvent()
|
||||
{
|
||||
// NavigationManager.NavigateTo("/redirectpage");
|
||||
Console.WriteLine("Redirecting to redirect page");
|
||||
|
||||
}
|
||||
}
|
|
@ -1,12 +1,15 @@
|
|||
using Microsoft.AspNetCore.Components;
|
||||
using Microsoft.JSInterop;
|
||||
|
||||
namespace Front.Program.Views.Project;
|
||||
|
||||
public partial class Auth : ComponentBase
|
||||
{
|
||||
[Inject] NavigationManager NavigationManager { get; set; } = default!;
|
||||
[Inject] IJSRuntime JS { get; set; } = default!;
|
||||
void KakaoLogin()
|
||||
{
|
||||
// await JS
|
||||
// Redirect to Kakao login page
|
||||
NavigationManager.NavigateTo("/api/v1/in/user/kakao/auth", true);
|
||||
}
|
||||
|
|
|
@ -1,8 +1,5 @@
|
|||
@* <div class="flex items-center p-4 bg-second-darker shadow"> *@
|
||||
@* $1$ 이동하는 거 말고 그냥 일반 텍스트 넣을거야 #1# *@
|
||||
@* <img src="/logo.png" alt="Icon" class="w-8 h-8 mr-0 absolute left-4 top-1/2 transform -translate-y-1/2"> *@
|
||||
@* <h3 class="flex-1 text-center text-normal-normal pl-12">일반 텍스트 작성</h3> *@
|
||||
@* </div> *@
|
||||
|
||||
|
||||
|
||||
<div class="relative bg-second-darker shadow p-4 flex items-center justify-center">
|
||||
<!-- 왼쪽 아이콘 -->
|
||||
|
|
|
@ -1,11 +1,18 @@
|
|||
<div class="flex justify-end items-center p-4 bg-white shadow">
|
||||
<a href="#about" class="mx-2 text-gray-700 hover:text-blue-600">About</a>
|
||||
<a href="#join" class="mx-2 text-gray-700 hover:text-blue-600">Join</a>
|
||||
<a href="#notice" class="mx-2 text-gray-700 hover:text-blue-600">What’s New</a>
|
||||
|
||||
<button class="ml-4 px-4 py-2 bg-red-600 text-white rounded hover:bg-blue-700"
|
||||
@onclick="OnClickLogin">
|
||||
Login
|
||||
</button>
|
||||
|
||||
<div class="flex items-center justify-between whitespace-nowrap border-b border-solid border-b-[#f0f2f5] py-4 bg-white">
|
||||
<div class="flex items-center gap-4 text-[#111418] ml-4">
|
||||
<img src="/logo.png" alt="Icon" class="w-8 h-8">
|
||||
<h2 class="text-[#111418] text-lg font-bold leading-tight tracking-[-0.015em]">AcaMate</h2>
|
||||
</div>
|
||||
|
||||
<div class="flex flex-1 justify-end gap-8">
|
||||
<div class="flex items-center gap-9">
|
||||
<a class=" text-text-title font-medium leading-normal hover:text-blue-800" href="#">About</a>
|
||||
<a class="text-text-title font-medium leading-normal hover:text-blue-800" href="#">Join</a>
|
||||
<a class="text-text-title font-medium leading-normal hover:text-blue-800" href="#">What's New</a>
|
||||
</div>
|
||||
<button class="flex min-w-[84px] max-w-[480px] cursor-pointer items-center justify-center overflow-hidden rounded-lg h-10 px-4 bg-blue-500 hover:bg-blue-800 text-white text-sm font-bold leading-normal tracking-[0.015em] mr-4"
|
||||
@onclick= "OnClickLogin">
|
||||
<span class="truncate">Get Started</span>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
|
@ -10,8 +10,8 @@ public partial class TopNav : ComponentBase
|
|||
|
||||
public void OnClickLogin()
|
||||
{
|
||||
NavigationManager.NavigateTo("/auth");
|
||||
// Console.WriteLine("Redirecting to redirect page");
|
||||
// NavigationManager.NavigateTo("/auth");
|
||||
Console.WriteLine("Clicked Login Button");
|
||||
}
|
||||
|
||||
}
|
11
package.json
11
package.json
|
@ -2,12 +2,21 @@
|
|||
"name": "tailwind-blazor-template",
|
||||
"version": "1.0.0",
|
||||
"scripts": {
|
||||
"watch:css": "tailwindcss -i ./wwwroot/css/app.css -o ./wwwroot/css/tailwind.css --watch",
|
||||
"build:css": "tailwindcss -i ./wwwroot/css/app.css -o ./wwwroot/css/tailwind.css --minify",
|
||||
"watch:css": "tailwindcss -i ./wwwroot/css/app.css -o ./wwwroot/css/tailwind.css --watch"
|
||||
"build:publish": "rm -rf ./publish && /Users/tanine/.dotnet/dotnet publish -c Debug -o ./publish",
|
||||
"build:test": "rm -rf ../AcaMate_API/publish/debug/ && /Users/tanine/.dotnet/dotnet publish -c Debug -o ../AcaMate_API/publish/debug",
|
||||
"build:copy": "mkdir -p ../AcaMate_API/publish/debug/wwwroot && cp -r ./publish/wwwroot/* ../AcaMate_API/publish/debug/wwwroot"
|
||||
},
|
||||
|
||||
"devDependencies": {
|
||||
"tailwindcss": "^3.4.1",
|
||||
"postcss": "^8.4.21",
|
||||
"autoprefixer": "^10.4.14"
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -65,6 +65,9 @@
|
|||
}
|
||||
document.cookie = name + "=" + (value || "") + expires + "; path=/";
|
||||
};
|
||||
window.deleteCookie = function (name) {
|
||||
document.cookie = name + '=; Max-Age=-99999999;';
|
||||
};
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
Loading…
Reference in New Issue
Block a user