A Pen by Lucas Mosele on CodePen.
A Pen by Lucas Mosele on CodePen.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// This sort of works, but not really. | |
function sendAnalytics() { | |
var pageName = location.hash.replace('#', ''); | |
ga('send', 'screenview', { | |
'page': location.pathname + location.search + location.hash, | |
'screenName': 'member ' + pageName + ' page' | |
}); | |
} | |
window.addEventListener('hashchange', function() { |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// This simple jquery script adds a class to an element once it reaches the bottom of a container (for example, a navbar switching colors once it reaches a new section on the page | |
$(window).scroll(function() { | |
var scroll = $(window).scrollTop(); | |
var topofDiv = $(".banner").offset().top; //use the element you want to limit the styles to | |
var height = $(".banner").outerHeight(); | |
if (scroll >= (topofDiv + height) - 80) { // the -80 should be the height of the container that's changing | |
$("#topNav").addClass("scrolled"); // this is where you add the new class for the element you want to change | |
} else { |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"name": "project", | |
"main": "index.js", | |
"scripts": { | |
"build-css": "node-sass --include-path scss src/styles/main.scss dist/css/main.min.css", | |
"watch-css": "nodemon -e scss -x \"npm run build-css\" " | |
}, | |
"devDependencies": { | |
"node-sass": "^4.5.1", | |
"nodemon": "^1.11.0" |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// enzyme requires you to set up jsdom for rendering | |
var jsdom = require('jsdom').jsdom; | |
var exposedProperties = ['window', 'navigator', 'document']; | |
global.document = jsdom(''); | |
global.window = document.defaultView; | |
Object.keys(document.defaultView).forEach((property) => { | |
if (typeof global[property] === 'undefined') { | |
exposedProperties.push(property); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* $this will always target the top level selector */ | |
.filter-block { | |
$this: &; | |
&__title { | |
color: black; | |
} | |
&--expandable { | |
#{$this}__title { | |
color: blue; | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
@charset "utf-8"; | |
@font-face { | |
font-family: "Poppins"; | |
src: url("../fonts/Poppins-Regular.otf"); | |
} | |
// @font-face { | |
// font-family: "Merriweather"; | |
// src: url("../fonts/Merriweather-Regular.ttf"); | |
// } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
.bell-ring { | |
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1NyA0NiI+PGRlZnM+PHN0eWxlPi5jbHMtNXtmaWxsOiM2Y2M4ZGV9PC9zdHlsZT48L2RlZnM+PGcgaWQ9IkxheWVyXzIiIGRhdGEtbmFtZT0iTGF5ZXIgMiI+PGcgaWQ9IkxheWVyXzEtMiIgZGF0YS1uYW1lPSJMYXllciAxIj48cGF0aCBkPSJNMTUgMzdjLTUgMC03IDItNyA3YTEgMSAwIDAgMCAxIDJoMjB2LTl6IiBmaWxsPSIjYmRiZmM2Ii8+PHBhdGggZD0iTTI0IDEzYTEgMSAwIDAgMC0xIDF2MWExIDEgMCAwIDAgMSAxaDN2MWMtMTAgMS0xNyA4LTE3IDE3YTEgMSAwIDAgMCAxIDFoMThWMTN6IiBmaWxsPSIjZmNiZjUzIi8+PHBhdGggZD0iTTQzIDM3YzQgMCA3IDIgNyA3YTEgMSAwIDAgMS0yIDJIMjl2LTl6IiBmaWxsPSIjYzZjOWQ0Ii8+PHBhdGggZD0iTTMzIDEzYTEgMSAwIDAgMSAxIDF2MWExIDEgMCAwIDEtMSAxaC0zdjFjMTEgMSAxNyA4IDE3IDE3YTEgMSAwIDAgMS0xIDFIMjlWMTN6IiBmaWxsPSIjZmRjYTdhIi8+PHBhdGggY2xhc3M9ImNscy01IiBkPSJNNyAyMGwtNi0yYTYgNiAwIDAgMC0xIDJsNiAzaDFsMS0yLTEtMXoiLz48cGF0aCBkPSJNMTcgMTBsLTMtNGE2IDYgMCAwIDAtMiAxbDMgNGgydi0xem0xMy0zYTIgMiAwIDAgMCAwLTFWMGgtMnY2bDEgMWEzIDMgMCAwIDEgMSAwem0xNS0zbC0zIDR2MmgxbDMtNGEyMCAyMCAwIDAgMS0xLTJ6IiBmaWxsP |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import * as React from 'react'; | |
import styled, {css} from 'styled-components'; | |
import { IStyledProps } from 'types/theme-types'; | |
function validate(value) { | |
if (value.length > 0) { | |
return true; | |
} else { | |
return false; | |
} |
OlderNewer