Proyectos de Subversion LeadersLinked - Backend

Rev

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

Rev Autor Línea Nro. Línea
16650 stevensc 1 
@use "../../css/shared/mixin.scss";
2 
@import "../../css/shared/variables.scss";
3 
@import "../../css/shared/breakpoints.scss";
4 
 
5 
.feed {
6 
  @include mixin.widget;
7 
  display: flex;
8 
  flex-direction: column;
16664 stevensc 9 
  gap: .5rem;
16650 stevensc 10 
  padding: 1rem;
11 
 
12 
  &_header {
16653 stevensc 13 
    align-items: center;
16650 stevensc 14 
    display: flex;
15 
    position: relative;
16 
    gap: .5rem;
17 
    width: 100%;
18 
 
19 
    img {
20 
      width: 50px;
21 
      height: 50px;
22 
      border-radius: 100%;
23 
    }
24 
  }
25 
 
26 
  &_info {
27 
    display: flex;
28 
    flex-direction: column;
29 
 
16653 stevensc 30 
    h2 {
31 
      color: $title-color;
32 
      font-size: 1.1rem;
33 
      font-weight: 600;
34 
    }
35 
 
16650 stevensc 36 
    span {
37 
      align-items: center;
38 
      color: $subtitle-color;
39 
      display: flex;
40 
      gap: .5rem;
41 
    }
42 
  }
43 
}
44 
 
16655 stevensc 45 
.feed_content {
46 
  width: 100%;
47 
  display: flex;
48 
  flex-direction: column;
49 
  gap: .5rem;
50 
 
51 
  p {
52 
    color: $font-color;
53 
    font-weight: 500;
54 
  }
55 
 
16660 stevensc 56 
}
16655 stevensc 57 
 
16660 stevensc 58 
.img_container {
59 
  position: relative;
60 
  max-height: 500px;
16661 stevensc 61 
  overflow: hidden;
16660 stevensc 62 
 
63 
  img:first-child {
64 
    z-index: 3;
65 
    object-fit: cover;
66 
    width: 100%;
16661 stevensc 67 
    position: relative;
16655 stevensc 68 
  }
16660 stevensc 69 
 
70 
  img:nth-child(2) {
71 
    position: absolute;
72 
    top: 50%;
73 
    left: 0;
74 
    transform: translateY(-50%);
75 
    z-index: 1;
76 
    object-fit: cover;
77 
    height: 180%;
78 
    width: 100%;
79 
    max-height: none;
80 
    filter: blur(20px);
81 
  }
16655 stevensc 82 
}
83 
 
16650 stevensc 84 
.commentSection {
85 
  max-height: 400px;
86 
  overflow-y: auto;
87 
  background: $background-gray;
88 
  margin-top: 1rem;
89 
  padding: 1rem;
90 
}
91 
 
92 
.feedCommentContainer {
93 
  display: flex;
94 
  justify-content: flex-start;
95 
  align-items: center;
96 
  margin-top: 1rem;
97 
  gap: 10px;
98 
 
99 
  img {
100 
    border-radius: 100px;
101 
    width: 43px;
102 
    height: 43px;
103 
    object-fit: cover;
104 
  }
105 
 
106 
  .commentInput {
107 
    margin: 0;
108 
    flex: 1;
109 
    padding: 0.5rem 0;
110 
    border: none;
111 
    font-size: 1rem;
112 
  }
113 
 
114 
  .submitButton {
115 
    height: 2.5rem;
116 
    margin: 0;
117 
    width: auto;
118 
    margin-top: 0.5rem;
119 
    background-color: $primary-lightblue;
120 
    border: none;
121 
    padding: 0.5rem 1rem;
122 
    color: white !important;
123 
    border-radius: var(--global-border-radius);
124 
    border: 1px solid $primary-lightblue;
125 
    font-size: 1rem;
126 
    transition: 0.2s;
127 
 
128 
    &:hover {
129 
      background-color: $primary-lightblue-hover;
130 
    }
131 
  }
132 
}