Changeset e958037 for reactapp/src


Ignore:
Timestamp:
07/30/22 20:37:52 (2 years ago)
Author:
Viktor <mlviktor23@…>
Branches:
main
Children:
5347491
Parents:
2998dc4
Message:

added styling to /professor/{professorId} page

Location:
reactapp/src
Files:
3 added
4 deleted
3 edited

Legend:

Unmodified
Added
Removed

  • reactapp/src/App.js

    r2998dc4 re958037  
    1 import { Outlet, Link, useParams } from "react-router-dom";
     1import { Outlet } from "react-router-dom";
     2import { MainWrapper, MainTitle } from "./Components/Main.style";
    23
    34export default function App() {
     5  //document.body.style = "background: red;";
    46  return (
    5     <div>
    6       <h1>profesori.mk</h1>
     7    <MainWrapper>
     8      <style>
     9        @import
     10        url('https://fonts.googleapis.com/css2?family=Roboto+Mono:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap');
     11      </style>
     12      <style>
     13        {
     14          "body { background-color: papayawhip;} * {margin: 0; padding: 0; box-sizing: border-box;}"
     15        }
     16      </style>
     17      <MainTitle>profesori.mk</MainTitle>
    718      <Outlet />
    8     </div>
     19    </MainWrapper>
    920  );
    1021}

  • reactapp/src/Components/OpinionTree.js

    r2998dc4 re958037  
     1import { OpinionCard } from "./OpinionCard.style";
     2
    13function OpinionTree({ professor }) {
    24  var renderedOpinionIds = [];
    … …  
    810    return (
    911      <div key={child.postId}>
    10         <p>{child.author.username} реплицирал</p>
     12        <p>
     13          <a href="#">{child.author.username}</a> реплицирал
     14        </p>
    1115        <p>Содржина: {child.content}</p>
    1216        {child.children.map((childOfChild) => displayChildPosts(childOfChild))}
    … …  
    2226          return (
    2327            <div key={opinion.postId}>
    24               <p>{opinion.author.username} напишал</p>
    25               <p>Наслов: {opinion.title}</p>
    26               <p>Содржина: {opinion.content}</p>
     28              <OpinionCard>
     29                <p>
     30                  <a href="#">{opinion.author.username}</a> напишал
     31                </p>
     32
     33                <p>{opinion.title}</p>
     34                <p>{opinion.content}</p>
     35                <p>{Date(opinion.timePosted)}</p>
     36              </OpinionCard>
    2737              {opinion.children.map((child) => displayChildPosts(child))}
    28               <hr />
    2938            </div>
    3039          );

  • reactapp/src/Pages/Professor.js

    r2998dc4 re958037  
    33import JSOG from "jsog";
    44import OpinionTree from "../Components/OpinionTree";
     5import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
     6import {
     7  solid,
     8  regular,
     9  brands,
     10} from "@fortawesome/fontawesome-svg-core/import.macro";
     11
     12import {
     13  ProfessorCard,
     14  ProfessorCardDetails,
     15  ProfessorCardName,
     16  ProfessorCardSeparator,
     17} from "../Components/ProfessorCard.style";
    518
    619function Professor(props) {
    … …  
    3245    return (
    3346      <div>
    34         <h2>{professor.professorName}</h2>
    35         <h3>{professor.faculty.facultyName}</h3>
    36         <h3>Мислења</h3>
     47        <ProfessorCard>
     48          <ProfessorCardName>{professor.professorName}</ProfessorCardName>
     49          <ProfessorCardSeparator />
     50          <div style={{ marginTop: "20px" }}>
     51            <ProfessorCardDetails fontSize="20px">
     52              {professor.faculty.facultyName}
     53            </ProfessorCardDetails>
     54            <ProfessorCardDetails fontSize="15px">
     55              {professor.faculty.university.universityName}
     56            </ProfessorCardDetails>
     57          </div>
     58        </ProfessorCard>
     59        <h3>{professor.relatedOpinions.length} мислења</h3>
    3760        <div className="opinionTree">
    3861          <OpinionTree professor={professor} />
Note: See TracChangeset for help on using the changeset viewer.