Обновление шаблона John Smith до версии 1.0.1

1. Найдте в CSS (ПУ » Дизайн Управление дизайном (CSS)) следующий код:

   .p-works {
   	overflow: hidden;
   	height: 542px;
   }
   .p-title a {
   	float: right;
   	text-decoration: underline;
   }
   .p-title a:hover {
   	text-decoration: none;
   }
   .work {
       width: 270px;
       height: 270px;
       float: left;
       margin-left: 1px;
       margin-bottom: 1px;
       overflow: hidden;
       position: relative;
       line-height: 22px;
   }
   .work img {
       width: 270px;
       height: 270px;
       transition: all .3s ease;
   }
   .work:hover img {
       opacity: 0.2;
   }
   .work span {
       display: block;
       position: absolute;
       z-index: 2;
       top: 0;
       left: 0;
       padding: 60px 20px;
       width: 230px;
       text-align: center;
       font-weight: 400;
       opacity: 0;
       transition: all .3s ease;
   }

   и замените его на этот:

   .p-works {
   	overflow: hidden;
   }
   .p-title a {
   	float: right;
   	text-decoration: underline;
   }
   .p-title a:hover {
   	text-decoration: none;
   }
   .work {
   	float: left;
   	width: 25%;
   	position: relative;
   }
   .work:after {
   	content: '';
   	display: block;
   	padding-top: 100%;
   }
   .work img {
   	width: 100%;
   	position: absolute;
   	top: 0;
   	left: 0;
   	transition: all .3s ease;
   }
   .work:hover img {
   	opacity: 0.2;
   }
   .work span {
   	display: block;
   	position: absolute;
   	z-index: 2;
   	top: 50%;
   	left: 0;
   	margin-top: -70px;
   	padding: 0 30px;
   	width: 100%;
   	text-align: center;
   	font-weight: 400;
   	opacity: 0;
   	box-sizing: border-box;
   	transition: all .3s ease;
   }

2. Добавьте в CSS (ПУ » Дизайн Управление дизайном (CSS)) следующий код:

   .portfolio-page .work {
       float: none;
       width: 100%;
   }
   .portfolio-page .uEntryWrap {
       width: 25% !important;
       position: relative;
       float: left;
       display: block !important;
       overflow: hidden;
       margin-left: 0 !important;
   }
   .portfolio-page .uEntryWrap > div {
       width: 100%;
       display: block !important;
       position: absolute;
       top: 0;
       left: 0;
   }
   .portfolio-page .uEntryWrap:after {
       content: '';
       display: block;
       padding-top: 100%;
   }

3. Замените содержимое файла /js/ui.js на следующий код:

   $(function(){$(".skils li span b").each(function(){$(this).width($(this).parent().parent().width()*$(this).data("pct")/100).attr("title",$(this).data("pct")+"%").parent().parent().find("u").text($(this).data("pct")+"%")}),$("#reviews ul").easyPaginate({step:1,nextprev:!1}),$('textarea, input[type="text"], input[type="password"]').each(function(){$(this).width($(this).width()-30).addClass("new-width").css({"padding-left":"20px","padding-right":"20px"})})});