made contacts page responsive
This commit is contained in:
parent
80646d4d33
commit
c0ef870956
|
@ -11,6 +11,7 @@ a:hover {
|
||||||
}
|
}
|
||||||
|
|
||||||
.card {
|
.card {
|
||||||
|
min-width: 360px;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
background: $card-background;
|
background: $card-background;
|
||||||
|
@ -146,10 +147,14 @@ a:hover {
|
||||||
}
|
}
|
||||||
|
|
||||||
.contacts {
|
.contacts {
|
||||||
height: 570px;
|
// height: 570px;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.contacts-list{
|
.contacts-list{
|
||||||
|
height: 80vh;
|
||||||
overflow: scroll;
|
overflow: scroll;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1,7 +1,9 @@
|
||||||
<!-- CONTACTS PAGE -->
|
<!-- CONTACTS PAGE -->
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<div class="contacts-container text-color">
|
<div class="contacts-container text-color">
|
||||||
<div class="contacts half">
|
<div class="row">
|
||||||
|
<div class="col-xs-12 col-md-6">
|
||||||
|
<div class="contacts">
|
||||||
<div class="contacts-header">
|
<div class="contacts-header">
|
||||||
<h2>Contacts</h2>
|
<h2>Contacts</h2>
|
||||||
<%= link_to new_connection_path do %>
|
<%= link_to new_connection_path do %>
|
||||||
|
@ -14,12 +16,16 @@
|
||||||
<% end %>
|
<% end %>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="video-feed half hidden-xs hidden-sm">
|
</div>
|
||||||
|
<div class="col-xs-12 col-md-6 hidden-xs hidden-sm">
|
||||||
|
<div class="video-feed">
|
||||||
<div class="video-content">
|
<div class="video-content">
|
||||||
<video id="contacts-video" class="flex-video" autoplay=""></video>
|
<video id="contacts-video" class="flex-video" autoplay=""></video>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- INFORMATION TO BE PASSED TO NOTIFICATIONS.JS -->
|
<!-- INFORMATION TO BE PASSED TO NOTIFICATIONS.JS -->
|
||||||
|
|
Loading…
Reference in New Issue