Hugging Face's logo

Spaces:
cyberbuddies
/
cyberbuddies_AI
Running

App Files Community
EbubeJohnEnyi commited on
Commit
d018552
•
1 Parent(s): da9aae7

Update style.css

Browse files
Files changed (1) hide show
  1. style.css +78 -23
style.css CHANGED
@@ -1,28 +1,83 @@
1
- body {
2
- padding: 2rem;
3
- font-family: -apple-system, BlinkMacSystemFont, "Arial", sans-serif;
4
  }
5
-
6
- h1 {
7
- font-size: 16px;
8
- margin-top: 0;
 
 
 
9
  }
10
-
11
- p {
12
- color: rgb(107, 114, 128);
13
- font-size: 15px;
14
- margin-bottom: 10px;
15
- margin-top: 5px;
 
 
16
  }
17
-
18
- .card {
19
- max-width: 620px;
20
- margin: 0 auto;
21
- padding: 16px;
22
- border: 1px solid lightgray;
23
- border-radius: 16px;
24
  }
25
-
26
- .card p:last-child {
27
- margin-bottom: 0;
 
 
 
 
 
 
 
 
28
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ * {
2
+ /* outline: red solid 1px; */
 
3
  }
4
+ .chat-container {
5
+ width: 100%;
6
+ height: fit-content;
7
+ display: flex;
8
+ flex-direction: column;
9
+ align-items: center;
10
+ justify-content: center;
11
  }
12
+ .logo-container {
13
+ display: flex;
14
+ flex-direction: column;
15
+ align-items: center;
16
+ width: fit-content;
17
+ height: fit-content;
18
+ margin: auto;
19
+ margin-bottom: 20px;
20
  }
21
+ .logo-container p {
22
+ color: #0C0F15;
23
+ font-family: Inter;
24
+ font-size: 20px;
25
+ font-style: normal;
26
+ font-weight: 700;
27
+ line-height: 30px;
28
  }
29
+ .chatBot_area{
30
+ display: flex;
31
+ flex-direction: column;
32
+ justify-content: center;
33
+ align-items: center;
34
+ width: 70%;
35
+ height: fit-content;
36
+ }
37
+ .displayArea {
38
+ width: 100%;
39
+ height: fit-content;
40
  }
41
+ .chatBot_area form {
42
+ width: 100%;
43
+ padding: 10px;
44
+ }
45
+ .chatBot_area form input{
46
+ display: flex;
47
+ width: 80%;
48
+ padding: 15px 10px;
49
+ border-radius: 8px;
50
+ border: 1px solid var(--Greys-Grey-700, #A0A3AA);
51
+ padding: 10px;
52
+ font-size: 14px;
53
+ flex: 1;
54
+ }
55
+ .chatBot_area form button {
56
+ background-color: #E7EBF2;
57
+ border: none;
58
+ padding: 10px;
59
+ border-radius: 5px;
60
+ cursor: pointer;
61
+ }
62
+
63
+ /*MOBILE DEVICES*/
64
+ @media only screen and (max-width: 767px) {
65
+ .chat-container {
66
+ padding: 20px;
67
+ }
68
+ .chatBot_area{
69
+ width: 90%;
70
+ }
71
+ .displayArea {
72
+ width: 100%;
73
+ height: fit-content;
74
+ }
75
+ .chatBot_area form {
76
+ width: 100%;
77
+ padding: 10px;
78
+ }
79
+ .chatBot_area form input{
80
+ display: flex;
81
+ width: 60%;
82
+ }
83
+ }