WiskerBottom.github.io/styles.css at main · WiskerBottom/WiskerBottom.github.io · GitHub

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
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
body {
  margin: 0;
  font-family: 'Helvetica Neue', Arial, sans-serif;
  background: #0d111e;
  color: #f8f9fa;
}

.navbar {
  background: #1f2851;
  padding: 1rem 2rem;
  box-shadow: 0 2px 4px rgba(0,0,0,0.3);
}
.nav-container .logo {
  text-decoration: none;
  font-size: 1.5rem;
  font-weight: bold;
  color: #f8f9fa;
}

.layout {
  display: flex;
  padding: 2rem;
  gap: 2rem;
}

.sidebar {
  position: sticky; /* Add this line */
  top: 25; /* Add this line */
  height: 100vh; /* Add this line */
  width: 250px;
  background: rgba(255,255,255,0.05);
  border-radius: 8px;
  padding: 1.5rem;
}

.sidebar h2 {
  margin: 0;
  font-size: 1.5rem;
  color: #8ab4f8;
}

.sidebar ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.sidebar li {
  padding: 0.5rem 0;
  font-size: 1.125rem;
  border-bottom: 1px solid rgba(255,255,255,0.1);
}

.recipes {
  flex: 1;
}

.lightBlueContainer {
  background: #193149;
  padding: 1.5rem;
  border-radius: 8px;
}

.lightBlueContainer h3 {
  margin: 1rem;
  font-size: 2rem;
  color: #a5d8ff;
  text-align: center;
}

.textbox {
  margin: 1rem;
  background-color:  rgb(26,30,43); /* edit here rgb 13, 17, 30 */
  color: #f8f9fa;
  border-radius: 16px;
}

.textbox h3 {
  margin: 1rem;
  font-size: 2rem;
  color: #a5d8ff;
  text-align: center;
}

.textbox p {
  font-size: 1.1rem;
  margin-left: 4rem; /* Increased from 1rem to 2rem */
  margin-right: 4rem; /* Added right margin property */
  line-height: 1.5; /* Added line-height property to double-space text */
}

.textbox li {
  font-size: 1.1rem;
  margin-left: 4rem; /* Increased from 1rem to 2rem */
  margin-right: 4rem; /* Added right margin property */
  line-height: 1.5; /* Added line-height property to double-space text */
}

.lightBlueContainer img {
  display: block;
  background-color: rgba(255,255,255,0.05);
  margin: 2rem auto; /* Added top and bottom margins */
  border-radius: 16px;
}

.code-box {
  margin-left: 5rem;
  margin-right: 7rem;
  padding: 1rem;
  background-color: rgb(36, 39, 51);
  border-radius: 8px;
}

.code-box code {
  font-family: monospace, monaco, consolas, courier new;
  font-size: 1rem;
  color: #ffffff;
}

a {
  color: inherit; /* Inherit the text color from the parent element */
  text-decoration: underline; /* Add an underline to the hyperlink */
}

.chart-container {
  border-radius: 8px;
  padding: 1rem;
  background: #193149;
  margin: auto;
  width: 50%;
  height: 10%;
}