[ADD] theme saas-12.3
This commit is contained in:
Design
@@ -0,0 +1,245 @@
|
||||
|
||||
// Collapse menu
|
||||
@include media-breakpoint-down(sm) {
|
||||
#wrapwrap {
|
||||
header {
|
||||
.navbar-toggle {
|
||||
display: block;
|
||||
}
|
||||
.navbar-fixed-top {
|
||||
top: 0;
|
||||
border-width: 0 0 1px;
|
||||
}
|
||||
.navbar-collapse.collapse {
|
||||
display: none!important;
|
||||
}
|
||||
.navbar-nav {
|
||||
float: none!important;
|
||||
}
|
||||
.navbar-nav > li {
|
||||
float: none;
|
||||
}
|
||||
.collapse.show {
|
||||
display:block !important;
|
||||
height: auto !important;
|
||||
}
|
||||
.container {
|
||||
padding-left: $grid-gutter-width/2;
|
||||
padding-right: $grid-gutter-width/2;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@include o-theme-cfa-btn-style();
|
||||
|
||||
main > :not(.o_portal_wrap):not(.o_portal) {
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
#wrap {
|
||||
margin: 80px auto;
|
||||
|
||||
.text-muted:after {
|
||||
color: rgba(0, 0, 0, 0);
|
||||
}
|
||||
}
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
@include o-theme-cfa-header-shadows();
|
||||
@include o-theme-cfa-header-responsive-sizes();
|
||||
|
||||
address {
|
||||
// Made to counter the center-aligned panels (in ecommerce for example).
|
||||
// This was made as a 10.0 fix but should be reviewed in master.
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.breadcrumb {
|
||||
background: rgba(0, 0, 0, 0);
|
||||
border-radius: 0px;
|
||||
}
|
||||
|
||||
@include o-theme-cfa-card-classes(20px);
|
||||
|
||||
@include o-theme-cfa-nav-pills-styles($active-color: theme-color('alpha'), $active-bg: theme-color('epsilon'),
|
||||
$badge-color: theme-color('epsilon'), $badge-bg: theme-color('alpha'));
|
||||
|
||||
@include o-theme-cfa-bg-img-classes($bg-img-01, $bg-img-02, $bg-img-03, $bg-img-04, $bg-img-05, $bg-img-06, $bg-img-07);
|
||||
|
||||
/* ========== Navigation =========== */
|
||||
|
||||
.navbar {
|
||||
border: none;
|
||||
background-color: theme-color('alpha');
|
||||
border-bottom: 1px solid gray('200');
|
||||
|
||||
.container {
|
||||
margin-top: 5px;
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
@include o-position-absolute(0, 0, auto, 0);
|
||||
height: 5px;
|
||||
background: linear-gradient(to left, theme-color('beta'), theme-color('epsilon'));
|
||||
}
|
||||
|
||||
li > .dropdown-menu {
|
||||
margin-top: 9px;
|
||||
border: none;
|
||||
}
|
||||
.navbar-toggler {
|
||||
top: 4px;
|
||||
right: -25px;
|
||||
border-color: gray('700');
|
||||
border-radius: 30px;
|
||||
background-color: rgba(0, 0, 0, 0.7);
|
||||
z-index: 2;
|
||||
padding: 7px 15px;
|
||||
transition: background-color 0.2s ease-out;
|
||||
&:hover, &:focus {
|
||||
background-color: rgba(0, 0, 0, 0);
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
}
|
||||
.navbar-collapse {
|
||||
border-color: rgba(0, 0, 0, 0);
|
||||
display: inline-block !important;
|
||||
vertical-align: middle;
|
||||
@include media-breakpoint-down(sm) {
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#top_menu {
|
||||
@include o-theme-cfa-top-menu-style($font-size: 12px, $dropdown-item-color: theme-color('epsilon'),
|
||||
$dropdown-item-hover-color: gray('700'), $nav-link-color: theme-color('epsilon') !important, $text-transform: uppercase);
|
||||
|
||||
li {
|
||||
&:hover {
|
||||
@include media-breakpoint-down(sm) {
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
a {
|
||||
text-transform: uppercase;
|
||||
&.nav-link.active {
|
||||
font-weight: normal;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#wrapwrap > footer {
|
||||
@include o-theme-cfa-footer-style($padding: 20px 0px, $h4-padding: 0, $text-transform: none);
|
||||
.container {
|
||||
@include media-breakpoint-up(lg) {
|
||||
padding: 8px 65px;
|
||||
}
|
||||
.js_language_selector .dropdown-toggle {
|
||||
padding: 3px 20px;
|
||||
}
|
||||
}
|
||||
#footer {
|
||||
border-top: 1px solid gray('200');
|
||||
|
||||
.col-lg-3, .col-lg-5 {
|
||||
padding: 20px 0px;
|
||||
h2 { // social icons in footer
|
||||
text-transform: uppercase;
|
||||
font-size: 25px;
|
||||
color: theme-color('beta');
|
||||
a {
|
||||
display: inline;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* ====================== form style ======================== */
|
||||
|
||||
#wrapwrap .form-control:not(.quantity) {
|
||||
@include o-theme-cfa-custom-form-control();
|
||||
}
|
||||
|
||||
/* ===================== BLOG ===================== */
|
||||
|
||||
@include o-theme-cfa-website-blog-styles();
|
||||
|
||||
/* ===================== FORUM ===================== */
|
||||
@include o-theme-cfa-forum-style($padding: 0);
|
||||
.o_wforum_navbar_container {
|
||||
.navbar .navbar-brand {
|
||||
color: rgba(0, 0, 0, 0.9);
|
||||
}
|
||||
.navbar-right input {
|
||||
background-color: rgba(255, 255, 255, 0.5);
|
||||
&:focus {
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
}
|
||||
}
|
||||
}
|
||||
.website_forum #wrap .col-md-3 .btn-block .btn {
|
||||
background-color: inherit;
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
@if ($o-theme-layout == 'boxed') {
|
||||
#wrapwrap {
|
||||
padding: 0 !important;
|
||||
|
||||
#wrap {
|
||||
width: 992px;
|
||||
margin-bottom: 0;
|
||||
@include media-breakpoint-down(md) {
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
.navbar > .container {
|
||||
max-width: 100%;
|
||||
}
|
||||
.container {
|
||||
max-width: 992px;
|
||||
}
|
||||
|
||||
.s_color_blocks_2 [class*="col-lg-"] {
|
||||
padding-top: 992px * 8 / 100;
|
||||
padding-bottom: 992px * 8 / 100;
|
||||
}
|
||||
}
|
||||
.navbar {
|
||||
width: 100%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
footer:not(.modal-footer) > :not(#footer):last-child {
|
||||
margin-bottom: 80px;
|
||||
}
|
||||
#footer, footer:not(.modal-footer) > :not(#footer):not(.o_footer_copyright):last-child {
|
||||
width: 992px;
|
||||
}
|
||||
footer:not(.modal-footer) > .oe_structure {
|
||||
margin: 0 auto;
|
||||
}
|
||||
@include media-breakpoint-down(md) {
|
||||
#footer, footer:not(.modal-footer) > :not(#footer):last-child {
|
||||
width: 100%;
|
||||
}
|
||||
footer:not(.modal-footer) > :not(#footer):last-child {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
#wrapwrap .container {
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
} @else {
|
||||
@include o-theme-cfa-full-width-styles();
|
||||
#wrapwrap > footer .container {
|
||||
max-width: 100%;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user