alexbenic

import React, { Component } from 'react';
import { Pagination as ReactBootstrapPagination } from 'react-bootstrap';

interface PaginationProps extends ReactBootstrapPagination.PaginationProps {
  onPaginationItemClick: React.MouseEventHandler;
  totalPages: number;
  activePage: number;
}

export class Pagination extends Component<PaginationProps> {

alexbenic

return (
  <div>
    <div style={{ marginBottom: "25px" }}>
      <input
        type="text"
        style={inputStyle}
        value={this.state.filter}
        onChange={evt => this.handleChange(evt)}
        tabIndex={0}
      />

alexbenic

const NotFound = () => {
  return (
    <Fragment>
      <Header />
      <div className="f1 mesaure center mv4 tc w-100">404</div>
    </Fragment>
  );
};

alexbenic

class App extends Component {
  constructor(props) {
    super(props);

    this.state = {};
  }

  render() {
    return (
      <div></div>

alexbenic

render() {
  return (
    <Router>
      <Switch>
	<Route exact path="/" 
		render={() => <Redirect to="/one" />} />
	<Route exact path="/one" component={Lorem} />
	<Route exact path="/two" component={Lorem} />
	<Route exact path="/three" component={Lorem} />
	<Route component={NotFound} />

alexbenic

render() {
  return(
    <div 
      className="helvetica f2">
      <input className="ma2 pa1" 
          onChange={this.handleChange("firstName")} />
      <input className="ma2 pa1" 
          onChange={this.handleChange("lastName")} />
      <div className="ma2">
        {`Hello ${this.state.firstName} ${this.state.lastName}`}

alexbenic

render() {
  return React.createElement(
    "div",
    {
      className:
      "helvetica vh-100 vw-100 flex flex-column items-center justify-center f2"
    },
    [
      React.createElement("input", {
        className: "ma2 pa1",

alexbenic

Principles of Adult Behavior

1. Be patient. No matter what.
2. Don’t badmouth: Assign responsibility, not blame. Say nothing of another you wouldn’t say to him.
3. Never assume the motives of others are, to them, less noble than yours are to you.
4. Expand your sense of the possible.
5. Don’t trouble yourself with matters you truly cannot change.
6. Expect no more of anyone than you can deliver yourself.
7. Tolerate ambiguity.
8. Laugh at yourself frequently.

alexbenic

set noautofocus
let blacklists = ["*://www.draw.io/*"]

alexbenic

CSS Layout Debugger

A tweet-sized debugger for visualizing your CSS layouts. Outlines every DOM element on your page a random (valid) CSS hex color.

One-line version to paste in your DevTools

Use $$ if your browser aliases it:

~ 108 byte version