大佬您好,我尝试使用了您的主题,效果非常好,但我有一个需求是想给欢迎banner设置背景图😂在英文站的discuss也看到了这个issue,但好像没有解决方法。。。我尝试把https://github.com/yannisme/flarum-oxo-theme/blob/main/less/forum.less 里的header.Hero.DiscussionHero,header.Hero.WelcomeHero
的background都改成自己的url,但还是没有效果。。。实在是对前端一无所知,烦请指导一下吧。。。下面是我的代码:
.define-colors(true) {
.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-number,.hljs-operator,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id,.hljs-variable{color: #5082bd!important
}
.hljs-meta,.hljs-meta .hljs-keyword,.hljs-meta .hljs-string {
color: #ff93b3!important
}
.hljs-addition {
color: #50a965!important;
background-color: #14191f!important
}
.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_ {
color: #ce606a!important
}
.hljs-built_in,.hljs-symbol {
color: #b97e55!important
}
.hljs-meta .hljs-string,.hljs-regexp,.hljs-string {
color: #beda78!important
}
.hljs-subst {
color: #a77fad!important
}
.hljs-name,.hljs-quote,.hljs-selector-pseudo,.hljs-selector-tag {
color: #38984f!important
}
@media @tablet-up {
body {
background: fade(#191d21,100%)!important
}
.backgrwb,.backgrwbguest,.AfruxWidgets-Widget.Afrux-ForumStatsWidgetWidget,.AfruxWidgets-Widget:not(:last-child),.IndexPage .DiscussionListItem,.Post-body,.UserPage .DiscussionListItem,header.Hero.DiscussionHero,header.Hero.WelcomeHero,li.item-nav,.AfruxWidgets-Widget {
background: fade(#181c1e,100%)!important;
border-bottom: 2px solid fade(#000,13%)!important
}
.App.BlogOverviewPage {
background: fade(#000,97%)!important
}
.Post-body {
box-shadow: rgba(0,0,0,.1) 0 1px 3px 0,rgba(0,0,0,.06) 0 1px 2px 0
}
.Avatar {
border: unset!important
}
.card {
background: #181c1e!important;
border-bottom: 2px solid rgba(0,0,0,.13)!important
}
.IndexPage .DiscussionListItem-title,.UserPage .DiscussionListItem-title {
color: #988f81!important
}
.PostStream-item:not(:last-child) {
border: unset!important
}
.DiscussionPage .Hero::before,.IndexPage .Hero::before {
background: unset!important
}
p.welcomeText {
background: #181c1e!important;
color: #6c7f93!important
}
}
@media (max-width:@screen-desktop) {
header.Hero.DiscussionHero,header.Hero.WelcomeHero {
background: url("我的图片url");
border-bottom: unset!important
}
.Hero h2 {
font-size: 18px!important;
font-weight: 600!important
}
.DiscussionListItem-title {
font-size: 14px!important;
font-weight: 600!important
}
.DiscussionHero--colored,.DiscussionHero--colored a {
color: #959595!important
}
}
@media @phone {
.item-discussion-views {
background: #1b2128!important
}
}
}
header.Hero.DiscussionHero,header.Hero.WelcomeHero {
background: url("我的图片url");
border-radius: 15px;
border-bottom: 2px solid fade(#e5e5e5,70%)
}
@media @phone {
span.Avatar.lastPostedUserAvatar,img.Avatar.lastPostedUserAvatar {
width: 14px!important;
height: 14px!important;
box-shadow: unset!important;
top: 8px!important;
left: 81px!important
}
.DiscussionListItem-author .Avatar {
--size: 35px;
margin-top: 0px
}
.DiscussionListItem {
padding-top: 2px
}
.App-content {
background: fade(@config-secondary-color,5%)
}
.DiscussionListItem-content {
background: @body-bg;
margin: 5px 10px;
box-shadow: rgba(0,0,0,.1) 0 1px 3px 0,rgba(0,0,0,.06) 0 1px 2px 0!important
}
.DiscussionListItem-title {
font-weight: 600
}
.Badge {
--size: 20px;
box-shadow: unset;
margin-top: 8px
}
header.Hero.DiscussionHero,header.Hero.WelcomeHero {
border-radius: 0 0 4em 4em!important;
background: url("我的图片url");
}
.UserPage {
.Hero,.darkenBackground {border-radius: 0 0 2em 2em!important;
}
}
.Hero h2 {
font-size: 18px!important;
font-weight: 600!important
}
.PostUser-badges {
float: right;
position: initial;
}
.DiscussionPage-nav {
border-bottom: 0
}
.TagTiles>li {
margin: 15px 10px;
box-shadow: rgba(0,0,0,.1) 0 1px 3px 0,rgba(0,0,0,.06) 0 1px 2px 0!important;
border-radius: 15px
}
.FlarumBlogOverview .BlogScrubber .BlogList-item-default .BlogList-item-photo {
border-radius: 13px 13px 0 0
}
.FlarumBlogOverview .BlogScrubber .BlogList-item-content h4 {
overflow-wrap: break-word
}
.FlarumBlog-Article-Author,.FlarumBlogItem .FlarumBlog-Article .FlarumBlog-Article-Container>*,.FlarumBlogOverview .BlogScrubber .BlogList-item {
border-radius: 13px!important;
box-shadow: rgba(0,0,0,.1) 0 1px 3px 0,rgba(0,0,0,.06) 0 1px 2px 0!important
}
.FlarumBlog-Article-Author-background {
border-top-left-radius: 13px;
border-top-right-radius: 13px
}
.BlogSideWidget {
margin-bottom: 20px;
box-shadow: rgba(0,0,0,.1) 0 1px 3px 0,rgba(0,0,0,.06) 0 1px 2px 0!important
}
.FlarumBlogItem .BlogForumNav.BlogSideWidget {
background: unset;
box-shadow: unset!important
}
.FlarumBlogItem li.item-nav {
padding: unset
}
.BlogSideWidget h3,.BlogSideWidget-item {
display: none!important
}
}