metamn metamn

Swiftype

This site will contain our subscription services, our offer, articles, blog posts written by us. Mostly tutorials how to use our platform.

Responsive typography means two important things:

The HTML <body> gets a default size set in percentage
All other elements (larger and smaller text) are sized relative to 1.) using em instead of px.

I'm trying to write pure and standard HTML, CSS and Javascript code.
I'm trying to separate concerns: data, structure, style, behavior.
When there are no standards and guidelines I do extensive research and pick up those technologies which are not breaking 1. and 2.

This is a short introduction to technologies I use for website development.

	/**
	* TypeScript, after all, helps only during development time.
	* Runtime we've left with plain old JavaScript.
	/
	export const borderVariants = ["default", "smooth", "edoMenu"]; // This data is available later
	export type TBorderVariants = typeof borderVariants[number]; // This data is lost

	<?php
	/**
	* Displays a list of posts with an ad
	*
	* @package Pointhacks
	*/

	$post_list_title = get_query_var( 'post-list-title', 'Post list' );
	$post_list_klass = get_query_var( 'post-list-klass', 'post-list--default' );
	$post_list_posts = get_query_var( 'post-list-posts', null );

	?php
	/**
	* Displays a list of posts
	*
	* @package Pointhacks
	*/
	$post_list_title = get_query_var( 'post-list-title', 'Post list' );
	$post_list_klass = get_query_var( 'post-list-klass', 'post-list--default' );
	$post_list_posts = get_query_var( 'post-list-posts', null );
	$post_list_post_format = get_query_var( 'post-list-post-format', '' );

	@mixin latest-posts--regrid-for-ad($max-items-to-display-map, $margin-right) {
	.dfp-holder {
	width: 100%;
	height: 90px;
	background-color: black;
	display: flex;
	}

	@include media('<tablet') {
	$max-items-to-display: map-get($max-items-to-display-map, mobile);


	"title": "Practically",
	"excerpt": "How an ideally perfect website can be designed and developed today.",
	"template": "article",
	"categories": [
	"design",
	"code"
	],
	"url": "practically",
	"date": "2016-03-25",


	cs@cs-swift:~/work/pointhacks$ curl 'http://localhost:8000/wp-admin/admin-ajax.php' --data 'page=0&per_page=8&exclude=31325&action=ph_fetch_posts'
	{"0":{"image":"<figure class=\"post-featured-image\"><a class=\"link\" href=\"http:\/\/localhost:8000\/platinum-one-benefits-guide\/\" title=\"Is it worth going the extra mile from Platinum to Platinum One status?\"><img src=\"http:\/\/i.pointhacks.com\/2019\/02\/28212904\/Qantas-Status_0.jpg\" class=\"attachment-large size-large wp-post-image\" alt=\"\" srcset=\"http:\/\/i.pointhacks.com\/2019\/02\/28212904\/Qantas-Status_0.jpg 653w, http:\/\/i.pointhacks.com\/2019\/02\/28212904\/Qantas-Status_0-300x175.jpg 300w, http:\/\/i.pointhacks.com\/2019\/02\/28212904\/Qantas-Status_0-286x166.jpg 286w, http:\/\/i.pointhacks.com\/2019\/02\/28212904\/Qantas-Status_0-301x175.jpg 301w, http:\/\/i.pointhacks.com\/2019\/02\/28212904\/Qantas-Status_0-330x192.jpg 330w, http:\/\/i.pointhacks.com\/2019\/02\/28212904\/Qantas-Status_0-381x222.jpg 381w, http:\/\/i.pointhacks.com\/2019\

	// Colors
	//
	// The colors together with the color pairs.
	// Colors don't exist alone yet in pairs, like black on white.
	// All color pairs have a contrast ratio set for perfect readability using [Lea Verou's contrast checking tool](http://leaverou.github.io/contrast-ratio/).
	//
	// Styleguide colors