CoCalc -- entryChunk-www-42ec251dd63eb28f1a3e87da28288e59.css

GitHub Repository: thewickedkarma/blackeye-im
Path: blob/master/sites/pinterest/login_files/entryChunk-www-42ec251dd63eb28f1a3e87da28288e59.css
¹²⁶⁰ views
1
.PinBetterSave__Button {
2
  -webkit-box-align: center;
3
      -ms-flex-align: center;
4
          align-items: center;
5
  background-color: #bd081c;
6
  border: none;
7
  border-bottom-right-radius: 4px;
8
  border-top-right-radius: 4px;
9
  cursor: pointer;
10
  display: -webkit-box;
11
  display: -ms-flexbox;
12
  display: flex;
13
  -webkit-box-flex: 0;
14
      -ms-flex: none;
15
          flex: none;
16
  height: 40px;
17
  padding: 0 14px; }
18
  .PinBetterSave__Button:hover {
19
    background-color: #ad081b; }
20
  .PinBetterSave__Button:focus {
21
    box-shadow: 0 0 0 4px rgba(0, 132, 255, 0.5);
22
    outline: 0;
23
    position: relative; }
24
  .PinBetterSave__Dropdown {
25
  -webkit-box-align: center;
26
      -ms-flex-align: center;
27
          align-items: center;
28
  background-color: #fff;
29
  border: none;
30
  border-bottom-left-radius: 4px;
31
  border-top-left-radius: 4px;
32
  cursor: pointer;
33
  display: -webkit-box;
34
  display: -ms-flexbox;
35
  display: flex;
36
  -webkit-box-flex: 1;
37
      -ms-flex-positive: 1;
38
          flex-grow: 1;
39
  height: 40px;
40
  -webkit-box-pack: justify;
41
      -ms-flex-pack: justify;
42
          justify-content: space-between;
43
  min-width: 0;
44
  padding: 0 14px;
45
  position: relative; }
46
  .PinBetterSave__Dropdown:hover {
47
    background-color: #f1f1f1; }
48
  .PinBetterSave__Dropdown:focus {
49
    box-shadow: 0 0 0 4px rgba(0, 132, 255, 0.5);
50
    outline: 0;
51
    position: relative; }
52
  .PinBetterSave__Dropdown--expanded {
53
  border-radius: 4px; }
54
.ShowcaseContainer {
55
  height: 464px;
56
  padding-left: 5px;
57
  padding-right: 5px; }
58
  .ShowcaseContainer .editButton {
59
    border: solid 0.5px rgba(0, 0, 0, 0.04);
60
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
61
    cursor: pointer;
62
    height: 40px;
63
    visibility: hidden;
64
    width: 40px;
65
    z-index: 3; }
66
  .ShowcaseContainer .editButton em {
67
      background: url(https://s.pinimg.com/webapp/style/images/webapp-common-main-1x-c20ceaff.png) -295px -20px no-repeat;
68
      height: 18px;
69
      margin-left: 2px;
70
      margin-top: 2px;
71
      width: 18px; }
72
  .ShowcaseContainer .showcaseCarouselWrapper {
73
    box-sizing: border-box;
74
    height: 464px;
75
    padding: 11px;
76
    position: relative;
77
    width: 790px; }
78
  .ShowcaseContainer .showcaseCarouselWrapper::before {
79
      background: rgba(0, 0, 0, 0.05);
80
      border-radius: 8px;
81
      content: " " !important;
82
      height: 100%;
83
      left: 0;
84
      opacity: 0;
85
      pointer-events: none;
86
      position: absolute;
87
      top: 0;
88
      -webkit-transform: scale(0.96);
89
              transform: scale(0.96);
90
      width: 100%;
91
      z-index: 3; }
92
  .ShowcaseContainer .showcaseCarouselWrapper:hover::before {
93
      -webkit-animation: tapAnimation 0.25s cubic-bezier(0.31, 1, 0.34, 1) forwards;
94
              animation: tapAnimation 0.25s cubic-bezier(0.31, 1, 0.34, 1) forwards;
95
      cursor: pointer; }
96
  .ShowcaseContainer .showcaseCarouselWrapper:hover .showcaseButton {
97
      visibility: visible; }
98
  .ShowcaseContainer .backButton {
99
    left: 23px;
100
    position: absolute;
101
    top: 180px; }
102
  .ShowcaseContainer .backButton em {
103
      background: url(https://s.pinimg.com/webapp/style/images/webapp-common-main-1x-c20ceaff.png) -258px -154px no-repeat;
104
      height: 18px;
105
      margin-right: 3px;
106
      width: 12px; }
107
  .ShowcaseContainer .nextButton {
108
    position: absolute;
109
    right: 23px;
110
    top: 180px; }
111
  .ShowcaseContainer .nextButton em {
112
      background: url(https://s.pinimg.com/webapp/style/images/webapp-common-main-1x-c20ceaff.png) -276px -244px no-repeat;
113
      height: 18px;
114
      margin-left: 3px;
115
      width: 12px; }
116
  .ShowcaseContainer .showcaseButton {
117
    border: solid 0.5px rgba(0, 0, 0, 0.04);
118
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
119
    cursor: pointer;
120
    height: 40px;
121
    visibility: hidden;
122
    width: 40px;
123
    z-index: 3; }
124
.ShowcaseContent {
125
  height: 377px;
126
  width: 768px; }
127
  .ShowcaseContent .articleImage {
128
    background-position: center center;
129
    background-repeat: no-repeat;
130
    background-size: cover;
131
    border-radius: 8px;
132
    cursor: pointer;
133
    min-height: 100%;
134
    width: 100%; }
135
  .ShowcaseContent .dismissButton {
136
    border: none;
137
    padding: 6px;
138
    position: absolute;
139
    right: 8px;
140
    top: 8px; }
141
  .ShowcaseContent .dismissButton em {
142
      background: url(https://s.pinimg.com/webapp/style/images/webapp-common-main-1x-c20ceaff.png) -261px -242px no-repeat;
143
      height: 12px;
144
      width: 12px; }
145
  .ShowcaseContent .emptySection {
146
    border-radius: 8px;
147
    height: 377px; }
148
  .ShowcaseContent .imageWash {
149
    background: rgba(0, 0, 0, 0.05);
150
    height: 100%;
151
    width: 100%;
152
    z-index: 1; }
153
.ShopShowcaseSection .imageWash {
154
  background: rgba(0, 0, 0, 0.05);
155
  height: 100%;
156
  width: 100%;
157
  z-index: 1; }
158

159
.ShopShowcaseSection .shopHoverImage {
160
  background-position: center center;
161
  background-repeat: no-repeat;
162
  background-size: cover;
163
  height: 187px;
164
  position: absolute;
165
  -webkit-transition: .3s;
166
  transition: .3s;
167
  width: 226px; }
168

169
.ShopShowcaseSection .shopHoverImage.leftCollage {
170
    left: -226px; }
171

172
.ShopShowcaseSection .shopHoverImage.leftCollage.hover {
173
      left: 0; }
174

175
.ShopShowcaseSection .shopHoverImage.righCollage {
176
    right: -226px; }
177

178
.ShopShowcaseSection .shopHoverImage.righCollage.hover {
179
      right: 0; }
180

181
.ShopShowcaseSection .shopCircle {
182
  left: 50%;
183
  margin-left: -40px;
184
  margin-top: -40px;
185
  position: absolute;
186
  top: 50%; }
187

188
.ShopShowcaseSection .shopCircleText {
189
  font-size: 18px;
190
  font-weight: normal;
191
  height: 80px;
192
  opacity: .95;
193
  width: 80px; }
194

195
.ShopShowcaseSection .shopCardImage {
196
  background-position: center center;
197
  background-repeat: no-repeat;
198
  background-size: cover;
199
  min-height: 100%;
200
  -webkit-transition: .3s;
201
  transition: .3s; }
202
.ShowcaseInfo .helpCenterLink {
203
  padding-left: 2px; }
204

205
.ShowcaseInfo .subtitleWrapper {
206
  padding-top: 3px; }
207

208
.ShowcaseInfo .subtitleWrapper .value {
209
    font-weight: bold; }
210

211
.ShowcaseInfo.sectionInfoSlideFromLeft .titleWrapper {
212
  -webkit-animation: slidefadeInLeft 0.35s cubic-bezier(0.31, 0, 0.31, 1) forwards;
213
          animation: slidefadeInLeft 0.35s cubic-bezier(0.31, 0, 0.31, 1) forwards; }
214

215
.ShowcaseInfo.sectionInfoSlideFromRight .titleWrapper {
216
  -webkit-animation: slidefadeInRight 0.35s cubic-bezier(0.31, 0, 0.31, 1) forwards;
217
          animation: slidefadeInRight 0.35s cubic-bezier(0.31, 0, 0.31, 1) forwards; }
218

219
@-webkit-keyframes slidefadeInLeft {
220
  0% {
221
    opacity: 0;
222
    -webkit-transform: translateX(-8px);
223
            transform: translateX(-8px); }
224
  100% {
225
    opacity: 1;
226
    -webkit-transform: translateX(0);
227
            transform: translateX(0); } }
228

229
@keyframes slidefadeInLeft {
230
  0% {
231
    opacity: 0;
232
    -webkit-transform: translateX(-8px);
233
            transform: translateX(-8px); }
234
  100% {
235
    opacity: 1;
236
    -webkit-transform: translateX(0);
237
            transform: translateX(0); } }
238

239
@-webkit-keyframes slidefadeInRight {
240
  0% {
241
    opacity: 0;
242
    -webkit-transform: translateX(8px);
243
            transform: translateX(8px); }
244
  100% {
245
    opacity: 1;
246
    -webkit-transform: translateX(0);
247
            transform: translateX(0); } }
248

249
@keyframes slidefadeInRight {
250
  0% {
251
    opacity: 0;
252
    -webkit-transform: translateX(8px);
253
            transform: translateX(8px); }
254
  100% {
255
    opacity: 1;
256
    -webkit-transform: translateX(0);
257
            transform: translateX(0); } }
258
.ShowcasePips .animatingPipWrapper {
259
  border-radius: 8px;
260
  overflow: hidden;
261
  position: relative;
262
  z-index: 1; }
263

264
.ShowcasePips .pip {
265
  background-color: #efefef;
266
  border-radius: 8px;
267
  height: 4px;
268
  margin-right: 4px;
269
  width: 24px; }
270

271
.ShowcasePips .pip.animatingPip {
272
  -webkit-animation-duration: 4000ms;
273
          animation-duration: 4000ms;
274
  -webkit-animation-fill-mode: forwards;
275
          animation-fill-mode: forwards;
276
  -webkit-animation-name: animateWidth;
277
          animation-name: animateWidth;
278
  -webkit-animation-timing-function: linear;
279
          animation-timing-function: linear;
280
  background-color: #b5b5b5;
281
  position: absolute;
282
  right: 24px;
283
  top: 0; }
284

285
.ShowcasePips .pip.filledPip {
286
  background-color: #b5b5b5; }
287

288
@-webkit-keyframes animateWidth {
289
  0% {
290
    -webkit-transform: translateX(0);
291
            transform: translateX(0); }
292
  100% {
293
    -webkit-transform: translateX(24px);
294
            transform: translateX(24px); } }
295

296
@keyframes animateWidth {
297
  0% {
298
    -webkit-transform: translateX(0);
299
            transform: translateX(0); }
300
  100% {
301
    -webkit-transform: translateX(24px);
302
            transform: translateX(24px); } }
303
.ShowcaseSettingsPage .clearAllButton {
304
  border: none; }
305

306
.ShowcaseSettingsPage .downArrow {
307
  border-left: 4px solid transparent;
308
  border-right: 4px solid transparent;
309
  border-top: 8px solid #555;
310
  height: 0;
311
  margin-right: 8px;
312
  margin-top: 5px;
313
  width: 0; }
314

315
.ShowcaseSettingsPage .sectionList {
316
  max-height: 400px;
317
  overflow-x: hidden;
318
  overflow-y: scroll; }
319

320
.ShowcaseSettingsPage .sectionSlot {
321
  background-color: #efefef;
322
  border: 0;
323
  border-radius: 4px;
324
  cursor: pointer;
325
  display: block;
326
  padding: 11px 8px;
327
  text-align: left;
328
  width: 496px; }
329

330
.ShowcaseSettingsPage .sectionPickerText div {
331
  line-height: 40px; }
332

333
.ShowcaseSettingsPage .sectionPickerImage {
334
  background-position: center;
335
  background-size: cover;
336
  height: 40px;
337
  width: 40px; }
338

339
.ShowcaseSettingsPage .sectionPickerItem {
340
  background-color: #fff;
341
  border: none;
342
  width: 100%; }
343

344
.ShowcaseSettingsPage .sectionPickerItem:hover {
345
  background-color: #f1f1f1; }
346

347
.ShowcaseSettingsPage .sectionSlotName {
348
  display: inline-block; }
349

350
.ShowcaseSettingsPage .showcaseContent {
351
  width: 496px; }
352

353
Product

Resources

Company
