File size: 7.88Kb
<!doctype html>
<!--[if IE 6 ]><html lang="en-us" class="ie6"> <![endif]-->
<!--[if IE 7 ]><html lang="en-us" class="ie7"> <![endif]-->
<!--[if IE 8 ]><html lang="en-us" class="ie8"> <![endif]-->
<!--[if (gt IE 7)|!(IE)]><!-->
<html lang="en-us"><!--<![endif]-->
<head>
<meta charset="utf-8">
<title>Benhome - Architecture & Interior Figma Template</title>
<meta name="description" content="">
<meta name="author" content="Murren20">
<meta name="copyright" content="Murren20">
<meta name="generator" content="Documenter v2.0 http://rxa.li/documenter">
<meta name="date" content="2015-12-10T00:00:00+01:00">
<link rel="stylesheet" href="assets/css/documenter_style.css" media="all">
<link rel="stylesheet" href="assets/js/google-code-prettify/prettify.css" media="screen">
<style>
html{background-color:#FFFFFF;color:#383838;}
::-moz-selection{background:#444444;color:#DDDDDD;}
::selection{background:#444444;color:#DDDDDD;}
a{color:#F27935;}
.btn {
border-radius:3px;
}
.btn-primary {
background-image: -moz-linear-gradient(top, #0088CC, #0044CC);
background-image: -ms-linear-gradient(top, #0088CC, #0044CC);
background-image: -webkit-gradient(linear, 0 0, 0 0088CC%, from(#DDDDDD), to(#0044CC));
background-image: -webkit-linear-gradient(top, #0088CC, #0044CC);
background-image: -o-linear-gradient(top, #0088CC, #0044CC);
background-image: linear-gradient(top, #0088CC, #0044CC);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#0088CC', endColorstr='#0044CC', GradientType=0);
border-color: #0044CC #0044CC #bfbfbf;
color:#FFFFFF;
}
.btn-primary:hover,
.btn-primary:active,
.btn-primary.active,
.btn-primary.disabled,
.btn-primary[disabled] {
border-color: #0088CC #0088CC #bfbfbf;
background-color: #0044CC;
}
hr{border-top:1px solid #EBEBEB;border-bottom:1px solid #FFFFFF;}
#documenter_sidebar, #documenter_sidebar ul a{background-color:#0F0F0F;color:#0F0F0F;}
#documenter_sidebar ul a{}
#documenter_sidebar ul{}
#documenter_sidebar ul a{ border-top: 0; border-bottom:1px solid #F27935;color:#9B9B9B;}
#documenter_sidebar ul a:hover{background:#F27935;color:#ffffff;}
#documenter_sidebar ul a.current{background:#F27935;color:#ffffff;}
#documenter_copyright{color:#bfbfbf;display:block !important;visibility:visible !important;}
img {max-width: 800px; width: 100%;}
</style>
</head>
<body class="documenter-project-silvana">
<div id="documenter_sidebar">
<a href="#documenter_cover" id="documenter_logo" style="text-align:center; margin:20px 20px 20px;">
</a>
<ul id="documenter_nav">
<li><a class="current" href="#documenter_cover">Start</a></li>
<li><a href="#css" title="CSS">CSS</a></li>
<li><a href="#change_logo" title="Change Logo">Change Logo</a></li>
<li><a href="#projects_bg" title="Project backgrounds">Backgrounds</a></li>
<li><a href="#video" title="Video">Video</a></li>
<li><a href="#swiper" title="Swiper">Swiper</a></li>
<li><a href="#images" title="Images">Images</a></li>
<li><a href="#timer" title="Timer">Timer</a></li>
<li><a href="#parallax" title="Parallax">Parallax</a></li>
<li><a href="#filter" title="Filter">Filter</a></li>
<li><a href="#credits" title="Credits">Credits</a></li>
</ul>
<div id="documenter_copyright">Copyright Paul 2024<br>
made with the <a href="http://rxa.li/documenter">Documenter v2.0</a>
</div>
</div>
<div id="documenter_content">
<section id="documenter_cover">
<h1>Benhome</h1>
<h2>Benhome - Architecture & Interior Figma Template</h2>
<div id="documenter_buttons">
</div>
<hr>
<ul>
<li>created: 12/08/2017</li>
<li>updated: 12/01/2024</li>
<li>by: Paul</li>
</ul>
<p></p>
</section>
<section id="css">
<div class="page-header"><h3>CSS</h3><hr class="notop"></div>
<p><strong>1. </strong>In the very beginning you can see css-map, it helps you to find all you want to change. </p>
<p><strong>CSS:</strong></p>
<p><img alt="" src="assets/images/1.png"></p>
</section>
<section id="change_logo">
<div class="page-header"><h3>Change Logo</h3><hr class="notop"></div>
<p><strong>2. </strong>Just change logo's text in header there: </p>
<p><strong>HTML:</strong></p>
<p><img alt="" src="assets/images/2.png"></p>
</section>
<section id="projects_bg">
<div class="page-header"><h3>Backgrounds</h3><hr class="notop"></div>
<p><strong>3. </strong>You can change backgrounds images in inline styles.</p>
<p><img alt="" src="assets/images/3.png"></p>
</section>
<section id="video">
<div class="page-header"><h3>Video</h3><hr class="notop"></div>
<p><strong>4. </strong>You should insert link from <strong>YouTube</strong> instead of this example.</p>
<p><img alt="" src="assets/images/4.png"></p>
<p> Also you can insert link from <strong>YouTube</strong> here: </p>
<p><img alt="" src="assets/images/5.png"></p>
</section>
<section id="swiper">
<div class="page-header"><h3>Swiper</h3><hr class="notop"></div>
<p><strong>5. </strong>All of sliders are built using the swiper.js plugin, you can find the documentation here: <a href="https://swiperjs.com/" target="_blank">swiperjs.com/</a></p>
<p><strong>JS:</strong></p>
<p><img alt="" src="assets/images/7.png"></p>
</section>
<section id="images">
<div class="page-header"><h3>Images</h3><hr class="notop"></div>
<p><strong>6. </strong>All images you can change here: </p>
<p><img alt="" src="assets/images/6.png"></p>
</section>
<section id="timer">
<div class="page-header"><h3>Timer</h3><hr class="notop"></div>
<p><strong>7. </strong>This code is for timer. If you want, you can put here number, which you need: </p>
<p><img alt="" src="assets/images/8.png"></p>
</section>
<section id="parallax">
<div class="page-header"><h3>Parallax</h3><hr class="notop"></div>
<p><strong>8. </strong>If you need parallax for background, you can add this class: </p>
<p><strong>HTML:</strong></p>
<p><img alt="" src="assets/images/10.png"></p>
<p><strong>JS:</strong></p>
<p><img alt="" src="assets/images/9.png"></p>
</section>
<section id="filter">
<div class="page-header"><h3>Filter</h3><hr class="notop"></div>
<p><strong>9. </strong> Filter is built using the Isotope plugin, you can find the documentation here: <a href="https://isotope.metafizzy.co/" target="_blank">https://isotope.metafizzy.co/</a></p>
<p><img alt="" src="assets/images/11.png"></p>
</section>
<section id="credits">
<div class="page-header"><h3>Credits</h3><hr class="notop"></div>
<p>jQuery <a href="http://jquery.com/" target="_blank">http://jquery.com/</a></p>
<p>Bootstrap <a href="http://getbootstrap.com/" target="_blank">http://getbootstrap.com/</a> <br> In this project Bootstrap is used only grid.</p>
<p>Magnific Popup <a href="https://dimsemenov.com/plugins/magnific-popup/" target="_blank">https://dimsemenov.com/plugins/magnific-popup/</a> <br> Magnific Popup is used for video. </p>
<p>Swiper <a href="https://swiperjs.com/" target="_blank">https://swiperjs.com/</a></p>
<p>AOS - Animate On Scroll Library <a href="https://michalsnik.github.io/aos/" target="_blank">https://michalsnik.github.io/aos/</a></p>
<p>Isotope <a href="https://isotope.metafizzy.co/" target="_blank">https://isotope.metafizzy.co/</a></p>
<p>ANIMSITION <a href="https://git.blivesta.com/animsition/" target="_blank">https://git.blivesta.com/animsition/</a></p>
</section>
</div>
<script src="assets/js/jquery.js"></script>
<script src="assets/js/onepage.js"></script>
</body>
</html>