styles.css (4427B)
1 /* styles.css 2 * Better styling for of Nginx FancyIndex page 3 * © 2015-17, Lilian Besson (Naereen) and contributors, 4 * open-sourced under the MIT License, https://lbesson.mit-license.org/ 5 * hosted on GitHub, https://GitHub.com/Naereen/Nginx-Fancyindex-Theme 6 */ 7 8 * { 9 font-family: 'Verdana', sans-serif; 10 margin: 0; 11 padding: 0; 12 -webkit-box-sizing: border-box; 13 -moz-box-sizing: border-box; 14 box-sizing: border-box; 15 } 16 17 html { 18 color: #61666c; 19 font-weight: 300; 20 font-size: 1em; 21 line-height: 2em; 22 } 23 24 body { 25 margin: 0 auto; 26 padding-top: 20px; 27 max-width: 800px; 28 } 29 30 thead { 31 font-weight: 200; 32 font-size: 1.2em; 33 } 34 35 h1 { 36 font-weight: 200; 37 text-align: center; 38 font-size: 1.4em; 39 line-height: 3em; 40 } 41 42 a { 43 color: #5f5f5f; 44 text-decoration: none; 45 } 46 a:hover { 47 color: #000; 48 } 49 a.clear, a.clear:link, a.clear:visited { 50 color: #666; 51 padding: 2px 0; 52 font-weight: 400; 53 font-size: 14px; 54 margin: 0 0 0 20px; 55 line-height: 14px; 56 display: inline-block; 57 border-bottom: transparent 1px solid; 58 vertical-align: -10px; 59 -webkit-transition: all 300ms ease-in; 60 -moz-transition: all 300ms ease-in; 61 -ms-transition: all 300ms ease-in; 62 -o-transition: all 300ms ease-in; 63 transition: all 300ms ease-in; 64 } 65 66 input { 67 margin: 0 auto; 68 font-size: 100%; 69 vertical-align: middle; 70 *overflow: visible; 71 line-height: normal; 72 font-family: 'Open Sans', sans-serif; 73 font-size: 12px; 74 font-weight: 300; 75 line-height: 18px; 76 color: #555; 77 display: inline-block; 78 height: 20px; 79 padding: 4px 32px 4px 6px; 80 margin-bottom: 9px; 81 font-size: 14px; 82 line-height: 20px; 83 color: #555; 84 -webkit-border-radius: 3px; 85 -moz-border-radius: 3px; 86 border-radius: 3px; 87 width: 196px; 88 background-color: #fff; 89 border: 1px solid #ccc; 90 -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075); 91 -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075); 92 box-shadow: inset 0 1px 1px rgba(0,0,0,0.075); 93 -webkit-transition: border linear .2s,box-shadow linear .2s; 94 -moz-transition: border linear .2s,box-shadow linear .2s; 95 -o-transition: border linear .2s,box-shadow linear .2s; 96 transition: border linear .2s,box-shadow linear .2s; 97 } 98 input:focus { 99 outline: 0; 100 border-color: rgba(0,0,0,0.8); 101 -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(0,0,0,0.6); 102 -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(0,0,0,0.6); 103 box-shadow: inset 0 1px 1px rgba(0,0,0,0.075),0 0 8px rgba(0,0,0,0.6); 104 } 105 input::-moz-focus-inner { 106 padding: 0; 107 border: 0; 108 } 109 110 #search { 111 display: block; 112 margin-left: auto; 113 margin-right: auto; 114 width: 250px; 115 margin-top: 20px; 116 -webkit-box-sizing: content-box; 117 -moz-box-sizing: content-box; 118 box-sizing: content-box; 119 -webkit-appearance: textfield; 120 -webkit-transition: all 300ms ease-in; 121 -moz-transition: all 300ms ease-in; 122 -ms-transition: all 300ms ease-in; 123 -o-transition: all 300ms ease-in; 124 transition: all 300ms ease-in; 125 } 126 127 table { 128 border-collapse: collapse; 129 font-size: 0.9em; 130 max-width: 100%; 131 margin: 20px auto 0; 132 } 133 134 tr { 135 outline: 0; 136 border: 0; 137 } 138 tr:hover td { 139 background: #f6f6f6; 140 } 141 tr td:first-of-type { 142 padding-left: 10px; 143 padding-right: 10px; 144 } 145 tr.parent a { 146 color: #9099A3; 147 } 148 149 th { 150 151 text-align: left; 152 font-size: .75em; 153 padding-right: 20px; 154 } 155 th + th { 156 width: 25%; 157 } 158 th + th + th + th { 159 width: 5%; 160 } 161 162 td { 163 padding: 5px 0; 164 outline: 0; 165 border: 0; 166 border-bottom: 1px solid #edf1f5; 167 vertical-align: middle; 168 text-align: left; 169 -webkit-transition: background 300ms ease-in; 170 -moz-transition: background 300ms ease-in; 171 -ms-transition: background 300ms ease-in; 172 -o-transition: background 300ms ease-in; 173 transition: background 300ms ease-in; 174 } 175 td:last-child,th:last-child { 176 text-align: right; 177 padding-right: 0; 178 } 179 td a { 180 display: block; 181 } 182 183 .parent a:hover { 184 color: #2a2a2a; 185 } 186 187 footer { 188 font-size:12px; 189 text-align:center; 190 } 191 footer a { 192 text-decoration: underline; 193 color:#990012; 194 } 195 196 img { max-width: 100%; }