├── resources ├── locale │ └── en.yml └── less │ ├── admin.less │ └── forum.less ├── extend.php ├── composer.json ├── LICENSE.md └── README.md /resources/locale/en.yml: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /resources/less/admin.less: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /extend.php: -------------------------------------------------------------------------------- 1 | css(__DIR__.'/resources/less/forum.less'), 20 | (new Extend\Frontend('admin')) 21 | 22 | ->css(__DIR__.'/resources/less/admin.less'), 23 | new Extend\Locales(__DIR__ . '/resources/locale') 24 | ]; 25 | -------------------------------------------------------------------------------- /composer.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "yannisme/confixtheme", 3 | "description": "Confix Theme For Flarum", 4 | "keywords": [ 5 | "flarum" 6 | ], 7 | "type": "flarum-extension", 8 | "license": "MIT", 9 | "homepage": "https://yannisme.com", 10 | "support": { 11 | "issues": "https://github.com/yannisme/flarum-confix-theme/issues", 12 | "source": "https://github.com/yannisme/flarum-confix-theme", 13 | "forum": "https://discuss.flarum.org/d/27987-confix-theme" 14 | }, 15 | "require": { 16 | "flarum/core": "*" 17 | }, 18 | "authors": [ 19 | { 20 | "name": "yannis", 21 | "email": "rd@yannis.cn", 22 | "role": "Developer" 23 | } 24 | ], 25 | "autoload": { 26 | "psr-4": { 27 | "Yannisme\\ConfixTheme\\": "src/" 28 | } 29 | }, 30 | "extra": { 31 | "flarum-extension": { 32 | "title": "Confix", 33 | "category": "theme", 34 | "icon": { 35 | "name": "fab fa-yandex-international", 36 | "backgroundColor": "#F783AC", 37 | "color": "#FFF" 38 | } 39 | } 40 | } 41 | } 42 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2021 yannisme/flarum-confix-theme 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | ![GitHub](https://img.shields.io/github/license/yannisme/flarum-confix-theme?style=flat-square) ![GitHub last commit](https://img.shields.io/github/last-commit/yannisme/flarum-confix-theme?style=flat-square) ![GitHub release (latest by date)](https://img.shields.io/github/v/release/yannisme/flarum-confix-theme?style=flat-square) ![Packagist Downloads](https://img.shields.io/packagist/dt/yannisme/confixtheme?style=flat-square) [![buy me a coffee](https://img.shields.io/badge/donate-buy%20me%20a%20coffee-yellow?label=Donate&style=flat-square)](https://paypal.me/toyannis?country.x=C2&locale.x=zh_XC) 2 | 3 | A Flarum Theme. Confix theme 4 | This is the first theme I have ever wrapped in Composer , it is so great! 5 | The theme features a widescreen setting, which is more direct to browse. Compatible with Night Mode. The mobile phone style will gradually improve~ 6 | 7 | There may be some bugs. If you find it, please remind me, and I will fix it in time! 8 | 9 | 10 | 11 | ### Demo 12 | 13 | [click2see](https://yannisme.com/) 14 | 15 | ### Installation 16 | **Default color：**`#537ad0`,`#69a1f4` 17 | 18 | Install with composer: 19 | ```sh 20 | composer require yannisme/confixtheme 21 | ``` 22 | 23 | ### Updating 24 | 25 | ```sh 26 | composer update yannisme/confixtheme 27 | php flarum cache:clear 28 | ``` 29 | 30 | ### Links 31 | 32 | - [Github](https://github.com/yannisme/flarum-confix-theme) 33 | - [Packagist](https://packagist.org/packages/yannisme/confixtheme) 34 | - [Discuss](https://discuss.flarum.org/d/27987-confix-theme) 35 | 36 | ![image.png](https://s2.loli.net/2022/01/09/GDClX5utFqB9Uv1.png) 37 | ![image.png](https://s2.loli.net/2022/01/09/5LJQcB9wpDZbukV.png) 38 | ![image.png](https://s2.loli.net/2022/01/09/Jcwm78sMGPrpBd1.png) 39 | ![image.png](https://s2.loli.net/2022/01/09/WIsl1CkGwDNnKyd.png) 40 | ![image.png](https://s2.loli.net/2022/01/09/1qUhLtnSWRA69eM.png) 41 | ![image.png](https://s2.loli.net/2022/01/09/oLpmB1KHMgGTDuS.png) 42 | ![image.png](https://s2.loli.net/2022/01/09/VS5y6WRHTZzJwOP.png) 43 | ![image.png](https://s2.loli.net/2022/01/09/rny3Vqjb8aU97HL.png) 44 | 45 | 46 | -------------------------------------------------------------------------------- /resources/less/forum.less: -------------------------------------------------------------------------------- 1 | .define-colors(true){ 2 | table.catchthefish-table a{color:#fff} 3 | .catchthefish-table tr:nth-child(odd) td{background:#0000001f!important} 4 | .catchthefish-table td,.catchthefish-table th{border-bottom:unset!important} 5 | .hljs-attr,.hljs-attribute,.hljs-literal,.hljs-number,.hljs-operator,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id,.hljs-variable{color:#5082bd!important} 6 | .hljs-meta,.hljs-meta .hljs-keyword,.hljs-meta .hljs-string{color:#ff93b3!important} 7 | .hljs-addition{color:#50a965!important;background-color:#14191f!important} 8 | .hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_{color:#ce606a!important} 9 | .hljs-built_in,.hljs-symbol{color:#b97e55!important} 10 | .hljs-meta .hljs-string,.hljs-regexp,.hljs-string{color:#beda78!important} 11 | .hljs-subst{color:#a77fad!important} 12 | .hljs-name,.hljs-quote,.hljs-selector-pseudo,.hljs-selector-tag{color:#38984f!important}} 13 | @media(min-width:2200px)and (max-width:2560px){ 14 | .sideNav{position:unset!important} 15 | .UserCard.Hero.UserHero{margin-left:unset!important} 16 | .Hero{padding-left:unset!important} 17 | .IndexPage{padding:unset!important;margin:0 10%;height:100%;border:1px solid fade(@hero-bg,98.5%)} 18 | .UserPage{border:1px solid fade(@hero-bg,98.5%)} 19 | .DiscussionPage{margin:0 auto;max-width:1600px} 20 | .App-content{border:unset} 21 | .App-composer{padding:0 10%} 22 | .sideNav{min-height:calc(100vh)} 23 | .IndexPage .affix .App-header{margin:0 auto;max-width:1600px} 24 | .IndexPage .scrolled .App-header{box-shadow:unset} 25 | .AfruxWidgets-sideNavAlt{margin-left:unset!important} 26 | } 27 | @media @tablet-up and (max-width:2560px){ 28 | article.EventPost{padding-left:60px} 29 | span.TagLabel-text i{display:none} 30 | span.PostUser-text{top:28px;right:0;position:absolute;color:@config-primary-color;font-size:12px;font-weight:700;z-index:9} 31 | ul.UserCard-badges.badges{display:inline-table} 32 | .AfruxWidgets-Widget-title{margin:5px;font-weight:700} 33 | .PostUser-avatar{vertical-align:middle;position:relative;left:-7px;top:-2px;width:2.5em;height:2.5em;font-size:1em;line-height:2.5em} 34 | .PostUser-badges{float:right;position:relative;display:block!important} 35 | .Post{padding-left:40px} 36 | .PostUser-level{float:right!important;position:relative;margin-left:0;margin-top:0!important;width:55px;text-align:right} 37 | .PostUser-bar{border-radius:unset!important;height:5px!important;position:absolute} 38 | .Post-footer .item-bestAnswerPost{padding:10px!important;border-left:5px solid @control-bg!important;background-color:@body-bg!important;clear:both;border-radius:0!important} 39 | .Post--BestAnswer,.Post--BestAnswer a{color:unset!important} 40 | .Post--BestAnswer{ 41 | z-index:999;background:@control-bg!important;padding-left:4px!important;border-left:3px solid #58a400!important;border-radius:0!important; 42 | .BestAnswer--User{display:none!important} 43 | } 44 | .Hero{text-align:left} 45 | .Badge{width:auto;height:auto;color:unset;-webkit-box-shadow:unset;box-shadow:unset} 46 | .DiscussionPage .badges,.badges>li{display: inline-flex} 47 | .DiscussionListItem-badges .Badge{margin:1px;position:relative;top:41px;left:-3px} 48 | .DiscussionListItem-badges .Badge,header.Hero.DiscussionHero .Badge,header.Post-header .Badge,.Form-group.EditUserModal-groups .Badge{background:0 0!important} 49 | .DiscussionHero-items{padding-left: 10px;} 50 | .DiscussionPage .badges,.badges>li{padding:2px} 51 | .PostUser-badges .Badge{margin-left:auto} 52 | .UserCard-profile .Badge{background:unset!important} 53 | .badges,.badges>li{display:inline-flex;justify-content:center} 54 | .Badge--sticky{background:0 0} 55 | .container{width:auto;padding: 0 10px;} 56 | .containerNarrow{max-width:none!important;} 57 | .EventPost-icon{text-align:end;margin-left:-75px;width:65px;margin-top:5px;font-size:15px} 58 | .Hero .container{padding:10px} 59 | .PostStream-timeGap{padding:20px} 60 | .fa-thumbtack:before{color:#de8e00} 61 | .TagCloud{margin-top:10px!important} 62 | .TagTiles{padding:10px 0!important} 63 | .AfruxWidgets-Widget-content{border-radius:unset!important} 64 | .AfruxWidgets-Widget:not(:last-child){margin-bottom:8px} 65 | } 66 | @media @desktop-up and (max-width:2560px){ 67 | html{max-width:2000px;margin:0 auto} 68 | body{font-family:"PingFang SC","Hiragino Sans GB","Microsoft Yahei",tahoma,arial} 69 | a.titleFeed{text-transform:capitalize;font-weight:700} 70 | a.TagLinkButton.hasIcon.child{background:0 0!important;border:0!important} 71 | a.TagTile-info{display:flex;flex-wrap:wrap} 72 | ul.DiscussionListItem-badges.badges{display:inline-flex!important} 73 | span.NotificationsDropdown-unread{z-index:999} 74 | li.TagTile{margin-top:5px;border-radius:4px} 75 | button.Button.Button--primary.IndexPage-newDiscussion.hasIcon{border-radius:0;font-size:1.2em} 76 | header.Hero.DiscussionHero.DiscussionHero--colored{padding:20px} 77 | footer.site-footer{padding-left:210px} 78 | nav.TagsPage-nav.IndexPage-nav.sideNav{display:none} 79 | i.icon.fas.fa-times{display:inline-block} 80 | span.Avatar.lastPostedUserAvatar,img.Avatar.lastPostedUserAvatar { 81 | width: 15px!important; 82 | height: 15px!important; 83 | box-shadow:unset!important; 84 | } 85 | .UserPage,.IndexPage{span.Avatar.lastPostedUserAvatar,img.Avatar.lastPostedUserAvatar{top:14px;left:68px;}} 86 | .IndexPage{ 87 | padding-left:190px; 88 | li.item-startTopWidgetSection{margin-bottom:0!important} 89 | } 90 | .IndexPage-toolbar{display:flex} 91 | .IndexPage-nav { 92 | .item-newDiscussion{ 93 | margin-bottom:5px;margin-left:-10px; 94 | .Button{height:61px} 95 | } 96 | } 97 | .IndexPage-results.sideNavOffset .DiscussionList.DiscussionList--searchResults li.item-discussion-views{display:none} 98 | .container{width:auto;padding:0} 99 | .Hero{padding-left:10px;} 100 | .Hero-close{display:none} 101 | .UserPage{margin-left:190px} 102 | .UserCard.Hero.UserHero{margin-left:-10px} 103 | .UserCard-info>.social-button{margin-right:5px} 104 | .DiscussionListItem{padding-left:unset} 105 | .DiscussionListItem-main{min-height:75px;display:inline-grid} 106 | .DiscussionListItem-content{ 107 | padding-left:70px; 108 | .Slidable-content.read .badges{display:flex} 109 | } 110 | .DiscussionPage-list .DiscussionListItem-info{white-space:break-spaces} 111 | .DiscussionPage-list { 112 | overflow-x:hidden; 113 | .DiscussionListItem-title{max-width:300px;word-wrap:break-word} 114 | .DiscussionListItem-count{display:none} 115 | .DiscussionListItem-main{display:flex;flex-wrap:wrap;align-content:flex-start;flex-direction:column;justify-content:center} 116 | .DiscussionListItem-content{padding-right:0} 117 | .item-discussion-views{display:none!important} 118 | span.Avatar.lastPostedUserAvatar,img.Avatar.lastPostedUserAvatar {top:19px;left:66px;} 119 | } 120 | .DiscussionPage-discussion .container{max-width:1100px} 121 | .panePinned .DiscussionPage-list .TagLabel-text,.paneShowing .DiscussionPage-list .TagLabel-text{margin-left:-3px!important} 122 | .sideNavOffset{margin-top:0!important;min-width:0;padding:15px;box-sizing:border-box} 123 | .TagsPage .sideNavOffset{display:contents} 124 | .TagLabel{font-size:85%;font-weight:600;display:inline-block;padding:0 4px!important;color:#45556e;margin-right:5px;border-radius:4px!important} 125 | .feed-container{margin-top:unset!important;display:flex;width:auto!important;border-radius:unset!important;background:unset!important;box-shadow:unset!important;padding:10px!important;border-bottom:1px solid fade(@hero-bg,98.5%)} 126 | .sideNav{ 127 | flex-shrink:0;margin-right:auto;position:fixed;z-index:2;left:0;top:50px;overflow:auto;width:auto;height:100%;padding-bottom:30px;background:@body-bg;border-right:1px solid fade(@hero-bg,98.5%);flex-shrink:0;margin-right:auto; 128 | .Dropdown--select { 129 | padding-left: 10px; 130 | .Dropdown-menu{ 131 | margin-left:-10px;width:auto; 132 | >li.active>a{font-weight:700;background:@hero-bg;color:@link-color} 133 | >li{ 134 | >a{padding:8px 0 8px 40px} 135 | } 136 | } 137 | } 138 | >ul{margin-top:0;padding-bottom:80px} 139 | } 140 | .aaalert.aaquote .aainner{background:fade(@control-bg,50%)!important} 141 | .App{overflow-x:visible} 142 | .App-composer{padding-right:5%} 143 | .App--discussion .Composer:not(.fullScreen){margin-left:220px} 144 | .Alert.Alert--undefined{padding-left:220px} 145 | .AfruxWidgets-sideNavAlt{margin-left:unset!important;padding-top:15px!important;padding-right:5px;padding-left:5px;position:sticky!important;top:50px;height:100%;min-height:calc(100vh);background:@body-bg;border-left:1px solid fade(@hero-bg,98.5%)} 146 | .AchievementsList .Achievement--Icon{background:unset;display:unset!important;width:22px;height:22px} 147 | .BlogItemPage .App-composer .Composer{margin:0 0 0 220px!important} 148 | .BlogSideWidget{ 149 | .sideNav{ 150 | position:inherit; 151 | li{padding:1px 30px 1px 0!important} 152 | } 153 | } 154 | .SettingsPage legend{float:unset} 155 | .UserPage .SettingsPage .Button--primary.active,.UserPage .SettingsPage .Button--primary:active,.UserPage .SettingsPage .Button:focus,.UserPage .SettingsPage .Button:hover,.UserPage .SettingsPage .open>.Dropdown-toggle.Button,.UserPage .SettingsPage .open>.Dropdown-toggle.Button--primary{background:@config-primary-color!important} 156 | .UserCard-Achievement-list{display:none} 157 | .DiscussionList:not(.DiscussionList--searchResults) .unread .DiscussionListItem-title{font-weight:500} 158 | .DiscussionList-loadMore{margin-left:-200px} 159 | .NotificationsDropdown-unread,.new .NotificationsDropdown-unread{background:@muted-color!important} 160 | .unread .DiscussionListItem-title:after{content:"New";color:#f8504b;font-size:smaller;margin-left:4px;position:relative} 161 | .Modal--New-Achievement .Achievement--Icon{width:22px;color:@body-bg} 162 | .GroupList-content .GroupList-UserList-item .badges{top:-10px} 163 | .RemoveAnnounce::after{content:"";display:none} 164 | .TagTiles{ 165 | display:grid;grid-template-columns:repeat(3,33.33333%); 166 | >li{float:unset;width:auto!important;height:auto!important;margin:1em 1em;min-height:102px;max-height:200px;} 167 | } 168 | .TagTile-description,.TagTile-name{width:-webkit-fill-available;width:100%} 169 | .TagTile-info .icon{font-size:168px!important;right:-65px;top:-55px;position:absolute;opacity:.2;font-weight:700} 170 | .TagTile-info,.TagTile-lastPostedDiscussion{position:unset!important} 171 | .TagTile.colored .TagTile-lastPostedDiscussion {max-width: 220px} 172 | .FT1{padding-left:220px;padding-top:10px;margin:10px auto;border-top:1px solid fade(@hero-bg,98.5%)} 173 | .FlarumBlogItem{padding:30px 75px!important} 174 | .FlarumBlogOverview{padding: 30px 75px!important} 175 | .Pages { 176 | .container{margin:0 auto;max-width:unset;width:980px!important} 177 | .Pages-container{padding:15px} 178 | } 179 | } 180 | @media @screen-phone-max{ 181 | .DiscussionListItem-content{padding-left:20px;padding-right:20px} 182 | .DiscussionListItem-count,.item-discussion-views{background:@header-control-bg!important} 183 | .IndexPage{ 184 | .DiscussionListItem-info>.item-tags{margin-top:unset} 185 | .DiscussionListItem-title{margin-right:auto} 186 | } 187 | } 188 | @media @phone{ 189 | .item-discussion-views{display:none!important} 190 | } 191 | li.licss {max-width:20%;overflow:hidden} 192 | .Alert{border-radius:unset} 193 | .AfruxWidgets-Widget-content{width:auto!important;margin-left:unset!important} 194 | .Badge{-webkit-box-shadow:unset;box-shadow:unset} 195 | .catchthefish-basket{background:@body-bg!important;border:2px solid fade(@config-primary-color,5%)!important} 196 | .DiscussionListItem{border-bottom:1px solid fade(@hero-bg,98.5%)} 197 | /*.DiscussionListItem-count{margin-right:-38px;}*/ 198 | .GroupList-content .Badge{width:22px;height:22px;color:#fff;box-shadow: 0 2px 4px fade(#000,35%)} 199 | .IndexPage .DiscussionListItem-info>.item-tags,.UserPage .DiscussionListItem-info>.item-tags{padding-right:3px!important;position:initial!important;-webkit-mask-image:none!important} 200 | .item-discussion-views{right:37px;width:79px;width:60px} 201 | .Post-body{ 202 | pre{border-left:3px solid @control-bg;border-radius:0} 203 | blockquote{border-left:3px solid @config-primary-color!important;border:0;border-radius:0} 204 | } 205 | .SignatureWrapper{clear:both;border-top:1px dashed @hero-bg!important;color:@control-color;padding:5px 0!important;margin-top:10px} 206 | .topicStarter{padding:1px 4px 1px 5px!important;font-weight:600;float:right;position:inherit;margin-left:-35px!important;z-index:99;font-size:12px!important} 207 | .sideNav::-webkit-scrollbar{width:2px;height:7px;background-color:fade(@secondary-color,30%)} 208 | .sideNav::-webkit-scrollbar-thumb{background-color:@primary-color;background-image:-webkit-linear-gradient(45deg,rgba(255,255,255,.2) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.2) 50%,rgba(255,255,255,.2) 75%,transparent 75%,transparent)} 209 | .avatarwb .Avatar,.backgrwb {box-shadow: unset!important;} 210 | .iconbadge>li>*{background:unset!important;color:unset!important} 211 | --------------------------------------------------------------------------------