Skip to content

Commit

Permalink
Layout FE
Browse files Browse the repository at this point in the history
  • Loading branch information
@hoangcnpd01980
hoangcnpd01980 committed Sep 5, 2019
1 parent 0d2a20d commit 0b4d261
Show file tree
Hide file tree
Showing 44 changed files with 1,037 additions and 177 deletions.
Binary file added app/assets/images/banner_showroom_detail.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added app/assets/images/house.png
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions app/assets/javascripts/application.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@
//= require bootstrap
//= require custom
//= require toastr
//= require multislider

/*global toastr*/
toastr.options = {
Expand Down
45 changes: 21 additions & 24 deletions app/assets/javascripts/custom.js
View file
Original file line number Diff line number Diff line change
@@ -1,30 +1,28 @@
$(document).ready(function() {
var $headline = $('.headline'),
$inner = $('.inner'),
$nav = $('nav'),
navHeight = 75;

$(window).scroll(function() {
var scrollTop = $(this).scrollTop(),
headlineHeight = $headline.outerHeight() - navHeight,
navOffset = $nav.offset().top;

$headline.css({
'opacity': (1 - scrollTop / headlineHeight)
});
$(".preview-signup").change(function() {
readURL(this, '#img-prev-signup');
});

$inner.children().css({
'transform': 'translateY('+ scrollTop * 0.4 +'px)'
});
if (navOffset > headlineHeight) {
$nav.addClass('scrolled');
} else {
$nav.removeClass('scrolled');
$('.carousel .item').each(function(){
var next = $(this).next();
if (!next.length) {
next = $(this).siblings(':first');
}
next.children(':first-child').clone().appendTo($(this));

for (var i=0;i<2;i++) {
next=next.next();
if (!next.length) {
next = $(this).siblings(':first');
}

next.children(':first-child').clone().appendTo($(this));
}
});

$(".preview-signup").change(function() {
readURL(this, '#img-prev-signup');
$('#exampleSlider').multislider({
interval: 5000,
slideAll: false
});

$(".preview-edit-profile").change(function() {
Expand All @@ -43,8 +41,7 @@ function readURL(f, previewId) {
if (f.files && f.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
$(previewId)
.attr('src', e.target.result);
$(previewId).attr('src', e.target.result);
};
reader.readAsDataURL(f.files[0]);
}
Expand Down
61 changes: 61 additions & 0 deletions app/assets/javascripts/manager/custom.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -102,7 +102,68 @@ $(document).ready(function(){
});

$('[data-toggle="tooltip"]').tooltip();
$('.preview-image').on("change", previewImages);
$('#new_address_modal, #editModal').on('hidden.bs.modal', function(){
location.reload();
});

$('#new-areas').submit(function(){
$.ajax({
url: $(this).attr('action'),
type: $(this).attr('method'),
data: $(this).serialize(),
success: function(data) {
if(data.type == 'success') {
$('.name_area').val('');
toastr.success('', data.message);
$('.load-areas').load(location.href + ' .load-areas');
} else {
toastr.error('', data.message);
}
}
});
return false;
});

$('#new-address').submit(function(){
$.ajax({
url: $(this).attr('action'),
type: $(this).attr('method'),
data: $(this).serialize(),
success: function(data) {
if(data.type == 'success') {
$('.name_address').val('');
toastr.success('', data.message);
$('.load-address').load(location.href + ' .load-address');
} else {
toastr.error('', data.message);
}
}
});
return false;
});

$('#edit-address').submit(function(){
$.ajax({
url: $(this).attr('action'),
type: 'PATCH',
data: $(this).serialize(),
success: function(data) {
if(data.type == 'success') {
toastr.success('', data.message);
$('.load-address').load(location.href + ' .load-address');
} else {
toastr.error('', data.message);
}
}
});
return false;
});

$('.address-edit').click(function() {
$('.name_address').val($(this).data('address-name'))
$('#edit-address').attr('action', $(this).data('address-url'))
})
$('.preview-image').on("change", previewImages);

$(".select2").select2({
Expand Down
8 changes: 4 additions & 4 deletions app/assets/stylesheets/application.css
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
/*
*= require custom
.*= require toastr
*= require_self
*/
*= require custom
*= require toastr
*= require_self
*/
201 changes: 192 additions & 9 deletions app/assets/stylesheets/custom.scss
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,17 @@
@import 'bootstrap';

html {
margin: 0;
height: 100%;
width: 100%;
}

body {
font-weight: 500;
font-size: 1rem;
color: #222;
}

/* ----------------------------
header
---------------------------- */
Expand All @@ -13,10 +25,6 @@ body {
font-size: 1rem;
}

header {
background: #111;
}

.headline {
position: relative;
height: 78px;
Expand Down Expand Up @@ -44,10 +52,9 @@ header {
.custom-nav {
position: fixed;
width: 100%;
height: 78px;
z-index: 10;
&.scrolled {
background: rgba(#111, 0.9);
}
background-color: #333;
ul {
float: right;
list-style: none;
Expand Down Expand Up @@ -373,12 +380,12 @@ $offWhite: #e9eaea;
}

@media (min-width: 1200px){
.container {
.container #custom {
padding: 0 2.8rem;
}
}

.container {
.container #custom{
margin: auto;
padding: 0 1.25rem;
}
Expand Down Expand Up @@ -639,3 +646,179 @@ h1, h2, h3, h4, h5, h6 {
.preview-edit-profile {
padding: 3px;
}

#exampleSlider {
position: relative;
}
@media (max-width: 767px) {
#exampleSlider {
border-color: transparent;
}
}
#exampleSlider .MS-content {
overflow: hidden;
white-space: nowrap;
}
@media (max-width: 767px) {
#exampleSlider .MS-content {
margin: 0;
}
}
#exampleSlider .MS-content .item {
display: inline-block;
height: 100%;
overflow: hidden;
position: relative;
vertical-align: top;
border-right: none;
width: 20%;
}
@media (max-width: 1200px) {
#exampleSlider .MS-content .item {
width: 25%;
}
}
@media (max-width: 992px) {
#exampleSlider .MS-content .item {
width: 33.3333%;
}
}
@media (max-width: 767px) {
#exampleSlider .MS-content .item {
width: 50%;
}
}
#exampleSlider .MS-content .item p {
font-size: 30px;
text-align: center;
line-height: 1;
vertical-align: middle;
margin: 0;
padding: 10px 0;
}
#exampleSlider .MS-controls button {
position: absolute;
border: none;
background: transparent;
font-size: 30px;
outline: 0;
top: 35px;
}
@media (max-width: 767px) {
#exampleSlider .MS-controls button {
display: none;
}
}
#exampleSlider .MS-controls button:hover {
cursor: pointer;
}
#exampleSlider .MS-controls .MS-left {
left: 10px;
}
@media (max-width: 992px) {
#exampleSlider .MS-controls .MS-left {
left: -2px;
}
}
#exampleSlider .MS-controls .MS-right {
right: 10px;
}
@media (max-width: 992px) {
#exampleSlider .MS-controls .MS-right {
right: -2px;
}
}

.title-favorite-space {
margin-bottom: 18px!important;
}

.item p img {
width: 100%;
padding: 0 10px;
}

.title-content {
font-size: .75rem;
text-transform: uppercase;
}

.article_content {
padding: 0 8px;
}

#exampleSlider .MS-controls .MS-right {
top: 40%;
}

#exampleSlider .MS-controls .MS-left {
top: 40%;
}

.title-favorite {
margin: 0px;
padding-top: 20px;
}

.icon-favorite {
display: inline;
width: 32px;
height: 32px;
}

.card {
background: none;
}

.text-title {
display: inline;
padding: 0 15px;
}

.small {
font-size: 14px;
}

.extra-bold span {
font-size: 15px;
}

.address {
padding-top: 10px;
}

.tales {
width: 100%;
}

.carousel-showroomdetails {
height: 400px;
}

.img-room-detail {
width: 100%;
height: 583px;
}

.favorite-room {
width: 120%;
}

a.name-room {
text-decoration: none;
font-size: 20px;
color: #333;
}

a.name-room:hover {
color: red;
transition: all .5s;
}

.image-banner {
width: 100%;
}

.pagination {
padding: 10px 40%;
}
Loading

0 comments on commit 0b4d261

Please sign in to comment.