-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
header dice, blog section, client section, markdown blog
- Loading branch information
Showing
39 changed files
with
1,955 additions
and
352 deletions.
There are no files selected for viewing
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,32 @@ | ||
| import React, { useEffect, useState } from "react"; | ||
| import { BsFillArrowUpCircleFill } from "react-icons/bs"; | ||
| const ArrowUpIcon = () => { | ||
| const [showButton, setShowButton] = useState(false); | ||
|
|
||
| useEffect(() => { | ||
| // window.scrollTo({ top: 0, left: 0, behavior: "smooth" }); | ||
| const handleVisibility = () => { | ||
| window.pageYOffset > 400 ? setShowButton(true) : setShowButton(false); | ||
| }; | ||
| window.addEventListener("scroll", handleVisibility); | ||
| return () => { | ||
| window.removeEventListener("scroll", handleVisibility); | ||
| }; | ||
| }, []); | ||
| return ( | ||
| <> | ||
| {showButton && ( | ||
| <div | ||
| className="arrowUpIcon" | ||
| onClick={() => { | ||
| window.scrollTo({ top: 0, left: 0, behavior: "smooth" }); | ||
| }} | ||
| > | ||
| <BsFillArrowUpCircleFill /> | ||
| </div> | ||
| )} | ||
| </> | ||
| ); | ||
| }; | ||
|
|
||
| export default ArrowUpIcon; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,67 @@ | ||
| import React from "react"; | ||
| import ai from "../../assets/aii.jpg"; | ||
| import livee from "../../assets/livee.jpg"; | ||
| import render from "../../assets/3199.jpg"; | ||
| import transcoding from "../../assets/transcoding.jpg"; | ||
| import { Link } from "@remix-run/react"; | ||
| const blogSection = () => { | ||
| return ( | ||
| <div className="blog web-align"> | ||
| <h1>Blog</h1> | ||
| <div className="blog_section"> | ||
| <Link className="link blog_card" to="/blog/ai"> | ||
| <div className="blog_card_img"> | ||
| <img src={ai} alt="banner" /> | ||
| </div> | ||
| <div className="blog_card_content"> | ||
| <span>May 30, 2022</span> | ||
| <h3>AI with Distributed Learning</h3> | ||
| <p> | ||
| When building machine learning models, we often come across tasks | ||
| that would be more efficient and effective if they could be | ||
| parallelized. | ||
| </p> | ||
| </div> | ||
| </Link> | ||
| <Link className="link blog_card" to="/blog/homomorphic_encryption"> | ||
| <div className="blog_card_img"> | ||
| <img src={livee} alt="" /> | ||
| </div> | ||
| <div className="blog_card_content"> | ||
| <span>June 26, 2022</span> | ||
| <h3>Homomorphic Encryption for secure training</h3> | ||
| </div> | ||
| </Link> | ||
| <Link className="link blog_card" to="/blog/render"> | ||
| <div className="blog_card_img"> | ||
| <img src={render} alt="" /> | ||
| </div> | ||
| <div className="blog_card_content"> | ||
| <span>May 23, 2022</span> | ||
| <h3>0% lost time</h3> | ||
| </div> | ||
| </Link> | ||
| <Link className="link blog_card" to="/blog/transcode"> | ||
| <div className="blog_card_img"> | ||
| <img src={transcoding} alt="" /> | ||
| </div> | ||
| <div className="blog_card_content"> | ||
| <span>May 16, 2022</span> | ||
| <h3>Transcoding up to 1080p /w Video Delivery</h3> | ||
| </div> | ||
| </Link> | ||
| <Link className=" link blog_card" to="/blog/live"> | ||
| <div className="blog_card_img"> | ||
| <img src={livee} alt="" /> | ||
| </div> | ||
| <div className="blog_card_content"> | ||
| <span>May 9, 2022</span> | ||
| <h3>Live Streaming with OBS+RTMP</h3> | ||
| </div> | ||
| </Link> | ||
| </div> | ||
| </div> | ||
| ); | ||
| }; | ||
|
|
||
| export default blogSection; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,105 @@ | ||
| .blog { | ||
| margin-top: 40px; | ||
| } | ||
| .blog h1 { | ||
| text-align: center; | ||
| margin-bottom: 30px; | ||
| color: #252939; | ||
| } | ||
| .blog_section { | ||
| display: grid; | ||
| grid-template-rows: repeat(4, minmax(0, 1fr)); | ||
| grid-template-columns: repeat(2, minmax(0, 1fr)); | ||
| gap: 2rem; | ||
| } | ||
| .blog_section a:first-child { | ||
| grid-row: 1/-1; | ||
| flex-direction: column; | ||
| } | ||
| .blog_section a:first-child .blog_card_img img { | ||
| height: 200px; | ||
| width: 100%; | ||
| } | ||
| .blog_section a:first-child h3 { | ||
| font-size: 32px; | ||
| } | ||
| .blog_section a:first-child span { | ||
| margin-top: 10px; | ||
| } | ||
| .blog_card { | ||
| border: 1px solid #e0e5eb; | ||
| border-radius: 0.5rem; | ||
| padding: 1.25rem; | ||
| transition: all 0.3s ease-in-out; | ||
| display: flex; | ||
| gap: 1.5rem; | ||
| } | ||
| .blog_card:hover { | ||
| cursor: pointer; | ||
| border: 1px solid transparent; | ||
| box-shadow: 0px 2px 10px rgba(20, 26, 31, 0.15); | ||
| } | ||
| .blog_card:hover h3 { | ||
| color: #0073e6; | ||
| } | ||
| .blog_card_img { | ||
| flex: 2; | ||
| } | ||
| .blog_card_img img { | ||
| width: 100%; | ||
| height: 100%; | ||
| object-fit: cover; | ||
| border-radius: 0.5rem; | ||
| } | ||
| .blog_card_content { | ||
| flex: 4; | ||
| } | ||
| .blog_card_content span { | ||
| color: #6c7993; | ||
| font-weight: 400; | ||
| margin-bottom: 10px; | ||
| display: block; | ||
| } | ||
| @media screen and (max-width: 1100px) { | ||
| .blog_section { | ||
| grid-template-columns: repeat(1, minmax(0, 1fr)); | ||
| } | ||
| .blog_section a:first-child { | ||
| grid-row: unset; | ||
| flex-direction: row; | ||
| } | ||
| .blog_section a:first-child .blog_card_img img { | ||
| height: 100px; | ||
| } | ||
| .blog_section a:first-child h3 { | ||
| font-size: 18px; | ||
| } | ||
| .blog_card_img { | ||
| flex: 1; | ||
| } | ||
| .blog_card_img img { | ||
| height: 100px; | ||
| } | ||
| .blog_card_content { | ||
| flex: 3; | ||
| } | ||
| .blog_card_content p { | ||
| display: none; | ||
| } | ||
| } | ||
| @media screen and (max-width: 630px) { | ||
| .blog_card { | ||
| flex-direction: column; | ||
| } | ||
| .blog_section a:first-child { | ||
| flex-direction: column; | ||
| } | ||
| .blog_card_content { | ||
| flex: unset; | ||
| } | ||
| } | ||
|
|
||
| .link { | ||
| color: inherit; | ||
| text-decoration: none; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,42 @@ | ||
| .client { | ||
| margin-top: 60px; | ||
| background: #f6f6f7; | ||
| padding: 30px 0 40px 0; | ||
| } | ||
|
|
||
| .client h1 { | ||
| text-align: center; | ||
| color: #252939; | ||
| margin-bottom: 20px; | ||
| } | ||
| .client-container { | ||
| display: grid; | ||
| grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); | ||
| gap: 1.5rem; | ||
| } | ||
| .client-card { | ||
| box-shadow: 0px 2px 10px rgba(20, 26, 31, 0.15); | ||
| padding: 1.5rem; | ||
| border-radius: 0.5rem; | ||
| background-color: white; | ||
| } | ||
| .client-card__img img { | ||
| width: 60px; | ||
| } | ||
| .client-card__text { | ||
| margin: 1rem 0; | ||
| padding-bottom: 0.5rem; | ||
| border-bottom: 1px solid #e5e7eb; | ||
| } | ||
| .client-card__footer { | ||
| display: flex; | ||
| gap: 10px; | ||
| } | ||
| .client-card__footer a { | ||
| color: rgb(0, 115, 230); | ||
| text-decoration: none; | ||
| line-height: 1; | ||
| text-transform: uppercase; | ||
| font-weight: 700; | ||
| font-size: 14px; | ||
| } |
Oops, something went wrong.