Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ControlLabel -> FormLabel #411

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions _chapters/add-the-create-note-page.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ First we are going to create the form for a note. It'll take some content and a

``` coffee
import React, { useRef, useState } from "react";
import { FormGroup, FormControl, ControlLabel } from "react-bootstrap";
import { FormGroup, FormControl, FormLabel } from "react-bootstrap";
import LoaderButton from "../components/LoaderButton";
import config from "../config";
import "./NewNote.css";
Expand Down Expand Up @@ -61,7 +61,7 @@ export default function NewNote(props) {
/>
</FormGroup>
<FormGroup controlId="file">
<ControlLabel>Attachment</ControlLabel>
<FormLabel>Attachment</FormLabel>
<FormControl onChange={handleFileChange} type="file" />
</FormGroup>
<LoaderButton
Expand Down
8 changes: 4 additions & 4 deletions _chapters/allow-users-to-change-passwords.md
Original file line number Diff line number Diff line change
Expand Up @@ -137,7 +137,7 @@ Now let's create the form that allows our users to change their password.
``` coffee
import React, { Component } from "react";
import { Auth } from "aws-amplify";
import { FormGroup, FormControl, ControlLabel } from "react-bootstrap";
import { FormGroup, FormControl, FormLabel } from "react-bootstrap";
import LoaderButton from "../components/LoaderButton";
import "./ChangePassword.css";

