import InputAmount from './components/inputs/InputAmount';

function App(props) {
  // const { } = props;

  return (
    <div className="container py-5">
      <InputAmount />

      <hr />

      <div className="alert alert-primary">
        <h2>
          Übung 13: InputAmount um <strong>min</strong> und <strong>max</strong> Werte erweitern
        </h2>
        <p>
          Endlich sind wir in der Lage die Anzahl in unserer <strong>InputAmount</strong>-Komponente zu verändern und
          über der <strong>useState</strong>-Hook ein Rerendering der Komponente auszulösen.
        </p>
        <p>
          Jetzt bist du gefragt: Erweitere die <strong>InputAmount</strong> Komponente, sodass der Wert des Eingabefelds
          auf einen Bereich zwischen 0 und 10 begrenzt ist. Wenn der Benutzer versucht, den Wert unter 0 oder über 10 zu
          setzen, soll der Wert auf 0 bzw. 10 gesetzt werden und der entsprechende Button deaktiviert werden.
        </p>
        <p>
          <strong>Hinweis:</strong> In React kannst du das <strong>disabled</strong>-Attribut auf einem Button
          verwenden, um ihn zu deaktivieren. Wenn der zugewiesene Wert true ist, wird der Button deaktiviert,
          andernfalls bleibt er aktiv. Die Syntax sieht wie folgt aus
        </p>
      </div>
    </div>
  );
}
export default App;