Proyectos de Subversion LeadersLinked - Antes de SPA

Rev

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

Rev Autor Línea Nro. Línea
4265 stevensc 1 
.feed__share {
2 
    background-color: #fff;
4273 stevensc 3 
    border: 1px solid lightgray;
4265 stevensc 4 
    border-radius: 10px;
4273 stevensc 5 
    display: grid;
6 
    gap: 1rem;
7 
    padding: 10px;
8 
    width: 100%;
4265 stevensc 9 
}
10 
 
11 
.feed__input-container {
4284 stevensc 12 
    display: flex;
4265 stevensc 13 
    align-items: center;
14 
    gap: 0.5rem;
4284 stevensc 15 
    .feed__input {
16 
        align-items: center;
17 
        border: 1px solid lightgray;
18 
        border-radius: 30px;
19 
        color: gray;
20 
        display: flex;
21 
        gap: 0.5rem;
22 
        padding: 10px;
23 
        padding-left: 1rem;
24 
        overflow: hidden;
4285 stevensc 25 
        flex: 1;
26 
        cursor: pointer;
4284 stevensc 27 
        &:hover {
28 
            background-color: rgba(0, 0, 0, 0.08);
29 
        }
30 
        input {
31 
            background-color: transparent;
32 
            border: none;
33 
            outline: none;
34 
            flex: 1;
35 
            font-weight: 600;
36 
        }
4276 stevensc 37 
    }
4265 stevensc 38 
}
39 
 
40 
.feed__section {
41 
    display: flex;
42 
    flex-direction: column;
4270 stevensc 43 
    grid-area: main;
4265 stevensc 44 
    gap: 1rem;
45 
}
46 
 
4272 stevensc 47 
.feed__info {
48 
    display: flex;
49 
    flex-direction: column;
50 
    justify-content: center;
51 
    gap: 5px;
4280 stevensc 52 
    .time__elapse {
53 
        align-items: center;
54 
        display: flex;
4272 stevensc 55 
        font-size: 14px;
56 
        gap: 5px;
57 
        .time__elapse-icon {
58 
            font-size: 14px;
59 
        }
60 
    }
61 
}
62 
 
4265 stevensc 63 
.feed__share-options {
64 
    display: flex;
65 
    justify-content: space-evenly;
66 
}
67 
 
68 
.feed__share-option {
69 
    align-items: center;
70 
    display: inline-flex;
71 
    cursor: pointer;
72 
    gap: 0.5rem;
73 
    padding: 10px;
74 
    &:hover {
75 
        background-color: whitesmoke;
76 
        border-radius: 10px;
77 
    }
78 
}
79 
 
80 
.feed {
81 
    background-color: #fff;
4273 stevensc 82 
    border: 1px solid #d3d3d3;
4265 stevensc 83 
    border-radius: 10px;
4273 stevensc 84 
    display: flex;
85 
    flex-direction: column;
86 
    gap: 0.5rem;
4265 stevensc 87 
}
88 
 
89 
.feed__header {
90 
    display: flex;
91 
    gap: 0.5rem;
4275 stevensc 92 
    padding: 5px 1rem 0;
4265 stevensc 93 
}
94 
 
95 
.feed__info > h2 {
96 
    font-size: 1rem;
97 
    font-weight: bold;
98 
}
99 
 
100 
.feed__info > p {
101 
    font-size: 0.8rem;
102 
    color: gray;
103 
    line-height: 1.5;
104 
}
105 
 
106 
.feed__body {
107 
    overflow-wrap: anywhere;
4274 stevensc 108 
    display: flex;
109 
    flex-direction: column;
110 
    gap: 0.5rem;
4280 stevensc 111 
    p,
112 
    a {
4278 stevensc 113 
        padding-left: 10px;
114 
    }
4265 stevensc 115 
}
116 
 
117 
.feed__buttons {
118 
    display: flex;
4275 stevensc 119 
    justify-content: space-around;
120 
    border-top: 1px solid lightgray;
121 
    gap: 0.5rem;
122 
    padding: 5px;
123 
    margin: 0 5px;
4276 stevensc 124 
    .feed__share-option {
125 
        flex-grow: 1;
126 
    }
4265 stevensc 127 
}
4309 stevensc 128 
 
129 
.external__share {
130 
    display: flex;
131 
    position: absolute;
132 
    align-items: center;
133 
    padding: 5px 1rem 0;
134 
    bottom: calc(100% + 0.5rem);
135 
    gap: 0.5rem;
136 
    right: 0;
137 
    width: 16.5rem;
138 
    border-radius: 10px;
139 
    background-color: #fff;
140 
    box-shadow: 0px 4px 4px -2px rgb(0 0 0 / 12%), 0px -4px 4px -2px rgb(0 0 0 / 12%);
141 
    &.post {
142 
        transform: none;
143 
        bottom: 100%;
144 
        right: 1.5rem;
145 
        z-index: 200;
146 
    }
147 
}