diff --git a/src/components/Nav.js b/src/components/Nav.js index 0b862d1c..1d8e2ec6 100644 --- a/src/components/Nav.js +++ b/src/components/Nav.js @@ -228,7 +228,7 @@ class Nav extends React.Component { </div> <ul className={`nav__items ${this.state.isNavRendered ? 'navIsRendered' : 'navIsNotRendered' }`}> <li className="nav__item"> - <Link to="/#features" className="nav__link">Features</Link> + <Link to="https://github.com/eclipse-theia/theia" className="nav__link">Github</Link> </li> <li className="nav__item"> <Link to="/docs/" className="nav__link" activeClassName="active">Documentation</Link> @@ -249,6 +249,7 @@ class Nav extends React.Component { <li><Link to="/resources/" className="nav__link">Other Resources</Link></li> </ul> </li> + </ul> </nav> </StyledNav> diff --git a/src/components/index/GettingStarted.js b/src/components/index/GettingStarted.js index 21ea3b2e..246d7d81 100644 --- a/src/components/index/GettingStarted.js +++ b/src/components/index/GettingStarted.js @@ -43,7 +43,7 @@ const features = [ img: <img src={TryIt} alt="Try it" />, title: "Try it", paragraphs: [<> - Eclipse Theia is a framework for building tools and IDEs. You can try it by <a href="https://theia-ide.org/docs/composing_applications/">building your own IDE/tools based on Theia</a> within minutes. Alternatively, you can <a href="https://theia-ide.org/docs/blueprint_download/">download and try Theia Blueprint</a>, a template tool based on Eclipse Theia or <a href="https://try.theia-cloud.io/">try it online</a>. + Eclipse Theia is a framework for building tools and IDEs. You can try it by <a href="https://theia-ide.org/docs/composing_applications/">building your own IDE/tools based on Theia</a> within minutes. Alternatively, you can <a href="#theiaide">download and use the Theia IDE</a>, a template tool based on Eclipse Theia or <a href="https://try.theia-cloud.io/">try it online</a>. </>] }, { @@ -72,7 +72,7 @@ const features = [ const GettingStarted = () => ( <StyledFeatures> <section className="row features" id="gettingstarted"> - <h3 className="heading-tertiary">Getting started with Eclipse Theia</h3> + <h3 className="heading-tertiary">Getting started with the Eclipse Theia Platform</h3> <div className="feature__container"> {features.map( (feature, i) => <Feature key={`${i}+${feature.title}`} {...feature} /> diff --git a/src/components/index/Header.js b/src/components/index/Header.js index fb1101ec..550e84c7 100644 --- a/src/components/index/Header.js +++ b/src/components/index/Header.js @@ -95,38 +95,16 @@ const Header = () => ( <iframe title="Github Star Count" className="header__github-button" src="https://ghbtns.com/github-btn.html?user=eclipse-theia&repo=theia&type=star&count=true" frameBorder={0} scrolling={0} /> <iframe title="Github Fork Count" className="header__github-button" src="https://ghbtns.com/github-btn.html?user=eclipse-theia&repo=theia&type=fork&count=true" frameBorder={0} scrolling={0} /> </div> - <div className="header__banner"> - <a href="https://events.eclipse.org/2023/theiacon/"> - <img className="banner__image" src={TheiaConLogo}></img> - </a> - <h1 style={{ fontSize: '2.2rem' }}> - <a href="https://events.eclipse.org/2023/theiacon/">TheiaCon 2023</a> is approaching! | VIRTUAL EVENT | November 15 - 16, 2023 | - Get registered for the largest Theia event of the year! - </h1> - <div className="header__buttons"> - <a className="btn btn--cta" href="https://events.eclipse.org/2023/theiacon/" rel="noopener"> - Get registered - </a> - </div> - </div> - <div className="header__buttons"> - <a className="btn" href="https://github.com/eclipse-theia/theia" target="_blank" rel="noopener noreferrer">Theia Platform (you want to build a tool)</a> - <a className="btn btn--cta" href="https://try.theia-cloud.io/" rel="noopener">Theia IDE (you want to use an IDE)</a> - </div> <h1 className="heading-primary"> The Eclipse Theia Platform </h1> <h2 style={{ fontSize: '2.1rem' }}> - Efficiently develop and deliver Cloud & Desktop IDEs and tools with modern web technologies. - <br/> - <a href="https://eclipsesource.com/blogs/2023/11/02/eclipse-theia-1-43-release-news-and-noteworthy/" rel="noopener noreferrer">Learn about the latest 1.43 Release</a> and <a href="https://eclipsesource.com/blogs/2023/09/15/the-eclipse-theia-community-release-2023-08/">the latest Community Release (2023-08)</a>. - <br/> - Stay up-to-date: <a href="https://twitter.com/theia_ide">follow us on Twitter</a> and <a href="https://accounts.eclipse.org/mailing-list/friends-of-theia">register to the "Friends of Theia" mailing list</a>. + An Open, Flexible and Extensible Cloud & Desktop IDE Platform Efficiently develop and deliver Cloud & Desktop IDEs and tools with modern web technologies. The <a href="#theiaide"><b>Theia IDE</b></a> is a standard IDE built on the Theia Platform. </h2> <div className="header__buttons"> - <a className="btn" href="https://github.com/eclipse-theia/theia" target="_blank" rel="noopener noreferrer">View on GitHub</a> - <a className="btn btn--cta" href="https://try.theia-cloud.io/" rel="noopener">Try online →</a> - <a className="btn btn--cta" href="/docs/blueprint_download/" rel="noopener">Try on desktop →</a> + <a className="btn" href="#gettingstarted" target="_blank" rel="noopener noreferrer">Get started with the Theia Platform</a> + <a className="btn btn--cta" href="https://try.theia-cloud.io/" rel="noopener">Try Theia IDE online</a> + <a style ={{backgroundColor: "#0B5394", borderColor: "#0B5394"}} className="btn btn--cta" href="#theiaide" rel="noopener">Get Theia IDE for desktop</a> </div> </div> <div className="header__banner"> diff --git a/src/components/index/Promo.js b/src/components/index/Promo.js deleted file mode 100644 index 8a672a3f..00000000 --- a/src/components/index/Promo.js +++ /dev/null @@ -1,100 +0,0 @@ -/******************************************************************************** - * Copyright (C) 2020 TypeFox and others. - * - * This program and the accompanying materials are made available under the - * terms of the Eclipse Public License v. 2.0 which is available at - * http://www.eclipse.org/legal/epl-2.0. - * - * This Source Code may also be made available under the following Secondary - * Licenses when the conditions for such availability set forth in the Eclipse - * Public License v. 2.0 are satisfied: GNU General Public License, version 2 - * with the GNU Classpath Exception which is available at - * https://www.gnu.org/software/classpath/license.html. - * - * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0 - ********************************************************************************/ - -import React from 'react' - -import styled from '@emotion/styled' -import { breakpoints } from '../../utils/variables' - -const StyledPromo = styled.div` - display: flex; - border: 2px solid #ebebeb; - - &:nth-of-type(2n) { - flex-direction: row-reverse; - - @media(max-width: ${breakpoints.md}) { - flex-direction: column; - } - } - - @media(max-width: ${breakpoints.md}) { - flex-direction: column; - max-width: 60rem; - margin: 0 auto; - } - - &:not(:last-child) { - margin-bottom: 5rem; - } - - .promo__text { - width: 50%; - padding: 9rem 5rem; - - @media(max-width: ${breakpoints.md}) { - width: 100%; - max-width: 60rem; - } - } - - .promo__media { - position: relative; - width: 50%; - z-index: -1000; - - @media(max-width: ${breakpoints.md}) { - width: 100%; - max-width: 60rem; - } - - &::before { - content: ""; - display: block; - position: absolute; - top: 0; - left: 0; - width: 100%; - height: 100%; - background: #8c9bae; - z-index: 1000; - opacity: .1; - } - } - - .promo__video { - width: 100%; - } -` - -const Promo = ({ - title, - para, - videoSrc -}) => ( - <StyledPromo className="promo"> - <div className="promo__text"> - <h3 className="heading-tertiary">{title}</h3> - {para} - </div> - <div className="promo__media"> - <video autoPlay loop muted playsInline className="promo__video"> - <source src={videoSrc} type="video/mp4" /> - </video> - </div> - </StyledPromo> -) -export default Promo \ No newline at end of file diff --git a/src/components/index/TheiaIDEDownloads.js b/src/components/index/TheiaIDEDownloads.js new file mode 100644 index 00000000..dae0d41b --- /dev/null +++ b/src/components/index/TheiaIDEDownloads.js @@ -0,0 +1,120 @@ +/******************************************************************************** + * Copyright (C) 2020 TypeFox and others. + * + * This program and the accompanying materials are made available under the + * terms of the Eclipse Public License v. 2.0 which is available at + * http://www.eclipse.org/legal/epl-2.0. + * + * This Source Code may also be made available under the following Secondary + * Licenses when the conditions for such availability set forth in the Eclipse + * Public License v. 2.0 are satisfied: GNU General Public License, version 2 + * with the GNU Classpath Exception which is available at + * https://www.gnu.org/software/classpath/license.html. + * + * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0 + ********************************************************************************/ + +import Background from '../../resources/background-image.png' +import DocImage from '../DocImage' +import Nav from '../Nav' +import React from 'react' +import TheiaLogoDark from '../../resources/theia-logo-dark.svg' +import TheiaConLogo from '../../resources/theiacon-logo.svg' +import { breakpoints } from '../../utils/variables' +import styled from '@emotion/styled' + +const StyledHeader = styled.div` + .header { + position: relative; + background-image: url(${Background}); + background-size: cover; + background-repeat: no-repeat; + border-bottom: 10px solid #f8f8f8; + @media(max-width: ${breakpoints.xmd}) { + padding-top: 15rem; + } + &__logo-box { + margin-bottom: 3rem; + } + &__logo { + height: 3rem; + } + .banner__image { + height: 15rem; + } + &__banner { + padding: 15px; + text-align: center; + } + h1 { + margin-bottom: 1rem; + font-size: 2.2rem; + } + .btn { + max-width: 21rem; + @media(max-width: 385px) { + &:not(:last-child) { + margin-right: 0; + } + } + @media(max-width: 800px) { + &:not(:last-child) { + margin-right: 2rem; + } + } + } + &__github-details { + position: absolute; + top: 10rem; + right: 2rem; + } + &__buttons { + display:flex; + justify-content: space-evenly; + align-items: center; + text-align: center; + padding: 3rem 10vw; + @media(max-width: 800px){ + padding: 3rem 0; + } + + } + iframe { + height: 2.5rem; + width: 12rem; + } + } +` + +const TheiaIDEDownloads = () => ( + <StyledHeader> + <div id="theiaidedownload" className="row"> + <h1 > + Download Theia IDE + </h1> + + NOTE: The Eclipse Theia IDE is currently in beta. While we are continuing to make improvements and add functionality, we welcome and value your feedback (see below). + + <div className="header__buttons"> + <a className="btn btn--cta" href="https://www.eclipse.org/downloads/download.php?file=/theia/latest/windows/TheiaBlueprint.exe&r=1" rel="noopener">Windows (latest)</a> + <a className="btn btn--cta" href="https://www.eclipse.org/downloads/download.php?file=/theia/latest/linux/TheiaBlueprint.AppImage&r=1" rel="noopener">Linux (latest)</a> + <a className="btn btn--cta" href="https://www.eclipse.org/downloads/download.php?file=/theia/latest/macos/TheiaBlueprint.dmg&r=1" rel="noopener">MacOS (latest)</a> + </div> + + <center> + You can also <a href="https://try.theia-cloud.io/">try the latest version of Theia Blueprint online</a>. The online test version is limited to 30 minutes per session and hosted via <a href="https://github.com/eclipsesource/theia-cloud">Theia.cloud</a>. + </center> + <br></br> + </div> + <div className="row"> + <h1>Feature Requests, Bugs and Support</h1> + Help us make the Theia IDE even better, by sharing your experience and suggestions <a href="https://github.com/eclipse-theia/theia/discussions">here</a>. + The features found in the Eclipse Theia IDE are based on Eclipse Theia and the available extensions/plugins. For more details please see the <a href="https://github.com/eclipse-theia/theia">Eclipse Theia GitHub Repository</a>. The Eclipse Theia IDE only packages existing Eclipse Theia functionality and installers. If you believe there is a mistake in packaging, something needs to be added to the packaging or the installers do not work properly, please <a href="https://github.com/eclipse-theia/theia-blueprint/issues/new/choose">open an issue on GitHub</a> to let us know. + <h1>Support</h1> + Need help with Theia? To get support by the community go to the <a href="https://community.theia-ide.org/">Discourse Theia forum</a> or the <a href="https://github.com/eclipse-theia/theia/discussions">Discussions at GitHub</a>. To get professional support for Theia see the <a href="http://localhost:8000/support/">support page</a>. + </div> + + </StyledHeader> +) + +export default TheiaIDEDownloads diff --git a/src/components/index/TheiaIDEExtensible.js b/src/components/index/TheiaIDEExtensible.js new file mode 100644 index 00000000..23e6dc72 --- /dev/null +++ b/src/components/index/TheiaIDEExtensible.js @@ -0,0 +1,143 @@ +/******************************************************************************** + * Copyright (C) 2020 EclipseSource and others. + * + * This program and the accompanying materials are made available under the + * terms of the Eclipse Public License v. 2.0 which is available at + * http://www.eclipse.org/legal/epl-2.0. + * + * This Source Code may also be made available under the following Secondary + * Licenses when the conditions for such availability set forth in the Eclipse + * Public License v. 2.0 are satisfied: GNU General Public License, version 2 + * with the GNU Classpath Exception which is available at + * https://www.gnu.org/software/classpath/license.html. + * + * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0 + ********************************************************************************/ + +import React from 'react' + +import styled from '@emotion/styled' +import { products } from '../../utils/data' +import Popup from 'reactjs-popup'; +import 'reactjs-popup/dist/index.css'; +import { Swiper, SwiperSlide } from 'swiper/react'; +import 'swiper/swiper-bundle.min.css'; +import 'swiper/components/navigation/navigation.min.css' +import SwiperCore, { + Autoplay, Navigation +} from 'swiper/core'; + +SwiperCore.use([Autoplay, Navigation]); + +const Styled = styled.div` + .products { + padding-bottom: 5rem; + margin-top: 4rem; + position: relative; + &__thumb { + height: calc(100% - 1.5em); + max-width: 100%; + object-fit: fill; + cursor: pointer; + display: block; + margin: auto; + + &-container { + height: 18rem; + padding: 2px; + @media(min-width: 768px) { + text-align: center; + } + @media(max-width: 50rem) { + width: 40%; + margin-bottom: 4rem; + } + @media(max-width: 30rem) { + width: 100%; + } + } + &-popup { + height: 100%; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + } + } + } + .swiper-button-next, .swiper-button-prev { + color: black; + margin-top: calc(0px - (var(--swiper-navigation-size)/ 2)); + } + @media(min-width: 1120px) { + .swiper-button-next { + right: -6rem; + } + .swiper-button-prev { + left: -6rem; + } + } +` + +const TheiaIDEExtensible = () => ( + <div className="row"> + <Styled> + <section className="products" > + <h2 className="heading-tertiary">Extensible and Open</h2> + <p>The Theia IDE is built upon the highly modular <a href="/">Theia platform</a>, enabling the integration of custom extensions and the creation of fully tailored tools (see examples below). <a href="/">Explore the Theia Platform</a> and learn how to create custom tool offerings with ease!</p> + <br></br> + <div className="swiper-button-prev"></div> + <Swiper + modules={[Navigation]} + slidesPerView={1} + breakpoints={{ + "750": { + "slidesPerView": 2, + }, + "1120": { + "slidesPerView": 3, + "spaceBetween": 20, + } + }} + navigation={{ + nextEl: '.swiper-button-next', + prevEl: '.swiper-button-prev' + }} + autoplay={{ + "delay": 4000, + "disableOnInteraction": false + }} + > + { + products.map((item, i) => ( + <SwiperSlide key={i} className="products__thumb-container"> + <Popup key={i} + trigger={ + <div className="products__thumb-popup"> + <img className="products__thumb" src={item.thumb} alt={item.alt} /> + <div>{item.alt}</div> + </div> + + } modal> + {close => ( + <> + <button className="close" onClick={close}> + × + </button> + <h2>{item.alt}</h2> + <img style={{ width: '100%', margin: '2rem' }} src={item.src} alt={item.alt} /> + <a className="btn" href={item.href} target="_blank" rel="noopener noreferrer">More information</a> + </> + )} + </Popup> + </SwiperSlide> + )) + } + </Swiper> + <div className="swiper-button-next"></div> + </section> + </Styled> + </div> +) + +export default TheiaIDEExtensible diff --git a/src/components/index/TheiaIDEFeatures.js b/src/components/index/TheiaIDEFeatures.js index dba7ebfa..60f2bd6c 100644 --- a/src/components/index/TheiaIDEFeatures.js +++ b/src/components/index/TheiaIDEFeatures.js @@ -16,40 +16,129 @@ import React from 'react' -import CompletionVideo from '../../resources/completion.mp4' -import TermianlVideo from '../../resources/terminal.mp4' -import LayoutVideo from '../../resources/layout.mp4' -import Promo from './Promo' - -const features = [ - { - title: "Language Support", - para: <p> - Experience world-class code editing support in Theia IDE, integrated with the Language Server Protocol (LSP). This allows you to develop in almost any programming language, including Python, Java, JavaScript, C++, and more—all within one versatile environment. - </p>, - videoSrc: CompletionVideo - }, - { - title: "Modern UX", - para: <p>Elevate your development workflow with Theia IDE's flexible workbench layout and user experience. Featuring a dynamic toolbar, detachable views, and efficient tab management, our interface is designed to adapt to your needs, streamlining your projects for optimal productivity.</p>, - videoSrc: TermianlVideo - }, - { - title: "Extensible and Open", - para: <p>Unlock limitless possibilities with Theia IDE's seamless compatibility with the vast VS Code extension ecosystem. From robust linting tools to interactive notebook editors, customize your development experience like never before. Plus, enjoy the added confidence of a fully open-source platform governed by a vendor-neutral community. Streamline your workflow, enrich your toolset, and code on your own terms. - - </p>, - videoSrc: LayoutVideo +import CodeEditing from '../../resources/codeediting.mp4' +import ModernUX from '../../resources/modernux.mp4' +import styled from '@emotion/styled' +import { breakpoints } from '../../utils/variables' +import { coreContributors } from '../../utils/data' + +const StyledPromo = styled.div` + display: flex; + border: 2px solid #ebebeb; + + &:nth-of-type(2n) { + flex-direction: row-reverse; + + @media(max-width: ${breakpoints.md}) { + flex-direction: column; + } + } + + @media(max-width: ${breakpoints.md}) { + flex-direction: column; + max-width: 60rem; + margin: 0 auto; } -] + + &:not(:last-child) { + margin-bottom: 2rem; + } + + .promo__text { + width: 50%; + padding: 1rem 3rem; + + @media(max-width: ${breakpoints.md}) { + width: 100%; + max-width: 60rem; + } + } + + .promo__media { + position: relative; + width: 50%; + z-index: -1000; + + @media(max-width: ${breakpoints.md}) { + width: 100%; + max-width: 60rem; + } + + &::before { + content: ""; + display: block; + position: absolute; + top: 0; + left: 0; + width: 100%; + height: 100%; + background: #8c9bae; + z-index: 1000; + opacity: .1; + } + } + + .promo__video { + width: 100%; + } +` +const LogoContainer = styled.div` + display: flex; + width: 50%; + flex-wrap: wrap; + align-items: center; + justify-content: space-around; + border: 0px solid #ddd; /* Optional: for visual boundary */ +`; + +const Logo = styled.img` + width: calc(15% - 10px); /* 4 logos per row */ + height: 33%; /* 2 rows */ + margin: 0px 0px 0px px; /* Adjust for spacing */ + object-fit: contain; + scale: 0.7 +`; -const TheiaIDEFeatures = () => ( - <section className="promos"> - <div className="row"> - { features.map((promo, i) => <Promo key={i} {...promo} />) } - </div> - </section> +const TheiaIDEFeatures = ({ adopters }) => ( + + <div className="row"> + <StyledPromo className="promo"> + <div className="promo__text"> + <h3 className="heading-tertiary">Language Support</h3> + <p>Experience world-class code editing support in Theia IDE, integrated with the Language Server Protocol (LSP). Develop in almost any programming language, including Python, Java, JavaScript, C++, and more—all within one environment.</p> + </div> + <div className="promo__media"> + <video autoPlay loop muted playsInline className="promo__video"> + <source src={CodeEditing} type="video/mp4" /> + </video> + </div> + </StyledPromo> + <StyledPromo className="promo"> + <div className="promo__text"> + <h3 className="heading-tertiary">Open Source and Vendor Neutral</h3> + <p>The Theia IDE is backed by a diverse and healthy open source ecosystem. Enjoy the added confidence of a fully open-source platform governed by a vendor-neutral community. Deploy and enrich your toolset on your own terms.</p> + </div> + <LogoContainer> + {adopters.map((item, i) => ( + <Logo key={i} src={'https://api.eclipse.org/adopters/assets/images/adopters/' + item.logo} alt={item.name}/> + )) + } + </LogoContainer> + </StyledPromo> + <StyledPromo className="promo"> + <div className="promo__text"> + <h3 className="heading-tertiary">Modern UX</h3> + <p>Elevate your development workflow with Theia IDE's flexible workbench layout and user experience. Featuring a dynamic toolbar, detachable views, and efficient tab management, our interface is designed to adapt to your needs, streamlining your projects for optimal productivity.</p> + </div> + <div className="promo__media"> + <video autoPlay loop muted playsInline className="promo__video"> + <source src={ModernUX} type="video/mp4" /> + </video> + </div> + </StyledPromo> + </div> + ) export default TheiaIDEFeatures \ No newline at end of file diff --git a/src/components/index/TheiaIDEHeader.js b/src/components/index/TheiaIDEHeader.js index ff8eb264..5cc60b67 100644 --- a/src/components/index/TheiaIDEHeader.js +++ b/src/components/index/TheiaIDEHeader.js @@ -19,19 +19,22 @@ import DocImage from '../DocImage' import Nav from '../Nav' import React from 'react' import TheiaLogoDark from '../../resources/theia-logo-dark.svg' -import TheiaConLogo from '../../resources/theiacon-logo.svg' +import TheiaIDELogo from '../../resources/TheiaIDE.svg' +import TheiaIDEScreenshot from '../../resources/theia-screenshot.png' import { breakpoints } from '../../utils/variables' import styled from '@emotion/styled' const StyledHeader = styled.div` .header { position: relative; - background-image: url(${Background}); background-size: cover; + background-color: #0B5394; background-repeat: no-repeat; + color: white; border-bottom: 10px solid #f8f8f8; @media(max-width: ${breakpoints.xmd}) { padding-top: 15rem; + } &__logo-box { margin-bottom: 3rem; @@ -40,7 +43,7 @@ const StyledHeader = styled.div` height: 3rem; } .banner__image { - height: 15rem; + height: 1rem; } &__banner { padding: 15px; @@ -83,30 +86,40 @@ const StyledHeader = styled.div` height: 2.5rem; width: 12rem; } + .wrap { + float: right; + margin: 0px; + width: 30rem; + } + .logo { + float: right; + margin: 10px; + width: 30rem; + scale: 1.3; + } } ` const TheiaIDEHeader = () => ( <StyledHeader> - <header className='header' role="banner"> - <div className="row"> - <h1 className="heading-primary"> - The Eclipse Theia IDE - </h1> + <div className="header"> + <div id="theiaide" className="row"> + <img className="logo" src={TheiaIDELogo} style={{height: '3rem'}}></img> + <h1>The Eclipse Theia IDE <sup>BETA</sup></h1> + <img className="wrap" src={TheiaIDEScreenshot} alt="Theia IDE" /> <h2 style={{ fontSize: '2.1rem' }}> A modern and open IDE for cloud and desktop. The Theia IDE is based on the Theia platform. </h2> <div className="header__buttons"> - <a className="btn btn--cta" href="/docs/blueprint_download/" rel="noopener">Download →</a> - <a className="btn btn--cta" href="https://try.theia-cloud.io/" rel="noopener">Try online →</a> + <a className="btn btn--cta" href="#theiaidedownload" rel="noopener">Download →</a> + <a className="btn btn--cta" href="https://try.theia-cloud.io/" rel="noopener">Try online</a> <a className="btn" href="https://github.com/eclipse-theia/theia" target="_blank" rel="noopener noreferrer">View on GitHub</a> </div> - <center><h2 style={{ fontSize: '1.5rem' }}> Please note that the Theia IDE is currently rebranded from its original name “Theia Blueprint”. </h2></center> </div> - </header> + </div> </StyledHeader> ) diff --git a/src/components/index/VSCodeExtensions.js b/src/components/index/VSCodeExtensions.js new file mode 100644 index 00000000..06d82d43 --- /dev/null +++ b/src/components/index/VSCodeExtensions.js @@ -0,0 +1,128 @@ +/******************************************************************************** + * Copyright (C) 2020 EclipseSource and others. + * + * This program and the accompanying materials are made available under the + * terms of the Eclipse Public License v. 2.0 which is available at + * http://www.eclipse.org/legal/epl-2.0. + * + * This Source Code may also be made available under the following Secondary + * Licenses when the conditions for such availability set forth in the Eclipse + * Public License v. 2.0 are satisfied: GNU General Public License, version 2 + * with the GNU Classpath Exception which is available at + * https://www.gnu.org/software/classpath/license.html. + * + * SPDX-License-Identifier: EPL-2.0 OR GPL-2.0 WITH Classpath-exception-2.0 + ********************************************************************************/ + +import React from 'react' + +import styled from '@emotion/styled' +import { extensions } from '../../utils/data' +import Popup from 'reactjs-popup'; +import 'reactjs-popup/dist/index.css'; +import { Swiper, SwiperSlide } from 'swiper/react'; +import 'swiper/swiper-bundle.min.css'; +import 'swiper/components/navigation/navigation.min.css' +import SwiperCore, { + Autoplay, Navigation +} from 'swiper/core'; + +SwiperCore.use([Autoplay, Navigation]); + +const Styled = styled.div` + .products { + padding-bottom: 5rem; + margin-top: 4rem; + position: relative; + &__thumb { + height: calc(100% - 1.5em); + max-width: 100%; + object-fit: fill; + cursor: pointer; + display: block; + margin: auto; + + &-container { + height: 12rem; + padding: 2px; + @media(min-width: 768px) { + text-align: center; + } + @media(max-width: 50rem) { + width: 40%; + margin-bottom: 4rem; + } + @media(max-width: 30rem) { + width: 100%; + } + } + &-popup { + height: 100%; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + user-select: none; + } + } + } + .swiper-button-next, .swiper-button-prev { + color: black; + margin-top: calc(0px - (var(--swiper-navigation-size)/ 2)); + } + @media(min-width: 1120px) { + .swiper-button-next { + right: -6rem; + } + .swiper-button-prev { + left: -6rem; + } + } +` + +const VSCodeExtensions = () => ( + <div className="row"> + <Styled> + <section className="products" > + <h3 className="heading-tertiary">Most popular extensions for Theia</h3> + <p>Unlock limitless possibilities with Theia IDE's seamless compatibility with the VS Code extension ecosystem. From robust linting tools to interactive notebook editors, customize your development experience like never before. Explore the <b>3000 availabe extensions</b> for the Theia IDE at <a href="https://open-vsx.org/">open-vsx.org!</a></p> + <br></br> + <div className="swiper-button-prev"></div> + <Swiper + modules={[Navigation]} + slidesPerView={1} + breakpoints={{ + "750": { + "slidesPerView": 4, + }, + "1120": { + "slidesPerView": 5, + "spaceBetween": 10, + } + }} + navigation={{ + nextEl: '.swiper-button-next', + prevEl: '.swiper-button-prev' + }} + autoplay={{ + "delay": 4000, + "disableOnInteraction": false + }} + > + { + extensions.map((item, i) => ( + <SwiperSlide key={i} className="products__thumb-container"> + <div className="products__thumb-popup"> + <a href={item.href}><img className="products__thumb" src={item.thumb} alt={item.alt} /></a> + <div>{item.alt}</div> + </div> + </SwiperSlide> + )) + } + </Swiper> + <div className="swiper-button-next"></div> + </section> + </Styled> + </div> +) + +export default VSCodeExtensions diff --git a/src/docs/blueprint_download.md b/src/docs/blueprint_download.md index f02fcc02..0d5508e4 100644 --- a/src/docs/blueprint_download.md +++ b/src/docs/blueprint_download.md @@ -4,52 +4,4 @@ title: Eclipse Theia Blueprint # Eclipse Theia Blueprint -<img src="/theia-logo-blueprint.png" alt="Theia Logo Blue" style="max-width: 525px"> - -## What is Eclipse Theia Blueprint? - -Eclipse Theia Blueprint is a **template** for building desktop-based products based on the Eclipse Theia platform, as well as to showcase Eclipse Theia capabilities. It is made up of a subset of existing Eclipse Theia features and extensions and can be easily downloaded and installed on all major operating system platforms (see below). Documentation is available to help you customize and build your own Eclipse Theia-based product. - -## Downloads - -NOTE: Eclipse Theia Blueprint is **currently in beta**. While we are continuing to make improvements and add functionality, we welcome and value your feedback (see below). - -<table cellspacing="25"> - <thead> - <tr> - <th>Windows</th> - <th>Linux</th> - <th>macOS</th> - </tr> - </thead> - <tbody> - <tr> - <td><a href="https://www.eclipse.org/downloads/download.php?file=/theia/latest/windows/TheiaBlueprint.exe&r=1" download>Download latest</a></td> - <td><a href="https://www.eclipse.org/downloads/download.php?file=/theia/latest/linux/TheiaBlueprint.AppImage&r=1" download>Download latest</a></td> - <td><a href="https://www.eclipse.org/downloads/download.php?file=/theia/latest/macos/TheiaBlueprint.dmg&r=1" download>Download latest</a></td> - </tr> - </tbody> -</table> - -Already using Eclipse Theia Blueprint? Help us make Theia even better, by sharing your experience and suggestions [here](https://github.com/eclipse-theia/theia/discussions). - -## Try Theia Blueprint Online - -You can also [try the latest version of Theia Blueprint online](https://try.theia-cloud.io/). The online test version is limited to 30 minutes per session and hosted via [Theia.cloud](https://github.com/eclipsesource/theia-cloud). - -## Reporting Feature Requests and Bugs - -The features found in Eclipse Theia Blueprint are based on Eclipse Theia and the available extensions/plugins. For more details please see the [Eclipse Theia GitHub Repository](https://github.com/eclipse-theia/theia). -Eclipse Theia Blueprint only packages existing Eclipse Theia functionality and installers. If you believe there is a mistake in packaging, something needs to be added to the packaging or the installers do not work properly, please [open an issue on GitHub](https://github.com/eclipse-theia/theia-blueprint/issues/new/choose) to let us know. - -## Source Code - -The source code for Eclipse Theia Blueprint is available on [GitHub](https://github.com/eclipse-theia/theia-blueprint). - -## Documentation - -Please see [here](/docs/blueprint_documentation) for documentation on how to customize Eclipse Theia Blueprint. - -## Support - -Need help with Theia? To get support by the community go to the [Discourse Theia forum](https://community.theia-ide.org/) or the [Discussions at GitHub](https://github.com/eclipse-theia/theia/discussions). To get professional support for Theia see the [support page](/support/). +Eclipse Theia Blueprint has been rebranded to "Theia IDE" and has moved to <a href="/#theiaide">this page</a>. \ No newline at end of file diff --git a/src/pages/index.js b/src/pages/index.js index a7f367c1..a3b8562d 100644 --- a/src/pages/index.js +++ b/src/pages/index.js @@ -26,6 +26,9 @@ import GettingStarted from '../components/index/GettingStarted' import IntrosToTheia from '../components/index/IntrosToTheia' import TheiaIDEFeatures from '../components/index/TheiaIDEFeatures' import TheiaIDEHeader from '../components/index/TheiaIDEHeader' +import VSCodeExtensions from '../components/index/VSCodeExtensions' +import TheiaIDEDownloads from '../components/index/TheiaIDEDownloads' +import TheiaIDEExtensible from '../components/index/TheiaIDEExtensible' export default ({ pageContext }) => { @@ -39,7 +42,10 @@ export default ({ pageContext }) => { <GettingStarted/> <IntrosToTheia /> <TheiaIDEHeader /> - <TheiaIDEFeatures /> + <VSCodeExtensions /> + <TheiaIDEFeatures adopters={pageContext.adopters}/> + <TheiaIDEExtensible /> + <TheiaIDEDownloads /> </main> <Footer background={true} /> </Layout> diff --git a/src/resources/TheiaIDE.png b/src/resources/TheiaIDE.png new file mode 100644 index 00000000..4379f33e Binary files /dev/null and b/src/resources/TheiaIDE.png differ diff --git a/src/resources/TheiaIDE.svg b/src/resources/TheiaIDE.svg new file mode 100644 index 00000000..b22b0359 --- /dev/null +++ b/src/resources/TheiaIDE.svg @@ -0,0 +1,90 @@ +<?xml version="1.0" encoding="utf-8"?> +<!-- Generator: Adobe Illustrator 27.4.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) --> +<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" + viewBox="0 0 445.5 86" style="enable-background:new 0 0 445.5 86;" xml:space="preserve"> +<style type="text/css"> + .st0{fill:url(#SVGID_1_);} + .st1{clip-path:url(#SVGID_00000167386746856513901470000003042487874386661053_);fill:#00ADEE;} + .st2{clip-path:url(#SVGID_00000167386746856513901470000003042487874386661053_);} + .st3{fill:#00ADEE;} + .st4{clip-path:url(#SVGID_00000054242515072454618500000016323923471560882071_);fill:#FFFFFF;} + .st5{fill:#FFFFFF;} +</style> +<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="-49.5726" y1="42.174" x2="391.8576" y2="42.174" gradientTransform="matrix(1.0221 0 0 1 65.7771 0)"> + <stop offset="0.4731" style="stop-color:#231F20"/> + <stop offset="0.566" style="stop-color:#1B3D4C;stop-opacity:0.8237"/> + <stop offset="0.7185" style="stop-color:#106A8D;stop-opacity:0.5342"/> + <stop offset="0.8469" style="stop-color:#078BBD;stop-opacity:0.2905"/> + <stop offset="0.9446" style="stop-color:#029FDB;stop-opacity:0.1051"/> + <stop offset="1" style="stop-color:#00A7E6;stop-opacity:0"/> +</linearGradient> +<path class="st0" d="M393.8,81.9H131.4c-19.7,0-35.6-16-35.6-35.6v-8.1c0-19.7,16-35.6,35.6-35.6l262.4,0c19.7,0,35.6,16,35.6,35.6 + v8.1C429.4,65.9,413.5,81.9,393.8,81.9z"/> +<g> + <g> + <defs> + <rect id="SVGID_00000103237334383586192740000008903319534172553147_" x="5" y="2.3" width="546.2" height="79.9"/> + </defs> + <clipPath id="SVGID_00000144310959564571615110000013590893603388272806_"> + <use xlink:href="#SVGID_00000103237334383586192740000008903319534172553147_" style="overflow:visible;"/> + </clipPath> + <path style="clip-path:url(#SVGID_00000144310959564571615110000013590893603388272806_);fill:#00ADEE;" d="M28.8,71 + c2.7,0,5.1,2.4,5.1,5.3v0.6c0,2.9-2.3,5.3-5.1,5.3H10.1c-2.7,0-5.1-2.4-5.1-5.3v-0.6c0-2.9,2.3-5.3,5.1-5.3H28.8"/> + <path style="clip-path:url(#SVGID_00000144310959564571615110000013590893603388272806_);" d="M129.9,113.3c2.7,0,5.1,2.4,5.1,5.3 + v0.6c0,2.9-2.3,5.3-5.1,5.3h-18.8c-2.7,0-5.1-2.4-5.1-5.3v-0.6c0-2.9,2.3-5.3,5.1-5.3H129.9"/> + <path style="clip-path:url(#SVGID_00000144310959564571615110000013590893603388272806_);" d="M129.9,113.3c2.7,0,5.1,2.4,5.1,5.3 + v0.6c0,2.9-2.3,5.3-5.1,5.3h-18.8c-2.7,0-5.1-2.4-5.1-5.3v-0.6c0-2.9,2.3-5.3,5.1-5.3H129.9"/> + <path style="clip-path:url(#SVGID_00000144310959564571615110000013590893603388272806_);fill:#00ADEE;" d="M123.6,16.2 + L123.6,16.2c-11.7,0-21.1,9.8-21.1,22.1v8.8c0,12.3,9.4,22.1,21.1,22.1s21.1-9.8,21.1-22.1v-8.8C144.8,26.3,135.2,16.2,123.6,16.2 + z M130.9,37.2c2.7,0,5.1,2.5,5.1,5.3v0.6c0,2.9-2.3,5.3-5.1,5.3H115c-2.7,0-5.1-2.5-5.1-5.3v-0.6c0-2.9,2.3-5.3,5.1-5.3H130.9z + M129.5,2.3c20.9,0,37.9,17.8,37.9,39.8s-17,39.8-37.9,39.8H45.7c-2.9,0-5.5-2.5-5.5-5.7c0-3.1,2.3-5.7,5.5-5.7h19.5 + c2.9,0,5.5-2.5,5.5-5.7c0-3.1-2.3-5.7-5.5-5.7h-4.3c-2.9,0-5.5-2.5-5.5-5.7c0-3.1,2.3-5.7,5.5-5.7H74c2.9,0,5.3-2.7,5.5-5.7 + c0-3.1-2.3-5.7-5.5-5.7H28.5c-2.9,0-5.5-2.5-5.5-5.7c0-3.3,2.3-5.7,5.5-5.7h33.6c2.9,0,5.3-2.7,5.5-5.7c0-3.1-2.3-5.7-5.5-5.7 + h-7.6c-2.9,0-5.6-2.5-5.5-5.7c0.2-5.4,4.3-4.9,3.2-4.9C51.1,2.3,129.5,2.3,129.5,2.3"/> + </g> + <path class="st3" d="M42.4,47.5c2.7,0,5,2.5,5,5.4v0.6c0,2.9-2.3,5.4-5,5.4H30.9c-2.7,0-5-2.5-5-5.4v-0.6c0-2.9,2.3-5.4,5-5.4H42.4 + "/> +</g> +<g> + <g> + <defs> + <rect id="SVGID_00000011716820131741507370000001687299576994894722_" x="34.2" y="19.6" width="314.2" height="44.1"/> + </defs> + <clipPath id="SVGID_00000157289742235958974410000008890723319589454514_"> + <use xlink:href="#SVGID_00000011716820131741507370000001687299576994894722_" style="overflow:visible;"/> + </clipPath> + <path style="clip-path:url(#SVGID_00000157289742235958974410000008890723319589454514_);fill:#FFFFFF;" d="M330.8,20.2 + c0,0,1.9,0,2.7,0.6c0,0,0.8,0.6,1.5,2.4l13.4,39.1c0,0,0.2,0.4,0,0.9c0,0-0.1,0.5-0.8,0.5h-5.7c0,0-0.7,0-1.1-0.1 + c0,0-0.4-0.1-0.7-0.8l-2.7-8.4h-15.7l-2.6,8.3c0,0-0.2,0.6-0.6,0.8c0,0-0.3,0.2-1.1,0.2h-5.7c0,0-0.7,0-0.9-0.5c0,0-0.2-0.4,0-0.9 + L324,23.1c0,0,0.3-0.9,0.7-1.5c0,0,0.3-0.6,0.8-0.9c0,0,0.4-0.3,1.1-0.4c0,0,0.6-0.1,1.5-0.1H330.8 M329.6,28.5h-0.3l-2.6,8.5 + l-3.3,10.6h11.9L332,37.3L329.6,28.5z"/> + </g> + <path class="st5" d="M219.3,20c0,0,0.9,0,1.1,0.2c0,0,0.3,0.2,0.3,1.1v16.1H240V21.2c0,0,0-0.8,0.3-1c0,0,0.3-0.2,1.1-0.2h4.7 + c0,0,0.9,0,1.1,0.2c0,0,0.2,0.2,0.2,1.1V62c0,0,0,0.9-0.2,1.1c0,0-0.2,0.2-1.1,0.2h-4.7c0,0-0.8,0-1.1-0.2c0,0-0.3-0.2-0.3-1V43.8 + h-19.2V62c0,0,0,0.9-0.3,1.1c0,0-0.3,0.2-1.1,0.2h-4.7c0,0-0.7,0-1-0.2c0,0-0.3-0.2-0.3-1V21.4c0,0,0-0.8,0.3-1c0,0,0.3-0.2,1-0.2 + h4.7V20"/> + <path class="st5" d="M206.7,20c0,0,0.7,0,0.9,0.2c0,0,0.2,0.2,0.2,0.9v4.3c0,0,0,0.7-0.2,0.9c0,0-0.2,0.2-0.9,0.2H195V62 + c0,0,0,0.9-0.2,1.1c0,0-0.2,0.2-1.1,0.2h-4.8c0,0-0.8,0-1.1-0.2c0,0-0.3-0.2-0.3-1V26.6h-11.5c0,0-0.7,0-0.9-0.2 + c0,0-0.2-0.2-0.2-0.9v-4.3c0,0,0-0.7,0.2-0.9c0,0,0.2-0.2,0.9-0.2H206.7"/> + <path class="st5" d="M284.2,20c0,0,0.8,0,1,0.3c0,0,0.2,0.3,0.2,1.1v3.9c0,0,0,0.8-0.2,1.1c0,0-0.2,0.2-1,0.2h-16.4 + c0,0-2.4,0-3.3,1c0,0-0.9,1-0.9,3v6.5h18.7c0,0,0.8,0,1,0.3c0,0,0.2,0.3,0.2,1.1v3.4c0,0,0,0.8-0.2,1.1c0,0-0.2,0.3-1,0.3h-18.7v9 + c0,0,0,2,1,3c0,0,1,1,3.3,1h16.9c0,0,0.9,0,1.1,0.3c0,0,0.2,0.3,0.2,1.1V62c0,0,0,0.7-0.2,1c0,0-0.2,0.3-1,0.3h-17.7 + c0,0-3.3,0-5.4-0.9c0,0-2.1-0.9-3.4-2.5c0,0-1.2-1.6-1.8-3.5c0,0-0.4-2-0.4-4.2V31.2c0,0,0-2.1,0.6-4.2c0,0,0.6-2,1.9-3.6 + c0,0,1.3-1.6,3.5-2.5c0,0,2.1-0.9,5.1-0.9H284.2"/> + <path class="st5" d="M301.2,20c0,0,0.9,0,1.1,0.2c0,0,0.3,0.2,0.3,1.1V62c0,0,0,0.9-0.3,1.1c0,0-0.3,0.2-1.1,0.2h-4.7 + c0,0-0.8,0-1.1-0.2c0,0-0.3-0.2-0.3-1V21.2c0,0,0-0.8,0.3-1c0,0,0.3-0.2,1.1-0.2H301.2"/> +</g> +<circle class="st3" cx="401" cy="42.6" r="39.5"/> +<g> + <path class="st5" d="M377.4,54.8V28.2h5.3v26.6H377.4z"/> + <path class="st5" d="M387.3,54.8V28.2h11.3c1.8,0,3.3,0.3,4.5,1c1.2,0.6,2.2,1.5,2.9,2.7c0.7,1.2,1.2,2.6,1.5,4.2s0.4,3.4,0.4,5.4 + c0,3-0.3,5.5-1,7.5c-0.7,2-1.7,3.4-3.1,4.4s-3.1,1.5-5.2,1.5H387.3z M392.6,50h5.4c1.1,0,2-0.3,2.6-1c0.6-0.6,1.1-1.6,1.4-2.9 + c0.3-1.3,0.5-2.8,0.5-4.7c0-1.7-0.1-3.1-0.3-4.3c-0.2-1.1-0.5-2-0.8-2.6c-0.4-0.6-0.8-1.1-1.4-1.3c-0.6-0.2-1.2-0.4-2-0.4h-5.4V50z + "/> + <path class="st5" d="M418.3,55c-0.6,0-1.2-0.1-2-0.2c-0.7-0.1-1.5-0.4-2.1-0.7c-0.7-0.4-1.2-1-1.7-1.7s-0.7-1.9-0.7-3.2V34.2 + c0-1.2,0.2-2.2,0.5-3c0.4-0.8,0.8-1.4,1.4-1.9c0.6-0.5,1.3-0.8,2-1c0.7-0.2,1.4-0.3,2.1-0.3c1.8,0,3.4,0,4.8,0.1 + c1.4,0,2.6,0.1,3.7,0.2c1.1,0.1,2.1,0.1,3,0.2v4.5h-9.9c-0.7,0-1.3,0.2-1.7,0.5c-0.4,0.4-0.6,0.9-0.6,1.7v3.9l10.5,0.3v4.2 + l-10.5,0.3v3.7c0,0.6,0.1,1.1,0.3,1.5c0.2,0.3,0.5,0.6,0.8,0.7c0.3,0.1,0.7,0.2,1.1,0.2h10v4.5c-1.1,0.1-2.2,0.2-3.5,0.3 + c-1.3,0.1-2.6,0.1-3.9,0.2C420.7,55,419.4,55,418.3,55z"/> +</g> +</svg> diff --git a/src/resources/codeediting.mp4 b/src/resources/codeediting.mp4 new file mode 100644 index 00000000..7537219f Binary files /dev/null and b/src/resources/codeediting.mp4 differ diff --git a/src/resources/extensible.mp4 b/src/resources/extensible.mp4 new file mode 100644 index 00000000..6346ceb0 Binary files /dev/null and b/src/resources/extensible.mp4 differ diff --git a/src/resources/extensions/docker.png b/src/resources/extensions/docker.png new file mode 100644 index 00000000..d83e54a7 Binary files /dev/null and b/src/resources/extensions/docker.png differ diff --git a/src/resources/extensions/eslint.png b/src/resources/extensions/eslint.png new file mode 100644 index 00000000..c9096381 Binary files /dev/null and b/src/resources/extensions/eslint.png differ diff --git a/src/resources/extensions/github.png b/src/resources/extensions/github.png new file mode 100644 index 00000000..740696ea Binary files /dev/null and b/src/resources/extensions/github.png differ diff --git a/src/resources/extensions/gitlens.png b/src/resources/extensions/gitlens.png new file mode 100644 index 00000000..feae8450 Binary files /dev/null and b/src/resources/extensions/gitlens.png differ diff --git a/src/resources/extensions/go.png b/src/resources/extensions/go.png new file mode 100644 index 00000000..a32f76f8 Binary files /dev/null and b/src/resources/extensions/go.png differ diff --git a/src/resources/extensions/java.png b/src/resources/extensions/java.png new file mode 100644 index 00000000..adb4470a Binary files /dev/null and b/src/resources/extensions/java.png differ diff --git a/src/resources/extensions/npm.png b/src/resources/extensions/npm.png new file mode 100644 index 00000000..9fb9cf10 Binary files /dev/null and b/src/resources/extensions/npm.png differ diff --git a/src/resources/extensions/python.png b/src/resources/extensions/python.png new file mode 100644 index 00000000..5ae72485 Binary files /dev/null and b/src/resources/extensions/python.png differ diff --git a/src/resources/extensions/yaml.png b/src/resources/extensions/yaml.png new file mode 100644 index 00000000..8f3a8002 Binary files /dev/null and b/src/resources/extensions/yaml.png differ diff --git a/src/resources/modernux.mp4 b/src/resources/modernux.mp4 new file mode 100644 index 00000000..682e70dd Binary files /dev/null and b/src/resources/modernux.mp4 differ diff --git a/src/resources/theia-screenshot.png b/src/resources/theia-screenshot.png new file mode 100644 index 00000000..1f2d7cfe Binary files /dev/null and b/src/resources/theia-screenshot.png differ diff --git a/src/utils/data.js b/src/utils/data.js index 5dfacbdc..bde952a6 100644 --- a/src/utils/data.js +++ b/src/utils/data.js @@ -38,7 +38,16 @@ import SmartfaceMin from '../resources/screenshots/thumbnails/smartface-min.gif' import CDTCloud from '../resources/screenshots/cdtcloudblueprint.gif' import CDTCloudMin from '../resources/screenshots/thumbnails/cdtcloudblueprint-min.gif' - + import Python from '../resources/extensions/python.png' + import Java from '../resources/extensions/java.png' + import GitHub from '../resources/extensions/github.png' + import GitLens from '../resources/extensions/gitlens.png' + import ESLint from '../resources/extensions/eslint.png' + import NPM from '../resources/extensions/npm.png' + import Docker from '../resources/extensions/docker.png' + import YAML from '../resources/extensions/yaml.png' + import Go from '../resources/extensions/go.png' + export const contributorsAndAdopters = [ { homepage_url: "https://about.google/", @@ -140,4 +149,52 @@ alt: "Smartface" } ] + + export const extensions = [ + { + href: "https://open-vsx.org/extension/ms-python/python", + thumb: Python, + alt: "Python" + }, + { + href: "https://open-vsx.org/extension/redhat/java", + thumb: Java, + alt: "Language support for Java" + }, + { + href: "https://open-vsx.org/extension/GitHub/vscode-pull-request-github", + thumb: GitHub, + alt: "GitHub Pull Requests and Issues" + }, + { + href: "https://open-vsx.org/extension/eamodio/gitlens", + thumb: GitLens, + alt: "GitLens — Git supercharged" + }, + { + href: "https://open-vsx.org/extension/dbaeumer/vscode-eslint", + thumb: ESLint, + alt: "ESLint" + }, + { + href: "https://open-vsx.org/extension/vscode/npm", + thumb: NPM, + alt: "NPM Support" + }, + { + href: "https://open-vsx.org/extension/ms-azuretools/vscode-docker", + thumb: Docker, + alt: "Docker" + }, + { + href: "https://open-vsx.org/extension/redhat/vscode-yaml", + thumb: YAML, + alt: "YAML" + }, + { + href: "https://open-vsx.org/extension/golang/Go", + thumb: Go, + alt: "Go" + } +] \ No newline at end of file