Skip to content

Instantly share code, notes, and snippets.

View Momciloo's full-sized avatar
🌴
Working like crazy

Momcilo Popov Momciloo

🌴
Working like crazy
View GitHub Profile
@Momciloo
Momciloo / index.js
Created July 12, 2020 11:02
Date string to human-readable format
const dateString = '2020-05-14T04:00:00Z'
const formatDate = (dateString) => {
const options = { year: "numeric", month: "long", day: "numeric" }
return new Date(dateString).toLocaleDateString(undefined, options)
}
@Momciloo
Momciloo / system-font-face.css
Created April 16, 2020 11:52
System font-face snippet
/* Define the "system" font family */
@font-face {
font-family: system;
font-style: normal;
font-weight: 300;
src: local(".SFNSText-Light"), local(".HelveticaNeueDeskInterface-Light"), local(".LucidaGrandeUI"), local("Ubuntu Light"), local("Segoe UI Light"), local("Roboto-Light"), local("DroidSans"), local("Tahoma");
}
/* Now, let's apply it on an element */
body {
@Momciloo
Momciloo / _mixin_fluid.scss
Created November 23, 2017 13:36
Responsive values between range.
/* # =================================================================
# Fluid values
# ================================================================= */
@mixin fluid($properties, $min-vw, $max-vw, $min-value, $max-value) {
@each $property in $properties {
#{$property}: $min-value;
}
@media screen and (min-width: $min-vw) {
@each $property in $properties {
@Momciloo
Momciloo / spacings.scss
Created November 3, 2017 16:10
Common Spacings Utility Classes
/*
# =================================================================
# Spacings
# =================================================================
usage:
.u-mt_4
.u-pb_0
.u-p_64
@Momciloo
Momciloo / package.json
Last active October 17, 2017 12:35
Serving VueJS in history mode
{
"name": "vueserver",
"version": "1.0.0",
"description": "A VueJS server",
"author": "Momcilo Popov",
"private": true,
"scripts": {
"start": "node server.js"
},
"dependencies": {
@Momciloo
Momciloo / index.html
Last active December 4, 2016 16:14
Input with placeholder animation // pure JS
<div class="wrapper">
<fieldset class="formRow">
<div class="formRow--item">
<label for="firstname" class="formRow--input-wrapper js-inputWrapper">
<input type="text" class="formRow--input js-input" id="firstname" placeholder="First name">
</label>
</div>
</fieldset>
</div>