Expand Down Expand Up @@ -192,7 +192,7 @@ export default class ChangePassword extends Component {
<div className="ChangePassword">
<form onSubmit={this.handleChangeClick}>
<FormGroup bsSize="large" controlId="oldPassword">
<ControlLabel>Old Password</ControlLabel>
<FormLabel>Old Password</FormLabel>
<FormControl
type="password"
onChange={this.handleChange}
Expand All @@ -201,15 +201,15 @@ export default class ChangePassword extends Component {
</FormGroup>
<hr />
<FormGroup bsSize="large" controlId="password">
<ControlLabel>New Password</ControlLabel>
<FormLabel>New Password</FormLabel>
<FormControl
type="password"
value={this.state.password}
onChange={this.handleChange}
/>
</FormGroup>
<FormGroup bsSize="large" controlId="confirmPassword">
<ControlLabel>Confirm Password</ControlLabel>
<FormLabel>Confirm Password</FormLabel>
<FormControl
type="password"
onChange={this.handleChange}
Expand Down
6 changes: 3 additions & 3 deletions _chapters/allow-users-to-change-their-email.md
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ import {
HelpBlock,
FormGroup,
FormControl,
ControlLabel
FormLabel
} from "react-bootstrap";
import LoaderButton from "../components/LoaderButton";
import "./ChangeEmail.css";
Expand Down Expand Up @@ -94,7 +94,7 @@ export default class ChangeEmail extends Component {
return (
<form onSubmit={this.handleUpdateClick}>
<FormGroup bsSize="large" controlId="email">
<ControlLabel>Email</ControlLabel>
<FormLabel>Email</FormLabel>
<FormControl
autoFocus
type="email"
Expand All @@ -119,7 +119,7 @@ export default class ChangeEmail extends Component {
return (
<form onSubmit={this.handleConfirmClick}>
<FormGroup bsSize="large" controlId="code">
<ControlLabel>Confirmation Code</ControlLabel>
<FormLabel>Confirmation Code</FormLabel>
<FormControl
autoFocus
type="tel"
Expand Down
8 changes: 4 additions & 4 deletions _chapters/create-a-billing-form.md
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ Next let's create our billing form component.
{% raw %}
``` coffee
import React, { useState } from "react";
import { FormGroup, FormControl, ControlLabel } from "react-bootstrap";
import { FormGroup, FormControl, FormLabel } from "react-bootstrap";
import { CardElement, injectStripe } from "react-stripe-elements";
import LoaderButton from "./LoaderButton";
import { useFormFields } from "../libs/hooksLib";
Expand Down Expand Up @@ -62,7 +62,7 @@ function BillingForm({ isLoading, onSubmit, ...props }) {
return (
<form className="BillingForm" onSubmit={handleSubmitClick}>
<FormGroup bsSize="large" controlId="storage">
<ControlLabel>Storage</ControlLabel>
<FormLabel>Storage</FormLabel>
<FormControl
min="0"
type="number"
Expand All @@ -73,15 +73,15 @@ function BillingForm({ isLoading, onSubmit, ...props }) {
</FormGroup>
<hr />
<FormGroup bsSize="large" controlId="name">
<ControlLabel>Cardholder&apos;s name</ControlLabel>
<FormLabel>Cardholder&apos;s name</FormLabel>
<FormControl
type="text"
value={fields.name}
onChange={handleFieldChange}
placeholder="Name on the card"
/>
</FormGroup>
<ControlLabel>Credit Card Info</ControlLabel>
<FormLabel>Credit Card Info</FormLabel>
<CardElement
className="card-field"
onChange={e => setIsCardComplete(e.complete)}
Expand Down
6 changes: 3 additions & 3 deletions _chapters/create-a-custom-react-hook-to-handle-form-fields.md
Original file line number Diff line number Diff line change
Expand Up @@ -70,7 +70,7 @@ And that's it! We can now use this in our Login component.
``` coffee
import React, { useState } from "react";
import { Auth } from "aws-amplify";
import { FormGroup, FormControl, ControlLabel } from "react-bootstrap";
import { FormGroup, FormControl, FormLabel } from "react-bootstrap";
import LoaderButton from "../components/LoaderButton";
import { useFormFields } from "../libs/hooksLib";
import "./Login.css";
Expand Down Expand Up @@ -105,7 +105,7 @@ export default function Login(props) {
<div className="Login">
<form onSubmit={handleSubmit}>
<FormGroup controlId="email" bsSize="large">
<ControlLabel>Email</ControlLabel>
<FormLabel>Email</FormLabel>
<FormControl
autoFocus
type="email"
Expand All @@ -114,7 +114,7 @@ export default function Login(props) {
/>
</FormGroup>
<FormGroup controlId="password" bsSize="large">
<ControlLabel>Password</ControlLabel>
<FormLabel>Password</FormLabel>
<FormControl
type="password"
value={fields.password}
Expand Down
6 changes: 3 additions & 3 deletions _chapters/create-a-login-page.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ So let's start by creating the basic form that'll take the user's email (as thei

``` coffee
import React, { useState } from "react";
import { Button, FormGroup, FormControl, ControlLabel } from "react-bootstrap";
import { Button, FormGroup, FormControl, FormLabel } from "react-bootstrap";
import "./Login.css";

export default function Login(props) {
Expand All @@ -37,7 +37,7 @@ export default function Login(props) {
<div className="Login">
<form onSubmit={handleSubmit}>
<FormGroup controlId="email" bsSize="large">
<ControlLabel>Email</ControlLabel>
<FormLabel>Email</FormLabel>
<FormControl
autoFocus
type="email"
Expand All @@ -46,7 +46,7 @@ export default function Login(props) {
/>
</FormGroup>
<FormGroup controlId="password" bsSize="large">
<ControlLabel>Password</ControlLabel>
<FormLabel>Password</FormLabel>
<FormControl
value={password}
onChange={e => setPassword(e.target.value)}
Expand Down
10 changes: 5 additions & 5 deletions _chapters/create-the-signup-form.md
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ import {
HelpBlock,
FormGroup,
FormControl,
ControlLabel
FormLabel
} from "react-bootstrap";
import LoaderButton from "../components/LoaderButton";
import { useFormFields } from "../libs/hooksLib";
Expand Down Expand Up @@ -68,7 +68,7 @@ export default function Signup(props) {
return (
<form onSubmit={handleConfirmationSubmit}>
<FormGroup controlId="confirmationCode" bsSize="large">
<ControlLabel>Confirmation Code</ControlLabel>
<FormLabel>Confirmation Code</FormLabel>
<FormControl
autoFocus
type="tel"
Expand All @@ -94,7 +94,7 @@ export default function Signup(props) {
return (
<form onSubmit={handleSubmit}>
<FormGroup controlId="email" bsSize="large">
<ControlLabel>Email</ControlLabel>
<FormLabel>Email</FormLabel>
<FormControl
autoFocus
type="email"
Expand All @@ -103,15 +103,15 @@ export default function Signup(props) {
/>
</FormGroup>
<FormGroup controlId="password" bsSize="large">
<ControlLabel>Password</ControlLabel>
<FormLabel>Password</FormLabel>
<FormControl
type="password"
value={fields.password}
onChange={handleFieldChange}
/>
</FormGroup>
<FormGroup controlId="confirmPassword" bsSize="large">
<ControlLabel>Confirm Password</ControlLabel>
<FormLabel>Confirm Password</FormLabel>
<FormControl
type="password"
onChange={handleFieldChange}
Expand Down
2 changes: 1 addition & 1 deletion _chapters/give-feedback-while-logging-in.md
Original file line number Diff line number Diff line change
Expand Up @@ -116,7 +116,7 @@ Now we can use our new component in our `Login` container.
<img class="code-marker" src="/assets/s.png" />Also, import the `LoaderButton` in the header. And remove the reference to the `Button` component.

``` javascript
import { FormGroup, FormControl, ControlLabel } from "react-bootstrap";
import { FormGroup, FormControl, FormLabel } from "react-bootstrap";
import LoaderButton from "../components/LoaderButton";
```

Expand Down
10 changes: 5 additions & 5 deletions _chapters/handle-forgot-and-reset-password.md
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ import {
FormGroup,
Glyphicon,
FormControl,
ControlLabel
FormLabel
} from "react-bootstrap";
import LoaderButton from "../components/LoaderButton";
import "./ResetPassword.css";
Expand Down Expand Up @@ -104,7 +104,7 @@ export default class ResetPassword extends Component {
return (
<form onSubmit={this.handleSendCodeClick}>
<FormGroup bsSize="large" controlId="email">
<ControlLabel>Email</ControlLabel>
<FormLabel>Email</FormLabel>
<FormControl
autoFocus
type="email"
Expand All @@ -129,7 +129,7 @@ export default class ResetPassword extends Component {
return (
<form onSubmit={this.handleConfirmClick}>
<FormGroup bsSize="large" controlId="code">
<ControlLabel>Confirmation Code</ControlLabel>
<FormLabel>Confirmation Code</FormLabel>
<FormControl
autoFocus
type="tel"
Expand All @@ -143,15 +143,15 @@ export default class ResetPassword extends Component {
</FormGroup>
<hr />
<FormGroup bsSize="large" controlId="password">
<ControlLabel>New Password</ControlLabel>
<FormLabel>New Password</FormLabel>
<FormControl
type="password"
value={this.state.password}
onChange={this.handleChange}
/>
</FormGroup>
<FormGroup bsSize="large" controlId="confirmPassword">
<ControlLabel>Confirm Password</ControlLabel>
<FormLabel>Confirm Password</FormLabel>
<FormControl
type="password"
onChange={this.handleChange}
Expand Down
4 changes: 2 additions & 2 deletions _chapters/ko/add-the-create-note-page.md
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ comments_id: add-the-create-note-page/107

``` coffee
import React, { Component } from "react";
import { FormGroup, FormControl, ControlLabel } from "react-bootstrap";
import { FormGroup, FormControl, FormLabel } from "react-bootstrap";
import LoaderButton from "../components/LoaderButton";
import config from "../config";
import "./NewNote.css";
Expand Down Expand Up @@ -73,7 +73,7 @@ export default class NewNote extends Component {
/>
</FormGroup>
<FormGroup controlId="file">
<ControlLabel>Attachment</ControlLabel>
<FormLabel>Attachment</FormLabel>
<FormControl onChange={this.handleFileChange} type="file" />
</FormGroup>
<LoaderButton
Expand Down
8 changes: 4 additions & 4 deletions _chapters/ko/create-a-billing-form.md
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ $ npm install --save react-stripe-elements
{% raw %}
``` coffee
import React, { Component } from "react";
import { FormGroup, FormControl, ControlLabel } from "react-bootstrap";
import { FormGroup, FormControl, FormLabel } from "react-bootstrap";
import { CardElement, injectStripe } from "react-stripe-elements";
import LoaderButton from "./LoaderButton";
import "./BillingForm.css";
Expand Down Expand Up @@ -81,7 +81,7 @@ class BillingForm extends Component {
return (
<form className="BillingForm" onSubmit={this.handleSubmitClick}>
<FormGroup bsSize="large" controlId="storage">
<ControlLabel>Storage</ControlLabel>
<FormLabel>Storage</FormLabel>
<FormControl
min="0"
type="number"
Expand All @@ -92,15 +92,15 @@ class BillingForm extends Component {
</FormGroup>
<hr />
<FormGroup bsSize="large" controlId="name">
<ControlLabel>Cardholder&apos;s name</ControlLabel>
<FormLabel>Cardholder&apos;s name</FormLabel>
<FormControl
type="text"
value={this.state.name}
onChange={this.handleFieldChange}
placeholder="Name on the card"
/>
</FormGroup>
<ControlLabel>Credit Card Info</ControlLabel>
<FormLabel>Credit Card Info</FormLabel>
<CardElement
className="card-field"
onChange={this.handleCardFieldChange}
Expand Down
6 changes: 3 additions & 3 deletions _chapters/ko/create-a-login-page.md
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@ comments_id: create-a-login-page/71

``` coffee
import React, { Component } from "react";
import { Button, FormGroup, FormControl, ControlLabel } from "react-bootstrap";
import { Button, FormGroup, FormControl, FormLabel } from "react-bootstrap";
import "./Login.css";

export default class Login extends Component {
Expand Down Expand Up @@ -50,7 +50,7 @@ export default class Login extends Component {
<div className="Login">
<form onSubmit={this.handleSubmit}>
<FormGroup controlId="email" bsSize="large">
<ControlLabel>Email</ControlLabel>
<FormLabel>Email</FormLabel>
<FormControl
autoFocus
type="email"
Expand All @@ -59,7 +59,7 @@ export default class Login extends Component {
/>
</FormGroup>
<FormGroup controlId="password" bsSize="large">
<ControlLabel>Password</ControlLabel>
<FormLabel>Password</FormLabel>
<FormControl
value={this.state.password}
onChange={this.handleChange}
Expand Down
10 changes: 5 additions & 5 deletions _chapters/ko/create-the-signup-form.md
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ import {
HelpBlock,
FormGroup,
FormControl,
ControlLabel
FormLabel
} from "react-bootstrap";
import LoaderButton from "../components/LoaderButton";
import "./Signup.css";
Expand Down Expand Up @@ -78,7 +78,7 @@ export default class Signup extends Component {
return (
<form onSubmit={this.handleConfirmationSubmit}>
<FormGroup controlId="confirmationCode" bsSize="large">
<ControlLabel>Confirmation Code</ControlLabel>
<FormLabel>Confirmation Code</FormLabel>
<FormControl
autoFocus
type="tel"
Expand All @@ -104,7 +104,7 @@ export default class Signup extends Component {
return (
<form onSubmit={this.handleSubmit}>
<FormGroup controlId="email" bsSize="large">
<ControlLabel>Email</ControlLabel>
<FormLabel>Email</FormLabel>
<FormControl
autoFocus
type="email"
Expand All @@ -113,15 +113,15 @@ export default class Signup extends Component {
/>
</FormGroup>
<FormGroup controlId="password" bsSize="large">
<ControlLabel>Password</ControlLabel>
<FormLabel>Password</FormLabel>
<FormControl
value={this.state.password}
onChange={this.handleChange}
type="password"
/>
</FormGroup>
<FormGroup controlId="confirmPassword" bsSize="large">
<ControlLabel>Confirm Password</ControlLabel>
<FormLabel>Confirm Password</FormLabel>
<FormControl
value={this.state.confirmPassword}
onChange={this.handleChange}
Expand Down
Loading