t0ng7u
7826099221
- Replace copy button icon from semi-ui IconCopy to lucide-react Copy in PricingCardView - Add conditional tooltip functionality to SelectableButtonGroup that only shows when text overflows - Implement responsive table column behavior in PricingTableColumns with mobile-aware fixed positioning - Use DOM-based overflow detection (scrollWidth vs clientWidth) for better performance - Apply useIsMobile hook to conditionally set fixed: 'right' only on desktop devices These changes improve user experience across different screen sizes and provide more consistent iconography throughout the pricing interface.
54 lines
2.0 KiB
React
54 lines
2.0 KiB
React
/*
|
|
Copyright (C) 2025 QuantumNous
|
|
|
|
This program is free software: you can redistribute it and/or modify
|
|
it under the terms of the GNU Affero General Public License as
|
|
published by the Free Software Foundation, either version 3 of the
|
|
License, or (at your option) any later version.
|
|
|
|
This program is distributed in the hope that it will be useful,
|
|
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
|
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
|
GNU Affero General Public License for more details.
|
|
|
|
You should have received a copy of the GNU Affero General Public License
|
|
along with this program. If not, see <https://www.gnu.org/licenses/>.
|
|
|
|
For commercial licensing, please contact support@quantumnous.com
|
|
*/
|
|
|
|
import React from 'react';
|
|
import PricingTopSection from '../header/PricingTopSection';
|
|
import PricingView from './PricingView';
|
|
|
|
const PricingContent = ({ isMobile, sidebarProps, ...props }) => {
|
|
return (
|
|
<div className={isMobile ? "pricing-content-mobile" : "pricing-scroll-hide"}>
|
|
{/* 固定的顶部区域（分类介绍 + 搜索和操作） */}
|
|
<div className="pricing-search-header">
|
|
<PricingTopSection
|
|
{...props}
|
|
isMobile={isMobile}
|
|
sidebarProps={sidebarProps}
|
|
showWithRecharge={sidebarProps.showWithRecharge}
|
|
setShowWithRecharge={sidebarProps.setShowWithRecharge}
|
|
currency={sidebarProps.currency}
|
|
setCurrency={sidebarProps.setCurrency}
|
|
showRatio={sidebarProps.showRatio}
|
|
setShowRatio={sidebarProps.setShowRatio}
|
|
viewMode={sidebarProps.viewMode}
|
|
setViewMode={sidebarProps.setViewMode}
|
|
tokenUnit={sidebarProps.tokenUnit}
|
|
setTokenUnit={sidebarProps.setTokenUnit}
|
|
/>
|
|
</div>
|
|
|
|
{/* 可滚动的内容区域 */}
|
|
<div className={isMobile ? "pricing-view-container-mobile" : "pricing-view-container"}>
|
|
<PricingView {...props} viewMode={sidebarProps.viewMode} />
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default PricingContent; |