snipette/independent-snipette
snipette/independent-snipette
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity

Add basic custom CSS

Browse source
This commit is contained in:
Hippo 2019-08-03 17:51:25 +05:30
parent 8a69142c55
commit 1183c5cca2
1 changed files with 116 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

116
style.css
View file

@ -57,3 +57,119 @@ 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;
}
/* Temporary "not ready" banner */
body::before {
content: "Heads up! This website isn't ready yet. You can look around, but be aware that the current version is still on Medium (https://medium.com/snipette).";
background-color: red;
width: calc(100vw - 2.6em);
text-align: center;
display: block;
color: white;
padding: 1em;
}
.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;
}