Page History
Jira
| Jira | ||||||
|---|---|---|---|---|---|---|
|
| Jira | ||||||
|---|---|---|---|---|---|---|
|
| HTML |
|---|
<div
style={{
height: '1243',
overflow: 'hidden'
}}
>
<iframe scrolling="no" style="border: 1px solid rgba(0, 0, 0, 0.1); overflow: hidden;" width="1169" height="1243" src="https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Ffile%2FEACtjbcd9Eve66KPlbayKq%2FGE---DesignSystem%3Fnode-id%3D2767%253A194610" allowfullscreen></iframe>
</div> |
...
Example
...
| HTML |
|---|
<style type="text/css">
#loader-container {
position: relative;
height: 100px;
width: 100px;
transition: 0.5s background-color linear;
}
#loader-container {
background-color: none;
}
.e1-theme-dark #loader-container {
background-color: none;
}
.e1-theme-light #loader-container {
background-color: #fff;
}
.loader {
width: 60px;
height: 60px;
position: absolute;
display: flex;
justify-content: center;
animation: spin 1.2s cubic-bezier(0.68, -0.55, 0.265, 1.55) infinite;
}
.dot {
height: 10px;
width: 10px;
background: #fad465;
border-radius: 50%;
}
@keyframes bg {
0% {
opacity: 0;
}
100% {
opacity: 0.035;
}
}
@keyframes spin {
100% {
transform: rotateZ(360deg);
}
}
@keyframes spin2 {
100% {
transform: rotateZ(-360deg);
}
}
.loader2 {
animation: spin 1.2s cubic-bezier(0.68, -0.55, 0.265, 1.55) infinite;
justify-content: flex-start;
align-items: center;
}
.loader3 {
animation: spin2 1.2s cubic-bezier(0.68, -0.55, 0.265, 1.55) infinite;
justify-content: flex-end;
align-items: center;
}
.loader4 {
animation: spin2 1.2s cubic-bezier(0.68, -0.55, 0.265, 1.55) infinite;
justify-content: center;
align-items: flex-end;
}
</style>
<div id="loader-container">
<div class="loader">
<div class="dot"></div>
</div>
<div class="loader loader2">
<div class="dot"></div>
</div>
<div class="loader loader3">
<div class="dot"></div>
</div>
<div class="loader loader4">
<div class="dot"></div>
</div>
</div> |
