/* Theme Name: Independent Snipette Author: Badri Sunderarajan Author URI: https://medium.com/@badrihippo Description: Snipette extensions to the "Independent Publisher" theme Template: independent-publisher Version: 0.1 License: GNU GPLv3 License URI: http://www.gnu.org/copyleft/gpl.html Tags: light, white, blue, two-columns, left-sidebar, flexible-width, custom-background, custom-colors, custom-menu, editor-style, post-formats, rtl-language-support, sticky-post, threaded-comments, translation-ready Based on "Independent Publisher Child Theme" by raamdev https://github.com/raamdev/independent-publisher-child-theme/ */ /* =Imports styles from the parent theme -------------------------------------------------------------- */ @import url('../independent-publisher/style.css'); /* =Theme customization starts here. Add your own custom styles. -------------------------------------------------------------- */ /* Uncomment this style definition to hide the green bar on Quote Formatted posts: */ /* .format-quote blockquote { border-left: none; padding-left: 0; } */ /* Uncomment this style definition to use the original, Mac-specific font stack */ /* h1, h2, h3, h4, h5, h6, .pinglist, #taglist, .comment-form-author label, .comment-form-email label, .comment-form-url label, .comment-form-comment label, .comment-form-subscriptions label, .comment-form-reply-title { font-family: "Myriad Pro","Lucida Grande","Lucida Sans Unicode","Lucida Sans",Geneva,Verdana,sans-serif; } */ /* Uncomment this style definition to use a long dash in ``````: */ /* blockquote cite:before { content: "\2014 \0020"; } */ /* Add social buttons: Fediverse and Medium */ #menu-social li a[href*="squeet.me"]::before { content: url('/wp-content/uploads/2019/07/fediverse-28.png'); color: #4a4ae; opacity: 0.3; } #menu-social li a[href*="squeet.me"]:hover::before { opacity: 1; } #menu-social li a[href*="medium.com"]::before { content: url("/wp-content/uploads/2019/07/medium-logo-24.png"); color: #4a4a4e; opacity: 0.3; } #menu-social li a[href*="medium.com"]:hover::before { opacity:1; } /* center-align images */ figure > p { text-align: center; } figure { text-align: center; } /* Scissors */ .wp-block-separator { display:block; background-image:url('/wp-content/uploads/2019/07/snip-grey-small.png'); border:0; background-repeat: no-repeat; height: 32px; background-color: inherit; background-position: center; } /* Image Grid */ /* Grid style */ .display-posts-listing.grid { display: grid; grid-gap: 16px; } .display-posts-listing a{ font-weight: bold ; font-size-adjust:0.9; color: black; line-height: 2; } .display-posts-listing .title { display: block; color: black; } .display-posts-listing .excerpt { color: #77777; } .display-posts-listing .listing-item { border: 0.2rem solid rgba(0,0,0,0); padding:1rem; } .display-posts-listing .listing-item:hover { border-style: dashed; border-color: lightgrey; cursor: pointer; } .display-posts-listing .title:hover { text-decoration: none; } .display-posts-listing.grid img { display: block; max-width: 100%; height: auto; } @media (min-width: 600px) { .display-posts-listing.grid { grid-template-columns: repeat( 2, 1fr ); margin-bottom: 1em; } } /* Grid: Top post */ .display-posts-listing.image-top .listing-item { margin-bottom: 32px; } .display-posts-listing.image-top .listing-item .title { display: block; } .display-posts-listing.image-top .listing-item .excerpt-dash { display: none; } /* Topbar */ .topbar { display: flex; align-items: center; margin: 0; padding: 0; background: white; border-bottom: 0.1rem solid lightgrey; } .topbar ul { margin: 0; padding: 1.6rem; } .topbar ul>li { display: inline; padding: 0.7rem; border: 0.2rem dashed rgba(0,0,0,0); } .topbar ul>li:hover { border: 0.2rem dashed darkgrey; padding-left: 1rem; padding-right: 1rem; padding-top: 1rem; padding-bottom: 1rem; } .topbar a, .topbar a:visited, .topbar a:hover, .topbar a:visited:hover { color: black; text-decoration: none; font-family: "Myriad Pro", Helvetica, Arial, sans-serif; } .topbar img { display: inline-block; margin-left: 3rem; margin-right: 0.5rem; margin-top: 0.7rem; margin-bottom: 0.7rem; max-width: 100%; max-height: 100%; max-height: 3rem; }