| 1 |
import React, { useRef, useEffect, useState } from "react"; |
| 2 |
|
| 3 |
import { __ } from "@wordpress/i18n"; |
| 4 |
import Slider from "react-slick"; |
| 5 |
import "slick-carousel/slick/slick.css"; |
| 6 |
import "slick-carousel/slick/slick-theme.css"; |
| 7 |
|
| 8 |
import { PopupVideo } from "../dashboard-overview/components/PopupVideo"; |
| 9 |
|
| 10 |
import AIChatbotImage from "./assets/images/videoThumb.svg"; |
| 11 |
import aichatborbenefits1 from "./assets/images/aichatborbenefits1.svg"; |
| 12 |
import aichatborbenefits2 from "./assets/images/aichatborbenefits2.svg"; |
| 13 |
import aichatborbenefits3 from "./assets/images/aichatborbenefits3.svg"; |
| 14 |
import aichatborbenefits4 from "./assets/images/aichatborbenefits4.svg"; |
| 15 |
import tourContentImg1 from "./assets/images/tourContentImg1.svg"; |
| 16 |
import tourContentImg2 from "./assets/images/tourContentImg2.svg"; |
| 17 |
import tourContentImg3 from "./assets/images/tourContentImg3.svg"; |
| 18 |
import AnalyticsSliderimg1 from "./assets/images/AnalyticsSliderimg1.svg"; |
| 19 |
import AnalyticsSliderimg2 from "./assets/images/AnalyticsSliderimg2.svg"; |
| 20 |
import AnalyticsSliderimg3 from "./assets/images/AnalyticsSliderimg3.svg"; |
| 21 |
import AnalyticsSliderimg4 from "./assets/images/AnalyticsSliderimg4.svg"; |
| 22 |
|
| 23 |
|
| 24 |
const sliderItems = [ |
| 25 |
{ |
| 26 |
id: 1, |
| 27 |
sliderImg: AnalyticsSliderimg1, |
| 28 |
sliderCardTitle: __("Full Knowledge Base Data Processing", "betterdocs"), |
| 29 |
sliderCardSubTitle: |
| 30 |
__("Get your full website analyzed by BetterDocs AI Chatbot and have all the data processed. The addon will then utilize AI to generate replies based on the processed data.", "betterdocs"), |
| 31 |
}, |
| 32 |
{ |
| 33 |
id: 2, |
| 34 |
sliderImg: AnalyticsSliderimg2, |
| 35 |
sliderCardTitle: __("Integration with OpenAI", "betterdocs"), |
| 36 |
sliderCardSubTitle: |
| 37 |
__("The chatbot addon works by integrating with the renowned OpenAI platform, which you can configure in a few, simple steps to start giving informative chat replies with AI.", "betterdocs"), |
| 38 |
}, |
| 39 |
{ |
| 40 |
id: 3, |
| 41 |
sliderImg: AnalyticsSliderimg3, |
| 42 |
sliderCardTitle: __("3 Embed Model Options", "betterdocs"), |
| 43 |
sliderCardSubTitle: |
| 44 |
__("With BetterDocs Chatbot, you have 3 different embed model options to choose from. Based on your choice, the addon will process your website data to provide replies.", "betterdocs"), |
| 45 |
}, |
| 46 |
{ |
| 47 |
id: 4, |
| 48 |
sliderImg: AnalyticsSliderimg4, |
| 49 |
sliderCardTitle: __("2 Chat Model Options", "betterdocs"), |
| 50 |
sliderCardSubTitle: |
| 51 |
__("As a BetterDocs user, you get to select from 2 chat model options for your AI-generated answers. So, you can pick your preferred chat model straight from BetterDocs plugin.", "betterdocs"), |
| 52 |
}, |
| 53 |
|
| 54 |
|
| 55 |
]; |
| 56 |
|
| 57 |
const SparkleIcon = () => ( |
| 58 |
<svg width="22" height="21" viewBox="0 0 22 21" fill="none" xmlns="http://www.w3.org/2000/svg"> |
| 59 |
<g filter="url(#filter0_d_11660_40617)"> |
| 60 |
<path |
| 61 |
d="M5 8.99819C5 8.73939 5.2104 8.53206 5.46793 8.50653C7.68223 8.28699 9.44321 6.526 9.66275 4.31168C9.68828 4.05415 9.89561 3.84375 10.1544 3.84375C10.4132 3.84375 10.6205 4.05415 10.6461 4.31168C10.8656 6.52599 12.6266 8.28699 14.8409 8.50653C15.0984 8.53206 15.3088 8.73939 15.3088 8.99819C15.3088 9.25698 15.0984 9.46431 14.8409 9.48984C12.6266 9.70939 10.8656 11.4704 10.6461 13.6847C10.6205 13.9422 10.4132 14.1526 10.1544 14.1526C9.89561 14.1526 9.68828 13.9422 9.66275 13.6847C9.44321 11.4704 7.68223 9.70939 5.46793 9.48984C5.2104 9.46431 5 9.25698 5 8.99819Z" |
| 62 |
fill="url(#paint0_linear_11660_40617)" |
| 63 |
/> |
| 64 |
</g> |
| 65 |
<g filter="url(#filter1_d_11660_40617)"> |
| 66 |
<path |
| 67 |
d="M14.2773 3.32758C14.2773 3.24994 14.3405 3.18774 14.4177 3.18008C15.082 3.11422 15.6103 2.58592 15.6762 1.92163C15.6838 1.84437 15.746 1.78125 15.8237 1.78125C15.9013 1.78125 15.9635 1.84437 15.9712 1.92163C16.037 2.58592 16.5653 3.11422 17.2296 3.18008C17.3069 3.18774 17.37 3.24994 17.37 3.32758C17.37 3.40522 17.3069 3.46742 17.2296 3.47508C16.5653 3.54094 16.037 4.06924 15.9712 4.73354C15.9635 4.81079 15.9013 4.87391 15.8237 4.87391C15.746 4.87391 15.6838 4.81079 15.6762 4.73354C15.6103 4.06924 15.082 3.54094 14.4177 3.47508C14.3405 3.46742 14.2773 3.40522 14.2773 3.32758Z" |
| 68 |
fill="url(#paint1_linear_11660_40617)" |
| 69 |
/> |
| 70 |
</g> |
| 71 |
<g filter="url(#filter2_d_11660_40617)"> |
| 72 |
<path |
| 73 |
d="M13.25 14.1555C13.25 14.052 13.3342 13.9691 13.4372 13.9589C14.3229 13.871 15.0273 13.1666 15.1151 12.2809C15.1253 12.1779 15.2082 12.0938 15.3118 12.0938C15.4153 12.0938 15.4982 12.1779 15.5084 12.2809C15.5962 13.1666 16.3006 13.871 17.1863 13.9589C17.2894 13.9691 17.3735 14.052 17.3735 14.1555C17.3735 14.259 17.2894 14.342 17.1863 14.3522C16.3006 14.44 15.5962 15.1444 15.5084 16.0301C15.4982 16.1331 15.4153 16.2173 15.3118 16.2173C15.2082 16.2173 15.1253 16.1331 15.1151 16.0301C15.0273 15.1444 14.3229 14.44 13.4372 14.3522C13.3342 14.342 13.25 14.259 13.25 14.1555Z" |
| 74 |
fill="url(#paint2_linear_11660_40617)" |
| 75 |
/> |
| 76 |
</g> |
| 77 |
<defs> |
| 78 |
<filter id="filter0_d_11660_40617" x="0.876464" y="2.81287" width="18.5557" height="18.5596" filterUnits="userSpaceOnUse" colorInterpolationFilters="sRGB"> |
| 79 |
<feFlood floodOpacity="0" result="BackgroundImageFix" /> |
| 80 |
<feColorMatrix in="SourceAlpha" type="matrix" |
| 81 |
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha" /> |
| 82 |
<feOffset dy="3.09265" /> |
| 83 |
<feGaussianBlur stdDeviation="2.06177" /> |
| 84 |
<feComposite in2="hardAlpha" operator="out" /> |
| 85 |
<feColorMatrix type="matrix" |
| 86 |
values="0 0 0 0 0 0 0 0 0 0.00392157 0 0 0 0 0.137255 0 0 0 0.13 0" /> |
| 87 |
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_11660_40617" /> |
| 88 |
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_11660_40617" result="shape" /> |
| 89 |
</filter> |
| 90 |
<filter id="filter1_d_11660_40617" x="10.1538" y="0.750366" width="11.3408" height="11.3408" filterUnits="userSpaceOnUse" colorInterpolationFilters="sRGB"> |
| 91 |
<feFlood floodOpacity="0" result="BackgroundImageFix" /> |
| 92 |
<feColorMatrix in="SourceAlpha" type="matrix" |
| 93 |
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha" /> |
| 94 |
<feOffset dy="3.09265" /> |
| 95 |
<feGaussianBlur stdDeviation="2.06177" /> |
| 96 |
<feComposite in2="hardAlpha" operator="out" /> |
| 97 |
<feColorMatrix type="matrix" |
| 98 |
values="0 0 0 0 0 0 0 0 0 0.00392157 0 0 0 0 0.137255 0 0 0 0.13 0" /> |
| 99 |
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_11660_40617" /> |
| 100 |
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_11660_40617" result="shape" /> |
| 101 |
</filter> |
| 102 |
<filter id="filter2_d_11660_40617" x="9.12646" y="11.0629" width="12.3721" height="12.3721" filterUnits="userSpaceOnUse" colorInterpolationFilters="sRGB"> |
| 103 |
<feFlood floodOpacity="0" result="BackgroundImageFix" /> |
| 104 |
<feColorMatrix in="SourceAlpha" type="matrix" |
| 105 |
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha" /> |
| 106 |
<feOffset dy="3.09265" /> |
| 107 |
<feGaussianBlur stdDeviation="2.06177" /> |
| 108 |
<feComposite in2="hardAlpha" operator="out" /> |
| 109 |
<feColorMatrix type="matrix" |
| 110 |
values="0 0 0 0 0 0 0 0 0 0.00392157 0 0 0 0 0.137255 0 0 0 0.13 0" /> |
| 111 |
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_11660_40617" /> |
| 112 |
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_11660_40617" result="shape" /> |
| 113 |
</filter> |
| 114 |
<linearGradient id="paint0_linear_11660_40617" x1="10.1544" y1="3.84375" x2="10.1544" y2="14.1526" gradientUnits="userSpaceOnUse"> |
| 115 |
<stop stopColor="#CD93FF" /> |
| 116 |
<stop offset="1" stopColor="#A741FF" /> |
| 117 |
</linearGradient> |
| 118 |
<linearGradient id="paint1_linear_11660_40617" x1="15.8237" y1="1.78125" x2="15.8237" y2="4.87391" gradientUnits="userSpaceOnUse"> |
| 119 |
<stop stopColor="#D099FF" /> |
| 120 |
<stop offset="1" stopColor="#CE96FF" /> |
| 121 |
</linearGradient> |
| 122 |
<linearGradient id="paint2_linear_11660_40617" x1="15.3118" y1="12.0938" x2="15.3118" y2="16.2173" gradientUnits="userSpaceOnUse"> |
| 123 |
<stop stopColor="#D099FF" /> |
| 124 |
<stop offset="1" stopColor="#CE96FF" /> |
| 125 |
</linearGradient> |
| 126 |
</defs> |
| 127 |
</svg> |
| 128 |
); |
| 129 |
|
| 130 |
|
| 131 |
const AIChatbot = () => { |
| 132 |
// popup |
| 133 |
const [isOpen, setIsOpen] = useState(false); |
| 134 |
const openPopup = () => setIsOpen(true); |
| 135 |
const closePopup = () => setIsOpen(false); |
| 136 |
const sectionRef = useRef(null); |
| 137 |
const [oneFourth, setOneFourth] = useState(300); |
| 138 |
const [isYearly, setIsYearly] = useState(false); |
| 139 |
|
| 140 |
useEffect(() => { |
| 141 |
if (sectionRef.current) { |
| 142 |
const fullWidth = sectionRef.current.offsetWidth; |
| 143 |
const oneFourthValue = fullWidth / 4; |
| 144 |
setOneFourth(`${oneFourthValue}px`); |
| 145 |
} |
| 146 |
|
| 147 |
console.log("oneFourthValue", oneFourth); |
| 148 |
}, []); |
| 149 |
|
| 150 |
|
| 151 |
|
| 152 |
const settings = { |
| 153 |
// className: "center", |
| 154 |
centerPadding: oneFourth, |
| 155 |
centerMode: true, |
| 156 |
infinite: true, |
| 157 |
slidesToShow: 1, |
| 158 |
slidesToScroll: 1, |
| 159 |
speed: 500, |
| 160 |
arrows: true, |
| 161 |
dots: false, |
| 162 |
responsive: [ |
| 163 |
{ |
| 164 |
breakpoint: 1024, // For tablets and small desktops |
| 165 |
settings: { |
| 166 |
slidesToShow: 1, |
| 167 |
centerPadding: "60px", |
| 168 |
}, |
| 169 |
}, |
| 170 |
{ |
| 171 |
breakpoint: 600, |
| 172 |
settings: { |
| 173 |
arrows: true, |
| 174 |
autoplay: true, |
| 175 |
slidesToShow: 1, |
| 176 |
centerPadding: "40px", |
| 177 |
}, |
| 178 |
} |
| 179 |
] |
| 180 |
}; |
| 181 |
|
| 182 |
return ( |
| 183 |
<div className="betterdocs-chatbot-container"> |
| 184 |
<div className="betterdocs-overview-section betterdocs-chatbot-video-section"> |
| 185 |
<div className="betterdocs-row align-items-center"> |
| 186 |
<div className=" betterdocs-overview-col betterdocs-col-6 betterdocs-content-left"> |
| 187 |
<div className="betterdocs-flex align-items-center betterdocs-chatbot-video-section-tag "> |
| 188 |
<span className="betterdocs-svg-icon"> |
| 189 |
<SparkleIcon /> |
| 190 |
</span> |
| 191 |
<span className="card-title">{__("AI Chatbot Addon", "betterdocs")}</span> |
| 192 |
</div> |
| 193 |
<h2 className="betterdocs-section-title"> |
| 194 |
<span className="betterdocs-title-style">{__("AI Chatbot Addon", "betterdocs")}</span> |
| 195 |
<span> |
| 196 |
{__("Instantly Respond to Web Visitors’ Queries", "betterdocs")} |
| 197 |
</span> |
| 198 |
</h2> |
| 199 |
<p className="betterdocs-section-description">{__("Give quick & accurate answers to visitors’ queries collecting data from your entire website with our AI-powered chatbot addon.", "betterdocs")}</p> |
| 200 |
<a href="https://betterdocs.co/dashboard-purchase-ai-chatbot" className="betterdocs-chatbot-section-btn betterdocs-video-btn">{__("Get AI Chatbot", "betterdocs")}</a> |
| 201 |
</div> |
| 202 |
|
| 203 |
<div className=" betterdocs-overview-col betterdocs-col-6 betterdocs-content-right"> |
| 204 |
|
| 205 |
<div class="popup-trigger" onClick={openPopup}> |
| 206 |
<img src={AIChatbotImage} /> |
| 207 |
</div> |
| 208 |
{isOpen && ( |
| 209 |
<div className="betterdocs-popup-overlay" onClick={closePopup}> |
| 210 |
<div |
| 211 |
className="betterdocs-popup-wrapper" |
| 212 |
onClick={(e) => e.stopPropagation()} |
| 213 |
> |
| 214 |
<PopupVideo closePopup={closePopup} /> |
| 215 |
</div> |
| 216 |
</div> |
| 217 |
)} |
| 218 |
</div> |
| 219 |
</div> |
| 220 |
</div> |
| 221 |
|
| 222 |
<div className="betterdocs-overview-section betterdocs-benefits-chatbot-section"> |
| 223 |
<div className="betterdocs-chatbot-section-header"> |
| 224 |
<h2 className="betterdocs-section-title"> |
| 225 |
<span>{__("Why Use BetterDocs", "betterdocs")}</span> <span className="betterdocs-title-style">{__("AI Chatbot", "betterdocs")}</span> |
| 226 |
</h2> |
| 227 |
<p className="betterdocs-section-sub-title">{__("Discover the benefits of using our AI-powered chatbot on your website.", "betterdocs")}</p> |
| 228 |
</div> |
| 229 |
|
| 230 |
<div className="betterdocs-chatbot-section-content"> |
| 231 |
<div className="betterdocs-row"> |
| 232 |
<div className="betterdocs-overview-col betterdocs-col-6 "> |
| 233 |
<div className="betterdocs-benefits-card"> |
| 234 |
<div className="benefits-card-left-bg benefits-card-img-wrapper"> |
| 235 |
<img src={aichatborbenefits1} /> |
| 236 |
</div> |
| 237 |
<div className="benefits-card-header-wrapper"> |
| 238 |
<h4 className="betterdocs-overview-card-header">{__("Easier Knowledge Base Navigation", "betterdocs")}</h4> |
| 239 |
</div> |
| 240 |
</div> |
| 241 |
</div> |
| 242 |
<div className="betterdocs-overview-col betterdocs-col-6"> |
| 243 |
<div className="betterdocs-benefits-card"> |
| 244 |
<div className="benefits-card-right-bg benefits-card-img-wrapper"> |
| 245 |
<img src={aichatborbenefits2} /> |
| 246 |
</div> |
| 247 |
<div className="benefits-card-header-wrapper"> |
| 248 |
<h4 className="betterdocs-overview-card-header">{__("Instant Answers for All Queries", "betterdocs")}</h4> |
| 249 |
</div> |
| 250 |
</div> |
| 251 |
</div> |
| 252 |
<div className="betterdocs-overview-col betterdocs-col-6 "> |
| 253 |
<div className="betterdocs-benefits-card"> |
| 254 |
<div className="benefits-card-left-bg benefits-card-img-wrapper"> |
| 255 |
<img src={aichatborbenefits3} /> |
| 256 |
</div> |
| 257 |
<div className="benefits-card-header-wrapper"> |
| 258 |
<h4 className="betterdocs-overview-card-header">{__("Reduced Load for Your Support Team", "betterdocs")}</h4> |
| 259 |
</div> |
| 260 |
</div> |
| 261 |
</div> |
| 262 |
<div className="betterdocs-overview-col betterdocs-col-6 "> |
| 263 |
<div className="betterdocs-benefits-card"> |
| 264 |
<div className="benefits-card-right-bg benefits-card-img-wrapper"> |
| 265 |
<img src={aichatborbenefits4} /> |
| 266 |
</div> |
| 267 |
<div className="benefits-card-header-wrapper"> |
| 268 |
<h4 className="betterdocs-overview-card-header">{__("Improved Visitor Experience", "betterdocs")}</h4> |
| 269 |
</div> |
| 270 |
</div> |
| 271 |
</div> |
| 272 |
</div> |
| 273 |
</div> |
| 274 |
</div> |
| 275 |
{/* slider section */} |
| 276 |
<div className="betterdocs-overview-section betterdocs-analytics-reporting-section" ref={sectionRef}> |
| 277 |
<div className="betterdocs-chatbot-section-header"> |
| 278 |
<h2 className="betterdocs-section-title"> |
| 279 |
<span className="betterdocs-title-style">{__("Advanced Features", "betterdocs")}</span> <span>{__("You Are Getting", "betterdocs")}</span> |
| 280 |
</h2> |
| 281 |
<p className="betterdocs-section-sub-title">{__("Find out more about the versatile functionalities of the addon.", "betterdocs")}</p> |
| 282 |
</div> |
| 283 |
|
| 284 |
<div className="betterdocs-chatbot-section-content"> |
| 285 |
<div className="betterdocs-slider-wrapper"> |
| 286 |
|
| 287 |
<div className="slider-container" > |
| 288 |
<Slider {...settings}> |
| 289 |
{sliderItems.map((item) => ( |
| 290 |
<div className="betterdocs-slider-item-wrapper" key={item.count}> |
| 291 |
<div className="betterdocs-slider-item"> |
| 292 |
<div className="benefits-card-img-wrapper"> |
| 293 |
<img |
| 294 |
src={item.sliderImg} |
| 295 |
alt="Slider Visual" |
| 296 |
/> |
| 297 |
</div> |
| 298 |
<div className="benefits-card-header-wrapper"> |
| 299 |
<h4 className="betterdocs-overview-card-header"> |
| 300 |
{item.sliderCardTitle} |
| 301 |
</h4> |
| 302 |
<p className="betterdocs-section-sub-title"> |
| 303 |
{item.sliderCardSubTitle} |
| 304 |
</p> |
| 305 |
</div> |
| 306 |
</div> |
| 307 |
</div> |
| 308 |
))} |
| 309 |
</Slider> |
| 310 |
</div> |
| 311 |
|
| 312 |
</div> |
| 313 |
</div> |
| 314 |
</div> |
| 315 |
|
| 316 |
|
| 317 |
<div className="betterdocs-overview-section betterdocs-tour__section"> |
| 318 |
<div className="betterdocs-chatbot-section-header"> |
| 319 |
<h2 className="betterdocs-section-title"> |
| 320 |
<span>{__("How to Enable AI Chatbot: ", "betterdocs")}</span> |
| 321 |
<span className="betterdocs-title-style">{__("A Quick Tour", "betterdocs")}</span> |
| 322 |
</h2> |
| 323 |
<p className="betterdocs-section-sub-title">{__("Set up the chatbot for your knowledge base built using BetterDocs.", "betterdocs")}</p> |
| 324 |
</div> |
| 325 |
|
| 326 |
<div className="betterdocs-chatbot-section-content"> |
| 327 |
<div className="betterdocs-row"> |
| 328 |
<div className="betterdocs-overview-col betterdocs-col-4 "> |
| 329 |
<div className="betterdocs-tour-card"> |
| 330 |
<div className="tour-card-img-wrapper"> |
| 331 |
<img src={tourContentImg1} /> |
| 332 |
</div> |
| 333 |
<div className="tour-card-header-wrapper"> |
| 334 |
<h4 className="betterdocs-tour-card-header"> |
| 335 |
<span className="betterdocs-step-badge">{__("1", "betterdocs")}</span> |
| 336 |
<span>{__("Unlock BetterDocs PRO & AI Chatbot addon", "betterdocs")}</span> |
| 337 |
</h4> |
| 338 |
</div> |
| 339 |
</div> |
| 340 |
</div> |
| 341 |
<div className="betterdocs-overview-col betterdocs-col-4 "> |
| 342 |
<div className="betterdocs-tour-card"> |
| 343 |
<div className="tour-card-img-wrapper"> |
| 344 |
<img src={tourContentImg2} /> |
| 345 |
</div> |
| 346 |
<div className="tour-card-header-wrapper"> |
| 347 |
<h4 className="betterdocs-tour-card-header"> |
| 348 |
<span className="betterdocs-step-badge">{__("2", "betterdocs")}</span> |
| 349 |
<span>{__("Activate BetterDocs PRO & AI Chatbot with your license key", "betterdocs")}</span> |
| 350 |
</h4> |
| 351 |
</div> |
| 352 |
</div> |
| 353 |
</div> |
| 354 |
<div className="betterdocs-overview-col betterdocs-col-4 "> |
| 355 |
<div className="betterdocs-tour-card"> |
| 356 |
<div className="tour-card-img-wrapper"> |
| 357 |
<img src={tourContentImg3} /> |
| 358 |
</div> |
| 359 |
<div className="tour-card-header-wrapper"> |
| 360 |
<h4 className="betterdocs-tour-card-header"> |
| 361 |
<span className="betterdocs-step-badge">{__("3", "betterdocs")}</span> |
| 362 |
<span>{__("Enable BetterDocs AI Chatbot on your site & start using it", "betterdocs")}</span> |
| 363 |
</h4> |
| 364 |
</div> |
| 365 |
</div> |
| 366 |
</div> |
| 367 |
|
| 368 |
</div> |
| 369 |
</div> |
| 370 |
</div> |
| 371 |
|
| 372 |
<div className="betterdocs-overview-section betterdocs-chatbot-promo-section"> |
| 373 |
<div className="betterdocs-row align-items-center"> |
| 374 |
<div className=" betterdocs-overview-col betterdocs-col-6 "> |
| 375 |
<div className="betterdocs-flex justify-content-space-between align-items-center"> |
| 376 |
<div className="betterdocs-svg-icon"> |
| 377 |
<svg width="69" height="76" viewBox="0 0 69 76" fill="none" xmlns="http://www.w3.org/2000/svg"> |
| 378 |
<g filter="url(#filter0_d_11660_69361)"> |
| 379 |
<path d="M14 28.0014C14 27.1407 14.6997 26.4512 15.5562 26.3663C22.9203 25.6362 28.7767 19.7797 29.5068 12.4155C29.5917 11.5591 30.2812 10.8594 31.1419 10.8594C32.0026 10.8594 32.6921 11.5591 32.777 12.4155C33.5071 19.7797 39.3636 25.6362 46.7276 26.3663C47.5841 26.4512 48.2838 27.1407 48.2838 28.0014C48.2838 28.8621 47.5841 29.5516 46.7276 29.6365C39.3636 30.3666 33.5071 36.2232 32.777 43.5873C32.6921 44.4437 32.0026 45.1434 31.1419 45.1434C30.2812 45.1434 29.5917 44.4437 29.5068 43.5873C28.7767 36.2232 22.9203 30.3666 15.5562 29.6365C14.6997 29.5516 14 28.8621 14 28.0014Z" fill="url(#paint0_linear_11660_69361)" /> |
| 380 |
</g> |
| 381 |
<g filter="url(#filter1_d_11660_69361)"> |
| 382 |
<path d="M44.8555 9.14261C44.8555 8.88441 45.0654 8.67756 45.3223 8.65208C47.5315 8.43305 49.2885 6.67609 49.5075 4.46685C49.533 4.20992 49.7398 4 49.998 4C50.2562 4 50.4631 4.20991 50.4886 4.46685C50.7076 6.67609 52.4646 8.43304 54.6738 8.65208C54.9307 8.67756 55.1406 8.88441 55.1406 9.14261C55.1406 9.40081 54.9307 9.60766 54.6738 9.63314C52.4646 9.85218 50.7076 11.6091 50.4886 13.8184C50.4631 14.0753 50.2562 14.2852 49.998 14.2852C49.7398 14.2852 49.533 14.0753 49.5075 13.8184C49.2885 11.6091 47.5315 9.85218 45.3223 9.63314C45.0654 9.60766 44.8555 9.40081 44.8555 9.14261Z" fill="url(#paint1_linear_11660_69361)" /> |
| 383 |
</g> |
| 384 |
<g filter="url(#filter2_d_11660_69361)"> |
| 385 |
<path d="M41.4297 45.1459C41.4297 44.8016 41.7096 44.5258 42.0522 44.4918C44.9978 44.1998 47.3404 41.8572 47.6324 38.9115C47.6664 38.5689 47.9422 38.2891 48.2864 38.2891C48.6307 38.2891 48.9065 38.5689 48.9405 38.9115C49.2325 41.8572 51.5751 44.1998 54.5207 44.4918C54.8633 44.5258 55.1432 44.8016 55.1432 45.1459C55.1432 45.4901 54.8633 45.7659 54.5207 45.7999C51.5751 46.092 49.2325 48.4346 48.9405 51.3802C48.9065 51.7228 48.6307 52.0027 48.2864 52.0027C47.9422 52.0027 47.6664 51.7228 47.6324 51.3802C47.3404 48.4346 44.9978 46.092 42.0522 45.7999C41.7096 45.7659 41.4297 45.4901 41.4297 45.1459Z" fill="url(#paint2_linear_11660_69361)" /> |
| 386 |
</g> |
| 387 |
<defs> |
| 388 |
<filter id="filter0_d_11660_69361" x="0.286422" y="7.43098" width="61.7123" height="61.7084" filterUnits="userSpaceOnUse" colorInterpolationFilters="sRGB"> |
| 389 |
<feFlood floodOpacity="0" result="BackgroundImageFix" /> |
| 390 |
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha" /> |
| 391 |
<feOffset dy="10.2852" /> |
| 392 |
<feGaussianBlur stdDeviation="6.85679" /> |
| 393 |
<feComposite in2="hardAlpha" operator="out" /> |
| 394 |
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0.00392157 0 0 0 0 0.137255 0 0 0 0.13 0" /> |
| 395 |
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_11660_69361" /> |
| 396 |
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_11660_69361" result="shape" /> |
| 397 |
</filter> |
| 398 |
<filter id="filter1_d_11660_69361" x="31.1419" y="0.571606" width="37.7123" height="37.7162" filterUnits="userSpaceOnUse" colorInterpolationFilters="sRGB"> |
| 399 |
<feFlood floodOpacity="0" result="BackgroundImageFix" /> |
| 400 |
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha" /> |
| 401 |
<feOffset dy="10.2852" /> |
| 402 |
<feGaussianBlur stdDeviation="6.85679" /> |
| 403 |
<feComposite in2="hardAlpha" operator="out" /> |
| 404 |
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0.00392157 0 0 0 0 0.137255 0 0 0 0.13 0" /> |
| 405 |
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_11660_69361" /> |
| 406 |
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_11660_69361" result="shape" /> |
| 407 |
</filter> |
| 408 |
<filter id="filter2_d_11660_69361" x="27.7161" y="34.8607" width="41.142" height="41.1381" filterUnits="userSpaceOnUse" colorInterpolationFilters="sRGB"> |
| 409 |
<feFlood floodOpacity="0" result="BackgroundImageFix" /> |
| 410 |
<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha" /> |
| 411 |
<feOffset dy="10.2852" /> |
| 412 |
<feGaussianBlur stdDeviation="6.85679" /> |
| 413 |
<feComposite in2="hardAlpha" operator="out" /> |
| 414 |
<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0.00392157 0 0 0 0 0.137255 0 0 0 0.13 0" /> |
| 415 |
<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_11660_69361" /> |
| 416 |
<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_11660_69361" result="shape" /> |
| 417 |
</filter> |
| 418 |
<linearGradient id="paint0_linear_11660_69361" x1="31.1419" y1="10.8594" x2="31.1419" y2="45.1434" gradientUnits="userSpaceOnUse"> |
| 419 |
<stop stopColor="#CD93FF" /> |
| 420 |
<stop offset="1" stopColor="#A741FF" /> |
| 421 |
</linearGradient> |
| 422 |
<linearGradient id="paint1_linear_11660_69361" x1="49.998" y1="4" x2="49.998" y2="14.2852" gradientUnits="userSpaceOnUse"> |
| 423 |
<stop stopColor="#D099FF" /> |
| 424 |
<stop offset="1" stopColor="#CE96FF" /> |
| 425 |
</linearGradient> |
| 426 |
<linearGradient id="paint2_linear_11660_69361" x1="48.2864" y1="38.2891" x2="48.2864" y2="52.0027" gradientUnits="userSpaceOnUse"> |
| 427 |
<stop stopColor="#D099FF" /> |
| 428 |
<stop offset="1" stopColor="#CE96FF" /> |
| 429 |
</linearGradient> |
| 430 |
</defs> |
| 431 |
</svg> |
| 432 |
</div> |
| 433 |
<div> |
| 434 |
<svg |
| 435 |
width="216" |
| 436 |
height="69" |
| 437 |
viewBox="0 0 216 69" |
| 438 |
fill="none" |
| 439 |
xmlns="http://www.w3.org/2000/svg" |
| 440 |
> |
| 441 |
<path |
| 442 |
d="M215.182 10.6014C215.68 10.3636 215.892 9.76668 215.654 9.26823L211.778 1.1454C211.54 0.646942 210.944 0.435655 210.445 0.673477C209.947 0.911298 209.735 1.50817 209.973 2.00663L213.418 9.22692L206.198 12.6718C205.699 12.9096 205.488 13.5065 205.726 14.005C205.964 14.5034 206.561 14.7147 207.059 14.4769L215.182 10.6014ZM81.6403 18.4862L82.0409 19.4024L81.6403 18.4862ZM47.9868 45.8912L46.9868 45.8879L47.9868 45.8912ZM73.2178 49.8495L72.9919 48.8753L73.2178 49.8495ZM89.3672 39.8037L90.3132 39.4796L89.3672 39.8037ZM52.1505 33.6007L52.0078 32.6109L52.1505 33.6007ZM0.933862 66.8024C0.716856 67.3102 0.952643 67.8979 1.46051 68.1149C1.96837 68.3319 2.556 68.0961 2.773 67.5882L0.933862 66.8024ZM215.085 8.75616C173.978 -5.79535 120.44 0.428125 81.2396 17.57L82.0409 19.4024C120.899 2.41055 173.901 -3.7008 214.418 10.6415L215.085 8.75616ZM81.2396 17.57C76.6869 19.5608 68.2048 23.1547 60.8582 27.9142C57.1844 30.2944 53.7473 32.9953 51.2164 35.9726C48.6868 38.9483 46.999 42.2769 46.9868 45.8879L48.9868 45.8946C48.9968 42.9265 50.384 40.0396 52.7402 37.2679C55.0951 34.4978 58.3544 31.9194 61.9457 29.5928C69.1294 24.9387 77.4518 21.4092 82.0409 19.4024L81.2396 17.57ZM46.9868 45.8879C46.9821 47.2924 47.3511 48.4936 48.051 49.4835C48.7447 50.4646 49.7195 51.1766 50.8337 51.6872C53.034 52.6954 55.9269 52.9853 58.8327 52.9384C64.6732 52.8441 71.0855 51.3704 73.4436 50.8236L72.9919 48.8753C70.621 49.425 64.4014 50.8482 58.8004 50.9387C55.9855 50.9841 53.4553 50.6884 51.6668 49.8689C50.7866 49.4656 50.1255 48.9533 49.684 48.3289C49.2488 47.7133 48.9833 46.9281 48.9868 45.8946L46.9868 45.8879ZM73.4436 50.8236C74.7374 50.5237 79.3331 49.4062 83.3803 47.6355C85.3929 46.755 87.3584 45.6757 88.7082 44.3956C90.0632 43.1106 90.9793 41.4243 90.3132 39.4796L88.4211 40.1277C88.7214 41.0042 88.4228 41.9099 87.3319 42.9444C86.2358 43.9839 84.5242 44.952 82.5786 45.8032C78.7094 47.4961 74.264 48.5804 72.9919 48.8753L73.4436 50.8236ZM90.3132 39.4796C89.3789 36.7522 86.6696 35.0312 83.4522 33.9263C80.189 32.8056 76.1254 32.221 72.0264 31.9544C63.8203 31.4205 55.2239 32.1472 52.0078 32.6109L52.2932 34.5905C55.3973 34.1429 63.8526 33.4268 71.8965 33.9501C75.9224 34.2121 79.7834 34.781 82.8026 35.8179C85.8677 36.8705 87.7988 38.3109 88.4211 40.1277L90.3132 39.4796ZM52.0078 32.6109C30.1779 35.7583 9.11328 47.6599 0.933862 66.8024L2.773 67.5882C10.5825 49.3115 30.8727 37.6788 52.2932 34.5905L52.0078 32.6109Z" |
| 443 |
fill="url(#paint0_linear_11660_69359)" |
| 444 |
/> |
| 445 |
<defs> |
| 446 |
<linearGradient |
| 447 |
id="paint0_linear_11660_69359" |
| 448 |
x1="214.998" |
| 449 |
y1="-0.00148794" |
| 450 |
x2="-5.00195" |
| 451 |
y2="78.9985" |
| 452 |
gradientUnits="userSpaceOnUse" |
| 453 |
> |
| 454 |
<stop stopColor="#ADD0BB" /> |
| 455 |
<stop offset="1" stopColor="#F0FBF8" /> |
| 456 |
</linearGradient> |
| 457 |
</defs> |
| 458 |
</svg> |
| 459 |
|
| 460 |
</div> |
| 461 |
</div> |
| 462 |
<div className=" betterdocs-content-left"> |
| 463 |
|
| 464 |
<h2 className="betterdocs-section-title"> |
| 465 |
{__("Try BetterDocs", "betterdocs")} |
| 466 |
<span className="betterdocs-flex"> |
| 467 |
<span className="betterdocs-title-style"> {__("AI Chatbot", "betterdocs")} </span> |
| 468 |
{__("Now!", "betterdocs")} |
| 469 |
</span> |
| 470 |
</h2> |
| 471 |
<p className="betterdocs-section-sub-title"> |
| 472 |
{__("Ready to add an AI-powered chatbot to your website? Start addressing visitor queries with our powerful addon now.", "betterdocs")} |
| 473 |
</p> |
| 474 |
</div> |
| 475 |
</div> |
| 476 |
|
| 477 |
<div className=" betterdocs-overview-col betterdocs-col-6 "> |
| 478 |
<div className="betterdocs-content-right"> |
| 479 |
<div className="betterdocs-pricing-card"> |
| 480 |
<div className="betterdocs-pricing-card-content"> |
| 481 |
<span className="card-name">{__("AI Chatbot", "betterdocs")}</span> |
| 482 |
<div className="betterdocs-flex justify-content-space-between flex-wrap "> |
| 483 |
<div className="betterdocs-price"> |
| 484 |
<span className="price"> |
| 485 |
{isYearly ? __("$69", "betterdocs") : __("$8.99", "betterdocs")} |
| 486 |
</span> |
| 487 |
<span className="form-data-name-control"> |
| 488 |
{isYearly ? __("/Yearly", "betterdocs") : __("/Monthly", "betterdocs")} |
| 489 |
</span> |
| 490 |
</div> |
| 491 |
|
| 492 |
<form className="betterdocs-flex align-items-center betterdocs-price-toggle-switch"> |
| 493 |
<label className="form-data-name-control">{__("Monthly", "betterdocs")}</label> |
| 494 |
<label class="switch"> |
| 495 |
<input |
| 496 |
type="checkbox" |
| 497 |
checked={isYearly} |
| 498 |
onChange={() => setIsYearly(!isYearly)} |
| 499 |
/> |
| 500 |
<span class="slider round"></span> |
| 501 |
</label> |
| 502 |
<label className="form-data-name-control">{__("Yearly", "betterdocs")}</label> |
| 503 |
</form> |
| 504 |
</div> |
| 505 |
</div> |
| 506 |
<div className="betterdocs-pricing-card-content"> |
| 507 |
<ul className="betterdocs-pricing-features-list"> |
| 508 |
|
| 509 |
<li className="betterdocs-pricing-features-list-item"> |
| 510 |
<span className="betterdocs-features-list-svg-icon"> |
| 511 |
<svg |
| 512 |
width="20" |
| 513 |
height="21" |
| 514 |
viewBox="0 0 20 21" |
| 515 |
fill="none" |
| 516 |
xmlns="http://www.w3.org/2000/svg" |
| 517 |
> |
| 518 |
<g clipPath="url(#clip0_11660_69317)"> |
| 519 |
<path |
| 520 |
d="M2.5 10.5C2.5 11.4849 2.69399 12.4602 3.0709 13.3701C3.44781 14.2801 4.00026 15.1069 4.6967 15.8033C5.39314 16.4997 6.21993 17.0522 7.12987 17.4291C8.03982 17.806 9.01509 18 10 18C10.9849 18 11.9602 17.806 12.8701 17.4291C13.7801 17.0522 14.6069 16.4997 15.3033 15.8033C15.9997 15.1069 16.5522 14.2801 16.9291 13.3701C17.306 12.4602 17.5 11.4849 17.5 10.5C17.5 9.51509 17.306 8.53982 16.9291 7.62987C16.5522 6.71993 15.9997 5.89314 15.3033 5.1967C14.6069 4.50026 13.7801 3.94781 12.8701 3.5709C11.9602 3.19399 10.9849 3 10 3C9.01509 3 8.03982 3.19399 7.12987 3.5709C6.21993 3.94781 5.39314 4.50026 4.6967 5.1967C4.00026 5.89314 3.44781 6.71993 3.0709 7.62987C2.69399 8.53982 2.5 9.51509 2.5 10.5Z" |
| 521 |
stroke="#86838C" |
| 522 |
strokeWidth="1.5" |
| 523 |
strokeLinecap="round" |
| 524 |
strokeLinejoin="round" |
| 525 |
/> |
| 526 |
<path |
| 527 |
d="M7.5 10.5026L9.16667 12.1693L12.5 8.83594" |
| 528 |
stroke="#86838C" |
| 529 |
strokeWidth="1.5" |
| 530 |
strokeLinecap="round" |
| 531 |
strokeLinejoin="round" |
| 532 |
/> |
| 533 |
</g> |
| 534 |
<defs> |
| 535 |
<clipPath id="clip0_11660_69317"> |
| 536 |
<rect width="20" height="20" fill="white" transform="translate(0 0.5)" /> |
| 537 |
</clipPath> |
| 538 |
</defs> |
| 539 |
</svg> |
| 540 |
</span> |
| 541 |
<span> |
| 542 |
{__("Instant Answers for All Queries", "betterdocs")} |
| 543 |
</span> |
| 544 |
</li> |
| 545 |
<li className="betterdocs-pricing-features-list-item"> |
| 546 |
<span className="betterdocs-features-list-svg-icon"> |
| 547 |
<svg |
| 548 |
width="20" |
| 549 |
height="21" |
| 550 |
viewBox="0 0 20 21" |
| 551 |
fill="none" |
| 552 |
xmlns="http://www.w3.org/2000/svg" |
| 553 |
> |
| 554 |
<g clipPath="url(#clip0_11660_69317)"> |
| 555 |
<path |
| 556 |
d="M2.5 10.5C2.5 11.4849 2.69399 12.4602 3.0709 13.3701C3.44781 14.2801 4.00026 15.1069 4.6967 15.8033C5.39314 16.4997 6.21993 17.0522 7.12987 17.4291C8.03982 17.806 9.01509 18 10 18C10.9849 18 11.9602 17.806 12.8701 17.4291C13.7801 17.0522 14.6069 16.4997 15.3033 15.8033C15.9997 15.1069 16.5522 14.2801 16.9291 13.3701C17.306 12.4602 17.5 11.4849 17.5 10.5C17.5 9.51509 17.306 8.53982 16.9291 7.62987C16.5522 6.71993 15.9997 5.89314 15.3033 5.1967C14.6069 4.50026 13.7801 3.94781 12.8701 3.5709C11.9602 3.19399 10.9849 3 10 3C9.01509 3 8.03982 3.19399 7.12987 3.5709C6.21993 3.94781 5.39314 4.50026 4.6967 5.1967C4.00026 5.89314 3.44781 6.71993 3.0709 7.62987C2.69399 8.53982 2.5 9.51509 2.5 10.5Z" |
| 557 |
stroke="#86838C" |
| 558 |
strokeWidth="1.5" |
| 559 |
strokeLinecap="round" |
| 560 |
strokeLinejoin="round" |
| 561 |
/> |
| 562 |
<path |
| 563 |
d="M7.5 10.5026L9.16667 12.1693L12.5 8.83594" |
| 564 |
stroke="#86838C" |
| 565 |
strokeWidth="1.5" |
| 566 |
strokeLinecap="round" |
| 567 |
strokeLinejoin="round" |
| 568 |
/> |
| 569 |
</g> |
| 570 |
<defs> |
| 571 |
<clipPath id="clip0_11660_69317"> |
| 572 |
<rect width="20" height="20" fill="white" transform="translate(0 0.5)" /> |
| 573 |
</clipPath> |
| 574 |
</defs> |
| 575 |
</svg> |
| 576 |
</span> |
| 577 |
<span> |
| 578 |
{__("Integration with OpenAI", "betterdocs")} |
| 579 |
</span> |
| 580 |
</li> |
| 581 |
<li className="betterdocs-pricing-features-list-item"> |
| 582 |
<span className="betterdocs-features-list-svg-icon"> |
| 583 |
<svg |
| 584 |
width="20" |
| 585 |
height="21" |
| 586 |
viewBox="0 0 20 21" |
| 587 |
fill="none" |
| 588 |
xmlns="http://www.w3.org/2000/svg" |
| 589 |
> |
| 590 |
<g clipPath="url(#clip0_11660_69317)"> |
| 591 |
<path |
| 592 |
d="M2.5 10.5C2.5 11.4849 2.69399 12.4602 3.0709 13.3701C3.44781 14.2801 4.00026 15.1069 4.6967 15.8033C5.39314 16.4997 6.21993 17.0522 7.12987 17.4291C8.03982 17.806 9.01509 18 10 18C10.9849 18 11.9602 17.806 12.8701 17.4291C13.7801 17.0522 14.6069 16.4997 15.3033 15.8033C15.9997 15.1069 16.5522 14.2801 16.9291 13.3701C17.306 12.4602 17.5 11.4849 17.5 10.5C17.5 9.51509 17.306 8.53982 16.9291 7.62987C16.5522 6.71993 15.9997 5.89314 15.3033 5.1967C14.6069 4.50026 13.7801 3.94781 12.8701 3.5709C11.9602 3.19399 10.9849 3 10 3C9.01509 3 8.03982 3.19399 7.12987 3.5709C6.21993 3.94781 5.39314 4.50026 4.6967 5.1967C4.00026 5.89314 3.44781 6.71993 3.0709 7.62987C2.69399 8.53982 2.5 9.51509 2.5 10.5Z" |
| 593 |
stroke="#86838C" |
| 594 |
strokeWidth="1.5" |
| 595 |
strokeLinecap="round" |
| 596 |
strokeLinejoin="round" |
| 597 |
/> |
| 598 |
<path |
| 599 |
d="M7.5 10.5026L9.16667 12.1693L12.5 8.83594" |
| 600 |
stroke="#86838C" |
| 601 |
strokeWidth="1.5" |
| 602 |
strokeLinecap="round" |
| 603 |
strokeLinejoin="round" |
| 604 |
/> |
| 605 |
</g> |
| 606 |
<defs> |
| 607 |
<clipPath id="clip0_11660_69317"> |
| 608 |
<rect width="20" height="20" fill="white" transform="translate(0 0.5)" /> |
| 609 |
</clipPath> |
| 610 |
</defs> |
| 611 |
</svg> |
| 612 |
</span> |
| 613 |
<span> |
| 614 |
{__("3 Embed Model Options", "betterdocs")} |
| 615 |
</span> |
| 616 |
</li> |
| 617 |
<li className="betterdocs-pricing-features-list-item"> |
| 618 |
<span className="betterdocs-features-list-svg-icon"> |
| 619 |
<svg |
| 620 |
width="20" |
| 621 |
height="21" |
| 622 |
viewBox="0 0 20 21" |
| 623 |
fill="none" |
| 624 |
xmlns="http://www.w3.org/2000/svg" |
| 625 |
> |
| 626 |
<g clipPath="url(#clip0_11660_69317)"> |
| 627 |
<path |
| 628 |
d="M2.5 10.5C2.5 11.4849 2.69399 12.4602 3.0709 13.3701C3.44781 14.2801 4.00026 15.1069 4.6967 15.8033C5.39314 16.4997 6.21993 17.0522 7.12987 17.4291C8.03982 17.806 9.01509 18 10 18C10.9849 18 11.9602 17.806 12.8701 17.4291C13.7801 17.0522 14.6069 16.4997 15.3033 15.8033C15.9997 15.1069 16.5522 14.2801 16.9291 13.3701C17.306 12.4602 17.5 11.4849 17.5 10.5C17.5 9.51509 17.306 8.53982 16.9291 7.62987C16.5522 6.71993 15.9997 5.89314 15.3033 5.1967C14.6069 4.50026 13.7801 3.94781 12.8701 3.5709C11.9602 3.19399 10.9849 3 10 3C9.01509 3 8.03982 3.19399 7.12987 3.5709C6.21993 3.94781 5.39314 4.50026 4.6967 5.1967C4.00026 5.89314 3.44781 6.71993 3.0709 7.62987C2.69399 8.53982 2.5 9.51509 2.5 10.5Z" |
| 629 |
stroke="#86838C" |
| 630 |
strokeWidth="1.5" |
| 631 |
strokeLinecap="round" |
| 632 |
strokeLinejoin="round" |
| 633 |
/> |
| 634 |
<path |
| 635 |
d="M7.5 10.5026L9.16667 12.1693L12.5 8.83594" |
| 636 |
stroke="#86838C" |
| 637 |
strokeWidth="1.5" |
| 638 |
strokeLinecap="round" |
| 639 |
strokeLinejoin="round" |
| 640 |
/> |
| 641 |
</g> |
| 642 |
<defs> |
| 643 |
<clipPath id="clip0_11660_69317"> |
| 644 |
<rect width="20" height="20" fill="white" transform="translate(0 0.5)" /> |
| 645 |
</clipPath> |
| 646 |
</defs> |
| 647 |
</svg> |
| 648 |
</span> |
| 649 |
<span> |
| 650 |
{__("2 Chat Model options", "betterdocs")} |
| 651 |
</span> |
| 652 |
</li> |
| 653 |
<li className="betterdocs-pricing-features-list-item"> |
| 654 |
<span className="betterdocs-features-list-svg-icon"> |
| 655 |
<svg |
| 656 |
width="20" |
| 657 |
height="21" |
| 658 |
viewBox="0 0 20 21" |
| 659 |
fill="none" |
| 660 |
xmlns="http://www.w3.org/2000/svg" |
| 661 |
> |
| 662 |
<g clipPath="url(#clip0_11660_69317)"> |
| 663 |
<path |
| 664 |
d="M2.5 10.5C2.5 11.4849 2.69399 12.4602 3.0709 13.3701C3.44781 14.2801 4.00026 15.1069 4.6967 15.8033C5.39314 16.4997 6.21993 17.0522 7.12987 17.4291C8.03982 17.806 9.01509 18 10 18C10.9849 18 11.9602 17.806 12.8701 17.4291C13.7801 17.0522 14.6069 16.4997 15.3033 15.8033C15.9997 15.1069 16.5522 14.2801 16.9291 13.3701C17.306 12.4602 17.5 11.4849 17.5 10.5C17.5 9.51509 17.306 8.53982 16.9291 7.62987C16.5522 6.71993 15.9997 5.89314 15.3033 5.1967C14.6069 4.50026 13.7801 3.94781 12.8701 3.5709C11.9602 3.19399 10.9849 3 10 3C9.01509 3 8.03982 3.19399 7.12987 3.5709C6.21993 3.94781 5.39314 4.50026 4.6967 5.1967C4.00026 5.89314 3.44781 6.71993 3.0709 7.62987C2.69399 8.53982 2.5 9.51509 2.5 10.5Z" |
| 665 |
stroke="#86838C" |
| 666 |
strokeWidth="1.5" |
| 667 |
strokeLinecap="round" |
| 668 |
strokeLinejoin="round" |
| 669 |
/> |
| 670 |
<path |
| 671 |
d="M7.5 10.5026L9.16667 12.1693L12.5 8.83594" |
| 672 |
stroke="#86838C" |
| 673 |
strokeWidth="1.5" |
| 674 |
strokeLinecap="round" |
| 675 |
strokeLinejoin="round" |
| 676 |
/> |
| 677 |
</g> |
| 678 |
<defs> |
| 679 |
<clipPath id="clip0_11660_69317"> |
| 680 |
<rect width="20" height="20" fill="white" transform="translate(0 0.5)" /> |
| 681 |
</clipPath> |
| 682 |
</defs> |
| 683 |
</svg> |
| 684 |
</span> |
| 685 |
<span> |
| 686 |
{__("1 Website", "betterdocs")} |
| 687 |
</span> |
| 688 |
</li> |
| 689 |
</ul> |
| 690 |
</div> |
| 691 |
<div className="betterdocs-pricing-card-content"> |
| 692 |
<a href="https://betterdocs.co/dashboard-purchase-ai-chatbot" className="betterdocs-chatbot-section-btn betterdocs-pricing-card-btn"> |
| 693 |
{__("Get Started", "betterdocs")} |
| 694 |
</a> |
| 695 |
</div> |
| 696 |
</div> |
| 697 |
</div> |
| 698 |
</div> |
| 699 |
</div> |
| 700 |
</div> |
| 701 |
</div> |
| 702 |
); |
| 703 |
}; |
| 704 |
|
| 705 |
export default AIChatbot; |
| 706 |
|
