Loader by jeremyssocial
#212121
1/* Terminal Window */ 2.terminal { 3 width: 500px; 4 background-color: #000; 5 color: #0f0; 6 font-family: "Courier New", Courier, monospace; 7 border-radius: 8px; 8 overflow: hidden; 9 box-shadow: 0 0 15px rgba(0, 0, 0, 0.4); 10} 11 12/* Terminal Header */ 13.terminal-header { 14 background-color: #333; 15 padding: 5px; 16 display: flex; 17 align-items: center; 18 color: #fff; 19} 20 21.buttons { 22 display: flex; 23 margin-right: 15px; 24} 25 26.buttons span { 27 height: 15px; 28 width: 15px; 29 border-radius: 50%; 30 display: inline-block; 31 margin-right: 5px; 32} 33 34.close { 35 background-color: #ff605c; 36} 37.minimize { 38 background-color: #ffbd44; 39} 40.maximize { 41 background-color: #00ca4e; 42} 43 44.title { 45 flex-grow: 1; 46 text-align: center; 47} 48 49/* Terminal Body */ 50.terminal-body { 51 padding: 10px; 52} 53 54.terminal-loader { 55 display: inline-flex; 56 align-items: center; 57} 58 59.loader-text { 60 margin-right: 5px; 61} 62 63.dot { 64 opacity: 0; 65 animation: dotFadeInOut 1.5s infinite; 66} 67 68@keyframes dotFadeInOut { 69 0%, 70 100% { 71 opacity: 0; 72 } 73 50% { 74 opacity: 1; 75 } 76} 77 78#dot1 { 79 animation-delay: 0.5s; 80} 81 82#dot2 { 83 animation-delay: 0.6s; 84} 85 86#dot3 { 87 animation-delay: 0.7s; 88} 89
518 views
518 views
MIT License