patterns.css

/*! style-forge.patterns 2025.1.18 | MIT License | https://github.com/Style-Forge/patterns */

.sf-pattern{display:grid}.sf-pattern>.area-aside{grid-area:aside}.sf-pattern>.area-footer{grid-area:footer}.sf-pattern>.area-header{grid-area:header}.sf-pattern>.area-main{grid-area:main}.sf-pattern>.area-menu{grid-area:menu}.sf-pattern{grid-auto-rows:auto;grid-auto-columns:auto;grid-template-areas:'main'}.sf-pattern.area-header{grid-template-rows:auto 1fr;grid-template-areas:'header' 'main'}.sf-pattern.area-footer{grid-template-rows:1fr;grid-template-areas:'main' 'footer'}.sf-pattern.area-header.area-footer{grid-template-rows:auto 1fr;grid-template-areas:'header' 'main' 'footer'}.sf-pattern.area-menu{grid-template-columns:auto 1fr;grid-template-areas:'menu main'}.sf-pattern.area-menu.area-header{grid-template-areas:'header header' 'menu main'}.sf-pattern.area-menu.area-footer{grid-template-areas:'menu main' 'footer footer'}.sf-pattern.area-menu.area-header.area-footer{grid-template-areas:'header header' 'menu main' 'footer footer'}.sf-pattern.area-aside{grid-template-columns:1fr;grid-template-areas:'main aside'}.sf-pattern.area-aside.area-header{grid-template-areas:'header header' 'main aside'}.sf-pattern.area-aside.area-footer{grid-template-areas:'main aside' 'footer footer'}.sf-pattern.area-aside.area-header.area-footer{grid-template-areas:'header header' 'main aside' 'footer footer'}.sf-pattern.area-menu.area-aside{grid-template-columns:auto 1fr;grid-template-areas:'menu main aside'}.sf-pattern.area-menu.area-aside.area-header{grid-template-areas:'header header header' 'menu main aside'}.sf-pattern.area-menu.area-aside.area-footer{grid-template-areas:'menu main aside' 'footer footer footer'}.sf-pattern.area-menu.area-aside.area-header.area-footer{grid-template-areas:'header header header' 'menu main aside' 'footer footer footer'}@media only screen and (max-width:1024px){.sf-pattern.area-menu{grid-template-columns:1fr auto;grid-template-rows:auto 1fr;grid-template-areas:'menu' 'main'}.sf-pattern.area-menu.area-header{grid-template-rows:auto auto 1fr;grid-template-areas:'header' 'menu' 'main'}.sf-pattern.area-menu.area-footer{grid-template-areas:'menu' 'main' 'footer'}.sf-pattern.area-menu.area-header.area-footer{grid-template-areas:'header' 'menu' 'main' 'footer'}.sf-pattern.area-aside{grid-template-areas:'main aside'}.sf-pattern.area-aside.area-header{grid-template-areas:'header header' 'main aside'}.sf-pattern.area-aside.area-footer{grid-template-areas:'main aside' 'footer footer'}.sf-pattern.area-aside.area-header.area-footer{grid-template-areas:'header header' 'main aside' 'footer footer'}.sf-pattern.area-menu.area-aside{grid-template-columns:1fr auto;grid-template-areas:'menu menu' 'main aside'}.sf-pattern.area-menu.area-aside.area-header{grid-template-rows:auto auto 1fr;grid-template-areas:'header header' 'menu menu' 'main aside'}.sf-pattern.area-menu.area-aside.area-footer{grid-template-areas:'menu menu' 'main aside' 'footer footer'}.sf-pattern.area-menu.area-aside.area-header.area-footer{grid-template-areas:'header header' 'menu menu' 'main aside' 'footer footer'}}@media only screen and (max-width:600px){.sf-pattern.area-aside{grid-template-rows:1fr auto;grid-template-areas:'main' 'aside'}.sf-pattern.area-aside.area-header{grid-template-rows:auto 1fr auto;grid-template-areas:'header' 'main' 'aside'}.sf-pattern.area-aside.area-footer{grid-template-areas:'main' 'aside' 'footer'}.sf-pattern.area-aside.area-header.area-footer{grid-template-areas:'header' 'main' 'aside' 'footer'}.sf-pattern.area-menu.area-aside{grid-template-columns:1fr;grid-template-rows:auto 1fr auto;grid-template-areas:'menu' 'main' 'aside'}.sf-pattern.area-menu.area-aside.area-header{grid-template-areas:'header' 'menu' 'main' 'aside'}.sf-pattern.area-menu.area-aside.area-footer{grid-template-areas:'menu' 'main' 'aside' 'footer'}.sf-pattern.area-menu.area-aside.area-header.area-footer{grid-template-areas:'header' 'menu' 'main' 'aside' 'footer'}}.sf-pattern.area-media{grid-template-columns:64px 1fr;grid-template-areas:'. main'}.sf-pattern.area-media .sf-pattern.area-media{grid-template-columns:32px 1fr}.sf-pattern.area-media .sf-pattern.area-media,.sf-pattern.area-media~.sf-pattern.area-media{margin-block-start:0.5em;padding-block-start:1em;border-top:1px solid}