Using different kind of tools to build big styles for websites. Problem with big CSS is that it gets heavy, hard to manage, convoluted. But fortunately there are ways to keep structured and manageable. In this presentation we introduce combination of Makefile, SASS, ImageMagick, and other tools.
An overview of the CSS preprocessor LESS.
Including code samples for creating mixins, variables, math, colors, patterns, guards, scope, and namespaces.
LESS is a CSS pre-processor that extends CSS by adding features like variables, mixins, functions and nested rules. This allows CSS to be more maintainable, themeable and extendable. The document outlines key LESS features like variables, operations, functions, mixins, loops and compiling LESS to CSS. It provides examples of how each feature can be used.
Sass is a meta-language that extends CSS by adding features like nested rules, variables, mixins, selector inheritance, and more. It allows for more modular and maintainable CSS code. Sass code is translated to standard CSS using a command line tool or web framework plugin. Some benefits of Sass include reducing redundant code through variables and mixins, and creating more scalable and maintainable style sheets through features like nesting and imports. Sass supports both .sass and .scss syntax and files can be compiled to CSS using the sass or compass command line tools.
This document provides an introduction and overview of SASS (Syntactically Awesome Style Sheets), a CSS preprocessor. It highlights key SASS features like nesting, variables, math operations, mixins and imports that allow for more efficient, reusable and readable CSS code. The document also briefly explains how to install SASS using Ruby gems and use it to compile SCSS files into normal CSS.
The document provides an overview of web development. It discusses the objectives of the workshop which are to understand the differences between web designers and developers, and gain knowledge of front-end technologies like HTML, CSS, and JavaScript. It also explains why the web is popular due to being cross-platform, writable once and usable everywhere. Key topics covered include the history of the web, definitions of web designers versus developers, front-end versus back-end development, and an overview of HTML, CSS, and JavaScript.
An overview of the CSS preprocessor LESS.
Including code samples for creating mixins, variables, math, colors, patterns, guards, scope, and namespaces.
LESS is a CSS pre-processor that extends CSS by adding features like variables, mixins, functions and nested rules. This allows CSS to be more maintainable, themeable and extendable. The document outlines key LESS features like variables, operations, functions, mixins, loops and compiling LESS to CSS. It provides examples of how each feature can be used.
Sass is a meta-language that extends CSS by adding features like nested rules, variables, mixins, selector inheritance, and more. It allows for more modular and maintainable CSS code. Sass code is translated to standard CSS using a command line tool or web framework plugin. Some benefits of Sass include reducing redundant code through variables and mixins, and creating more scalable and maintainable style sheets through features like nesting and imports. Sass supports both .sass and .scss syntax and files can be compiled to CSS using the sass or compass command line tools.
This document provides an introduction and overview of SASS (Syntactically Awesome Style Sheets), a CSS preprocessor. It highlights key SASS features like nesting, variables, math operations, mixins and imports that allow for more efficient, reusable and readable CSS code. The document also briefly explains how to install SASS using Ruby gems and use it to compile SCSS files into normal CSS.
The document provides an overview of web development. It discusses the objectives of the workshop which are to understand the differences between web designers and developers, and gain knowledge of front-end technologies like HTML, CSS, and JavaScript. It also explains why the web is popular due to being cross-platform, writable once and usable everywhere. Key topics covered include the history of the web, definitions of web designers versus developers, front-end versus back-end development, and an overview of HTML, CSS, and JavaScript.
HTML5, CSS, JavaScript Style guide and coding conventionsKnoldus Inc.
Coding conventions are style guidelines for any programming language. As, we are growing ourselves rapidly in learning new technology, the need for learning of the coding standards and conventions for the same language also arises.
So, here let us try to learn some coding guidelines for few frontend languages.
Grok Drupal (7) Theming - 2011 Feb updateLaura Scott
These are slides from my presentation at Drupal Design Camp Los Angeles, February 2011. Video with rather low resolution version of the slides (we inadvertently recorded my presentation notes screen rather than the projector screen) can be viewed on blip:
http://ladrupal.blip.tv/file/4731722/
The document describes several templating languages and preprocessors for HTML, CSS, and front-end development including Haml, Jade, LESS, SASS, and Bourbon. It provides code examples to demonstrate features like variables, nesting, mixins, imports and more. These tools can be used to make HTML, CSS, and template files more concise, reusable and maintainable.
This document provides an overview of HTML and CSS basics:
- HTML is used to define the structure and content of web pages using tags like <html>, <head>, <body>, etc. CSS is used to style and lay out HTML elements.
- The <head> holds metadata like the page title and links to CSS. The <body> contains visible elements that define the page structure.
- CSS rules are made up of selectors that target HTML elements paired with declarations in curly braces. Common selectors include classes, IDs, and element types.
- CSS files are linked in the <head> with <link> tags. Paths to other files can be relative to the current
This PPT is about my best friends, HTML, CSS and JS. Here I am just talk/show few features of them. all three combined make our web site more powerful in this WWW world.
LESS is a dynamic stylesheet language that extends CSS syntax. The LESS compiler converts LESS code into regular CSS. LESS adds features like variables, mixins, nested rules, and functions that allow things like setting variables to reuse colors and values, embedding selectors to reduce code, nesting rules to organize selectors, and performing operations to generate CSS properties mathematically.
Sass is an extension of CSS3 that adds power and elegance to the basic language. It allows you to use variables, nested rules, mixins, inline imports, and more, all with a fully CSS-compatible syntax. (With a little help from Ruby) This talk will cover an overview of what Sass is, how to get it, run it, and use it, and show some examples of its magic.
Code examples at: https://github.com/founddrama/vt-code-camp
CSS3 - is everything we used to do wrong? Russ Weakley
The document discusses the benefits and potential issues of using CSS3 and preprocessors. It recommends learning CSS2.1 fundamentals first before jumping into CSS3. Object-oriented CSS, resets, frameworks and preprocessors can make development more efficient and flexible by reducing repetitive code and improving maintenance. However, they also have drawbacks like additional classes and changing mindsets.
1. The document discusses different topics in CSS including the basics of CSS, background properties, fonts, text properties, the box model, lists, styling links, and positioning.
2. It provides examples and explanations of key CSS concepts like selectors, declarations, background images and colors, fonts, padding, borders, margins, and different positioning techniques.
3. The document is intended to teach the fundamentals of CSS through clear explanations, syntax examples, and diagrams of the box model.
The document provides an overview of HTML and XHTML topics including:
1. It defines HTML as a markup language used to define the structure and layout of web pages using tags. XHTML is defined as a stricter version of HTML that follows XML syntax rules.
2. Key HTML topics covered include basic tags for headings, paragraphs, colors, fonts, lists, links, images and tables. It also discusses HTML forms, headers and bodies.
3. The document contrasts XHTML with HTML and outlines requirements for XHTML documents such as mandatory DOCTYPEs and proper nesting of tags.
Authoring Stylesheets with Compass & Sasschriseppstein
The document discusses authoring stylesheets using Sass and Compass. It provides an overview of Sass features like variables, nested rules, mixins, and more. It also discusses how Compass can be used to simplify CSS development with features like a project context, libraries, and asset management. The presentation aims to teach attendees the Sass syntax and how to set up and use Compass projects.
This document provides an overview of Bootstrap, a popular CSS framework. It discusses including Bootstrap via a CDN or by downloading files. It covers Bootstrap containers, grids for layouts using rows and columns, responsive typography styles, and common components like buttons, navigation bars, dropdown menus, and more. Setup and basic usage of these Bootstrap features are demonstrated with code examples.
HTML is used to structure and layout web pages. The basic HTML document has a head and body section. The head contains metadata like the title, while the body contains visible content. Common elements include headings, paragraphs, lists, links, images and tables. Tags like <h1> and <p> define headings and paragraphs. Unordered and ordered lists use <ul> and <ol> tags. Links are created with <a> tags and images with <img> tags. Tables are made up of <table>, <tr>, and <td> tags to define the table, rows, and cells. HTML provides basic building blocks for creating web pages.
What is Basic?
Basic was originally developed for client projects. Originally a stripped down version of the ZEN theme, basic has now become its own concept of a theme starter. Basic boasts a clean HTML structure with extensible CSS classes and ID's for unlimited theming possibilities as well as a top-down load order for improved SEO.
Basic's goal is to provide themers the building blocks needed to get their designs up and running quickly and simply.
What is SASS?
Sass is a meta-language on top of CSS that’s used to describe the style of a document cleanly and structurally, with more power than flat CSS allows. Sass both provides a simpler, more elegant syntax for CSS and implements various features that are useful for creating manageable stylesheets.
What will I Learn?
We will guide you through using Basic with SASS and Compass to kick-start your next Drupal theming project and show you how easy it is to get started. We will also cover the syntax and file structure of using SASS and how to get your development environment up
You've been tasked with developing a new front end feature. HTML, CSS, and JavaScript are nothing new to you, in fact you even know a few tricks to get this feature out the door. It doesn't take you long and the code works like a charm, yet you have a looming suspicion that some of the code might not be up to par. You're likely right, and you're definitely better than that.
We often write code without paying attention to the bigger picture, or overall code base. Upon stepping back we notice areas of duplicate code, ripe for refactoring. It's time to build more modular front ends, focusing on the reusability of HTML, CSS, and JavaScript, and to take maintainability to heart.
This document introduces Sass (Syntactically Awesome Style Sheets), which is a CSS preprocessor that adds powerful features like variables, nested rules, mixins, inheritance, and other useful tools that help make authoring CSS easier and more maintainable. It discusses some of the key benefits of using Sass like variables, nesting, mixins, functions, and operations that make styling more powerful and repetitive tasks easier. It also covers using Compass, a Sass extension framework, to gain access to useful CSS3 mixins and functions.
Panels: how to fire Front-end developerKirill Borzov
This document discusses how to work with panels in Drupal, including templates, layouts, styles, responsiveness, and scripts. It is written by Kirill Borzov, a front-end developer with 7 years of experience and 3 years working specifically with Drupal panels. The document provides examples of preprocessing panels panes and layouts, discusses responsive panel implementations using plugins, and encourages writing custom scripts.
Web front end development introduction to html css and javascriptMarc Huang
This document provides an introduction to HTML, CSS, and JavaScript for building websites. It discusses how websites work by connecting clients and servers, and compares making a website to writing a book by organizing content into pages. The document then covers the basic purposes and syntax of HTML for creating page content, CSS for styling, and JavaScript for interactivity. It provides many code examples and explains common elements, properties, and methods in each language to demonstrate basic front-end web development concepts and tools.
This document summarizes best practices for managing code complexity in Drupal projects. It recommends:
- Building the data model around entities and relationships with minimal duplication and no cycles.
- Avoid hacking core/contrib modules and putting code in the database. Use entity wrappers.
- Create modules that correspond to each content type, field, and field type to keep functionality well organized.
- Structure modules by content types, fields, and functionality for good modularity.
The poem reflects on Christmas past and present, remembering the magic of Christmas from childhood. It wishes a Merry Christmas to Zachary and all, hoping the spirit of peace, brotherhood, and love that surrounded Jesus' birth also surrounds Zachary and fills his time.
HTML5, CSS, JavaScript Style guide and coding conventionsKnoldus Inc.
Coding conventions are style guidelines for any programming language. As, we are growing ourselves rapidly in learning new technology, the need for learning of the coding standards and conventions for the same language also arises.
So, here let us try to learn some coding guidelines for few frontend languages.
Grok Drupal (7) Theming - 2011 Feb updateLaura Scott
These are slides from my presentation at Drupal Design Camp Los Angeles, February 2011. Video with rather low resolution version of the slides (we inadvertently recorded my presentation notes screen rather than the projector screen) can be viewed on blip:
http://ladrupal.blip.tv/file/4731722/
The document describes several templating languages and preprocessors for HTML, CSS, and front-end development including Haml, Jade, LESS, SASS, and Bourbon. It provides code examples to demonstrate features like variables, nesting, mixins, imports and more. These tools can be used to make HTML, CSS, and template files more concise, reusable and maintainable.
This document provides an overview of HTML and CSS basics:
- HTML is used to define the structure and content of web pages using tags like <html>, <head>, <body>, etc. CSS is used to style and lay out HTML elements.
- The <head> holds metadata like the page title and links to CSS. The <body> contains visible elements that define the page structure.
- CSS rules are made up of selectors that target HTML elements paired with declarations in curly braces. Common selectors include classes, IDs, and element types.
- CSS files are linked in the <head> with <link> tags. Paths to other files can be relative to the current
This PPT is about my best friends, HTML, CSS and JS. Here I am just talk/show few features of them. all three combined make our web site more powerful in this WWW world.
LESS is a dynamic stylesheet language that extends CSS syntax. The LESS compiler converts LESS code into regular CSS. LESS adds features like variables, mixins, nested rules, and functions that allow things like setting variables to reuse colors and values, embedding selectors to reduce code, nesting rules to organize selectors, and performing operations to generate CSS properties mathematically.
Sass is an extension of CSS3 that adds power and elegance to the basic language. It allows you to use variables, nested rules, mixins, inline imports, and more, all with a fully CSS-compatible syntax. (With a little help from Ruby) This talk will cover an overview of what Sass is, how to get it, run it, and use it, and show some examples of its magic.
Code examples at: https://github.com/founddrama/vt-code-camp
CSS3 - is everything we used to do wrong? Russ Weakley
The document discusses the benefits and potential issues of using CSS3 and preprocessors. It recommends learning CSS2.1 fundamentals first before jumping into CSS3. Object-oriented CSS, resets, frameworks and preprocessors can make development more efficient and flexible by reducing repetitive code and improving maintenance. However, they also have drawbacks like additional classes and changing mindsets.
1. The document discusses different topics in CSS including the basics of CSS, background properties, fonts, text properties, the box model, lists, styling links, and positioning.
2. It provides examples and explanations of key CSS concepts like selectors, declarations, background images and colors, fonts, padding, borders, margins, and different positioning techniques.
3. The document is intended to teach the fundamentals of CSS through clear explanations, syntax examples, and diagrams of the box model.
The document provides an overview of HTML and XHTML topics including:
1. It defines HTML as a markup language used to define the structure and layout of web pages using tags. XHTML is defined as a stricter version of HTML that follows XML syntax rules.
2. Key HTML topics covered include basic tags for headings, paragraphs, colors, fonts, lists, links, images and tables. It also discusses HTML forms, headers and bodies.
3. The document contrasts XHTML with HTML and outlines requirements for XHTML documents such as mandatory DOCTYPEs and proper nesting of tags.
Authoring Stylesheets with Compass & Sasschriseppstein
The document discusses authoring stylesheets using Sass and Compass. It provides an overview of Sass features like variables, nested rules, mixins, and more. It also discusses how Compass can be used to simplify CSS development with features like a project context, libraries, and asset management. The presentation aims to teach attendees the Sass syntax and how to set up and use Compass projects.
This document provides an overview of Bootstrap, a popular CSS framework. It discusses including Bootstrap via a CDN or by downloading files. It covers Bootstrap containers, grids for layouts using rows and columns, responsive typography styles, and common components like buttons, navigation bars, dropdown menus, and more. Setup and basic usage of these Bootstrap features are demonstrated with code examples.
HTML is used to structure and layout web pages. The basic HTML document has a head and body section. The head contains metadata like the title, while the body contains visible content. Common elements include headings, paragraphs, lists, links, images and tables. Tags like <h1> and <p> define headings and paragraphs. Unordered and ordered lists use <ul> and <ol> tags. Links are created with <a> tags and images with <img> tags. Tables are made up of <table>, <tr>, and <td> tags to define the table, rows, and cells. HTML provides basic building blocks for creating web pages.
What is Basic?
Basic was originally developed for client projects. Originally a stripped down version of the ZEN theme, basic has now become its own concept of a theme starter. Basic boasts a clean HTML structure with extensible CSS classes and ID's for unlimited theming possibilities as well as a top-down load order for improved SEO.
Basic's goal is to provide themers the building blocks needed to get their designs up and running quickly and simply.
What is SASS?
Sass is a meta-language on top of CSS that’s used to describe the style of a document cleanly and structurally, with more power than flat CSS allows. Sass both provides a simpler, more elegant syntax for CSS and implements various features that are useful for creating manageable stylesheets.
What will I Learn?
We will guide you through using Basic with SASS and Compass to kick-start your next Drupal theming project and show you how easy it is to get started. We will also cover the syntax and file structure of using SASS and how to get your development environment up
You've been tasked with developing a new front end feature. HTML, CSS, and JavaScript are nothing new to you, in fact you even know a few tricks to get this feature out the door. It doesn't take you long and the code works like a charm, yet you have a looming suspicion that some of the code might not be up to par. You're likely right, and you're definitely better than that.
We often write code without paying attention to the bigger picture, or overall code base. Upon stepping back we notice areas of duplicate code, ripe for refactoring. It's time to build more modular front ends, focusing on the reusability of HTML, CSS, and JavaScript, and to take maintainability to heart.
This document introduces Sass (Syntactically Awesome Style Sheets), which is a CSS preprocessor that adds powerful features like variables, nested rules, mixins, inheritance, and other useful tools that help make authoring CSS easier and more maintainable. It discusses some of the key benefits of using Sass like variables, nesting, mixins, functions, and operations that make styling more powerful and repetitive tasks easier. It also covers using Compass, a Sass extension framework, to gain access to useful CSS3 mixins and functions.
Panels: how to fire Front-end developerKirill Borzov
This document discusses how to work with panels in Drupal, including templates, layouts, styles, responsiveness, and scripts. It is written by Kirill Borzov, a front-end developer with 7 years of experience and 3 years working specifically with Drupal panels. The document provides examples of preprocessing panels panes and layouts, discusses responsive panel implementations using plugins, and encourages writing custom scripts.
Web front end development introduction to html css and javascriptMarc Huang
This document provides an introduction to HTML, CSS, and JavaScript for building websites. It discusses how websites work by connecting clients and servers, and compares making a website to writing a book by organizing content into pages. The document then covers the basic purposes and syntax of HTML for creating page content, CSS for styling, and JavaScript for interactivity. It provides many code examples and explains common elements, properties, and methods in each language to demonstrate basic front-end web development concepts and tools.
This document summarizes best practices for managing code complexity in Drupal projects. It recommends:
- Building the data model around entities and relationships with minimal duplication and no cycles.
- Avoid hacking core/contrib modules and putting code in the database. Use entity wrappers.
- Create modules that correspond to each content type, field, and field type to keep functionality well organized.
- Structure modules by content types, fields, and functionality for good modularity.
The poem reflects on Christmas past and present, remembering the magic of Christmas from childhood. It wishes a Merry Christmas to Zachary and all, hoping the spirit of peace, brotherhood, and love that surrounded Jesus' birth also surrounds Zachary and fills his time.
This document discusses different approaches to implementing content subtyping in Drupal:
1. One content type with optional fields, which has issues around data integrity and redundancy.
2. Multiple content types duplicating common fields, making management difficult.
3. A base content type with common fields and subtypes as a reference, which provides good integrity, scalability and manageability but has challenges with forms.
The base with subtypes approach is recommended, noting potential solutions around forms and caching subtypes for performance. Modules for different inheritance approaches are also discussed but have limitations.
Up Close and Personal: How Storytelling Builds Movements - KaplanAvi Kaplan
Get up close and personal with passionate changemakers Mark Horvath of invisiblepeople.tv, Stacey Monk of Epic Change, and Estrella Rosenberg of Big Love Little Hearts, who have each harnessed the power of their own stories to successfully advocate for their causes.
How do their unique experiences enable them to effectively engage grassroots supporters? How have they used their voices and personal stories to build movements in today’s landscape of social communications? What can other changemakers and nonprofits learn from the challenges they have faced and success they have achieved?
Session Takeaways:
1) Successful movement builders use stories and personal investment to inspire change.
2) Engaging and sharing your passion across multiple channels is essential to effective nonprofit communication.
3) Leveraging social media can expand the reach of passionate voices.
http://e.myntc.zerista.com/event/member?item_id=842874
Homeschooling your kids can be effective but one size does not fit all as there are misconceptions that homeschooling produces socially awkward kids who are unprepared for college. The document expresses thanks to Tim Hawkins, Tinypic.com, and Homeschoolers.com.
1) The document provides resources for a front-end development session including working files, slides, and an agenda.
2) It reviews HTML tags, CSS selectors, the box model, positioning, and Flexbox.
3) Instructions are given to install Atom plugins and review JavaScript and JQuery before adding an Express server to a webpage.
Drupal Theme Development - DrupalCon Chicago 2011Ryan Price
This class is intended for people who know some HTML and CSS, and covers the fundamental principles of Drupal theming geared toward people who wish to take a static mockup of a site design and turn it into a Drupal theme. You will also learn about using base themes, grid-based layout and helper modules to streamline and customize your Drupal theme.
Trainer Ryan Price has built entertainment sites, social networks, and eCommerce sites for clients including Popular Science, Field and Stream and Outdoor Life magazines. With over 10 years of experience building sites with PHP and other technologies, Ryan began immersing himself in Drupal around 2006. Ryan often teaches and writes articles along with Mike Anello, and the duo is also known for producing the DrupalEasy Podcast with their host Andrew Riley.
Video at http://www.youtube.com/watch?v=HaJnhYPLvx0
Large Drupal projects will generally have a themer or five working alongside the developers, site builders and designers. Themers are the magicians who transform what Drupal wants to do into what the designer wants it to do.
Smaller projects also usually need someone on the team who can make sense of Drupal's output, knows more CSS and JS than anyone else and can configure Views with their eyes closed.
The thing is — and whisper this, if possible redundancy concerns you — we can bypass the themer entirely.
With some simple configuration, a site builder can get Drupal to output exactly the semantic, lightweight markup that any modern front-end designer would be proud of. The designer can be left alone to write the most appropriate HTML, CSS and JS, while the site builder need only choose a couple of options when putting together content types, views and panels to make Drupal behave.
A friendly developer may have to lend a hand every now and then, but that’s it. You can get rid of the themer altogether.
http://2013.drupalcamplondon.co.uk/session/death-themer
The document provides an overview of CSS (Cascading Style Sheets) methodology. It defines CSS as the language used for implementing designs on HTML documents. It then covers CSS basics including selectors, properties, conflicts resolution using specificity and cascade order. It also discusses the box model which defines how browsers handle rectangular boxes for elements. Finally, it offers some best practices tips such as resetting styles, separating content from design, and planning layout during HTML coding.
The document discusses using CSS frameworks to speed up web development by avoiding having to repeatedly write CSS resets and layout code. It describes the Blueprint CSS framework, including how it provides a grid system, typography styles, and other components out of the box. The author explains how using a framework like Blueprint CSS can save significant time over building sites from scratch each time.
How to Use the Command Line to Increase Speed of DevelopmentAcquia
In a world of beautiful graphical user interfaces (GUI), it can be easy to forget (or ignore) the comparatively ugly and boring command line. However, for those of us who have been doing web development for many years, it is often still our go-to place to get things done quickly without the distraction that a dedicated application sometimes provides. With a little bit of tweaking, the command line can actually look pretty too, while at the same time providing useful information.
In this webinar, Dave Myburgh, senior engineer at Acquia, and team lead on acquia.com, will discuss useful ways to get things done faster by using the command line in Drupal web development.
Attendees will walk away from this webinar with a deeper understanding of:
-Using Git via the command line along with the aid of some visual tweaks
-Managing Drupal sites with drush
-Using SASS and Compass in your themes
-Several small command line tweaks and commands to optimize development
This document provides an overview of layout managers and skins in Oracle ADF Faces. It discusses:
1) The benefits of using layout managers such as abstraction from HTML, consistent layout behavior across browsers, and managing browser geometry. It describes stretchable vs flowing layouts.
2) Tips for working with layout managers such as starting with a stretchable outer frame and placing flowing islands inside.
3) An introduction to skins including how they work, the artifacts that make up a skin, and how skinning differs from regular CSS. It provides examples of using different selectors to style parts of a component.
Magento x codekit x sass x compass x skeleton responsive gridArush Sehgal
A presentation by @ldn_tech_exec for #magentoLDN on extreme CSS techniques, how to set up codekit, compass and sass/scss and the skeleton responsive/adaptive framework for Magento
source code:
https://github.com/arush/mage-skeleton
This document provides tips and tricks for improving performance and user administration in Drupal. It discusses optimizing CCK fields, avoiding multiple node loads, and rewriting queries. It recommends 5 modules for user administration like Taxonomy Super Select. It also covers theming best practices like using a base theme, customizing with a child theme, and using the Less module for CSS. The Skinr module helps define reusable CSS styles. Views can be enhanced with the Cycle plugin for image rotation. Finally, it compares Panels and Areas for layouts.
Drupal's theming layer is a powerful and beautiful beast, but it requires a firm hand to really behave. New themers often start out trying to control it with a light touch and gentle strokes of CSS. Only too late do they realize their error…
All too often the result of this misguided approach is bloated and inefficient CSS and JavaScript and site out of control. By the time the themer realizes what the beast have done, it might be too late to fix.
Don't let Contrib bully you around. Grab the reins, create a frontend architecture and teach the theming layer to produce lean, extendable, high performance markup and CSS that is easy and cost-efficient to maintain.
This session is about learning to take charge.
Glen Smith discusses ways to reduce duplication in Grails user interfaces using Grails resources, Bootstrap, and Less CSS. Resources allow bundling and minimizing JavaScript and CSS, improving performance. Bootstrap provides pre-built HTML and CSS components. Less CSS extends CSS with features like variables, mixins, and nesting to reduce duplication. The talk demonstrates using these techniques and plugins to standardize fonts, layouts, forms, and navigation across a Grails application.
Advanced Front End Architecture in D8: Sass, Gulp, & Living Style GuidesAidan Foster
VIDEO RECORDING: https://www.youtube.com/watch?v=NNmYqcPam6I
This session Originally was Presented at Drupal North 2016 - Montreal, Canada.
http://www.drupalnorth.org/en/session/advanced-front-end-architecture-d8-sass-gulp-and-living-style-guides
In this advanced session we will review the front-end tools & setup we use at Foster Interactive in our Drupal themes. This suite of tools is bundled in an open-source starter kit called Mainspring.
Main-spring.io was created internally to allow us to kick off projects faster. It’s basically a clean slate where all the interesting tools and best practices we’ve observed in other open-source projects have been bundled together in a way that works with Drupal.
Mainspring has evolved to include 3 major components:
1. Gulp/Node Based Development tools to help us code faster and with less bugs.
2. Living Style guide: (Think a custom, automatically documented version of Twitter Bootstrap for each project)
3. Sass Components / Structure (Opinionated refinement of the Drupal 8 CSS coding standards)
The tools used in mainspring are all "Proudly Built Elsewhere". This session is intended to showcase what works for us. Hopefully you’ll see something interesting you can start using in your own project.
[PyConZA 2017] Web Scraping: Unleash your Internet VikingAndrew Collier
This document provides an overview of scraping web pages, including:
- Why scrape rather than use APIs
- The difference between scraping and crawling
- The anatomy of web pages including HTML, CSS, and XPath for selecting elements
- Common files like robots.txt and sitemap.xml
- Python libraries like urllib and requests for working with URLs and making HTTP requests
Css training tutorial css3 & css4 essentialsQA TrainingHub
Learn CSS - Cascading style Sheets to crate awsome looking for your general html Ui & Create responsive HTML Templates by understanding this css tutorial
Structuring your CSS for maintainability: rules and guile lines to write CSSSanjoy Kr. Paul
Structuring your CSS for maintainability: rules and guile lines to write CSS
As you start work on larger stylesheets and big projects with a team, you will discover that maintaining a huge CSS file can be challenging. So, we will go through some best practices for writing CSS that will help us to maintain the CSS project easily.
This document discusses best practices for organizing code and setting up architecture for larger frontend projects with multiple developers. It covers choosing technology stacks, code organization, coding guidelines, responsive design approaches, performance optimization, and workflows.
Display Suite is a Drupal module that allows users to take full control over how content is displayed using a drag and drop interface without having to work with template files. It provides predefined layouts and allows users to create custom layouts and view modes. Display Suite also features code fields to add custom variables and styles to control field formatting. The module is actively maintained and widely used with thousands of active sites.
The document provides guidelines for standardizing markup and CSS code, including:
1. Commenting on code blocks for HTML and CSS using consistent formats.
2. Recommendations for file naming and organization of CSS, images, and JavaScript.
3. Best practices like using a reset, sprites, minimal browser hacks, and validating code.
Must Know Postgres Extension for DBA and Developer during MigrationMydbops
Mydbops Opensource Database Meetup 16
Topic: Must-Know PostgreSQL Extensions for Developers and DBAs During Migration
Speaker: Deepak Mahto, Founder of DataCloudGaze Consulting
Date & Time: 8th June | 10 AM - 1 PM IST
Venue: Bangalore International Centre, Bangalore
Abstract: Discover how PostgreSQL extensions can be your secret weapon! This talk explores how key extensions enhance database capabilities and streamline the migration process for users moving from other relational databases like Oracle.
Key Takeaways:
* Learn about crucial extensions like oracle_fdw, pgtt, and pg_audit that ease migration complexities.
* Gain valuable strategies for implementing these extensions in PostgreSQL to achieve license freedom.
* Discover how these key extensions can empower both developers and DBAs during the migration process.
* Don't miss this chance to gain practical knowledge from an industry expert and stay updated on the latest open-source database trends.
Mydbops Managed Services specializes in taking the pain out of database management while optimizing performance. Since 2015, we have been providing top-notch support and assistance for the top three open-source databases: MySQL, MongoDB, and PostgreSQL.
Our team offers a wide range of services, including assistance, support, consulting, 24/7 operations, and expertise in all relevant technologies. We help organizations improve their database's performance, scalability, efficiency, and availability.
Contact us: info@mydbops.com
Visit: https://www.mydbops.com/
Follow us on LinkedIn: https://in.linkedin.com/company/mydbops
For more details and updates, please follow up the below links.
Meetup Page : https://www.meetup.com/mydbops-databa...
Twitter: https://twitter.com/mydbopsofficial
Blogs: https://www.mydbops.com/blog/
Facebook(Meta): https://www.facebook.com/mydbops/
Northern Engraving | Nameplate Manufacturing Process - 2024Northern Engraving
Manufacturing custom quality metal nameplates and badges involves several standard operations. Processes include sheet prep, lithography, screening, coating, punch press and inspection. All decoration is completed in the flat sheet with adhesive and tooling operations following. The possibilities for creating unique durable nameplates are endless. How will you create your brand identity? We can help!
"Choosing proper type of scaling", Olena SyrotaFwdays
Imagine an IoT processing system that is already quite mature and production-ready and for which client coverage is growing and scaling and performance aspects are life and death questions. The system has Redis, MongoDB, and stream processing based on ksqldb. In this talk, firstly, we will analyze scaling approaches and then select the proper ones for our system.
Main news related to the CCS TSI 2023 (2023/1695)Jakub Marek
An English 🇬🇧 translation of a presentation to the speech I gave about the main changes brought by CCS TSI 2023 at the biggest Czech conference on Communications and signalling systems on Railways, which was held in Clarion Hotel Olomouc from 7th to 9th November 2023 (konferenceszt.cz). Attended by around 500 participants and 200 on-line followers.
The original Czech 🇨🇿 version of the presentation can be found here: https://www.slideshare.net/slideshow/hlavni-novinky-souvisejici-s-ccs-tsi-2023-2023-1695/269688092 .
The videorecording (in Czech) from the presentation is available here: https://youtu.be/WzjJWm4IyPk?si=SImb06tuXGb30BEH .
zkStudyClub - LatticeFold: A Lattice-based Folding Scheme and its Application...Alex Pruden
Folding is a recent technique for building efficient recursive SNARKs. Several elegant folding protocols have been proposed, such as Nova, Supernova, Hypernova, Protostar, and others. However, all of them rely on an additively homomorphic commitment scheme based on discrete log, and are therefore not post-quantum secure. In this work we present LatticeFold, the first lattice-based folding protocol based on the Module SIS problem. This folding protocol naturally leads to an efficient recursive lattice-based SNARK and an efficient PCD scheme. LatticeFold supports folding low-degree relations, such as R1CS, as well as high-degree relations, such as CCS. The key challenge is to construct a secure folding protocol that works with the Ajtai commitment scheme. The difficulty, is ensuring that extracted witnesses are low norm through many rounds of folding. We present a novel technique using the sumcheck protocol to ensure that extracted witnesses are always low norm no matter how many rounds of folding are used. Our evaluation of the final proof system suggests that it is as performant as Hypernova, while providing post-quantum security.
Paper Link: https://eprint.iacr.org/2024/257
Introduction of Cybersecurity with OSS at Code Europe 2024Hiroshi SHIBATA
I develop the Ruby programming language, RubyGems, and Bundler, which are package managers for Ruby. Today, I will introduce how to enhance the security of your application using open-source software (OSS) examples from Ruby and RubyGems.
The first topic is CVE (Common Vulnerabilities and Exposures). I have published CVEs many times. But what exactly is a CVE? I'll provide a basic understanding of CVEs and explain how to detect and handle vulnerabilities in OSS.
Next, let's discuss package managers. Package managers play a critical role in the OSS ecosystem. I'll explain how to manage library dependencies in your application.
I'll share insights into how the Ruby and RubyGems core team works to keep our ecosystem safe. By the end of this talk, you'll have a better understanding of how to safeguard your code.
"NATO Hackathon Winner: AI-Powered Drug Search", Taras KlobaFwdays
This is a session that details how PostgreSQL's features and Azure AI Services can be effectively used to significantly enhance the search functionality in any application.
In this session, we'll share insights on how we used PostgreSQL to facilitate precise searches across multiple fields in our mobile application. The techniques include using LIKE and ILIKE operators and integrating a trigram-based search to handle potential misspellings, thereby increasing the search accuracy.
We'll also discuss how the azure_ai extension on PostgreSQL databases in Azure and Azure AI Services were utilized to create vectors from user input, a feature beneficial when users wish to find specific items based on text prompts. While our application's case study involves a drug search, the techniques and principles shared in this session can be adapted to improve search functionality in a wide range of applications. Join us to learn how PostgreSQL and Azure AI can be harnessed to enhance your application's search capability.
"Frontline Battles with DDoS: Best practices and Lessons Learned", Igor IvaniukFwdays
At this talk we will discuss DDoS protection tools and best practices, discuss network architectures and what AWS has to offer. Also, we will look into one of the largest DDoS attacks on Ukrainian infrastructure that happened in February 2022. We'll see, what techniques helped to keep the web resources available for Ukrainians and how AWS improved DDoS protection for all customers based on Ukraine experience
LF Energy Webinar: Carbon Data Specifications: Mechanisms to Improve Data Acc...DanBrown980551
This LF Energy webinar took place June 20, 2024. It featured:
-Alex Thornton, LF Energy
-Hallie Cramer, Google
-Daniel Roesler, UtilityAPI
-Henry Richardson, WattTime
In response to the urgency and scale required to effectively address climate change, open source solutions offer significant potential for driving innovation and progress. Currently, there is a growing demand for standardization and interoperability in energy data and modeling. Open source standards and specifications within the energy sector can also alleviate challenges associated with data fragmentation, transparency, and accessibility. At the same time, it is crucial to consider privacy and security concerns throughout the development of open source platforms.
This webinar will delve into the motivations behind establishing LF Energy’s Carbon Data Specification Consortium. It will provide an overview of the draft specifications and the ongoing progress made by the respective working groups.
Three primary specifications will be discussed:
-Discovery and client registration, emphasizing transparent processes and secure and private access
-Customer data, centering around customer tariffs, bills, energy usage, and full consumption disclosure
-Power systems data, focusing on grid data, inclusive of transmission and distribution networks, generation, intergrid power flows, and market settlement data
[OReilly Superstream] Occupy the Space: A grassroots guide to engineering (an...Jason Yip
The typical problem in product engineering is not bad strategy, so much as “no strategy”. This leads to confusion, lack of motivation, and incoherent action. The next time you look for a strategy and find an empty space, instead of waiting for it to be filled, I will show you how to fill it in yourself. If you’re wrong, it forces a correction. If you’re right, it helps create focus. I’ll share how I’ve approached this in the past, both what works and lessons for what didn’t work so well.
inQuba Webinar Mastering Customer Journey Management with Dr Graham HillLizaNolte
HERE IS YOUR WEBINAR CONTENT! 'Mastering Customer Journey Management with Dr. Graham Hill'. We hope you find the webinar recording both insightful and enjoyable.
In this webinar, we explored essential aspects of Customer Journey Management and personalization. Here’s a summary of the key insights and topics discussed:
Key Takeaways:
Understanding the Customer Journey: Dr. Hill emphasized the importance of mapping and understanding the complete customer journey to identify touchpoints and opportunities for improvement.
Personalization Strategies: We discussed how to leverage data and insights to create personalized experiences that resonate with customers.
Technology Integration: Insights were shared on how inQuba’s advanced technology can streamline customer interactions and drive operational efficiency.
Northern Engraving | Modern Metal Trim, Nameplates and Appliance PanelsNorthern Engraving
What began over 115 years ago as a supplier of precision gauges to the automotive industry has evolved into being an industry leader in the manufacture of product branding, automotive cockpit trim and decorative appliance trim. Value-added services include in-house Design, Engineering, Program Management, Test Lab and Tool Shops.
ScyllaDB is making a major architecture shift. We’re moving from vNode replication to tablets – fragments of tables that are distributed independently, enabling dynamic data distribution and extreme elasticity. In this keynote, ScyllaDB co-founder and CTO Avi Kivity explains the reason for this shift, provides a look at the implementation and roadmap, and shares how this shift benefits ScyllaDB users.
In the realm of cybersecurity, offensive security practices act as a critical shield. By simulating real-world attacks in a controlled environment, these techniques expose vulnerabilities before malicious actors can exploit them. This proactive approach allows manufacturers to identify and fix weaknesses, significantly enhancing system security.
This presentation delves into the development of a system designed to mimic Galileo's Open Service signal using software-defined radio (SDR) technology. We'll begin with a foundational overview of both Global Navigation Satellite Systems (GNSS) and the intricacies of digital signal processing.
The presentation culminates in a live demonstration. We'll showcase the manipulation of Galileo's Open Service pilot signal, simulating an attack on various software and hardware systems. This practical demonstration serves to highlight the potential consequences of unaddressed vulnerabilities, emphasizing the importance of offensive security practices in safeguarding critical infrastructure.
Freshworks Rethinks NoSQL for Rapid Scaling & Cost-EfficiencyScyllaDB
Freshworks creates AI-boosted business software that helps employees work more efficiently and effectively. Managing data across multiple RDBMS and NoSQL databases was already a challenge at their current scale. To prepare for 10X growth, they knew it was time to rethink their database strategy. Learn how they architected a solution that would simplify scaling while keeping costs under control.
4. What we will learn
Description Tools and methods
Style Preprocessor SASS
Style speed Selector matching and specificity
Structuring the Style Split and join Style files
Style building automation Makefile
Automatic Image processing ImageMagick
Multiple layouts Makefile, SASS, ImageMagick
5. When your Style gets too fat
● Repeating and
dependent values
● Style too slow
● Files too big
http://www.waltsense.com/home/2010/4/23/too-fat-to-fight.html
6. When your theme gets too heavy
● Loss of overview
● Lack of structure
● Hard to manage http://benhartnett.com.au/artworkandplay/2009/hard-walking/
8. The problem and the solution
The problem
● A specific value used
for many times.
Example: main style
color.
● A specific value used
to derive other valus.
Example: calculation of
spacing values
The solution
Preprocessor
Example: Sass
13. The problem and the solution
The problem
Big style ruleset makes
page rendering slow in a
browser.
Symptom: browser hangs
for a moment before
displaying a page
The solution
Learn how selector
matching works:
● speed
● selectivity
14. Speed: Selector matching examples
#main-navigation { } /* ID (Fastest) */
body.home #page-wrap { } /* ID */
.main-navigation { } /* Class */
ul li a.current { } /* Class *
ul { } /* Tag */
ul li a { } /* Tag */
* { } /* Universal (Slowest) */
#content [title='home'] /* Universal */
#main-nav > li { } /* Slower than it might seem */
ul#main-navigation { } /* Don't */
html body ul li a { } /* Worst */
http://css-tricks.com/efficiently-rendering-css/
15. Speed: Selector matching rules
● Matching happens from right to left
● Failing rules are quicker than matching rules
● Google: css selector speed
16. Specificity: Calculation
A selector's specificity is calculated as follows:
● count the number of ID selectors in the selector (= a)
● count the number of class selectors, attributes selectors,
and pseudo-classes in the selector (= b)
● count the number of type selectors and pseudo-elements
in the selector (= c)
● ignore the universal selector
Concatenating the three numbers a-b-c (in a number system
with a large base) gives the specificity.
http://www.w3.org/TR/css3-selectors/#specificity
18. Example: classes for Views grid
<div class=”my-grid”>
<table>
<tr class=”my-grid-tr”>
<td class=”my-grid-td”> … </td>
<td class=”my-grid-td”> … </td>
</tr>
</table>
</div>
● This is simplification
● Only most relevant bits are shown
● Default classes are stripped to minimum
● Only custom classes are used for theming
20. Symptoms
* Convoluted code* Convoluted code
* Hard to keep track* Hard to keep track
* Hard to manage* Hard to manage
* Loss of overview* Loss of overview
* Hard to read :)* Hard to read :)
22. Structuring the Style
● Definitions file
● Elements
● Structural
● Fields
● Views
● Nodes
● Pages
23. Definitions file
● Path(s)
for example:
/sites/www.example.com/files/
● Image style dimensions
matches Drupal
Configuration > Image Styles
● Image dimensions
generated from actual images
● Dimensions
Like margins, certain element widths,
different layout sizes, etc
● Colors
custom color definitions
● CSS snippets
reusable CSS code like rounded()
● Included by all other
.sass files.
● Concatenated from
pieces.
27. What is a Makefile
● Utility “make” and rules file “Makefile” are
used to do automation
● Makefile specifies rules how to make target
files and what files does it depend on
● If dependency file is newer, the target will be
remade
29. Example 1/2: variables
# Assign individual files to variables
GLOBAL = global.css
DEFS = include/defs.sass
# The variable “ELEMENTS” is assigned list of files
# with directory and without suffixes
ELEMENTS = $(addprefix elements/,
tags
admin-menu
…
feedback
)
# same for other piece-sets
STRUCTURAL = $(addprefix structural/, … )
FIELDS = $(addprefix fields/, … )
VIEWS = $(addprefix views/, … )
NODES = $(addprefix nodes/, … )
PAGES = $(addprefix pages/, … )
# all pieces
PIECES = $(ELEMENTS) $(STRUCTURAL) $(FIELDS) $(VIEWS) $(NODES) $(PAGES)
# append .css
PIECES_CSS = $(addsuffix .css, $(PIECES))
30. Example 2/2: rules
# rule to generate final .css
# target depends on all .css pieces
# if any .css is missing it will be generated
# if any .css is newer than target, then the target will be regenerated
$(GLOBAL): $(PIECES_CSS)
cat $^ > $@
# rule to compile arbitrary .sass to .css
# if any required .css is missing it will be generated from
corresponding .sass file
# if any required .css is older than corresponding .sass it will be
regenerated
%.css: %.sass
sass $< $@
# any piece .css file depends on Makefile and definitions file
# if something is changed in Makefile or in definitions
# then all required .css files will be recompiled
$(PIECES_CSS): Makefile $(DEFS)
# kill all generated stuff
clean:
rm -f $(PIECES_CSS) $(GLOBAL)
find . -name '.sass-cache' -type d -print0 | xargs -0 rm -rf
31. Automatic variables
$@
The file name of the target of the rule. ‘$@’ is the name of whichever target caused the
rule's recipe to be run.
$<
The name of the first prerequisite.
$^
The names of all the prerequisites, with spaces between them.
$*
The stem with which an implicit rule matches. In a static pattern rule, the stem is part
of the file name that matched the ‘%’ in the target pattern.
http://www.gnu.org/software/make/manual/html_node/Automatic-Variables.html
32. Execution
● Clean up all stuff from previous compilation (rarely)
shell> make clean
rm -f elements/tags.css elements/admin-menu.css
elements/feedback.css structural/a.css … global.css
find . -name '.sass-cache' -type d -print0 | xargs -0 rm -rf
● Compile your theme (constantly)
shell> make
sass elements/tags.sass elements/tags.css
sass elements/admin-menu.sass elements/admin-menu.css
sass elements/feedback.sass elements/feedback.css
sass structural/a.sass structural/a.css
…
cat elements/tags.css elements/admin-menu.css
elements/feedback.css structural/a.css … > global.css
33. Explanation
● The example above describes a way to
compile one big .css file from multitude
of .sass files. Executed by 'make'.
● It knows exactly the dependency tree and
(re)generates all necessary files when
needed.
● It has instruction how to clean up all
generated files. Executed by 'make clean'.
35. What we need
● SASS handling for environment variables
● Tool to extract image dimensions for SASS
● Image conversion
● Layout styling to individual pieces
● Layout settings to definitions file
● Layout handling to Makefile
36. Environment variables for SASS
● Create file lib/env.rb as module/plugin/lib for SASS
module Sass::Script::Functions
def env(var)
assert_type var, :String
Sass::Script::String.new(ENV[var.to_s()])
end
end
● Using the module/plugin/lib
sass … --require lib/env.rb …
37. Automated image operations
ImageMagick® is free software
suite to create, edit, compose, or
convert bitmap images.
convert – convert between image
formats as well as resize an image,
blur, crop, despeckle, dither, draw
on, flip, join, re-sample, and much
more.
identify – describe the format and
characteristics of one or more image
files.
41. Image conversion
LOGO = logo.png
PNG =
logo-wide
logo-normal
logo-narrow
DERIVATIVES = $(addsuffix .png, $(PNG))
DIMENSIONS = $(addsuffix .sass, $(PNG))
all: $(DERIVATIVES) $(DIMENSIONS)
logo-wide.png: $(LOGO)
convert $< -geometry 200x $@
logo-normal.png: $(LOGO)
convert $< -geometry 150x $@
logo-narrow.png: $(LOGO)
convert $< -geometry 100x $@
$(DERIVATIVES): Makefile
%.sass: %.png
./wh $< > $@
clean:
rm -f $(DERIVATIVES) $(DIMENSIONS)
● In image directory there is
separate Makefile.
● It deals with automatic image
conversion for different
layouts.
● Executed by 'make'.
● In this particular example
logo.png is resized for 3
different layouts.
● In addition dimensions will be
extracted for these images for
SASS inclusion.
● Should the designer change
the logo, possibly even
changing its dimensions,
'make' will handle that.
42. Layout styling to individual pieces
@import "includes/defs.sass"
@if $LAYOUT == "global"
@if $LAYOUT == "alpha-default"
#logo
display: block
background-position: center
background-repeat: no-repeat
@if $LAYOUT == "alpha-default-narrow"
#logo
width: $WIDTH_LOGO_NARROW
height: $HEIGHT_LOGO_NARROW
background-image: url($IMG + "logo-narrow.png")
@if $LAYOUT == "alpha-default-normal"
#logo
width: $WIDTH_LOGO_NORMAL
height: $HEIGHT_LOGO_NORMAL
background-image: url($IMG + "logo-normal.png")
@if $LAYOUT == "alpha-default-wide"
#logo
width: $WIDTH_LOGO_WIDE
height: $HEIGHT_LOGO_WIDE
background-image: url($IMG + "logo-wide.png")
● This SASS compiles into 4 CSS
files according to “if” statement.
● It styles #logo element for different
layouts.
● It uses the logo image's
dimensions which is set up
automatically.
● It uses $IMG to save you from
carpal tunnel syndrome.
43. Layout settings to definitions file
● Common definitions file includes all image dimensions which are used in
any layout
● SASS variable LAYOUT will be assigned according to environment
variable LAYOUT:
$LAYOUT: env(LAYOUT)
● Layout-specific definitions
$SPACER: 0
@if $LAYOUT == "global"
@if $LAYOUT == "alpha-default"
@if $LAYOUT == "alpha-default-narrow"
$SPACER: 10px
@if $LAYOUT == "alpha-default-normal"
$SPACER: 15px
@if $LAYOUT == "alpha-default-wide"
$SPACER: 20px
This SASS code assigns layout-
dependent value(s) to variable(s).
45. Layout handling to Makefile
TARGET = $(LAYOUT).css
LAYOUTS =
global
alpha-default
alpha-default-narrow
alpha-default-normal
alpha-default-wide
PIECES_CSS = $(addsuffix .$(LAYOUT).css, $(PIECES))
all:
for layout in $(LAYOUTS); do
make $$layout.css -e LAYOUT=$$layout
|| exit 1 ;
done
$(TARGET): $(PIECES_CSS)
cat $^ > $@
%.$(LAYOUT).css: %.sass
LAYOUT=$(LAYOUT)
sass --require lib/env.rb $< $@
$(PIECES_CSS): Makefile $(DEFS)
clean:
for layout in $(LAYOUTS); do
make clean-$$layout -e LAYOUT=$$layout
|| exit 1 ;
done
clean-$(LAYOUT):
rm -f $(PIECES_CSS)
rm -f $(TARGET)
● This Makefile is not complete
● It is extension to earlier one
● This Makefile works by using environment
variable LAYOUT
● This makefile works by executing itself in
different context (env LAYOUT value).
● The environment variable LAYOUT is
available as Makefile variable $(LAYOUT)
● This Makefile produces one stylesheet for
each layout named as layout.css
● Each layout.css is concatenation of css
pieces named as name.layout.css which
are compiled from name.sass
46. Difference between
the easy way and the hard way
● Speed difference ca 10x
● If (easy_way.compile() == too_slow)
then goto hard_way;
● Remember that during theming process
compilation is very frequent procedure
47. What did we learn
Description Tools and methods
Style Preprocessor SASS
Style speed Selector matching and specificity
Structuring the Style Split and join Style files
Style building automation Make / Makefile
Automatic Image processing ImageMagick
Multiple layouts Make / Makefile, SASS, ImageMagick