add info message about 1.5.0
This commit is contained in:
parent
a2e2af3bf0
commit
81ba0391dc
|
@ -1,29 +1,33 @@
|
||||||
import React from "react";
|
import React from "react";
|
||||||
import TopSwoosh from "../../svg/TopSwoosh";
|
import TopSwoosh from "../../svg/TopSwoosh";
|
||||||
import "./App.scss";
|
import "./App.scss";
|
||||||
|
import StickyTopMessage from "../StickyTopMessage/StickyTopMessage";
|
||||||
import { HomeTop, HomeUpload, HomeBuilt, HomeSamples, HomeStay, HomeNetwork, Footer } from "../";
|
import { HomeTop, HomeUpload, HomeBuilt, HomeSamples, HomeStay, HomeNetwork, Footer } from "../";
|
||||||
|
|
||||||
function App() {
|
function App() {
|
||||||
return (
|
return (
|
||||||
<div className="app">
|
<React.Fragment>
|
||||||
<TopSwoosh className="top-swoosh" />
|
<StickyTopMessage />
|
||||||
|
<div className="app">
|
||||||
|
<TopSwoosh className="top-swoosh" />
|
||||||
|
|
||||||
<div className="width">
|
|
||||||
<HomeTop />
|
|
||||||
<HomeUpload />
|
|
||||||
<HomeBuilt />
|
|
||||||
<HomeSamples />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div className="home-white">
|
|
||||||
<div className="width">
|
<div className="width">
|
||||||
<HomeStay />
|
<HomeTop />
|
||||||
<HomeNetwork />
|
<HomeUpload />
|
||||||
|
<HomeBuilt />
|
||||||
|
<HomeSamples />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<Footer />
|
<div className="home-white">
|
||||||
</div>
|
<div className="width">
|
||||||
|
<HomeStay />
|
||||||
|
<HomeNetwork />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<Footer />
|
||||||
|
</div>
|
||||||
|
</React.Fragment>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -9,7 +9,7 @@ import { Mailing } from "..";
|
||||||
export default function Footer() {
|
export default function Footer() {
|
||||||
return (
|
return (
|
||||||
<Reveal effect="active">
|
<Reveal effect="active">
|
||||||
<footer className="footer">
|
<footer className="footer" id="footer">
|
||||||
<div className="width">
|
<div className="width">
|
||||||
<Fade duration={700} distance="40px" bottom>
|
<Fade duration={700} distance="40px" bottom>
|
||||||
<div className="footer-column">
|
<div className="footer-column">
|
||||||
|
|
|
@ -0,0 +1,13 @@
|
||||||
|
import React from "react";
|
||||||
|
import "./StickyTopMessage.scss";
|
||||||
|
|
||||||
|
export default function StickyTopMessage() {
|
||||||
|
return (
|
||||||
|
<div className="sticky-top-message" role="alert">
|
||||||
|
<p>
|
||||||
|
We are working on improved performance as part of the upcoming Sia v1.5.0 release. In the meantime, you can try
|
||||||
|
other webportals listed at the <a href="#footer">bottom</a>.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
|
@ -0,0 +1,24 @@
|
||||||
|
@import "../../variables.scss";
|
||||||
|
|
||||||
|
.sticky-top-message {
|
||||||
|
position: sticky;
|
||||||
|
top: 0;
|
||||||
|
font-size: 14px;
|
||||||
|
text-align: center;
|
||||||
|
padding: 10px;
|
||||||
|
font-weight: bold;
|
||||||
|
z-index: 999;
|
||||||
|
background-color: #fbe6e6;
|
||||||
|
border-bottom: 1px solid #e65c5c;
|
||||||
|
color: $red;
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: $red;
|
||||||
|
text-decoration: underline;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
color: darken($red, 15%);
|
||||||
|
transition: color 0.2s ease;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
Reference in New Issue