Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

Rev 5737 | Rev 5740 | Ir a la última revisión | | Comparar con el anterior | Ultima modificación | Ver Log |

Rev Autor Línea Nro. Línea
5449 stevensc 1
@use "../../settings/mixins.scss";
2
 
3
.feed {
4
  @include mixins.widget;
3503 stevensc 5
  display: flex;
6
  flex-direction: column;
3953 stevensc 7
  gap: 1rem;
5449 stevensc 8
  padding: 1rem;
3503 stevensc 9
}
10
 
5667 stevensc 11
.reaction-btn {
12
  position: relative;
13
 
5734 stevensc 14
  .reactions {
5735 stevensc 15
    position: absolute;
5737 stevensc 16
    bottom: calc(100% + .5rem);
5667 stevensc 17
    background-color: $bg-color;
18
    box-shadow: 0px 0px 3px #000;
19
    gap: .5rem;
5737 stevensc 20
    left: 50%;
5736 stevensc 21
    display: none;
5734 stevensc 22
    padding: .2rem;
5670 stevensc 23
    width: fit-content;
5734 stevensc 24
    border-radius: 20px;
5737 stevensc 25
    transform: translateX(-50%);
5734 stevensc 26
 
5737 stevensc 27
    svg {
28
      font-size: 32px;
29
    }
30
 
5735 stevensc 31
    &.active {
5736 stevensc 32
      display: flex;
5734 stevensc 33
      transform-origin: bottom;
34
      animation: animationIn .2s;
35
    }
5667 stevensc 36
  }
5734 stevensc 37
}
5667 stevensc 38
 
5734 stevensc 39
@keyframes animationIn {
5738 stevensc 40
  0% {
41
    transform: translateX(-50%);
42
  }
43
 
5734 stevensc 44
  to {
5738 stevensc 45
    transform: translateX(-50%) scaleY(1);
5667 stevensc 46
  }
47
}
48
 
3503 stevensc 49
.feedCommentContainer {
50
  display: flex;
51
  justify-content: flex-start;
52
  align-items: center;
53
  gap: 10px;
5449 stevensc 54
 
55
  &>img {
3503 stevensc 56
    border-radius: 100px;
57
    width: 43px;
58
    height: 43px;
59
    object-fit: cover;
3517 stevensc 60
    background: #fff;
3503 stevensc 61
  }
5449 stevensc 62
 
3503 stevensc 63
  .commentInput {
64
    margin: 0;
65
    flex: 1;
66
    padding: 0.5rem 0;
67
    border: none;
68
    font-size: 1rem;
3509 stevensc 69
    background-color: $bg-color;
3503 stevensc 70
  }
5449 stevensc 71
 
3503 stevensc 72
  .submitButton {
73
    height: 2.5rem;
74
    margin: 0;
75
    width: auto;
76
    margin-top: 0.5rem;
77
    background-color: $button-bg;
78
    border: none;
79
    padding: 0.5rem 1rem;
80
    color: $bg-color;
81
    border-radius: var(--global-border-radius);
82
    border: 1px solid $button-bg;
83
    font-size: 1rem;
84
    transition: 0.2s;
5449 stevensc 85
 
3503 stevensc 86
    &:hover {
87
      background-color: $button-bg-hover;
88
    }
89
  }
5449 stevensc 90
}