wood/CoverView
1
0
Fork 0
mirror of https://github.com/woodchen-ink/CoverView.git synced 2025-07-18 05:51:56 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: add faqs about coverview

Browse Source
This commit is contained in:
rutik wankhade 2022-07-21 17:07:59 +05:30
parent e8ac7f73dc
commit a4ba942c6f
3 changed files with 75 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
src/components/Editor.js
View File

@ -5,8 +5,7 @@ import Select from 'react-select';
import RandomTheme from './RandomTheme';
// import resetIcon from '../assets/icons/reset.svg'
import { ImgProvider } from '../utils/ImgContext'
import logo from '../assets/icons/logo.png'
import { Link } from "react-router-dom";
import Header from "./Header";
const defaultSettings = {
title: "How I built my first project with react",
@ -29,7 +28,6 @@ const devIconsUrl = "https://raw.githubusercontent.com/devicons/devicon/master/d
// { value: 'javascript', label: 'Javascript' },
// { value: 'python', label: 'Python' },
// ]
const tweetText = encodeURIComponent(`type your thoughts here, Try https://coverview.vercel.app by @WankhadeRutik`)
class Editor extends React.Component {
@ -66,23 +64,7 @@ class Editor extends React.Component {
render() {
return (
<div>
<div className="text-xl bg-white flex border-b border-gray-100 shadow-xl p-2">
<Link to="/" className="flex items-center">
<img src={logo} alt="logo" className="w-8 h-8 mx-4" />
<h1 className="font-semibold">Coverview</h1>
</Link>
<div className="ml-auto mr-4 ">
<Link to="/faq" className="text-gray-700 hover:text-gray-800 text-base font-Nunito mx-4">How to use</Link>
<a href="https://www.buymeacoffee.com/rutikwankhade" target="_blank" rel="noreferrer" className="text-base mx-2 font-Nunito">🥤 Buy me a coffee</a>
<a href={`https://twitter.com/intent/tweet?text=${tweetText}`} className="mx-2 bg-blue-400 text-sm rounded-full px-4 font-semibold text-white p-1">Share on Twitter</a>
</div>
</div>
<Header />
<ImgProvider>

50
src/components/Faq.js
View File

@ -1,11 +1,51 @@
import React from 'react';
import Header from './Header';
const Faq = () => {
return (
return (
<div>
faq
<Header />
<div className=" md:w-10/12 mx-auto p-20 ">
<h1 className="font-bold text-4xl font-Anek text-center">Frequently asked questions</h1>
<div className="flex flex-wrap justify-center mt-20 font-Inter">
<div className="w-5/12 m-4 ">
<p className="text-xl font-bold py-2">What is Coverview?</p>
<p className="text-lg text-gray-700">Coverview is a tool to create cover images for your blogs quickly and easily.</p>
</div>
<div className="w-5/12 m-4">
<p className="text-xl font-bold py-2">Is Coverview free?</p>
<p className="text-lg text-gray-700">Yes! Coverview is absolutely free to use.</p>
</div>
<div className="w-5/12 m-4">
<p className="text-xl font-bold py-2">Can I upload my custom brand logo?</p>
<p className="text-lg text-gray-700">Yes.Just search and select <span className="font-semibold">custom</span> in icon section and you can upload your own logo to personalize your cover images.</p>
<p className="italic mt-2">See <a href="https://twitter.com/WankhadeRutik/status/1518270774335111168?s=20&t=XMjbJpGAC7anadJ690_DUg" className="text-blue-400" target="_blank" rel="noreferrer">example</a></p>
</div>
<div className="w-5/12 m-4">
<p className="text-xl font-bold my-2">Can I use coverview for non-technical/personal blogs?</p>
<p className="text-lg text-gray-700">Yes! Why not? Even though coverview was built with technical blogs in mind, you can still use it for your personal blogs. Check out the stylish theme for more.</p>
</div>
<div className="w-5/12 m-4">
<p className="text-xl font-bold my-2">Why use Coverview?</p>
<p className="text-lg text-gray-700">Because it's simple, quick and easy to use. Why spend hours designing when you can create cover images in seconds?</p>
</div>
<div className="w-5/12 m-4">
<p className="text-xl font-bold my-2">Want to support/sponsor the project?</p>
<p className="text-lg text-gray-700">If coverview adds value in your life and you wish to support this project, you can <a href="https://github.com/sponsors/rutikwankhade" target="_blank" rel="noreferrer" className="font-semibold hover:underline">sponsor me on Github</a> or <a href="https://www.buymeacoffee.com/rutikwankhade" target="_blank" rel="noreferrer" className="hover:underline text-pink-400 font-semibold">buy me a coffee</a>.</p>
</div>
</div>
</div>
</div>
);
);
}
export default Faq;

28
src/components/Header.js Normal file
View File

@ -0,0 +1,28 @@
import React from 'react';
import { Link } from 'react-router-dom'
import logo from '../assets/icons/logo.png'
const Header = () => {
const tweetText = encodeURIComponent(`type your thoughts here, Try https://coverview.vercel.app by @WankhadeRutik`)
return (
<div className="text-xl bg-white flex border-b border-gray-100 p-2">
<Link to="/" className="flex items-center">
<img src={logo} alt="logo" className="w-8 h-8 mx-4" />
<h1 className="font-semibold">Coverview</h1>
</Link>
<div className="ml-auto mr-4 ">
<Link to="/faq" className="text-gray-700 hover:text-gray-800 text-base font-Nunito mx-4">How to use</Link>
<a href="https://www.buymeacoffee.com/rutikwankhade" target="_blank" rel="noreferrer" className="text-base mx-2 font-Nunito">🥤 Buy me a coffee</a>
<a href={`https://twitter.com/intent/tweet?text=${tweetText}`} className="mx-2 bg-blue-400 text-sm rounded-full px-4 font-semibold text-white p-1">Share on Twitter</a>
</div>
</div>
);
}
export default Header;