94 lines
1.6 KiB
CSS
Vendored
94 lines
1.6 KiB
CSS
Vendored
.solution-hiding {
|
|
pointer-events: none;
|
|
}
|
|
|
|
.solution-hidden {
|
|
height: 0;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.solution-hidden .solution-main,
|
|
.solution-hiding .solution-main {
|
|
transform: translateY(-25px) scaleY(0.95);
|
|
opacity: 0;
|
|
}
|
|
|
|
.solution-main {
|
|
z-index: 1;
|
|
@apply text-gray-800;
|
|
opacity: 1;
|
|
transition: all 0.1s;
|
|
}
|
|
|
|
.solution-toggle {
|
|
@apply absolute;
|
|
@apply z-10;
|
|
top: 0.5rem;
|
|
right: 10px;
|
|
@apply px-3;
|
|
@apply py-1;
|
|
@apply text-xs;
|
|
@apply leading-none;
|
|
@apply cursor-pointer;
|
|
}
|
|
|
|
.solution-toggle-show {
|
|
top: 0;
|
|
@apply bg-green-300;
|
|
@apply shadow-sm;
|
|
@apply rounded-b-sm;
|
|
@apply z-0;
|
|
clip-path: polygon(0 0, 100% 0, 100% 100%, 9px 100%, 0 calc(100% - 5px));
|
|
-webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 9px 100%, 0 calc(100% - 5px));
|
|
}
|
|
|
|
.solution-toggle-show a {
|
|
@apply no-underline;
|
|
}
|
|
|
|
.solution-background {
|
|
@apply absolute;
|
|
@apply inset-0;
|
|
top: -6px;
|
|
margin: 0 10px;
|
|
@apply bg-green-300;
|
|
@apply shadow;
|
|
@apply border;
|
|
@apply border-tint-300;
|
|
@apply overflow-hidden;
|
|
@apply rounded-b-sm;
|
|
}
|
|
|
|
.solution-title {
|
|
@apply font-semibold;
|
|
@apply text-2xl;
|
|
@apply leading-tight;
|
|
@apply mb-4;
|
|
}
|
|
|
|
.solution-content {
|
|
@apply max-w-4xl;
|
|
}
|
|
|
|
@screen md {
|
|
.solution-content {
|
|
margin-left: 15rem;
|
|
}
|
|
}
|
|
|
|
.solution code {
|
|
@apply font-mono;
|
|
@apply text-gray-700;
|
|
@apply inline-block;
|
|
@apply -my-1;
|
|
@apply px-1;
|
|
@apply rounded-sm;
|
|
@apply bg-tint-100;
|
|
@apply border;
|
|
@apply border-tint-100;
|
|
@apply font-mono;
|
|
@apply text-gray-700;
|
|
@apply break-all;
|
|
@apply leading-tight;
|
|
}
|