You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
220 lines
6.7 KiB
220 lines
6.7 KiB
{% extends 'partials/base.html' %}
|
|
{% load staticfiles %}
|
|
{% load thumbnail %}
|
|
{% block content %}
|
|
<body>
|
|
<div class="wrTop disTab">
|
|
<div class="container-fluid topMain">
|
|
<div class="row">
|
|
<div class="col-lg-3">
|
|
<div class="logo" onClick="window.location='/'"></div>
|
|
</div>
|
|
<div class="col-lg-7">
|
|
<ul class="mainMenu">
|
|
<li class="icon_tm1">
|
|
<a href="javascript:void(0)">Биржа проектов</a>
|
|
<span></span>
|
|
</li>
|
|
<li class="icon_tm2">
|
|
<a href="javascript:void(0)">Поиск исполнителей</a>
|
|
<span></span>
|
|
</li>
|
|
<li class="icon_tm3">
|
|
<a href="javascript:void(0)">Работы на продажу</a>
|
|
<span></span>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="col-lg-2">
|
|
<div class="imgProfile">
|
|
<img src="img/profile.jpg" alt="profile-image">
|
|
</div>
|
|
<div class="infoProfile disTab">
|
|
<div class="btn-group" role="group">
|
|
<button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
|
<span class="glyphicon glyphicon-menu-hamburger" aria-hidden="true"></span>
|
|
</button>
|
|
<ul class="dropdown-menu menu-drop-new">
|
|
<li class="icon_mm1">
|
|
<a href="#">
|
|
Войти заказчиком
|
|
<span></span>
|
|
</a>
|
|
</li>
|
|
<li class="icon_mm2">
|
|
<a href="#">
|
|
Войти исполнителем
|
|
<span></span>
|
|
</a>
|
|
</li>
|
|
<li class="icon_mm3">
|
|
<a href="#">
|
|
Сообщения
|
|
<span></span>
|
|
</a>
|
|
</li>
|
|
<li class="icon_mm4">
|
|
<a href="#">
|
|
Счет
|
|
<span></span>
|
|
</a>
|
|
</li>
|
|
<li class="icon_mm5">
|
|
<a href="#">
|
|
Настройки
|
|
<span></span>
|
|
</a>
|
|
</li>
|
|
<li class="icon_mm6">
|
|
<a href="#">
|
|
FAQ
|
|
<span></span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="rating">
|
|
<div class="ratingInset"></div>
|
|
<div class="iconRating"></div>
|
|
</div>
|
|
<p class="ratingPer">45%</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="container mainScore">
|
|
<div class="row">
|
|
<div class="col-lg-12 allProjects">
|
|
<p class="titleScore">{{ object }}</p>
|
|
<div class="all all1">
|
|
<p>предыдущий</p>
|
|
</div>
|
|
<div class="all all2">
|
|
<p>следующий</p>
|
|
</div>
|
|
</div>
|
|
<div class="btnReadyBlock disTab">
|
|
<div class="triangle1"></div>
|
|
<div class="col-lg-3">
|
|
<p class="cenaReady">{{ object.price }} <i class="fa fa-rub"></i></p>
|
|
</div>
|
|
<div class="col-lg-3">
|
|
<a href="javascript:void(0)" class="linkReady LR1">
|
|
купить
|
|
</a>
|
|
</div>
|
|
<div class="col-lg-3">
|
|
<a href="javascript:void(0)" class="linkReady LR2">
|
|
Написать сообщение
|
|
</a>
|
|
</div>
|
|
<div class="col-lg-3">
|
|
<a href="javascript:void(0)" class="linkReady LR3">
|
|
посмотреть контакты
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<div class="desReadyBlock">
|
|
<div class="col-lg-10 col-lg-offset-1">
|
|
<p class="titleReady">Описание:</p>
|
|
</div>
|
|
<div class="col-lg-10 col-lg-offset-1">
|
|
<p class="textReady">
|
|
{{ object.text }}
|
|
</p>
|
|
</div>
|
|
<div class="col-lg-12 sliderReady">
|
|
<div class="arroww prev3"></div>
|
|
<div class="arroww next3"></div>
|
|
<div class="swiper-container gallery-top">
|
|
<div class="swiper-wrapper">
|
|
|
|
<div class="swiper-slide" style="background-image:url('{% static object.img.url %}')"></div>
|
|
{% for photo in object.photos.all %}
|
|
<div class="swiper-slide" style="background-image:url('{% static photo.img.url %}')"></div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
<div class="swiper-container gallery-thumbs">
|
|
<div class="swiper-wrapper">
|
|
<div class="swiper-slide is-selected" style="background-image:url('{% static object.img.url %}')"></div>
|
|
{% for photo in object.photos.all %}
|
|
<div class="swiper-slide" style="background-image:url('{% static photo.img.url %}')"></div>
|
|
{% endfor %}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-12">
|
|
<div class="triangle2"></div>
|
|
<div class="arr arr1"></div>
|
|
<div class="arr arr2"></div>
|
|
</div>
|
|
</div>
|
|
<div class="col-lg-12 sibl">
|
|
<p>Похожие работы</p>
|
|
</div>
|
|
|
|
|
|
<div class="gallMini disTab">
|
|
{% for worksell in worksell_related %}
|
|
<div class="col-lg-3">
|
|
|
|
<div class="insetCol box-sizing disTab">
|
|
{% thumbnail worksell.img "265x265" crop="center" as im %}
|
|
<div class="imgGal" style="background: url('{{ im.url }}') no-repeat center;">
|
|
<div class="imgFigure"></div>
|
|
</div>
|
|
{% endthumbnail %}
|
|
</div>
|
|
</div>
|
|
{% endfor %}
|
|
</div>
|
|
|
|
{% include 'partials/footer.html' %}
|
|
|
|
</div>
|
|
</div>
|
|
|
|
{% endblock %}
|
|
{% block js_block %}
|
|
<script src="{% static 'js/swiper.min.js' %}"></script>
|
|
<script>
|
|
var galleryTop = new Swiper('.gallery-top', {
|
|
nextButton: '.next3',
|
|
prevButton: '.prev3',
|
|
spaceBetween: 10,
|
|
});
|
|
var galleryTop = new Swiper('.gallery-top', {
|
|
nextButton: '.next3',
|
|
prevButton: '.prev3',
|
|
spaceBetween: 15,
|
|
onSlideChangeEnd: function(swiper){
|
|
var activeIndex = swiper.activeIndex;
|
|
$(galleryThumbs.slides).removeClass('is-selected');
|
|
$(galleryThumbs.slides).eq(activeIndex).addClass('is-selected');
|
|
galleryThumbs.slideTo(activeIndex,300, false);
|
|
|
|
}
|
|
|
|
});
|
|
var galleryThumbs = new Swiper('.gallery-thumbs', {
|
|
spaceBetween: 15,
|
|
freeMode: true,
|
|
centeredSlides: false,
|
|
slidesPerView: 6,
|
|
touchRatio: 0.2,
|
|
nextButton: '.arr2',
|
|
prevButton: '.arr1',
|
|
onClick: function (swiper, event){
|
|
var clicked = swiper.clickedIndex
|
|
swiper.activeIndex = clicked;
|
|
swiper.updateClasses()
|
|
$(swiper.slides).removeClass('is-selected');
|
|
$(swiper.clickedSlide).addClass('is-selected');
|
|
galleryTop.slideTo(clicked,300, false);
|
|
|
|
}
|
|
});
|
|
</script>
|
|
{% endblock %}
|
|
|