1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586 |
- .video-preview {
- background: none;
- display: inline-block;
- max-height: 344px;
-
- &-container {
- background: $menuBG;
- border-radius: 3px;
- overflow: auto;
- padding: 8px;
- }
-
- &-entry {
- cursor: pointer;
- height: 168px;
- margin-bottom: 8px;
- position: relative;
- width: 284px;
-
- &:last-child {
- margin-bottom: 0;
- }
-
- &--selected {
- border: 3px solid #31B76A;
- border-radius: 3px;
- cursor: default;
- height: 162px;
- width: 278px;
- }
- }
-
- &-video {
- border-radius: 3px;
- height: 100%;
- object-fit: cover;
- width: 100%;
- }
-
- &-overlay {
- background: rgba(42, 58, 75, 0.6);
- height: 100%;
- position: absolute;
- width: 100%;
- z-index: 1;
- }
-
- &-error {
- align-items: center;
- display: flex;
- height: 100%;
- justify-content: center;
- position: absolute;
- width: 100%;
- }
-
- &-label {
- bottom: 8px;
- color: #fff;
- position: absolute;
- width: 100%;
- z-index: 2;
-
- &-container {
- margin: 0 16px;
- }
-
- &-text {
- background-color: #131519;
- border-radius: 3px;
- padding: 2px 8px;
- font-size: 13px;
- line-height: 20px;
- margin: 0 auto;
- max-width: calc(100% - 16px);
- overflow: hidden;
- text-overflow: ellipsis;
- width: fit-content;
- white-space: nowrap;
- }
- }
- // Override @atlaskit/InlineDialog container which is made with styled components
- & > div:nth-child(2) {
- padding: 0;
- }
- }
|