github.com/retailcrm/mg-bot-helper@v0.0.0-20201229112329-a17255681a84/static/style.css (about) 1 /* fallback */ 2 @font-face { 3 font-family: 'Material Icons'; 4 font-style: normal; 5 font-weight: 400; 6 src: url(font.woff2) format('woff2'); 7 } 8 9 .material-icons { 10 font-family: 'Material Icons', sans-serif; 11 font-weight: normal; 12 font-style: normal; 13 font-size: 24px; 14 line-height: 1; 15 letter-spacing: normal; 16 text-transform: none; 17 display: inline-block; 18 white-space: nowrap; 19 word-wrap: normal; 20 direction: ltr; 21 -webkit-font-feature-settings: 'liga'; 22 -webkit-font-smoothing: antialiased; 23 } 24 25 body { 26 display: flex; 27 min-height: 100vh; 28 flex-direction: column; 29 } 30 31 main { 32 flex: 1 0 auto; 33 } 34 35 .indent-top { 36 margin-top: 2%; 37 } 38 39 .text-left { 40 text-align: right; 41 } 42 43 #tab { 44 width: 50%; 45 margin: 0 auto 23px; 46 } 47 48 .tab-el-center, 49 .footer-copyright { 50 width: 67%; 51 margin: 0 auto; 52 } 53 54 #bots .deletebot { 55 float: right; 56 } 57 58 #bots { 59 font-size: 12px; 60 } 61 62 #bots .select-wrapper input.select-dropdown, 63 #bots span { 64 font-size: 12px; 65 } 66 67 #msg { 68 height: 23px; 69 } 70 71 #logo { 72 height: 100px; 73 margin-bottom: 20px; 74 } 75 76 /* label color */ 77 .input-field label { 78 color: #ef5350; 79 } 80 81 /* label focus color */ 82 .input-field input[type=text]:focus + label { 83 color: #ef5350; 84 } 85 /* label underline focus color */ 86 .input-field input[type=text]:focus { 87 border-bottom: 1px solid #ef5350; 88 box-shadow: 0 1px 0 0 #ef5350; 89 } 90 91 /* valid color */ 92 .input-field input[type=text].valid { 93 border-bottom: 1px solid #ef5350; 94 box-shadow: 0 1px 0 0 #ef5350; 95 } 96 97 /* invalid color */ 98 .input-field input[type=text].invalid { 99 border-bottom: 1px solid #c62828; 100 box-shadow: 0 1px 0 0 #c62828; 101 } 102 103 /* icon prefix focus color */ 104 .input-field .prefix.active { 105 color: #ef5350; 106 } 107 108 .tabs .tab a { 109 color: #ef5350; 110 display: block; 111 width: 100%; 112 height: 100%; 113 padding: 0 24px; 114 font-size: 14px; 115 text-overflow: ellipsis; 116 overflow: hidden; 117 -webkit-transition: color .28s ease, background-color .28s ease; 118 transition: color .28s ease, background-color .28s ease; 119 } 120 121 .tabs .tab a:focus, .tabs .tab a:focus.active { 122 background-color: #e1f5fe; 123 outline: none; 124 } 125 126 .tabs .tab a:hover, .tabs .tab a.active { 127 background-color: transparent; 128 color: #ef5350; 129 } 130 131 .tabs .tab.disabled a, 132 .tabs .tab.disabled a:hover { 133 color: #ef5350; 134 cursor: default; 135 } 136 137 .tabs .indicator { 138 position: absolute; 139 bottom: 0; 140 height: 2px; 141 background-color: #ef5350; 142 will-change: left, right; 143 } 144 145 a.btn-floating img { 146 height: 40px; 147 width: 40px; 148 } 149 150 .lang-select, 151 .currency-select { 152 width: 30%; 153 margin: 40px auto 0; 154 } 155 156 .select-wrapper ul li span { 157 color: #ef5350; 158 } 159 160 .footer-copyright { 161 border-top: 1px solid #9e9e9e; 162 margin-top: 10px; 163 } 164 165 .footer-copyright p { 166 color: #9e9e9e; 167 } 168 169 .animate { 170 transition: all 0.5s ease; 171 animation: rotate 1s linear infinite; 172 } 173 174 @keyframes rotate { 175 from { 176 transform: rotate(360deg); 177 } 178 }