Skip to content

Instantly share code, notes, and snippets.

🐌
work work work

Andreas Kar thexmanxyz

🐌
work work work
Block or report user

Report or block thexmanxyz

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@thexmanxyz
thexmanxyz / Config-Explore-Gantry5.html.twig
Created May 26, 2020
Explore Gantry5 configuration in TWIG
View Config-Explore-Gantry5.html.twig
{# retrieve configuration #}
{{ dump(gantry.config) }}
{# retrieve styles configuration #}
{{ dump(gantry.config.styles) }}
{# retrieve breakpoint configuration #}
{{ dump(gantry.config.styles.breakpoints) }}
{# you can also obtain particle configurations via gantry.particles #}
View Multiply-Recursion-JS.js
function multiply(arr, n) {
if (n <= 0) { // return 0 if count is 0 or negative
return 0;
} else { // sum up the next n - 1 elements with the current element
return multiply(arr, n - 1) + arr[n - 1];
}
}
@thexmanxyz
thexmanxyz / Simple-Overlay-Cookie.css
Last active Apr 8, 2020
Simple Overlay with Cookie (only shown once or on action)
View Simple-Overlay-Cookie.css
@thexmanxyz
thexmanxyz / css-loader-all-loader.css
Last active Mar 29, 2020
CSS-Loader - Pure CSS loader - all 8 and small versions (CSS and SCSS) - credits @ https://github.com/lukehaas/css-loaders
View css-loader-all-loader.css
/* All 8 CSS-Loader (plus small version for each) pure CSS loaders in one file */
/* Uses black on white and not white on turquise like the original */
/* Add <div class="load1 loader">Loading...</div> to your HTML markup */
/* You can change the spinner with the classes load1 - load8 and load1-small - load8-small */
/* credits @ https://github.com/lukehaas/css-loaders */
/* load1 */
.async-gmaps-spinner.load1.loader,
.async-gmaps-spinner.load1-small.loader,
.async-gmaps-spinner.load1.loader:before,
@thexmanxyz
thexmanxyz / loading-io-all-loader-primary.scss
Last active Apr 6, 2020
Loading.io - Pure CSS loader - all 12 and small version (CSS, SCSS and SCSS+$primary) - credits @ https://loading.io
View loading-io-all-loader-primary.scss
/* All 12 Loading.io (plus small version for each) pure CSS loaders in one file, combined with $primary using e.g. template primary-color */
/* You can change the spinner with the classes load1 - load8 and load1-small - load8-small */
/* credits @ https://loading.io and https://github.com/loadingio/css-spinner/ */
/* circle */
.lds-circle, .lds-circle-small {
display: inline-block;
width: 64px;
height: 64px;
margin: 8px;
@thexmanxyz
thexmanxyz / WOWjs-Reanimate-Element-delay.js
Last active Mar 29, 2020
WOW.js Reanimate Single Elements without init() - delayed
View WOWjs-Reanimate-Element-delay.js
// If you want to explicitly trigger an animation for certain WOW.js elements again. No need to call `init()` and also not wanted (all elements are reset):
var triggerAnimation = function(selector, animation) {
var $element = $(selector); // get element
// re-apply animation (style and class)
var applyAnimation = function(){
$element = $(selector);
$element.addClass('wow ' + animation + ' animated');
$element.attr('style', 'visibility: visible; animation-name: ' + animation + ';');
};
@thexmanxyz
thexmanxyz / Reset-WOWjs-Animation-On-Leave-Viewport.js
Last active Mar 29, 2020
Reset WOW.js elements for reanimation during scrolling (leaving viewport)
View Reset-WOWjs-Animation-On-Leave-Viewport.js
// This snippet dynamically resets animation after passing the viewport (scrolling, resizing), hence they are reanimated when viewing them again
// Helper function for adding elements to box list in WOW, credits @ https://github.com/matthieua/WOW/issues/46#issuecomment-133760823
WOW.prototype.addBox = function(element) {
this.boxes.push(element);
};
wow = new WOW();
wow.init();
var checkWOWJsReset = function() {
var resetWOWJsAnimation = function() {
@thexmanxyz
thexmanxyz / WOWjs-Reanimate-Element.js
Last active Mar 29, 2020
WOW.js Reanimate Single Elements without init() - normal
View WOWjs-Reanimate-Element.js
// If you want to explicitly trigger an animation for certain WOW.js elements again. No need to call `init()` and also not wanted (all elements are reset):
var triggerAnimation = function(selector, animation) {
var $element = $(selector); // get element
var element = $element[0]; // get JS element
var newone = element.cloneNode(true); // clone it
element.parentNode.replaceChild(newone, element); // and replace the old with clone
$element = $(selector); // get cloned jQ element
$element.addClass('wow ' + animation + ' animated'); // apply animations
$element.attr('style', 'visibility: visible; animation-name: ' + animation + ';'); // and styles
@thexmanxyz
thexmanxyz / Lazy-Loading-Images-Spinner.html
Last active Mar 16, 2020
Lazy load images and remove BS4 spinner dynamically
View Lazy-Loading-Images-Spinner.html
<div class="lazy-load-ctn">
<div class="spinner-grow loading-img" role="status">
<span class="sr-only">Loading...</span>
</div>
<img data-src="img/yourimage.png" class="img-fluid lazy">
</div>
@thexmanxyz
thexmanxyz / _openinghours.scss
Last active Mar 29, 2020
Startbootstrap - Business Casual - dynamic opening hours
View _openinghours.scss
.opening-hours-section {
&.cta {
padding: 3rem 0 2.5rem 0;
background-color: fade-out($primary, 0.1);
.cta-inner {
position: relative;
padding: 2rem;
margin: 0.5rem;
background-color: fade-out($white, 0.15);
&:before {
You can’t perform that action at this time.