FazBrowse GitHub Viewer | Trending | | Home

Tools: [Download Repo ZIP] [View Raw Code] [Original HTTPS Page]

50Projects-HTML-CSS-JavaScript/Source-Code/ChatApp/style.css at main · aushmish/50Projects-HTML-CSS-JavaScript · GitHub

82 lines (72 loc) · 1.2 KB

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

44

45

46

47

48

49

50

51

52

53

54

55

56

57

58

59

60

61

62

63

64

65

66

67

68

69

70

71

72

73

74

75

76

77

78

79

80

81

82

body {

font-family: Arial, sans-serif;

background-color: #cbdc30;

margin: 0;

padding: 0;

display: flex;

justify-content: center;

align-items: center;

height: 100vh;

}

.chat-container {

background-color: #fff;

border-radius: 8px;

box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);

width: 400px;

padding: 20px;

}

h1 {

text-align: center;

color: #333;

}

.chat-box {

background-color: #f9f9f9;

border: 1px solid #ddd;

border-radius: 8px;

padding: 10px;

height: 300px;

overflow-y: auto;

margin-bottom: 10px;

}

.chat-box .message {

display: flex;

flex-direction: column;

margin: 5px 0;

padding: 10px;

border-radius: 12px 2px;

font-size: 14px;

}

.message.user {

background-color: #cdf2f7;

color: #025f54;

float: right;

width: 50%;

}

.message.bot {

background-color: #fbcfdd;

color: #d81b60;

float: left;

width: 50%;

}

form {

display: flex;

}

input[type="text"] {

flex: 1;

padding: 10px;

border: 1px solid #ddd;

border-radius: 4px;

font-size: 14px;

}

button {

padding: 10px 20px;

border: none;

background-color: #049786;

color: white;

font-size: 14px;

border-radius: 4px;

cursor: pointer;

}

button:hover {

background-color: #005f4b;

}

Back | FazBrowse Home | New Git URL