Skip to content

Commit 675cfd7

Browse files
SaraVieiraCompuIves
authored andcommitted
New homepage (codesandbox#2912)
* remove unused files * add first two parts * more fade in * add more screens * add final screen * add links to buttons * fix button colors * add footer & reduced motion * add variables * clean up * add tiny animation for tweet * some fixes * add glow * add link back home * fix hero text * fix glow * change card color * fadde out * Animation updates * add first fancy animation * ci page * fix typo * add team * add embed page * change slug * small ui fixes * add start of menu * add final menu * animations * fix animations * revert changes * fix animations * fix spaces * add explore * add more links * add prototyping * add learning * add learning * add Onboarding * add collaboration * open-source * add devrel * add breakpoints; turn to rems * responsive footer * fix a bit of mobile * add menu * add rest of menu * add header animation * add new animation * add cta * pricing header * start pricing * add more pricing * finish copy and paste * add mobile * make px rem & move styles * fix lint * add icons * first pass at ide * fic animation * kinda fix explore * add menu links * mobile * add tweets * add hover states * add all images to ide page0 * Update index.js * removing emoji as it deforms when italicized * Update ide.js * removing some tweets removing multiple tweets from the same person, or those used elsewhere * add parallax * start new emebeds page * Update started.js * Update experiment.js * Update experiment.js * more embed stuff * Update index.md * fix css * Update index.js * remove textCenter * Update pricing.js * fix thangs * fix thangs * fix css mess in ide * fix footer links * Update index.js * Update index.js * Update started.js * Update index.md * Update index.md * Update index.js * Update MobileNav.js * Update index.js * Update MobileNav.js * Update index.js making explore link titles consistent with top nav * make sandbox count dynamic * fix explore * fix explore * light fixes on embed * add box shadow to iframe * Update tweets.json * Update _tweets.js * Update index.md * Update MobileNav.js * add links to footer * first try at menu * make all homepage fit on mobile * make tweets better * more small fixes * make better on 1024 * small fixes * fixes * fix subscription amount * finish company page * change ide image * more fixes * fix menu * fix grid * try to fix android issue * try to fix android issue * fix small pricing stuff * remove other fonts * Update experiment.js Adding .s for oskar * Update explore.js Adding .s for oskar * Update share.js Adding .s for oskar * fixes * Update started.js Adding .s for oskar * Update index.js Adding .s for oskar * Update index.js Adding .s for oskar * Update index.md Adding .s for oskar * Update index.md Adding .s for oskar * fixes * Update ide.js Adding .s for oskar * Update index.md Adding .s for oskar * Update index.md Adding .s for oskar * Update index.md Adding .s for oskar * Update index.md Adding .s for oskar * Update index.md Adding .s for oskar * Update index.md * Update index.md Adding .s for oskar * Update pricing.js Adding .s for oskar * Update TitleAndMetaTags.js * Update _tweets.js * Update index.js Updating contributor count * Update ide.js fix . * fixes * more things * more fixes * add theme to icons * fix menu spacing * ordfer tweets * align bottom sectiuon * optimize images * ui fixes * Update index.js * Update ide.js * fix title wrapping * Update index.js * rename pages * Update index.md * Update index.md * Update index.md * Update index.md * Update index.js * Update index.js * fix build * fix menu weird state * new pic * optimize images * add team pro + link pro * more homepage fixes * fix team pro card height * fix bugs on embed flags * theme-color for pwa * tiny homepage tweeks * New homepage herosssss (codesandbox#3126) * WIP * Animation for explore * Responsive * New page * Live * Deploy * Add inspired by * Fix Safari * Disable the animation for reduce motion * Change inspired * Hopfeully fix styling jitter * Fix SSR by downgrading styled-components * New Image * Change colors * Tweaks * Tweaks * Tweaks * Tweaks
1 parent a758bab commit 675cfd7

File tree

262 files changed

+10495
-8562
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

262 files changed

+10495
-8562
lines changed

packages/app/src/app/overmind/effects/zip/create-zip/create-react-app-typescript/index.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -24,7 +24,7 @@ function alterPackageJSON(module: Module) {
2424
if (
2525
!parsed.dependencies ||
2626
!parsed.dependencies['react-scripts-ts'] ||
27-
(!parsed.devDependencies || !parsed.devDependencies['react-scripts-ts'])
27+
!parsed.devDependencies || !parsed.devDependencies['react-scripts-ts']
2828
) {
2929
parsed.dependencies['react-scripts-ts'] = '^2.13.0';
3030
}

packages/app/src/app/overmind/effects/zip/create-zip/index.ts

Lines changed: 22 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -268,33 +268,39 @@ export async function createZip(
268268
// For the new vue cli we want to use the full promise
269269
promise = fullPromise();
270270
} else {
271-
promise = import(/* webpackChunkName: 'vue-zip' */ './vue-cli').then(
272-
generator =>
273-
generator.default(zip, sandbox, filteredModules, directories)
271+
promise = import(
272+
/* webpackChunkName: 'vue-zip' */ './vue-cli'
273+
).then(generator =>
274+
generator.default(zip, sandbox, filteredModules, directories)
274275
);
275276
}
276277
} catch (e) {
277278
promise = fullPromise();
278279
}
279280
} else if (sandbox.template === preact.name) {
280-
promise = import(/* webpackChunkName: 'preact-zip' */ './preact-cli').then(
281-
generator => generator.default(zip, sandbox, filteredModules, directories)
281+
promise = import(
282+
/* webpackChunkName: 'preact-zip' */ './preact-cli'
283+
).then(generator =>
284+
generator.default(zip, sandbox, filteredModules, directories)
282285
);
283286
} else if (sandbox.template === svelte.name) {
284-
promise = import(/* webpackChunkName: 'svelte-zip' */ './svelte').then(
285-
generator => generator.default(zip, sandbox, filteredModules, directories)
287+
promise = import(
288+
/* webpackChunkName: 'svelte-zip' */ './svelte'
289+
).then(generator =>
290+
generator.default(zip, sandbox, filteredModules, directories)
286291
);
287292
} else {
288293
// If no specific zip generator is found we will default to the full generator
289-
promise = import(/* webpackChunkName: 'full-zip' */ './full').then(
290-
generator =>
291-
generator.default(
292-
zip,
293-
sandbox,
294-
filteredModules,
295-
directories,
296-
downloadBlobs
297-
)
294+
promise = import(
295+
/* webpackChunkName: 'full-zip' */ './full'
296+
).then(generator =>
297+
generator.default(
298+
zip,
299+
sandbox,
300+
filteredModules,
301+
directories,
302+
downloadBlobs
303+
)
298304
);
299305
}
300306

packages/app/src/app/pages/Sandbox/Editor/Workspace/Chat/index.tsx

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -62,9 +62,7 @@ export const Chat: React.FC = () => {
6262
sortBy(takeRight(messages, 100), 'date').map((message, i) => {
6363
const metadata = roomInfoUsers.find(u => u.id === message.userId);
6464
const color = metadata
65-
? `rgb(${metadata.color[0]}, ${metadata.color[1]}, ${
66-
metadata.color[2]
67-
})`
65+
? `rgb(${metadata.color[0]}, ${metadata.color[1]}, ${metadata.color[2]})`
6866
: '#636363';
6967
const name = users[message.userId];
7068
return (

packages/common/src/components/FeaturedSandbox/elements.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,11 +17,12 @@ export const Container = styled.div<{ height?: number }>`
1717
box-shadow: 0 9px 14px rgba(0, 0, 0, 0.25);
1818
overflow: hidden;
1919
z-index: 1;
20+
border: 1px solid #242424;
2021
2122
cursor: pointer;
2223
2324
&:hover {
24-
background-color: ${props => props.theme.new.bg.lighten(0.2)};
25+
background-color: ${theme.new.bg.lighten(0.2)};
2526
}
2627
2728
@media screen and (max-width: ${VERTICAL_BREAKPOINT}px) {

packages/common/src/components/FeaturedSandbox/index.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -251,6 +251,7 @@ export default class FeaturedSandbox extends React.PureComponent<
251251
zenMode: true,
252252
}}
253253
isInProjectView
254+
showNavigation={false}
254255
/>
255256
</animated.div>
256257
)

packages/common/src/components/SandboxCard/elements.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -125,7 +125,7 @@ export const Author = styled(UserWithAvatar)`
125125
font-size: 0.75rem;
126126
font-weight: 600;
127127
text-decoration: none;
128-
color: ${props => props.theme.new.description};
128+
color: #777788;
129129
`;
130130

131131
export const Stats = styled.ul`

packages/common/src/components/WideSandbox/elements.ts

Lines changed: 12 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@ import styled, { css } from 'styled-components';
22

33
import { UserWithAvatar } from '../UserWithAvatar';
44

5-
export const BG_COLOR = '#1C2022';
6-
export const BG_HOVER = '#212629';
5+
export const BG_COLOR = '#151515';
6+
export const BG_HOVER = '#242424';
77

88
export const Container = styled.div<{ small?: boolean; noMargin?: boolean }>`
99
transition: 0.3s ease all;
@@ -21,9 +21,8 @@ export const Container = styled.div<{ small?: boolean; noMargin?: boolean }>`
2121
2222
margin-right: 0.5rem;
2323
margin-left: 0.5rem;
24-
2524
background-color: ${BG_COLOR};
26-
box-shadow: 0 0 0 rgba(0, 0, 0, 0.3);
25+
border: 1px solid ${BG_HOVER};
2726
2827
${props =>
2928
props.small &&
@@ -38,9 +37,12 @@ export const Container = styled.div<{ small?: boolean; noMargin?: boolean }>`
3837
`};
3938
4039
&:hover {
41-
background-color: ${BG_HOVER};
42-
transform: translateY(-5px);
43-
box-shadow: 0 8px 4px rgba(0, 0, 0, 0.3);
40+
transform: scale(1.05);
41+
box-shadow: 0 16px 32px rgba(0, 0, 0, 0.12), 0 4px 4px rgba(0, 0, 0, 0.24);
42+
}
43+
44+
&:hover {
45+
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.12), 0 4px 2px rgba(0, 0, 0, 0.24);
4446
}
4547
4648
&:last-child {
@@ -67,7 +69,7 @@ export const SandboxTitle = styled.h2`
6769

6870
export const SandboxDescription = styled.p`
6971
font-size: 0.8rem;
70-
color: ${props => props.theme.new.description};
72+
color: #777788;
7173
font-weight: 500;
7274
line-height: 1.3;
7375
margin-top: 8px;
@@ -103,7 +105,7 @@ export const SandboxInfo = styled.div<{ noHeight?: boolean }>`
103105
props.noHeight &&
104106
css`
105107
height: auto;
106-
`}: ;
108+
`};
107109
`;
108110

109111
export const TemplateIcon = styled.div`
@@ -122,5 +124,5 @@ export const Author = styled(UserWithAvatar)`
122124
bottom: 0.75rem;
123125
left: 0.75rem;
124126
text-decoration: none;
125-
color: ${props => props.theme.new.description};
127+
color: #777788;
126128
`;

packages/common/src/theme.ts

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -40,11 +40,13 @@ const theme = {
4040
}),
4141
vscodeTheme: codesandbox,
4242

43-
new: createTheme({
44-
title: '#EEEEFF',
45-
description: '#777788',
46-
bg: '#2B2E41',
47-
}),
43+
new: {
44+
...createTheme({
45+
title: '#EEEEFF',
46+
description: '#777788',
47+
bg: '#2B2E41',
48+
}),
49+
},
4850
};
4951

5052
export default theme;

packages/common/src/utils/global.ts

Lines changed: 13 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,21 @@
11
import { protocolAndHost } from './url-generator';
22

33
export function getGlobal() {
4-
if (typeof window !== 'undefined') {
5-
return (window as unknown) as Window & { BrowserFS: any };
6-
}
4+
try {
5+
if (typeof window !== 'undefined') {
6+
return (window as unknown) as Window & { BrowserFS: any };
7+
}
78

8-
if (typeof self !== 'undefined') {
9-
const returnedGlobal: unknown = self;
10-
return returnedGlobal as Worker & { BrowserFS: any };
11-
}
9+
if (typeof self !== 'undefined') {
10+
const returnedGlobal: unknown = self;
11+
return returnedGlobal as Worker & { BrowserFS: any };
12+
}
1213

13-
if (typeof global !== 'undefined') {
14-
return global;
14+
if (typeof global !== 'undefined') {
15+
return global;
16+
}
17+
} catch (e) {
18+
/* Couldn't find anything */
1519
}
1620

1721
return {};

packages/homepage/babel.config.js

Lines changed: 0 additions & 15 deletions
This file was deleted.

0 commit comments

Comments
 (0)