Skip to content

Instantly share code, notes, and snippets.

View torleifhalseth's full-sized avatar

Torleif Halseth torleifhalseth

View GitHub Profile
@torleifhalseth
torleifhalseth / style.md
Last active March 4, 2022 07:12
Scalable and Modular Architecture for CSS

Best practise on writing scalable and modular css

👮🏻 Naming conventions

Selectors

  • Don't use ID's for style.
  • Avoid over-qualified selectors: h1.page-title, div > .page-title
  • Use meaningful names: $visual-grid-color not $color or $vslgrd-clr.

Best / our practise on writing styled components

📖 Documentation

👮🏻 Conventions

Know your components. Look at existing components before you create a brand new one. It is really fun to create new components but please ask yourself or the designer if we already have a component that might do the job first! Maybe you can create a variant of an existing component or just use it out of the box? It is important to evaluate the complexity of creating a variant. Sometimes it is smarter to create a new component. Discuss with your teammates!

DRY - Don't repeat yourself - Use inheritance to share style between similar components.

@torleifhalseth
torleifhalseth / Access-Control-Allow-Origin-ALL.xml
Last active November 11, 2015 11:27
Access-Control-Allow-Origin
<system.webServer>
<httpProtocol>
<customHeaders>
<!--
Allow Web API to be called from a different domain.
-->
<add name="Access-Control-Allow-Origin" value="*" />
<add name="Access-Control-Allow-Headers" value="Content-Type, Accept" />
<add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" />
</customHeaders>
@torleifhalseth
torleifhalseth / RelationLookupType.cs
Last active January 2, 2018 11:48
Umbraco Relations
namespace MyProject.Models
{
/// <summary>
/// Enum RelationLookupType
/// </summary>
public enum RelationLookupType
{
Child,
Parent
}
using System.Collections.Generic;
using System.Linq;
using MyProject.Models;
using Our.Umbraco.Ditto;
using Umbraco.Web;
using Umbraco.Web.WebApi;
namespace MyProject.Controllers.WebApi
{
public class FeaturedArticlesController : UmbracoApiController
@torleifhalseth
torleifhalseth / RelationConverter.cs
Last active August 29, 2015 14:21
Provides a unified way of converting picked relation nodes as a specified type.
using System;
using System.ComponentModel;
using System.Globalization;
using System.Linq;
using nuPickers;
using Our.Umbraco.Ditto;
namespace MyProject.TypeConverters
{
/// <summary>
@torleifhalseth
torleifhalseth / SassMeister-input-HTML.html
Created April 22, 2015 11:18
Generated by SassMeister.com.
<article>
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</article>
@torleifhalseth
torleifhalseth / SassMeister-input-HTML.html
Last active August 29, 2015 14:19
Grid with static gutter using inner element margin
<div class="modules">
<div class="module_container">
<div class="module"></div>
</div>
<div class="module_container">
<div class="module"></div>
</div>
<div class="module_container">
<div class="module"></div>
</div>
@torleifhalseth
torleifhalseth / SassMeister-input-HTML.html
Last active August 29, 2015 14:19
Grid with static gutter using border
<div class="modules">
<div class="module"></div>
<div class="module"></div>
<div class="module"></div>
</div>