Question How to make Kunena 5 Crypsis template look like the K4 Blue Eagle template

Just to chime in on the lack of template availability... I would like to know if there is any "template" for developing a 5.02 template. Seems to me there should be an open source approach to template development or a simple SDK for this.

Hi there,

I am new to Kunena. Kunena 4 looks good but Kunena 5 is better in functions.
Kunena 5, Crypsis template just feels like a mess. I find it very hard to navigate between topics.

So I have customized the Crypsis template to look like the Blue Eagle template. I am getting very close to the Blue Eagle template layout.
Now I just want to create a new template folder, so in next updates the template would not change. After this is completed I will gladly contribute this template.

But it is not as easy as just duplicating the Crypsis folder, that just does not work.
So how to create a new template?

Thanks

Can't wait until you have it ready! huge thanks!

Hello,

Almost there. Only working a few hours a week on it.

But I still do not know how to transform it to a new template. And it is a must. Otherwise you could not update Kunena without overwriting the template. Also once I have this figured out, I allows me to keep the template up-to-date with new Kunena releases.

Anyone knows how to create a new template folder?

Thanks

Wish I could advise you about new templates, but no.
I want the background color of the topic rows to alternate colors, light then dark, etc. like in Blue Eagle.
Here's the code someone else posted for the custom.less file to create the TABS, looks good

.fa-rss { color: orange !important; }

#kunena, layout {
.navbar-inner {
border-top: none;
border-left: none;
border-right: none;
border-bottom: 4px solid #6f6c6c;
min-height: 12px !important;
background-image: none;
background-color: transparent;
}
.navbar .nav > li > a {
background-color: #6f6c6c;
border-top-left-radius: 7px;
border-top-right-radius: 7px;
margin-right: 1px;
color: #fff;
text-shadow: none;
padding: 8px 8px 11px !important;
max-height: 12px !important;
}
.navbar .active > a {
background-color: #3c728e !important;
}
.navbar a:hover {
background-color: #3c728e !important;
color: #fff !important;
}
.navbar .nav li.dropdown > .dropdown-toggle .caret {
border-top-color: #fff !important;
}
}

.fa-fw { color: #fff; }

a:hover {
text-decoration: underline;
}
.fa-rss:before {
color: orange;
}
.layout h1 {
color: #fff;
background-color: #3c728e;
line-height: 30px;
padding: 5px;
border-top-right-radius: 5px;
border-top-left-radius: 5px;
}
.layout h1 a {
color: #fff;
}
.layout h1 small {
color: #fff;
}
.layout h2 {
line-height: 30px;
padding-left: 5px !important;
padding-right: 5px !important;
}
.layout h2 a {
color: #fff;
}
h2.btn-link {
background-color: #3c728e !important;
}
th.span5, th.span1, th.span2, th.span6, th.span3, th.span4 {
background-color: #3c728e !important;
color: #fff;
}
th.span5 a, th.span1 a, th.span2 a, th.span6 a {
color: #fff;
}
.layout h1 .fa-2x {
font-size: 1.2em !important;
}
.form-search .input-append .search-query {
height: 19px;
}
.btn:first-child {
color: #424753;
}
button.btn.btn-primary {
/* color: #fff !important; */
}
.btn-group > .btn:first-child {
/* color: #fff !important; */
}
.btn-group > .btn:last-child, .btn-group > .dropdown-toggle {
color: #424753 !important;
}
button.btn, input[type="submit"] {
/* color: #fff !important; */
}
button.btn, .btn-primary {
background-image: linear-gradient(to bottom,#fff,#e6e6e6) !important;
background-color: #e6e6e6 !important;
color: #333 !important;
border-color: #a2a2a2 !important;
}
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus, .dropdown-submenu:hover > a, .dropdown-submenu:focus > a {
background: #3c728e !important;
}
.layout .badger-info:after {
width: 97%;
max-height: 30px;
}
#kunena.layout .kmsg {
margin-top: 15px;
}
.alert-info h1 {
background-color: transparent;
margin-top: 0px;
padding-top: 0;
margin-bottom: 0;
}
.caret {
border-top: 4px solid #000 !important;
}

Actually. I have changed many template files to make topics look like Blue Eagle template. I also added many extra classes so every element could be custom styled. So the provided custom.less will not work in my template, at least not completely.

When it is completed. I will post the modified Crypsis template. Hopefully under a new name. If not, it would have to be overwritten after every update.