Browse Source

new paddings chatlist

master
Eduard Kuzmenko 5 years ago
parent
commit
af5decf644
  1. 3
      src/components/pageIm.ts
  2. 20
      src/lib/appManagers/appSidebarLeft.ts
  3. 6
      src/scss/partials/_chatlist.scss
  4. 10
      src/scss/style.scss

3
src/components/pageIm.ts

@ -728,6 +728,9 @@ export default () => import('../lib/services').then(services => { @@ -728,6 +728,9 @@ export default () => import('../lib/services').then(services => {
Array.from(document.getElementsByClassName('btn-menu-toggle')).forEach((el) => {
el.addEventListener('click', (e) => {
console.log('click pageIm');
if(!el.classList.contains('btn-menu-toggle')) return false;
window.removeEventListener('mousemove', onMouseMove);
openedMenu = el.querySelector('.btn-menu');
e.cancelBubble = true;

20
src/lib/appManagers/appSidebarLeft.ts

@ -74,8 +74,9 @@ class AppSidebarLeft { @@ -74,8 +74,9 @@ class AppSidebarLeft {
appDialogsManager.setListClickListener(this.searchMessagesList);
let clickTimeout = 0;
this.searchInput.addEventListener('focus', (e) => {
this.toolsBtn.classList.remove('tgico-menu');
this.toolsBtn.classList.remove('tgico-menu', 'btn-menu-toggle');
this.toolsBtn.classList.add('tgico-back');
this.searchContainer.classList.add('active');
@ -88,6 +89,12 @@ class AppSidebarLeft { @@ -88,6 +89,12 @@ class AppSidebarLeft {
this.toolsBtn.classList.add('tgico-menu');
this.toolsBtn.classList.remove('tgico-back');
this.searchContainer.classList.remove('active');
setTimeout(() => {
//this.toolsBtn.click();
this.toolsBtn.classList.add('btn-menu-toggle');
}, 200);
}
/* this.peerID = 0;
@ -121,15 +128,20 @@ class AppSidebarLeft { @@ -121,15 +128,20 @@ class AppSidebarLeft {
});
});
this.toolsBtn.addEventListener('click', () => {
this.toolsBtn.addEventListener('click', (e) => {
this.log('click', this.toolsBtn.classList.contains('tgico-back'));
if(this.toolsBtn.classList.contains('tgico-back')) {
this.searchInput.value = '';
this.toolsBtn.classList.add('tgico-menu');
this.toolsBtn.classList.add('tgico-menu', 'btn-menu-toggle');
this.toolsBtn.classList.remove('tgico-back');
this.searchContainer.classList.remove('active');
this.peerID = 0;
e.stopPropagation();
e.cancelBubble = true;
e.preventDefault();
return false;
}
});
}, true);
window.addEventListener('resize', () => {
this.chatsLoadCount = Math.round(document.body.scrollHeight / 70 * 1.5);

6
src/scss/partials/_chatlist.scss

@ -60,11 +60,11 @@ @@ -60,11 +60,11 @@
border-radius: $border-radius;
display: grid;
align-items: center;
grid-template-columns: 60px calc(100% - 60px);
grid-template-columns: 64px calc(100% - 64px - 6.5px);
position: relative;
cursor: pointer;
padding: 0 .5rem;
margin: 0 .5rem;
padding: 0 8.5px;
margin: 0 8.5px;
overflow: hidden;
&:hover {

10
src/scss/style.scss

@ -111,7 +111,7 @@ input { @@ -111,7 +111,7 @@ input {
border: none;
padding: .5rem;
position: relative;
overflow: hidden;
/* overflow: hidden; */
/* kostil */
display: flex;
@ -138,6 +138,7 @@ input { @@ -138,6 +138,7 @@ input {
&.menu-open {
background-color: rgba(112, 117, 121, 0.08);
}
}
.btn-menu {
visibility: hidden;
@ -205,13 +206,12 @@ input { @@ -205,13 +206,12 @@ input {
}
}
}
}
.user-avatar {
color: #fff;
width: 52px;
height: 52px;
line-height: 52px;
width: 54px;
height: 54px;
line-height: 54px;
border-radius: 50%;
background-color: $button-primary-background;
text-align: center;

Loading…
Cancel
Save