diff options
Diffstat (limited to 'plugins/jetpack/modules/infinite-scroll/infinity.css')
-rw-r--r-- | plugins/jetpack/modules/infinite-scroll/infinity.css | 164 |
1 files changed, 164 insertions, 0 deletions
diff --git a/plugins/jetpack/modules/infinite-scroll/infinity.css b/plugins/jetpack/modules/infinite-scroll/infinity.css new file mode 100644 index 00000000..4c84e294 --- /dev/null +++ b/plugins/jetpack/modules/infinite-scroll/infinity.css @@ -0,0 +1,164 @@ +/* =Infinity Styles +-------------------------------------------------------------- */ + +.infinite-wrap { +} +.infinite-loader { + color: #000; + display: block; + height: 28px; + text-indent: -9999px; +} +#infinite-handle span { + background: #333; + border-radius: 1px; + color: #eee; + cursor: pointer; + font-size: 13px; + padding: 6px 16px; +} + +/** + * Using a highly-specific rule to make sure that all button styles + * will be reset + */ +#infinite-handle span button, +#infinite-handle span button:hover, +#infinite-handle span button:focus { + display: inline; + position: static; + padding: 0; + margin: 0; + border: none; + line-height: inherit; + background: transparent; + color: inherit; + cursor: inherit; + font-size: inherit; + font-weight: inherit; + font-family: inherit; +} + +/** + * This is used to avoid unnecessary inner button spacing in Firefox + */ +#infinite-handle span button::-moz-focus-inner { + margin: 0; + padding: 0; + border: none; +} + +/** + * For smaller viewports, remove the down-arrow icon and turn + * the button into a block element, spanning the content's full width. + */ +@media (max-width: 800px) { + #infinite-handle span:before { + display: none; + } + #infinite-handle span { + display: block; + } +} + +/** + * Footer + */ +#infinite-footer { + position: fixed; + bottom: -50px; + left: 0; + width: 100%; +} +#infinite-footer a { + text-decoration: none; +} +#infinite-footer .blog-info a:hover, +#infinite-footer .blog-credits a:hover { + color: #444; + text-decoration: underline; +} +#infinite-footer .container { + background: rgba( 255, 255, 255, 0.8 ); + border-color: #ccc; + border-color: rgba( 0, 0, 0, 0.1 ); + border-style: solid; + border-width: 1px 0 0; + -moz-box-sizing: border-box; + box-sizing: border-box; + margin: 0 auto; + overflow: hidden; + padding: 1px 20px; + width: 780px; +} +#infinite-footer .blog-info, +#infinite-footer .blog-credits { + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + box-sizing: border-box; + line-height: 25px; +} +#infinite-footer .blog-info { + float: left; + overflow: hidden; + text-align: left; + text-overflow: ellipsis; + white-space: nowrap; + width: 40%; +} +#infinite-footer .blog-credits { + font-weight: normal; + float: right; + width: 60%; +} +#infinite-footer .blog-info a { + color: #111; + font-size: 14px; + font-weight: bold; +} +#infinite-footer .blog-credits { + color: #888; + font-size: 12px; + text-align: right; +} +#infinite-footer .blog-credits a { + color: #666; +} + +/** + * Hooks to infinity-end body class to restore footer + */ +.infinity-end.neverending #infinite-footer { + display: none; +} + +/** + * Responsive structure for the footer + */ +@media (max-width: 640px) { + #infinite-footer .container { + -moz-box-sizing: border-box; + -webkit-box-sizing: border-box; + box-sizing: border-box; + width: 100%; + } + #infinite-footer .blog-info { + width: 30%; + } + #infinite-footer .blog-credits { + width: 70%; + } + #infinite-footer .blog-info a, + #infinite-footer .blog-credits { + font-size: 10px; + } +} + +/** + * No fixed footer on small viewports + */ +@media ( max-width: 640px ) { + #infinite-footer { + position: static; + } +}
\ No newline at end of file |