{"id":467,"date":"2019-09-03T09:01:56","date_gmt":"2019-09-03T09:01:56","guid":{"rendered":"https:\/\/docs.theironnetwork.org\/vuely\/?page_id=467"},"modified":"2019-09-24T08:43:46","modified_gmt":"2019-09-24T08:43:46","slug":"style-customization-2","status":"publish","type":"page","link":"https:\/\/docs.theironnetwork.org\/vuely\/style-customization-2\/","title":{"rendered":"Style Customization"},"content":{"rendered":"\n<h6>Theme Style<\/h6>\n\n\n\n<p>Go to <code>sass>materizlize>components><\/code> and open variables.scss file. Edit your variables with your requirement.<\/p>\n\n\n\n<h6 id=\"custom-variables\">Custom Variables<a href=\"#custom-variables\"><\/a><\/h6>\n\n\n\n<p>In app.variables you will find the following variables. By using these variables you can customize the style of the theme.app.variables.scss<\/p>\n\n\n\n<pre class=\"wp-block-preformatted\">\/\/Main<br>$main-container-bg:#f4f7fa;<br>$main-container-gap:1.5rem;<br>$transition-time:0.2s;<br> <br>\/\/sidebar<br>$sidebar-width:250px;<br>$sidebar-bg-color: #2e3344;<br>$sidbar-menu-color: #fff;<br>$sidebar-menu-active-hover-box-shadow:0 4px 15px 0 rgba(0, 0, 0, 0.09);<br>$sidebar-menu-active-hover-bg: rgba(0, 0, 0, 0.2);<br>$sidebar-user-dropdown-color:#000;<br> <br>$compact-sidebar-width:65px;<br> <br> <br>\/\/app-card<br>$card-title-color:#464d69;<br>$card-title-font-size:1rem;<br>$card-title-font-weight:700;<br> <br>$card-preloader-bg-color: #ffffff;<br> <br>$card-dropdown-bg:#ffffff;<br>$card-dropdown-box-shadow:0 5px 5px -3px rgba(0, 0, 0, .2),<br>0 8px 10px 1px rgba(0, 0, 0, .14),<br>0 3px 14px 2px rgba(0, 0, 0, .12);<br> <br> <br>\/\/Header<br>$app-toolbar-bg-color:#fff;<br>$app-toolbar-left-right-gap:$main-container-gap;<br>$app-toolbar-nav-color:#727891;<br>$app-toolbar-dropdown-shadow:0 3px 2px 0 rgba(0, 0, 0, .02);<br>$app-toolbar-dropdown-width:320px;<br>$app-toolbar-dropdown-color:#727891;<br>$app-toolbar-serach-active-bg:#f2f2f2;<br>$site-logo-border:rgba(255, 255, 2555, 0.3);<br> <br> <br>\/\/Box Shadow<br>$mat-box-shadow:0 1px 15px 1px rgba(69, 65, 78, .08);<br> <br>\/\/BreadCrumb<br>$breadcrumb-bg-color:#fff;<br>$breadcrumb-font-size:1.4rem;<br>$breadcrumb-font-weight:600;<br>$breadcrumb-font-color:#464d69;<\/pre>\n<div class=\"pld-like-dislike-wrap pld-template-1\">\n    <div class=\"pld-like-wrap  pld-common-wrap\">\n    <a href=\"javascript:void(0);\" class=\"pld-like-trigger pld-like-dislike-trigger \" title=\"\" data-post-id=\"467\" data-trigger-type=\"like\" data-restriction=\"cookie\" data-ip-check=\"0\" data-user-check=\"1\">\n                        <i class=\"fas fa-thumbs-up\"><\/i>\n                    <\/a>\n    <span class=\"pld-like-count-wrap pld-count-wrap\">    <\/span>\n<\/div><div class=\"pld-dislike-wrap  pld-common-wrap\">\n    <a href=\"javascript:void(0);\" class=\"pld-dislike-trigger pld-like-dislike-trigger \" title=\"\" data-post-id=\"467\" data-trigger-type=\"dislike\" data-ip-check=\"0\" data-restriction=\"cookie\" data-user-check=\"1\">\n                        <i class=\"fas fa-thumbs-down\"><\/i>\n                    <\/a>\n    <span class=\"pld-dislike-count-wrap pld-count-wrap\"><\/span>\n<\/div><\/div>\n\n","protected":false},"excerpt":{"rendered":"<p>Theme Style Go to sass>materizlize>components> and open variables.scss file. Edit your variables with your requirement. Custom Variables In app.variables you will find the following variables. By using these variables you can customize the style of the theme.app.variables.scss \/\/Main$main-container-bg:#f4f7fa;$main-container-gap:1.5rem;$transition-time:0.2s; \/\/sidebar$sidebar-width:250px;$sidebar-bg-color: #2e3344;$sidbar-menu-color: #fff;$sidebar-menu-active-hover-box-shadow:0 4px 15px 0 rgba(0, 0, 0, 0.09);$sidebar-menu-active-hover-bg: rgba(0, 0, 0, 0.2);$sidebar-user-dropdown-color:#000; $compact-sidebar-width:65px; \/\/app-card$card-title-color:#464d69;$card-title-font-size:1rem;$card-title-font-weight:700; $card-preloader-bg-color: [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":49,"comment_status":"closed","ping_status":"closed","template":"","meta":[],"_links":{"self":[{"href":"https:\/\/docs.theironnetwork.org\/vuely\/wp-json\/wp\/v2\/pages\/467"}],"collection":[{"href":"https:\/\/docs.theironnetwork.org\/vuely\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/docs.theironnetwork.org\/vuely\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/docs.theironnetwork.org\/vuely\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/docs.theironnetwork.org\/vuely\/wp-json\/wp\/v2\/comments?post=467"}],"version-history":[{"count":1,"href":"https:\/\/docs.theironnetwork.org\/vuely\/wp-json\/wp\/v2\/pages\/467\/revisions"}],"predecessor-version":[{"id":469,"href":"https:\/\/docs.theironnetwork.org\/vuely\/wp-json\/wp\/v2\/pages\/467\/revisions\/469"}],"wp:attachment":[{"href":"https:\/\/docs.theironnetwork.org\/vuely\/wp-json\/wp\/v2\/media?parent=467"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}