The website was updated a bit again
This commit is contained in:
parent
b96eea3665
commit
f6b53e83de
0
components/feedback.js
Normal file
0
components/feedback.js
Normal file
|
@ -2,17 +2,19 @@ import styles from '../styles/Privacy.module.css'
|
||||||
|
|
||||||
export default function Privacy() {
|
export default function Privacy() {
|
||||||
return (
|
return (
|
||||||
<div className={styles.Privacy}>
|
<div className={styles.ScrollBox}>
|
||||||
<h1>Welcome to TheRed.SH!</h1>
|
<div className={styles.Privacy}>
|
||||||
<h3>TheRed.SH is a self-hosted site made by TheRed. Due to potential for concerned users to arise, we have made a privacy policy in order to notify these users.</h3>
|
<h1>Welcome to TheRed.SH!</h1>
|
||||||
<hr style={{color:"white", borderRadius:"10px", padding:"2px",backgroundColor:"white",border:"0px white solid"}}/>
|
<h3>TheRed.SH is a self-hosted site made by TheRed. Due to potential for concerned users to arise, we have made a privacy policy in order to notify these users.</h3>
|
||||||
<h3>We, in no way, track you or spy on you. We may only collect this information if you abuse our system, however, you can't be identified:</h3>
|
<hr style={{color:"white", borderRadius:"10px", padding:"2px",backgroundColor:"white",border:"0px white solid"}}/>
|
||||||
<h3 style={{lineHeight:"1"}}>᛫ Your IP address</h3>
|
<h3>We, in no way, track you or spy on you. We may only collect this information if you abuse our system, however, you can't be identified:</h3>
|
||||||
<h3 style={{lineHeight:"1"}}>᛫ Timestamp</h3>
|
<h3 style={{lineHeight:"1"}}>᛫ Your IP address</h3>
|
||||||
<h3 style={{lineHeight:"1"}}>᛫ Request Method</h3>
|
<h3 style={{lineHeight:"1"}}>᛫ Timestamp</h3>
|
||||||
<h3 style={{lineHeight:"1"}}>᛫ Status Code</h3>
|
<h3 style={{lineHeight:"1"}}>᛫ Request Method</h3>
|
||||||
<h3 style={{lineHeight:"1"}}>᛫ Traffic Usage</h3>
|
<h3 style={{lineHeight:"1"}}>᛫ Status Code</h3>
|
||||||
<h3 style={{lineHeight:"1"}}>᛫ Queries</h3>
|
<h3 style={{lineHeight:"1"}}>᛫ Traffic Usage</h3>
|
||||||
|
<h3 style={{lineHeight:"1"}}>᛫ Queries</h3>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
|
@ -3,6 +3,9 @@ import styles from '../styles/Sticker.module.css'
|
||||||
export default function Sticker(props) {
|
export default function Sticker(props) {
|
||||||
return (
|
return (
|
||||||
<div className={styles.Sticker} style={{color: props.txtColor ?? '#ffffff', backgroundColor: props.bgColor ?? 'rgba(36, 36, 49, 0.7)', scale: '1', ...props.style}}>
|
<div className={styles.Sticker} style={{color: props.txtColor ?? '#ffffff', backgroundColor: props.bgColor ?? 'rgba(36, 36, 49, 0.7)', scale: '1', ...props.style}}>
|
||||||
|
<script>
|
||||||
|
|
||||||
|
</script>
|
||||||
{props.children}
|
{props.children}
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
|
|
7
components/textbox.js
Normal file
7
components/textbox.js
Normal file
|
@ -0,0 +1,7 @@
|
||||||
|
import styles from '../styles/Textbox.module.css'
|
||||||
|
|
||||||
|
export default function Textbox(props) {
|
||||||
|
return (
|
||||||
|
<input className={styles.Textbox} type={props.type ?? 'text'} style={{width: props.width ?? '200px', ...props.style}} placeholder={props.placeholder ?? 'Type anything here!'}></input>
|
||||||
|
)
|
||||||
|
}
|
|
@ -6,6 +6,7 @@ import Navbar from '../components/navbar'
|
||||||
import TrianglesBG from '../components/trianglesbg'
|
import TrianglesBG from '../components/trianglesbg'
|
||||||
import Alert from '../components/alert'
|
import Alert from '../components/alert'
|
||||||
import Sticker from '../components/sticker'
|
import Sticker from '../components/sticker'
|
||||||
|
import Textbox from '../components/textbox'
|
||||||
|
|
||||||
export default function Home() {
|
export default function Home() {
|
||||||
return (
|
return (
|
||||||
|
@ -19,7 +20,8 @@ export default function Home() {
|
||||||
</div>
|
</div>
|
||||||
<TrianglesBG />
|
<TrianglesBG />
|
||||||
<Alert />
|
<Alert />
|
||||||
<Sticker style={{top: '80px', right: '20px'}}>Hello there! This is a sticker!<br/>Here, you can stick anything!<br/>This works pretty well imo<br/></Sticker>
|
<Sticker style={{top: '80px', right: '20px'}}>Hello there! I'm a sticker!<br/>This is just a simple demo.<br/>A much more finished website will be coming soon!</Sticker>
|
||||||
|
<Textbox width="50vw" placeholder="Send anything to me here! (Currently not working)" style={{margin: 'auto', marginTop: '30px', display: 'block', marginBottom: '60px'}}/>
|
||||||
</>
|
</>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
@ -6,7 +6,7 @@ export default function Projects() {
|
||||||
return <><title>TheRed.SH / Projects</title><div className={styles.Box}>
|
return <><title>TheRed.SH / Projects</title><div className={styles.Box}>
|
||||||
<Redirect page="home"/>
|
<Redirect page="home"/>
|
||||||
<div className={styles.ScrollBox}>
|
<div className={styles.ScrollBox}>
|
||||||
<h1 className={styles.Header}>Here are all of my projects:</h1>
|
<h1 className={styles.Header}>Here are all of my projects (Only a demo, none of the buttons work):</h1>
|
||||||
<div className={styles.Project}>
|
<div className={styles.Project}>
|
||||||
<h1 className={styles.ProjectHeader}>
|
<h1 className={styles.ProjectHeader}>
|
||||||
Chatsy
|
Chatsy
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
.NavBarBackbone {
|
.NavBarBackbone {
|
||||||
background-color: rgba(0,0,0,0.1);
|
background-color: rgba(0,0,0,0.1);
|
||||||
border-bottom: 2px solid #3b3b58;
|
border-bottom: 2px solid #ddd;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 41px;
|
height: 41px;
|
||||||
z-index: 0;
|
z-index: 0;
|
||||||
|
@ -20,14 +20,14 @@
|
||||||
background-color: rgba(255,255,255,0.00);
|
background-color: rgba(255,255,255,0.00);
|
||||||
color: white;
|
color: white;
|
||||||
border: none;
|
border: none;
|
||||||
border-bottom: 2px solid #3b3b58;
|
border-bottom: 2px solid #ddd;
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
padding-left: 20px;
|
padding-left: 20px;
|
||||||
padding-right: 20px;
|
padding-right: 20px;
|
||||||
transition: all .2s ease;
|
transition: all .5s ease;
|
||||||
font-size: 10pt;
|
font-size: 10pt;
|
||||||
}
|
}
|
||||||
.NavBar>a>button:hover {
|
.NavBar>a>button:hover {
|
||||||
background-color: rgba(255,255,255,0.08);
|
background-color: rgba(255,255,255,0.08);
|
||||||
border-bottom: 2px solid #6060dd;
|
border-bottom: 2px solid #9d9dff;
|
||||||
}
|
}
|
|
@ -7,4 +7,13 @@
|
||||||
margin-top:0px;
|
margin-top:0px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-family: 'Manrope';
|
font-family: 'Manrope';
|
||||||
|
}
|
||||||
|
.ScrollBox {
|
||||||
|
display: block;
|
||||||
|
position: fixed;
|
||||||
|
overflow-y: scroll;
|
||||||
|
height: 100%;
|
||||||
|
padding-bottom: 50px;
|
||||||
|
margin: auto;
|
||||||
|
width: 100%;
|
||||||
}
|
}
|
|
@ -1,3 +1,11 @@
|
||||||
|
@keyframes pop {
|
||||||
|
0% {
|
||||||
|
scale: 0;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
scale: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
.Sticker {
|
.Sticker {
|
||||||
background-color: rgba(36, 36, 49, 0.7);
|
background-color: rgba(36, 36, 49, 0.7);
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
|
@ -7,4 +15,10 @@
|
||||||
backdrop-filter: blur(20px);
|
backdrop-filter: blur(20px);
|
||||||
mix-blend-mode: screen;
|
mix-blend-mode: screen;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
scale: 0;
|
||||||
|
animation-name: pop;
|
||||||
|
animation-duration: 1s;
|
||||||
|
animation-fill-mode: forwards;
|
||||||
|
animation-delay: 0s;
|
||||||
|
animation-timing-function: ease;
|
||||||
}
|
}
|
32
styles/Textbox.module.css
Normal file
32
styles/Textbox.module.css
Normal file
|
@ -0,0 +1,32 @@
|
||||||
|
@keyframes pop {
|
||||||
|
0% {
|
||||||
|
scale: 0;
|
||||||
|
}
|
||||||
|
60% {
|
||||||
|
scale: 1.2;
|
||||||
|
}
|
||||||
|
100% {
|
||||||
|
scale: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.Textbox {
|
||||||
|
background-color: #17171f;
|
||||||
|
border-radius: 10px;
|
||||||
|
font-family: 'Manrope';
|
||||||
|
color: white;
|
||||||
|
padding: 20px;
|
||||||
|
border: none;
|
||||||
|
scale: 1;
|
||||||
|
font-size: 12pt;
|
||||||
|
animation-name: pop;
|
||||||
|
animation-duration: 1s;
|
||||||
|
animation-fill-mode: forwards;
|
||||||
|
animation-delay: 1s;
|
||||||
|
animation-timing-function: ease;
|
||||||
|
scale: 0;
|
||||||
|
}
|
||||||
|
.Textbox::placeholder {
|
||||||
|
color: #8b8ba8;
|
||||||
|
font-family: 'Manrope';
|
||||||
|
}
|
Loading…
Reference in a new issue