Skip to content

Commit a5c4715

Browse files
oliviertassinarioliviertassinari
committed
commit to get netlify deploy
1 parent 7d61d14 commit a5c4715

File tree

6 files changed

+31
-205
lines changed

6 files changed

+31
-205
lines changed

‎docs/pages/index.js‎

Lines changed: 16 additions & 185 deletions
Original file line numberDiff line numberDiff line change
@@ -1,192 +1,23 @@
11
import React from 'react';
2-
import { useSelector } from 'react-redux';
3-
import { makeStyles } from '@material-ui/core/styles';
4-
import Typography from '@material-ui/core/Typography';
5-
import Button from '@material-ui/core/Button';
6-
import Container from '@material-ui/core/Container';
7-
import HomeSteps from 'docs/src/modules/components/HomeSteps';
8-
import HomeQuickWord from 'docs/src/modules/components/HomeQuickWord';
9-
import HomeBackers from 'docs/src/modules/components/HomeBackers';
10-
import HomeUsers from 'docs/src/modules/components/HomeUsers';
11-
import HomePro from 'docs/src/modules/components/HomePro';
12-
import HomeFooter from 'docs/src/modules/components/HomeFooter';
13-
import AppFrame from 'docs/src/modules/components/AppFrame';
14-
import Link from 'docs/src/modules/components/Link';
15-
import Head from 'docs/src/modules/components/Head';
16-
import loadScript from 'docs/src/modules/utils/loadScript';
17-
18-
let dependenciesLoaded = false;
19-
20-
function loadDependencies() {
21-
if (dependenciesLoaded) {
22-
return;
23-
}
24-
25-
dependenciesLoaded = true;
26-
27-
loadScript('https://buttons.github.io/buttons.js', document.querySelector('head'));
28-
loadScript('https://platform.twitter.com/widgets.js', document.querySelector('head'));
29-
}
30-
31-
const useStyles = makeStyles(theme => ({
32-
root: {
33-
flex: '1 0 100%',
34-
'& #main-content': {
35-
outline: 0,
36-
},
37-
},
38-
hero: {
39-
paddingTop: 64,
40-
color: theme.palette.primary.main,
41-
},
42-
content: {
43-
display: 'flex',
44-
flexDirection: 'column',
45-
alignItems: 'center',
46-
textAlign: 'center',
47-
paddingTop: theme.spacing(4),
48-
paddingBottom: theme.spacing(8),
49-
[theme.breakpoints.up('md')]: {
50-
paddingTop: theme.spacing(22),
51-
paddingBottom: theme.spacing(22),
52-
flexDirection: 'row',
53-
alignItems: 'flex-start',
54-
textAlign: 'left',
55-
},
56-
},
57-
title: {
58-
marginLeft: -12,
59-
whiteSpace: 'nowrap',
60-
letterSpacing: '.7rem',
61-
textIndent: '.7rem',
62-
fontWeight: theme.typography.fontWeightLight,
63-
[theme.breakpoints.only('xs')]: {
64-
fontSize: 28,
65-
},
66-
},
67-
logo: {
68-
flexShrink: 0,
69-
width: 120,
70-
height: 120,
71-
marginBottom: theme.spacing(2),
72-
[theme.breakpoints.up('md')]: {
73-
marginRight: theme.spacing(8),
74-
width: 195,
75-
height: 175,
76-
},
77-
},
78-
button: {
79-
marginTop: theme.spacing(4),
80-
},
81-
social: {
82-
padding: theme.spacing(2, 0),
83-
display: 'flex',
84-
justifyContent: 'center',
85-
alignItems: 'center',
86-
minHeight: 21,
87-
boxSizing: 'content-box',
88-
'& span': {
89-
display: 'flex',
90-
marginRight: theme.spacing(1),
91-
},
92-
'& a': {
93-
color: theme.palette.background.paper,
94-
},
95-
},
96-
}));
97-
98-
const GettingStartedLink = React.forwardRef((props, ref) => {
99-
return <Link href="/getting-started/installation" naked prefetch ref={ref} {...props} />;
100-
});
101-
102-
export default function HomePage() {
2+
import InputLabel from '@material-ui/core/InputLabel';
3+
import TextField from '@material-ui/core/TextField';
4+
import FormControl from '@material-ui/core/FormControl';
5+
import OutlinedInput from '@material-ui/core/OutlinedInput';
6+
7+
export default function Test() {
8+
const inputLabel = React.useRef(null);
9+
const [labelWidth, setLabelWidth] = React.useState(0);
10310
React.useEffect(() => {
104-
if (window.location.hash !== '' && window.location.hash !== '#main=content') {
105-
window.location.replace(`https://v0.material-ui.com/${window.location.hash}`);
106-
}
107-
108-
loadDependencies();
11+
setLabelWidth(inputLabel.current.offsetWidth);
10912
}, []);
110-
const t = useSelector(state => state.options.t);
111-
const classes = useStyles();
11213

11314
return (
114-
<AppFrame>
115-
<div className={classes.root}>
116-
<Head />
117-
<main id="main-content" tabIndex="-1">
118-
<div className={classes.hero}>
119-
<Container maxWidth="md" className={classes.content}>
120-
<img src="/static/logo_raw.svg" alt="" className={classes.logo} />
121-
<div>
122-
<Typography
123-
variant="h3"
124-
component="h1"
125-
color="inherit"
126-
gutterBottom
127-
className={classes.title}
128-
>
129-
{'MATERIAL-UI'}
130-
</Typography>
131-
<Typography variant="h5" component="h2" color="inherit">
132-
{t('strapline')}
133-
</Typography>
134-
<Button
135-
component={GettingStartedLink}
136-
className={classes.button}
137-
variant="outlined"
138-
color="primary"
139-
>
140-
{t('getStarted')}
141-
</Button>
142-
</div>
143-
</Container>
144-
</div>
145-
<div className={classes.social}>
146-
<a
147-
className="github-button"
148-
href="https://github.com/mui-org/material-ui"
149-
data-icon="octicon-star"
150-
data-show-count="true"
151-
>
152-
Star
153-
</a>
154-
<a
155-
className="twitter-follow-button"
156-
href="https://twitter.com/@materialui"
157-
data-show-screen-name="false"
158-
>
159-
Follow
160-
</a>
161-
</div>
162-
<HomePro />
163-
<HomeQuickWord />
164-
<HomeSteps />
165-
<HomeBackers />
166-
<HomeUsers />
167-
</main>
168-
<HomeFooter />
169-
</div>
170-
<script
171-
type="application/ld+json"
172-
// eslint-disable-next-line react/no-danger
173-
dangerouslySetInnerHTML={{
174-
__html: `
175-
{
176-
"@context": "https://schema.org",
177-
"@type": "Organization",
178-
"name": "Material-UI",
179-
"url": "https://material-ui.com/",
180-
"logo": "https://material-ui.com/static/brand.png",
181-
"sameAs": [
182-
"https://twitter.com/materialUI",
183-
"https://github.com/mui-org/material-ui",
184-
"https://opencollective.com/material-ui"
185-
]
186-
}
187-
`,
188-
}}
189-
/>
190-
</AppFrame>
15+
<div>
16+
<FormControl variant="outlined">
17+
<InputLabel ref={inputLabel}>Age</InputLabel>
18+
<OutlinedInput id="old" labelWidth={labelWidth} />
19+
</FormControl>
20+
<TextField id="new" label="Outlined" variant="outlined" />
21+
</div>
19122
);
19223
}

‎packages/material-ui/src/FilledInput/FilledInput.js‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ export const styles = theme => {
1818
borderTopLeftRadius: theme.shape.borderRadius,
1919
borderTopRightRadius: theme.shape.borderRadius,
2020
transition: theme.transitions.create('background-color', {
21-
duration: theme.transitions.duration.shorter,
21+
duration: theme.transitions.duration.shortest,
2222
easing: theme.transitions.easing.easeOut,
2323
}),
2424
'&:hover': {
@@ -53,7 +53,7 @@ export const styles = theme => {
5353
right: 0,
5454
transform: 'scaleX(0)',
5555
transition: theme.transitions.create('transform', {
56-
duration: theme.transitions.duration.shorter,
56+
duration: theme.transitions.duration.shortest,
5757
easing: theme.transitions.easing.easeOut,
5858
}),
5959
pointerEvents: 'none', // Transparent to the hover style.
@@ -74,7 +74,7 @@ export const styles = theme => {
7474
position: 'absolute',
7575
right: 0,
7676
transition: theme.transitions.create('border-bottom-color', {
77-
duration: theme.transitions.duration.shorter,
77+
duration: theme.transitions.duration.shortest,
7878
}),
7979
pointerEvents: 'none', // Transparent to the hover style.
8080
},

‎packages/material-ui/src/Input/Input.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,7 @@ export const styles = theme => {
4242
right: 0,
4343
transform: 'scaleX(0)',
4444
transition: theme.transitions.create('transform', {
45-
duration: theme.transitions.duration.shorter,
45+
duration: theme.transitions.duration.shortest,
4646
easing: theme.transitions.easing.easeOut,
4747
}),
4848
pointerEvents: 'none', // Transparent to the hover style.
@@ -63,7 +63,7 @@ export const styles = theme => {
6363
position: 'absolute',
6464
right: 0,
6565
transition: theme.transitions.create('border-bottom-color', {
66-
duration: theme.transitions.duration.shorter,
66+
duration: theme.transitions.duration.shortest,
6767
}),
6868
pointerEvents: 'none', // Transparent to the hover style.
6969
},

‎packages/material-ui/src/InputBase/InputBase.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ export const styles = theme => {
1717
color: 'currentColor',
1818
opacity: light ? 0.42 : 0.5,
1919
transition: theme.transitions.create('opacity', {
20-
duration: theme.transitions.duration.shorter,
20+
duration: theme.transitions.duration.shortest,
2121
}),
2222
};
2323
const placeholderHidden = {

‎packages/material-ui/src/InputLabel/InputLabel.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -43,7 +43,7 @@ export const styles = theme => ({
4343
/* Styles applied to the `input` element if `disableAnimation={false}`. */
4444
animated: {
4545
transition: theme.transitions.create(['color', 'transform'], {
46-
duration: theme.transitions.duration.shorter,
46+
duration: theme.transitions.duration.shortest,
4747
easing: theme.transitions.easing.easeOut,
4848
}),
4949
},

‎packages/material-ui/src/OutlinedInput/NotchedOutline.js‎

Lines changed: 8 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -6,8 +6,6 @@ import useTheme from '../styles/useTheme';
66
import capitalize from '../utils/capitalize';
77

88
export const styles = theme => {
9-
const align = theme.direction === 'rtl' ? 'right' : 'left';
10-
119
return {
1210
/* Styles applied to the root element. */
1311
root: {
@@ -23,19 +21,14 @@ export const styles = theme => {
2321
borderRadius: 'inherit',
2422
borderStyle: 'solid',
2523
borderWidth: 1,
26-
// Match the Input Label
27-
transition: theme.transitions.create([`padding-${align}`, 'border-color', 'border-width'], {
28-
duration: theme.transitions.duration.shorter,
29-
easing: theme.transitions.easing.easeOut,
30-
}),
3124
},
3225
/* Styles applied to the legend element when `labelWidth` is provided. */
3326
legend: {
3427
textAlign: 'left',
3528
padding: 0,
3629
lineHeight: '11px', // sync with `height` in `legend` styles
3730
transition: theme.transitions.create('width', {
38-
duration: theme.transitions.duration.shorter,
31+
duration: theme.transitions.duration.shortest,
3932
easing: theme.transitions.easing.easeOut,
4033
}),
4134
},
@@ -48,19 +41,21 @@ export const styles = theme => {
4841
visibility: 'hidden',
4942
maxWidth: 0,
5043
transition: theme.transitions.create('max-width', {
51-
duration: theme.transitions.duration.shorter,
44+
duration: 50,
5245
easing: theme.transitions.easing.easeOut,
5346
}),
5447
'& span': {
55-
paddingLeft: 4,
56-
paddingRight: 6,
48+
paddingLeft: 5,
49+
paddingRight: 5,
5750
},
5851
},
52+
/* Styles applied to the legend element is notched. */
5953
legendNotched: {
6054
maxWidth: 1000,
6155
transition: theme.transitions.create('max-width', {
62-
duration: theme.transitions.duration.shorter,
56+
duration: theme.transitions.duration.shortest - 50,
6357
easing: theme.transitions.easing.easeOut,
58+
delay: 30,
6459
}),
6560
},
6661
};
@@ -114,7 +109,7 @@ const NotchedOutline = React.forwardRef(function NotchedOutline(props, ref) {
114109
<fieldset
115110
aria-hidden
116111
style={{
117-
[`padding${capitalize(align)}`]: 8 + (notched ? 0 : labelWidth / 2),
112+
[`padding${capitalize(align)}`]: 8,
118113
...style,
119114
}}
120115
className={clsx(classes.root, className)}

0 commit comments

Comments
 (0)