openobserve-docs/input.css at main · openobserve/openobserve-docs · 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
@tailwind base;
@tailwind components;
@tailwind utilities;

@layer utilities {
  .hover\:text-\[\#7782FF\]:hover {
    color: #7782ff;
  }
}

.hero-gradient {
  background: linear-gradient(to right, #6a76e3, #45a4f3);
}

input {
  color: #ffffff;
}

.custom-gradient {
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.75) 0%,
    rgba(255, 255, 255, 0.5) 60%,
    rgba(255, 255, 255, 0.3) 100%
  );
}

.theme-purple {
  --color-primary-purple: rgba(107, 118, 227);
  color: var(--color-primary-purple);
  --color-card: rgba(107, 118, 227, 0.2);
  --color-hover-card: rgba(126, 34, 206);
  --color-tabs-background: rgba(107, 118, 227);
  --color-tabs-title-text: rgba(107, 118, 227);
}

html {
  margin: 0;
  width: 100%;
  font-family: "Inter", sans-serif;
  scroll-behavior: smooth;
  scroll-padding-top: 8rem;
  /* height: 100%; removed to prevent extra space at the bottom */
}

main {
  min-height: calc(100vh - 8rem);
  padding-top: 3rem;
}

.primary-button {
  position: relative;
  border: none;
  color: white;
  cursor: pointer;
  border-radius: 8px;
  background-origin: border-box;
  background-clip: padding-box, border-box;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  background: linear-gradient(135deg, #5b66e8 0%, #3b82f6 100%);
  border: 1px solid transparent;
  box-shadow:
    0 4px 6px -1px rgba(0, 0, 0, 0.1),
    0 2px 4px -2px rgba(0, 0, 0, 0.1);
  overflow: hidden;
  font-size: 12px;
}

.primary-button:hover {
  box-shadow:
    0 10px 15px -3px rgba(91, 102, 232, 0.4),
    0 4px 6px -4px rgba(91, 102, 232, 0.3);
  transform: translateY(-1px);
}

.primary-button:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  background-image:
    linear-gradient(180deg, #8cc7ff 0%, #7ab7ff 100%),
    linear-gradient(180deg, #8cc7ff 0%, #7ab7ff 100%);
  box-shadow: none;
}

.secondary-button {
  position: relative;
  color: #374151;
  cursor: pointer;
  border-radius: 8px;
  background: transparent;
  border: 1px solid #e5e7eb;
  font-size: 12px;
  font-weight: 600;
  transition: all 0.2s;
}

.secondary-button:hover {
  border-color: #a5b4fc;
  color: #4f46e5;
}

.secondary-button:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  border-color: #cccccc;
  /* Light gray border for disabled state */
  background: transparent;
  box-shadow: none;
}

.gradient-hover {
  background: linear-gradient(to left, #6a76e3, #45a4f3);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.header-list-style {
  list-style: none;
}