rzmk/learnhouse
1
0
Fork 0
mirror of https://github.com/rzmk/learnhouse.git synced 2025-12-18 20:09:25 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: add course img thumbnail preview

Browse source
This commit is contained in:
swve 2022-10-15 19:02:54 +02:00
parent c838b7e9cd
commit f492baf276
1 changed files with 21 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

21
front/pages/org/[orgslug]/courses/index.tsx
View file

@ -1,9 +1,11 @@
import Link from "next/link"; import Link from "next/link";
import { useRouter } from "next/router"; import { useRouter } from "next/router";
import React from "react"; import React from "react";
import styled from "styled-components";
import { Header } from "../../../../components/ui/header"; import { Header } from "../../../../components/ui/header";
import Layout from "../../../../components/ui/layout"; import Layout from "../../../../components/ui/layout";
import { Title } from "../../../../components/ui/styles/title"; import { Title } from "../../../../components/ui/styles/title";
import { getBackendUrl } from "../../../../services/config";
import { deleteCourseFromBackend, getOrgCourses } from "../../../../services/courses"; import { deleteCourseFromBackend, getOrgCourses } from "../../../../services/courses";
import { getOrganizationContextInfo } from "../../../../services/orgs"; import { getOrganizationContextInfo } from "../../../../services/orgs";
@ -64,7 +66,11 @@ const CoursesIndexPage = () => {
<Link href={"/org/" + orgslug + "/course/" + removeCoursePrefix(course.course_id)}> <Link href={"/org/" + orgslug + "/course/" + removeCoursePrefix(course.course_id)}>
<a> <a>
<h2>{course.name}</h2> <h2>{course.name}</h2>
<CourseWrapper>
<img src={`${getBackendUrl()}content/uploads/img/${course.thumbnail}`} alt="" />
</CourseWrapper>
</a> </a>
</Link> </Link>
<button onClick={() => deleteCourses(course.course_id)}>Delete</button> <button onClick={() => deleteCourses(course.course_id)}>Delete</button>
</div> </div>
@ -76,3 +82,18 @@ const CoursesIndexPage = () => {
}; };
export default CoursesIndexPage; export default CoursesIndexPage;
const CourseWrapper = styled.div`
display: flex;
img {
width: 269px;
height: 151px;
background: url(), #d9d9d9;
border: 1px solid rgba(255, 255, 255, 0.19);
box-shadow: 0px 13px 33px -13px rgba(0, 0, 0, 0.42);
border-radius: 7px;
}
`;