Skip to content

Instantly share code, notes, and snippets.

@Chaitra7
Chaitra7 / HaydenExcerpts.css
Created August 7, 2017 18:32
How to add blog post thumbnails in Hayden template
<style>
.view-list .excerpt-thumb { /* This is the selector for the excerpt thumbnail */
display: block;
float: none;
width: 100%; /* This sets the width and height of thumbnail to 100% of the container it belongs to */
height: 100%;
}
.entry-content .excerpt-thumb img { /* This is the selector for the excerpt thumbnail image */
position: relative;
@Chaitra7
Chaitra7 / HaydenExcerpts.css
Created August 7, 2017 18:28
How to add blog post thumbnails in Hayden template Squarespace
<style>
.view-list .excerpt-thumb {
display: block;
float: none;
width: 100%;
height: 100%;
}
.entry-content .excerpt-thumb img {
@Chaitra7
Chaitra7 / text-styling-css
Created June 14, 2016 05:48
text-styling-css
.paragraph {
font-family:proxima-nova, sans-serif !important;
font-style: normal;
font-size: 12px;
font-weight:400;
letter-spacing: 3px;
color: #231f20;
text-transform: uppercase;
line-height: 1.5em;
<Variable name="TextFont" description="Text Font" type="font" value="400 12px 'Raleway', sans-serif"/>
<Variable name="TitleFont" description="Titles Font" type="font" value="500 12px 'Raleway', sans-serif"/>
/*
* Dropit v1.1.0
* http://dev7studios.com/dropit
*
* Copyright 2012, Dev7studios
* Free to use and abuse under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
*/
;(function($) {
(function(w){
if(window.bpen == undefined){
window.bpen = function(){};
}
if(window.bpen.core == undefined){
window.bpen.core = function(){};
window.bpen.core.hasClass = function(ele, cls){
return ele.className.match(new RegExp('(\\s|^)'+cls+'(\\s|$)'));
};
@Chaitra7
Chaitra7 / Meta tag responsive design
Created March 15, 2015 06:08
header responsive design
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
@Chaitra7
Chaitra7 / Responsive blogger design
Last active August 29, 2015 14:17
Responsive blogger design
@media screen and (max-width : 1280px) {
/* For Screen Width Less than Or Equal To 1280 */
/* CSS CODE HERE FOR DESKTOP DESIGN */
}
@media screen and (max-width : 1024px) {
/* For Screen Width Less than Or Equal To 1024 */
/* CSS CODE HERE FOR LAPTOPS DESIGN */
}