新增筛选功能

This commit is contained in:
al 2024-08-23 14:06:27 +08:00
parent b95d707f71
commit 03ca571f07
4 changed files with 319 additions and 220 deletions

View File

@ -22,6 +22,9 @@ export default function MySlider({
defaultValue = 0,
disabled = false,
thumbSize = 25,
stepValues = [],
itemKey,
hasInfinity,
leftValue = 0,
rightValue = 0,
thumbImage = null,
@ -34,6 +37,7 @@ export default function MySlider({
const [leftProcess, setLeftProcess] = useState(0);
const [rightProcess, setRightProcess] = useState(0);
const [stepNum, setStepNum] = useState(stepValues.length - 1);
const [processWidth, setProcessWidth] = useState(330);
const tailwind = useTailwind();
const leftWatcher = useRef(null);
@ -53,26 +57,20 @@ export default function MySlider({
onPanResponderMove: _onPanResponderMoveRight, //
onPanResponderEnd: _onPanResponderEndRight, //
});
const currentLeftProcess = 0;
const currentRightProcess = 1;
// leftProcess.current = currentLeftProcess;
setLeftProcess(currentLeftProcess);
// rightProcess.current = currentRightProcess;
setRightProcess(currentRightProcess);
// setRightProcess(rightProcess);
setProcessWidth(width - thumbSize * 2);
console.log("rightProcess", currentRightProcess);
}, []);
useEffect(() => {
onChange({
lower_bound: Math.floor(
leftProcess * (upper_bound - lower_bound) + lower_bound
),
upper_bound: Math.floor(
rightProcess * (upper_bound - lower_bound) + lower_bound
),
});
}, [leftProcess, rightProcess]);
// if(itemKey)
const currentLeftProcess = 0;
const currentRightProcess =
(stepValues.indexOf(rightValue) * step - lower_bound) /
(upper_bound - lower_bound);
setLeftProcess(currentLeftProcess);
setRightProcess(currentRightProcess);
}, [leftValue, rightValue]);
// useEffect(() => {
// }, [leftProcess, rightProcess]);
//
const _onPanResponderGrantLeft = (e, gestureState) => {
const process = (gestureState.x0 - 40 - thumbSize / 2) / processWidth;
@ -88,7 +86,6 @@ export default function MySlider({
const process =
(gestureState.x0 - 40 - thumbSize / 2 + gestureState.dx) / processWidth;
_changeProcess(process, "left");
console.log("newValue_left", gestureState.x0, gestureState.dx, process);
};
//
@ -106,7 +103,6 @@ export default function MySlider({
const process =
(gestureState.x0 - 40 - thumbSize / 2 + gestureState.dx) / processWidth;
_changeProcess(process, "right");
// console.log("process", processWidth);
};
const _changeProcess = (changeProcess, direction) => {
//
@ -115,18 +111,36 @@ export default function MySlider({
//
const v = changeProcess * (upper_bound - lower_bound);
const newValue = Math.round(v / step) * step;
const newProcess = newValue / (upper_bound - lower_bound);
const newProcess = Math.round(newValue) / (upper_bound - lower_bound);
setStepNum(stepNum + 1);
if (process !== newProcess) {
if (direction == "left") {
if (newProcess < rightProcess) {
setLeftProcess(newProcess);
setStepNum((old) => old + 1);
onChange({
lower_bound: Math.round(
leftProcess * (upper_bound - lower_bound) + lower_bound
),
upper_bound: rightValue,
});
}
} else {
if (newProcess > leftProcess) {
console.log("newValue", newProcess, rightProcess);
// rightProcess.current = newProcess;
setRightProcess(newProcess);
setStepNum((old) => old - 1);
onChange({
lower_bound: leftValue,
upper_bound:
stepValues[
Math.round(
(newProcess * (upper_bound - lower_bound) + lower_bound) /
step
)
],
});
// setStepNum(stepNum - 1);
}
}
}
@ -232,7 +246,7 @@ export default function MySlider({
color: "#ff75c8",
}}
>
{Math.floor(leftProcess * (upper_bound - lower_bound) + lower_bound)}
{Math.round(leftProcess * (upper_bound - lower_bound) + lower_bound)}
</Text>
<Text
style={{
@ -246,11 +260,18 @@ export default function MySlider({
<Text
style={{
...tailwind("text-white text-lg"),
maxWidth: thumbSize * 2,
// maxWidth: thumbSize * 2,
color: "#ff75c8",
}}
>
{Math.floor(rightProcess * (upper_bound - lower_bound) + lower_bound)}
{hasInfinity && rightProcess == 1
? ">" + upper_bound
: stepValues[
Math.round(
(rightProcess * (upper_bound - lower_bound) + lower_bound) /
step
)
]}
</Text>
<Text
style={{
@ -284,7 +305,7 @@ export default function MySlider({
color: "#ffffff80",
}}
>
{upper_bound}
{hasInfinity ? ">" + upper_bound : upper_bound}
</Text>
</View>
);

View File

@ -4,6 +4,7 @@ import {
Image as NativeImage,
ScrollView,
TouchableOpacity,
Dimensions,
} from "react-native";
import React, { useState, useEffect, useRef } from "react";
import { useTailwind } from "tailwind-rn";
@ -26,13 +27,15 @@ import { generateSignature } from "../../utils/crypto";
import MyDivider from "../../components/MyDivider/index";
import MySlider from "../../components/MySlider";
import Picker from "../../components/Picker";
import { get } from "../../utils/storeInfo";
export default function Search({ navigation, route }) {
const tailwind = useTailwind();
const insets = useSafeAreaInsets();
const searchRef = useRef(null);
const screenDimensions = Dimensions.get("screen");
const [search, setSearch] = useState("");
const [isMember, setIsMember] = useState(0);
const [streamers, setStreamers] = useState([]);
const [recommList, setRecommList] = useState([]);
const [zones, setZones] = useState([]);
@ -46,21 +49,25 @@ export default function Search({ navigation, route }) {
name: "年龄",
upper_bound: 60,
lower_bound: 18,
default: 24,
default: 19,
step: 1,
type: "slider",
unit: "岁",
key: "age",
stepValues: Array(61)
.fill(null)
.map((_, index) => index),
},
{
name: "全网粉丝",
upper_bound: 200,
lower_bound: 1,
default: 24,
step: 1,
step: 200 / 10,
type: "slider",
unit: "万",
key: "fans",
stepValues: [1, 3, 5, 10, 20, 50, 75, 100, 150, 200, 1000],
},
{
name: "身高",
@ -71,6 +78,9 @@ export default function Search({ navigation, route }) {
type: "slider",
unit: "CM",
key: "height",
stepValues: Array(201)
.fill(null)
.map((_, index) => index),
},
{
name: "体重",
@ -81,6 +91,9 @@ export default function Search({ navigation, route }) {
type: "slider",
unit: "KG",
key: "weight",
stepValues: Array(101)
.fill(null)
.map((_, index) => index),
},
{
name: "所在地",
@ -166,34 +179,36 @@ export default function Search({ navigation, route }) {
upper_bound: 200,
lower_bound: 0,
default: 24,
step: 1,
step: 200 / 7,
type: "slider",
unit: "¥",
key: "zone",
stepValues: [0, 1, 10, 50, 100, 150, 200, 4000],
},
{
name: "微信价格",
upper_bound: 10000,
upper_bound: 200,
lower_bound: 0,
default: 24,
step: 1,
step: 200 / 8,
type: "slider",
unit: "金币",
key: "wechat",
stepValues: [0, 10, 100, 200, 500, 1000, 5000, 10000, 100000],
},
];
const [filtersValue, setFiltersValue] = useState({
age: { lower_bound: 18, upper_bound: 60 },
fans: { lower_bound: 1, upper_bound: 200 },
fans: { lower_bound: 1, upper_bound: 1000 },
height: { lower_bound: 140, upper_bound: 200 },
weight: { lower_bound: 35, upper_bound: 100 },
city: "",
constellation: "",
is_active_within_a_week: 0,
zone_admission_price: { lower_bound: 0, upper_bound: 9999 },
wechat_coin_price: { lower_bound: 0, upper_bound: 9999 },
priceUsed: false,
comprehensiveUsed: false,
zone_admission_price: { lower_bound: 0, upper_bound: 4000 },
wechat_coin_price: { lower_bound: 0, upper_bound: 100000 },
priceUsed: { show: false, used: false },
comprehensiveUsed: { show: false, used: false },
});
const updateSearch = (search) => {
setSearch(search);
@ -204,6 +219,7 @@ export default function Search({ navigation, route }) {
//focus
useEffect(() => {
searchRef.current.focus();
getIsMember();
}, []);
//
@ -293,14 +309,6 @@ export default function Search({ navigation, route }) {
offset: 0,
limit: 20,
});
console.log(
JSON.stringify({
...base,
...querryParams,
offset: 0,
limit: 20,
})
);
const response = await fetch(`${apiUrl}${api}?signature=${signature}`, {
method: "POST",
headers: {
@ -322,7 +330,6 @@ export default function Search({ navigation, route }) {
});
return;
}
console.log("xxxx", data.data.streamer_list);
const zonesData = data.data.streamer_list.filter(
(item) => item.zones.length > 0
);
@ -334,23 +341,65 @@ export default function Search({ navigation, route }) {
console.error(error);
}
};
const getIsMember = async () => {
const apiUrl = process.env.EXPO_PUBLIC_API_URL;
let api;
api = "/api/account/list_by_mid";
const account = await get("account");
try {
const base = await baseRequest();
const signature = await generateSignature({
...base,
mid: account.mid,
});
const response = await fetch(`${apiUrl}${api}?signature=${signature}`, {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({
...base,
mid: account.mid,
}),
});
const data = await response.json();
setIsMember(data.data.account.is_a_member);
} catch (error) {
console.error(error);
}
};
//
const handleResetFiltersValue = (type) => {
setFiltersValue({
age: { lower_bound: 18, upper_bound: 60 },
fans: { lower_bound: 1, upper_bound: 200 },
weight: { lower_bound: 140, upper_bound: 200 },
height: { lower_bound: 35, upper_bound: 100 },
city: "",
constellation: "",
is_active_within_a_week: 0,
priceUsed:
type == "zone_admission_price" ? false : filtersValue.priceUsed,
comprehensiveUsed:
type == "comprehensive" ? false : filtersValue.priceUsed,
});
setRecommList([]);
setStreamers([]);
let obj = {};
if (type == "comprehensive") {
obj = {
...filtersValue,
age: { lower_bound: 18, upper_bound: 60 },
fans: { lower_bound: 1, upper_bound: 1000 },
weight: { lower_bound: 35, upper_bound: 100 },
height: { lower_bound: 140, upper_bound: 200 },
city: "",
constellation: "",
is_active_within_a_week: 0,
comprehensiveUsed: { show: false, used: false },
};
} else {
obj = {
...filtersValue,
zone_admission_price: { lower_bound: 0, upper_bound: 4000 },
wechat_coin_price: { lower_bound: 0, upper_bound: 100000 },
priceUsed: { show: false, used: false },
};
}
setFiltersValue((old) => ({
...old,
...obj,
}));
if (!obj.comprehensiveUsed.used && !obj.priceUsed.used) {
setRecommList([]);
setStreamers([]);
setZones([]);
}
};
//
const ZoneItem = ({ item }) => {
@ -591,10 +640,13 @@ export default function Search({ navigation, route }) {
showLoading={isloading}
onChangeText={updateSearch}
value={search}
disabled={
filtersValue.comprehensiveUsed.used || filtersValue.priceUsed.used
}
/>
</View>
<ScrollView style={tailwind("flex-1")}>
<View style={tailwind("flex-row justify-around")}>
<View style={tailwind("flex flex-row justify-around")}>
<TouchableOpacity
onPress={() => {
setIsFilterVisible({
@ -605,7 +657,7 @@ export default function Search({ navigation, route }) {
style={{
...tailwind("px-2 rounded-xl flex-row items-center"),
borderColor: "#ff75c8",
borderWidth: filtersValue.comprehensiveUsed ? 1 : 0,
borderWidth: filtersValue.comprehensiveUsed.used ? 1 : 0,
boxSizing: "border-box",
width: 110,
}}
@ -614,12 +666,14 @@ export default function Search({ navigation, route }) {
style={{
...tailwind("text-white text-lg font-medium"),
marginVertical: 6,
color: filtersValue.comprehensiveUsed ? "#ff75c8" : "#ffffff80",
color: filtersValue.comprehensiveUsed.used
? "#ff75c8"
: "#ffffff80",
}}
>
综合筛选
</Text>
{filtersValue.comprehensiveUsed && (
{filtersValue.comprehensiveUsed.used && (
<TouchableOpacity
onPress={() => handleResetFiltersValue("comprehensive")}
style={{ width: 24 }}
@ -644,7 +698,7 @@ export default function Search({ navigation, route }) {
style={{
...tailwind("px-2 rounded-xl flex-row items-center"),
borderColor: "#ff75c8",
borderWidth: filtersValue.priceUsed ? 1 : 0,
borderWidth: filtersValue.priceUsed.used ? 1 : 0,
boxSizing: "border-box",
width: 110,
}}
@ -653,12 +707,12 @@ export default function Search({ navigation, route }) {
style={{
...tailwind("text-white text-lg font-medium"),
marginVertical: 6,
color: filtersValue.priceUsed ? "#ff75c8" : "#ffffff80",
color: filtersValue.priceUsed.used ? "#ff75c8" : "#ffffff80",
}}
>
价格筛选
</Text>
{filtersValue.priceUsed && (
{filtersValue.priceUsed.used && (
<TouchableOpacity
onPress={() => handleResetFiltersValue("zone_admission_price")}
style={{ width: 24 }}
@ -674,19 +728,37 @@ export default function Search({ navigation, route }) {
)}
</TouchableOpacity>
</View>
<SafeAreaProvider>
<View
style={{
display: "flex",
flex: 1,
}}
>
<BottomSheet
isVisible={isFilterVisible.comprehensive}
style={{
paddingTop: 120,
}}
>
<View
style={{
// containerStyle={{ marginTop: 80 }}
backdropStyle={{ backgroundColor: "#0000004d" }}
scrollViewProps={{
contentContainerStyle: {
// paddingTop: 20,
backgroundColor: "black",
borderRadius: 12,
}}
>
},
onScroll: (event) => {
const { y } = event.nativeEvent.contentOffset;
if (y < -50) {
setIsFilterVisible({
zone_admission_price: false,
comprehensive: false,
});
}
},
}}
isVisible={isFilterVisible.comprehensive}
style={{
paddingTop: 110,
}}
>
<View>
{filters.map((item, index) => (
<View
style={{
@ -713,18 +785,37 @@ export default function Search({ navigation, route }) {
height={40}
lower_bound={item.lower_bound}
upper_bound={item.upper_bound}
leftValue={item.lower_bound}
rightValue={item.upper_bound}
itemKey={item.key}
leftValue={
item.key == "age"
? filtersValue.age.lower_bound
: item.key == "height"
? filtersValue.height.lower_bound
: item.key == "weight"
? filtersValue.weight.lower_bound
: filtersValue.fans.lower_bound
}
rightValue={
item.key == "age"
? filtersValue.age.upper_bound
: item.key == "height"
? filtersValue.height.upper_bound
: item.key == "weight"
? filtersValue.weight.upper_bound
: filtersValue.fans.upper_bound
}
step={item.step}
hasInfinity={item.key == "fans"}
stepValues={item.stepValues}
onChange={(value) => {
if (item.key == "age") {
setFiltersValue({ ...filtersValue, age: value });
setFiltersValue((old) => ({ ...old, age: value }));
} else if (item.key == "fans") {
setFiltersValue({ ...filtersValue, fans: value });
setFiltersValue((old) => ({ ...old, fans: value }));
} else if (item.key == "height") {
setFiltersValue({ ...filtersValue, height: value });
setFiltersValue((old) => ({ ...old, height: value }));
} else if (item.key == "weight") {
setFiltersValue({ ...filtersValue, weight: value });
setFiltersValue((old) => ({ ...old, weight: value }));
}
}}
maximumTrackTintColor="#ff75c81a"
@ -777,44 +868,56 @@ export default function Search({ navigation, route }) {
)}
</View>
))}
<View style={tailwind("flex-row justify-around mb-4")}>
<TouchableOpacity
style={{
...tailwind("text-white px-4 py-2 rounded-xl"),
marginVertical: 6,
backgroundColor: "#ffffff1a",
width: 120,
}}
onPress={() => handleResetFiltersValue("comprehensive")}
>
<Text
<View
style={{
...tailwind("flex-row justify-around mb-4"),
}}
>
{isMember == 1 && (
<TouchableOpacity
style={{
...tailwind(
"text-white text-lg font-medium text-center"
),
...tailwind("text-white px-4 py-2 rounded-xl"),
marginVertical: 6,
backgroundColor: "#ffffff1a",
width: 120,
}}
onPress={() => handleResetFiltersValue("comprehensive")}
>
重置
</Text>
</TouchableOpacity>
<Text
style={{
...tailwind(
"text-white text-lg font-medium text-center"
),
}}
>
重置
</Text>
</TouchableOpacity>
)}
<TouchableOpacity
onPress={() => {
setFiltersValue((old) => ({
...old,
comprehensiveUsed: true,
}));
setIsFilterVisible({
zone_admission_price: false,
comprehensive: false,
});
if (!isMember) {
navigation.navigate("WebWithoutHeader", {
uri: process.env.EXPO_PUBLIC_WEB_URL + "/vip",
});
return;
}
setFiltersValue((old) => ({
...old,
comprehensiveUsed: { show: false, used: true },
}));
getFiltersResult();
console.log("00000000");
}}
style={{
...tailwind("text-white px-4 py-2 rounded-xl"),
marginVertical: 6,
backgroundColor: "#ff75c8",
width: 120,
minWidth: 120,
}}
>
<Text
@ -824,22 +927,42 @@ export default function Search({ navigation, route }) {
),
}}
>
确定
{!isMember ? "开通VIP后即可筛选" : "确定"}
</Text>
</TouchableOpacity>
</View>
</View>
</BottomSheet>
<BottomSheet
backdropStyle={{ backgroundColor: "#0000004d" }}
scrollViewProps={{
contentContainerStyle: {
// paddingTop: 20,
backgroundColor: "black",
borderRadius: 12,
},
onScroll: (event) => {
const { y } = event.nativeEvent.contentOffset;
if (y < -50) {
setIsFilterVisible({
zone_admission_price: false,
comprehensive: false,
});
}
},
}}
isVisible={isFilterVisible.zone_admission_price}
style={{
paddingTop: 120,
paddingTop: 110,
}}
>
<View
style={{
backgroundColor: "black",
borderRadius: 12,
// flex: 1,
// position: "relative",
height: screenDimensions.height - 120,
}}
>
{priceFilters.map((item) => (
@ -867,20 +990,31 @@ export default function Search({ navigation, route }) {
height={40}
lower_bound={item.lower_bound}
upper_bound={item.upper_bound}
leftValue={item.lower_bound}
rightValue={item.upper_bound}
leftValue={
item.key == "zone"
? filtersValue.zone_admission_price.lower_bound
: filtersValue.wechat_coin_price.lower_bound
}
rightValue={
item.key == "zone"
? filtersValue.zone_admission_price.upper_bound
: filtersValue.wechat_coin_price.upper_bound
}
stepValues={item.stepValues}
step={item.step}
hasInfinity={true}
itemKey={item.key}
onChange={(value) => {
if (item.key == "zone") {
setFiltersValue({
...filtersValue,
setFiltersValue((old) => ({
...old,
zone_admission_price: value,
});
}));
} else if (item.key == "wechat") {
setFiltersValue({
...filtersValue,
setFiltersValue((old) => ({
...old,
wechat_coin_price: value,
});
}));
}
}}
maximumTrackTintColor="#ff75c81a"
@ -891,46 +1025,61 @@ export default function Search({ navigation, route }) {
/>
</View>
))}
<View style={tailwind("flex-row justify-around mb-4")}>
<TouchableOpacity
style={{
...tailwind("text-white px-4 py-2 rounded-xl"),
marginVertical: 6,
backgroundColor: "#ffffff1a",
width: 120,
}}
onPress={() =>
handleResetFiltersValue("zone_admission_price")
}
>
<Text
<View
style={{
...tailwind("flex-row justify-around mb-4"),
position: "absolute",
bottom: 0,
width: "100%",
}}
>
{isMember == 1 && (
<TouchableOpacity
style={{
...tailwind(
"text-white text-lg font-medium text-center"
),
...tailwind("text-white px-4 py-2 rounded-xl"),
marginVertical: 6,
backgroundColor: "#ffffff1a",
width: 120,
}}
onPress={() =>
handleResetFiltersValue("zone_admission_price")
}
>
重置
</Text>
</TouchableOpacity>
<Text
style={{
...tailwind(
"text-white text-lg font-medium text-center"
),
}}
>
重置
</Text>
</TouchableOpacity>
)}
<TouchableOpacity
onPress={() => {
setFiltersValue((old) => ({
...old,
priceUsed: true,
}));
setIsFilterVisible({
zone_admission_price: false,
comprehensive: false,
});
if (!isMember) {
navigation.navigate("WebWithoutHeader", {
uri: process.env.EXPO_PUBLIC_WEB_URL + "/vip",
});
return;
}
setFiltersValue((old) => ({
...old,
priceUsed: { show: false, used: true },
}));
getFiltersResult();
// console.log("00000000");
}}
style={{
...tailwind("text-white px-4 py-2 rounded-xl"),
marginVertical: 6,
backgroundColor: "#ff75c8",
width: 120,
minWidth: 120,
}}
>
<Text
@ -940,13 +1089,13 @@ export default function Search({ navigation, route }) {
),
}}
>
确定
{!isMember ? "开通VIP后即可筛选" : "确定"}
</Text>
</TouchableOpacity>
</View>
</View>
</BottomSheet>
</SafeAreaProvider>
</View>
<View style={tailwind("flex-1 px-4")}>
{zones.length > 0 && (
<Text style={tailwind("mt-2 text-white text-xl font-medium")}>
@ -965,7 +1114,7 @@ export default function Search({ navigation, route }) {
{streamers?.map((item, index) => (
<StreamerItem key={index} item={item} />
))}
{streamers.length > 0 && <MyDivider style={tailwind("my-2")} />}
{recommList.length > 0 && <MyDivider style={tailwind("my-2")} />}
{recommList.length > 0 && (
<Text style={tailwind("mt-2 text-white text-xl font-medium")}>
猜你喜欢

View File

@ -149,10 +149,6 @@
margin-left: 1rem
}
.ml-\[3\.2rem\] {
margin-left: 3.2rem
}
.ml-auto {
margin-left: auto
}
@ -241,8 +237,8 @@
display: contents
}
.h-1 {
height: 0.25rem
.hidden {
display: none
}
.h-10 {
@ -357,14 +353,6 @@
width: 66.666667%
}
.w-2\/5 {
width: 40%
}
.w-20 {
width: 5rem
}
.w-28 {
width: 7rem
}
@ -592,11 +580,6 @@
background-color: rgb(23 22 26 / var(--tw-bg-opacity))
}
.bg-\[\#17171A\] {
--tw-bg-opacity: 1;
background-color: rgb(23 23 26 / var(--tw-bg-opacity))
}
.bg-\[\#1E1C29\] {
--tw-bg-opacity: 1;
background-color: rgb(30 28 41 / var(--tw-bg-opacity))
@ -617,11 +600,6 @@
background-color: rgb(255 102 158 / var(--tw-bg-opacity))
}
.bg-\[\#FF7DCB\] {
--tw-bg-opacity: 1;
background-color: rgb(255 125 203 / var(--tw-bg-opacity))
}
.bg-\[\#FFFFFF1A\] {
background-color: #FFFFFF1A
}
@ -712,21 +690,11 @@
padding-right: 0.25rem
}
.px-1\.5 {
padding-left: 0.375rem;
padding-right: 0.375rem
}
.px-10 {
padding-left: 2.5rem;
padding-right: 2.5rem
}
.px-12 {
padding-left: 3rem;
padding-right: 3rem
}
.px-2 {
padding-left: 0.5rem;
padding-right: 0.5rem

View File

@ -192,11 +192,6 @@
"marginLeft": 16
}
},
"ml-[3.2rem]": {
"style": {
"marginLeft": 51.2
}
},
"ml-auto": {
"style": {
"marginLeft": "auto"
@ -307,9 +302,9 @@
"display": "contents"
}
},
"h-1": {
"hidden": {
"style": {
"height": 4
"display": "none"
}
},
"h-10": {
@ -452,16 +447,6 @@
"width": "66.666667%"
}
},
"w-2/5": {
"style": {
"width": "40%"
}
},
"w-20": {
"style": {
"width": 80
}
},
"w-28": {
"style": {
"width": 112
@ -792,12 +777,6 @@
"backgroundColor": "rgb(23 22 26 / var(--tw-bg-opacity))"
}
},
"bg-[#17171A]": {
"style": {
"--tw-bg-opacity": 1,
"backgroundColor": "rgb(23 23 26 / var(--tw-bg-opacity))"
}
},
"bg-[#1E1C29]": {
"style": {
"--tw-bg-opacity": 1,
@ -822,12 +801,6 @@
"backgroundColor": "rgb(255 102 158 / var(--tw-bg-opacity))"
}
},
"bg-[#FF7DCB]": {
"style": {
"--tw-bg-opacity": 1,
"backgroundColor": "rgb(255 125 203 / var(--tw-bg-opacity))"
}
},
"bg-[#FFFFFF1A]": {
"style": {
"backgroundColor": "#FFFFFF1A"
@ -956,24 +929,12 @@
"paddingRight": 4
}
},
"px-1.5": {
"style": {
"paddingLeft": 6,
"paddingRight": 6
}
},
"px-10": {
"style": {
"paddingLeft": 40,
"paddingRight": 40
}
},
"px-12": {
"style": {
"paddingLeft": 48,
"paddingRight": 48
}
},
"px-2": {
"style": {
"paddingLeft": 8,