Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 7317 | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
7317 stevensc 1 
#react-chat {
2 
  bottom: 0;
3 
  margin: 0;
4 
  padding: 0;
5 
  right: 5%;
6 
  position: fixed;
7 
  z-index: 1000;
8 
  display: flex;
9 
  flex-direction: row-reverse;
10 
  align-items: flex-end;
11 
  gap: 1rem;
12 
  font-family: Arial, sans-serif;
13 
}
14 
 
15 
.chat-helper {
16 
  background-color: $bg-color;
17 
  border-top-left-radius: $border-radius;
18 
  border-top-right-radius: $border-radius;
19 
  box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.06), 0 2px 5px 0 rgba(0, 0, 0, 0.2);
20 
  display: grid;
21 
  gap: 0.5rem;
22 
  max-height: 25rem;
23 
  height: fit-content;
24 
  width: 235px;
25 
 
26 
  .chat_options {
27 
    border-bottom: 1px solid $border-primary;
28 
    overflow: hidden;
29 
    position: relative;
30 
 
31 
    a {
32 
      border-left: 1px solid $border-primary;
33 
      color: $font-color;
34 
      padding: 3px 8px 3px 3px;
35 
      border: 0;
36 
      font-size: 0.9rem;
37 
      cursor: pointer;
38 
      font-weight: bold;
39 
      white-space: nowrap;
40 
      overflow: hidden;
41 
      text-overflow: ellipsis;
42 
    }
43 
  }
44 
}
45 
 
46 
.actions-container {
47 
  display: flex;
48 
  align-items: center;
49 
  justify-content: space-around;
50 
  flex-wrap: wrap;
51 
  padding: 0 1rem;
52 
}
53 
 
54 
.action-btn {
55 
  position: relative;
56 
  font-weight: 700;
57 
  color: $font-color;
58 
  display: inline-flex;
59 
  align-items: center;
60 
 
61 
  &.active {
62 
    padding-bottom: 5px !important;
63 
 
64 
    &::before {
65 
      content: "";
66 
      position: absolute;
67 
      top: 100%;
68 
      width: 100%;
69 
      height: 3px;
70 
      background: $border-primary;
71 
    }
72 
  }
73 
}
74 
 
75 
.search-input {
76 
  display: flex;
77 
  align-items: center;
78 
  border-radius: 5px;
79 
  height: 34px;
80 
  color: gray;
81 
  cursor: pointer;
82 
  width: -webkit-fill-available;
83 
  padding: 0.5rem;
84 
  background-color: #eef3f0;
85 
 
86 
  &>input {
87 
    border: none;
88 
    outline: none;
89 
    background: none;
90 
    width: 100%;
91 
  }
92 
}
93 
 
94 
.contacts-list {
95 
  width: 100%;
96 
  overflow-y: auto;
97 
  max-height: 250px;
98 
 
99 
  .contacts-list__item {
100 
    align-items: center;
101 
    display: flex;
102 
    height: auto;
103 
    padding: 0.2rem 1rem;
104 
    gap: 0.5rem;
105 
 
106 
    img {
107 
      height: 36px;
108 
      width: 36px;
109 
      border-radius: 50%;
110 
    }
111 
 
112 
    .contacts-list__item-content {
113 
      display: flex;
114 
      flex-direction: column;
115 
      gap: 0.5rem;
116 
    }
117 
 
118 
    span {
119 
      font-size: 0.9rem;
120 
      cursor: pointer;
121 
      font-weight: bold;
122 
      white-space: nowrap;
123 
      overflow: hidden;
124 
      text-overflow: ellipsis;
125 
      max-width: 20ch;
126 
    }
127 
  }
128 
}