diff --git a/package-lock.json b/package-lock.json index c8dbce2..c1732c7 100644 --- a/package-lock.json +++ b/package-lock.json @@ -5396,6 +5396,11 @@ "resolved": "https://registry.npmjs.org/follow-redirects/-/follow-redirects-1.14.9.tgz", "integrity": "sha512-MQDfihBQYMcyy5dhRDJUHcw7lb2Pv/TuE6xP1vyraLukNDHKbDxDNaOE3NbCAdKQApno+GPRyo1YAp89yCjK4w==" }, + "font-awesome": { + "version": "4.7.0", + "resolved": "https://registry.npmjs.org/font-awesome/-/font-awesome-4.7.0.tgz", + "integrity": "sha1-j6jPBBGhoxr9B7BtKQK7n8gVoTM=" + }, "fork-ts-checker-webpack-plugin": { "version": "6.5.0", "resolved": "https://registry.npmjs.org/fork-ts-checker-webpack-plugin/-/fork-ts-checker-webpack-plugin-6.5.0.tgz", diff --git a/package.json b/package.json index 7946932..959e824 100644 --- a/package.json +++ b/package.json @@ -6,6 +6,7 @@ "@testing-library/jest-dom": "^5.16.2", "@testing-library/react": "^12.1.4", "@testing-library/user-event": "^13.5.0", + "font-awesome": "^4.7.0", "react": "^17.0.2", "react-dom": "^17.0.2", "react-scripts": "5.0.0", diff --git a/src/App.css b/src/App.css index 60ff72a..8e5f642 100644 --- a/src/App.css +++ b/src/App.css @@ -2,8 +2,11 @@ @tailwind components; @tailwind utilities; +@import url("https://fonts.googleapis.com/css2?family=Quicksand&display=swap"); + .App { text-align: center; + font-family: qicksand, arial; } .App-logo { diff --git a/src/App.js b/src/App.js index fb272f4..d223c0f 100644 --- a/src/App.js +++ b/src/App.js @@ -1,9 +1,10 @@ -import Eingabefelder from "./Components/eingabefelder"; +import Eingabefeld from "./Components/eingabefeld"; +import "../node_modules/font-awesome/css/font-awesome.min.css"; function App() { return (
- +

tets

); diff --git a/src/Components/eingabefelder.jsx b/src/Components/eingabefeld.jsx similarity index 83% rename from src/Components/eingabefelder.jsx rename to src/Components/eingabefeld.jsx index b3b8a74..1327044 100644 --- a/src/Components/eingabefelder.jsx +++ b/src/Components/eingabefeld.jsx @@ -5,8 +5,10 @@ function Eingabefeld(props) { return (
+
setPollName(e.target.value)} value={usepollName} placeholder={props.placeholder} + type={props.isPassword ? "password" : "text"} />
); diff --git a/src/Components/liste.jsx b/src/Components/liste.jsx new file mode 100644 index 0000000..a6c6457 --- /dev/null +++ b/src/Components/liste.jsx @@ -0,0 +1,11 @@ +import React, { useState } from "react"; + +function Liste(props) { + return ( +
+ +
+ ); +} + +export default Liste; diff --git a/src/index.css b/src/index.css index 17df0e7..a482539 100644 --- a/src/index.css +++ b/src/index.css @@ -4,14 +4,16 @@ body { margin: 0; - font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', - 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', - sans-serif; + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", + "Droid Sans", "Helvetica Neue", sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } code { - font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', - monospace; + font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New", monospace; +} + +input { + font-family: FontAwesome; }