Skip to content

Instantly share code, notes, and snippets.

Avatar
:octocat:
Building cool things!

Dev By Ray devbyray

:octocat:
Building cool things!
View GitHub Profile
View dark-mode-switcher.js
const button = document.querySelector(".color-switch");
button.addEventListener("click", function() {
const body = document.querySelector("body");
body.classList.toggle("darkmode");
if (button) {
button.innerText = body.classList.contains("lightmode") ? "Dark" : "Light";
}
});
View dark-mode-switcher.ts
const button: HTMLButtonElement = document.querySelector(".color-switch");
button.addEventListener("click", function() {
const body: HTMLBodyElement = document.querySelector("body");
body.classList.toggle("darkmode");
if (button) {
button.innerText = body.classList.contains("lightmode") ? "Dark" : "Light";
}
});
View dark-color-scheme.css
.darkmode {
--text: #fff;
--links: #66e387;
--bg-start: #2c5364;
--bg-middle: #203a43;
--bg-end: #0f2027;
--background-fallback: #0f2027; /* fallback for old browsers */
--background-gradient-webkit: -webkit-linear-gradient(
to bottom,
var(--bg-start),
View lazyloading.html
<img src="https://source.unsplash.com/random" loading="lazy" />
<iframe
src="https://raymonschouwenaar.nl"
width="100%"
height="500px"
loading="lazy"
></iframe>
@devbyray
devbyray / angularjs_directive_attribute_explanation.md
Created May 24, 2016 07:31 — forked from CMCDragonkai/angularjs_directive_attribute_explanation.md
JS: AngularJS Directive Attribute Binding Explanation
View angularjs_directive_attribute_explanation.md

AngularJS Directive Attribute Binding Explanation

When using directives, you often need to pass parameters to the directive. This can be done in several ways. The first 3 can be used whether scope is true or false. This is still a WIP, so validate for yourself.

  1. Raw Attribute Strings

    <div my-directive="some string" another-param="another string"></div>
@devbyray
devbyray / event-editable.scss
Last active January 5, 2016 20:34
Feedback
View event-editable.scss
// Overall feedback I see a lot in your CSS:
// Keep specificity as low as possible
// Read this article: http://csswizardry.com/2014/07/hacks-for-dealing-with-specificity/
// For the rest is your CSS not bad at all!
// Better than I expected :-)
@import "../../../../members/assets/scss/variables";
@import "../tooltip";