I agree with you. If the portal can encompass the entire site, it will be very unique. Though the add-on looks promising. I just used the "ask question" feature; it works well and creates a unique topic on its own.
I have two questions for the developer:
Is there a possibility to make the add-on work for the whole site instead of just the homepage? That's just the portal.
After purchase, is there any extra cost for the AI usage?
You can edit the extra.css to create the same look as the portal. You will also need to edite each themes extra.css if you have several themes.
I also replaced the place holders in the portal for the latest in the resource section as i don't use it for downloads or seling and don't have images in the resource threads. So I added a default image to display instead.
Here's my css for you to start with and that should make your site look like the portal.
Feel free to ignore the placeholder if you don't need it (ignore anything after this bit Default placeholder image for article cards)
/* ================================
PP portal-style card layout
================================ */
.p-body .block {
position: relative;
margin: 20px;
}
/* Large white background panel */
.p-body .block::before {
content: "";
position: absolute;
top: -20px;
bottom: -20px;
left: -20px;
right: -20px;
background: #ffffff;
border: 1px solid @xf-borderColor;
border-radius: 18px;
box-shadow: 0 2px 8px rgba(0,0,0,0.06);
z-index: 0;
}
/* Actual widget */
.p-body .block > .block-container {
position: relative;
z-index: 1;
border-radius: 10px;
overflow: hidden;
background: @xf-contentBg;
box-shadow: 0 6px 18px rgba(0,0,0,0.08);
}
/* Header rounding */
.p-body .block-header {
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
/* Bottom rounding */
.p-body .block-body:last-child,
.p-body .block-footer:last-child {
border-bottom-left-radius: 10px;
border-bottom-right-radius: 10px;
}
/* Sticky sidebar */
.p-body-sidebar {
position: sticky;
top: 20px;
align-self: start;
}
/* ================================
Default placeholder image for article cards
================================ */
/* Hide the placeholder newspaper icon */
.debArticleCard-coverPlaceholder i {
display: none !important;
}
/* Replace placeholder with default article image */
.debArticleCard-coverPlaceholder {
background: #e5e5e5 url('/images/history-default.jpg') center center / cover no-repeat !important;
}
/* ================================
Default placeholder image for hot slide widget
================================ */
.debPortal-hotSlide-placeholder {
background: #e5e5e5 url('/images/history-widget-default.jpg') center center / cover no-repeat !important;
min-height: 220px;
}