SlideShare a Scribd company logo
LESS, JS & WP
for #WPN12
RUSSELL FAIR
developer / open source code junkie
r@q21.co
1 LESS joke
LESS != 'more';
LESS $beer != 'happy coder';
LESS $money != 'happy coder';
LESS $time_writing_css == 'happy coder';
doing LESS work is good
saves time
easier to navigate
#!watch
drawbacks? slow,
more variables = LESS code
@color1: #e4e9c2;
@padding1: 1%;
body { background: @color1; }
.hfeed {
     background:@color1;
     padding:@padding1;
}
custom LESS functions
.recolor( @color4:purple ) {
      body.blog {
           .hfeed {
                 background:@color4;
           }
      }
}
.recolor();
native LESS functions
body.blog {
     background: saturate(@color2, 90%);
}
.hfeed a {
     color: spin(@color2, 20);
}
more native LESS functions
.hentry:nth-child(3n+1) {
      background: lighten( @color2 , 20% );
}
.hentry:nth-child(3n+2) {
      background: darken( @color2 , 5% );
}
.hentry:nth-child(3n+3) {
      background: saturate( spin( @color3, -50
), 30% );
}
LESS math
.multiplication { margin: @padding1 * 2; }
.division { margin: @padding2 / 2; }
.addition(@width1, @width2) {
      width: @width1 + @width2;
}
.subtraction(@width1, @width2) {
      width: @width1 - @width2;
}
Less js-&-wp
Less js-&-wp
Less js-&-wp
Less js-&-wp
Less js-&-wp

More Related Content

Viewers also liked

Make WordPress Fit: The Cinderella Shoe Approach to Custom Theming
Make WordPress Fit: The Cinderella Shoe Approach to Custom ThemingMake WordPress Fit: The Cinderella Shoe Approach to Custom Theming
Make WordPress Fit: The Cinderella Shoe Approach to Custom Theming
IntrepidRealist
 
Wordpress para seus Clientes
Wordpress para seus ClientesWordpress para seus Clientes
Wordpress para seus Clientes
Thiago Simões (Ted k')
 
WordPress as a CMS
WordPress as a CMSWordPress as a CMS
WordPress as a CMS
Matthew Vaccaro
 
Quanto è sicuro il tuo wordpress?
Quanto è sicuro il tuo wordpress? Quanto è sicuro il tuo wordpress?
Quanto è sicuro il tuo wordpress?
GGDBologna
 
Building Your First Widget
Building Your First WidgetBuilding Your First Widget
Building Your First Widget
Chris Wilcoxson
 
WordPress 101 - Foundation Friday at WordCamp Chicago 2014 #WCChi
WordPress 101 - Foundation Friday at WordCamp Chicago 2014 #WCChiWordPress 101 - Foundation Friday at WordCamp Chicago 2014 #WCChi
WordPress 101 - Foundation Friday at WordCamp Chicago 2014 #WCChi
Shanta Nathwani
 
Getting an eCommerce Site Running in 30 Minutes
Getting an eCommerce Site Running in 30 MinutesGetting an eCommerce Site Running in 30 Minutes
Getting an eCommerce Site Running in 30 Minutes
Apptivo
 
Scoping and Estimating WordPress Projects as an Agency
Scoping and Estimating WordPress Projects as an AgencyScoping and Estimating WordPress Projects as an Agency
Scoping and Estimating WordPress Projects as an Agency
Kara Hansen
 
Work, Life, Blog Balance
Work, Life, Blog BalanceWork, Life, Blog Balance
Work, Life, Blog Balance
Alicia Murray
 
Introduction to WordPress Multisite
Introduction to WordPress MultisiteIntroduction to WordPress Multisite
Introduction to WordPress Multisite
Craig Taylor
 
Congrats. You're having a WordPress Site. WordCamp Philly
Congrats. You're having a WordPress Site. WordCamp PhillyCongrats. You're having a WordPress Site. WordCamp Philly
Congrats. You're having a WordPress Site. WordCamp Philly
Trailer Trash Design
 
Como oferecer boas experiências online com a criação de sites de qualidade - ...
Como oferecer boas experiências online com a criação de sites de qualidade - ...Como oferecer boas experiências online com a criação de sites de qualidade - ...
Como oferecer boas experiências online com a criação de sites de qualidade - ...
Keyla Silva
 
WorryProof WordPress - Backup Strategies for Your Web Site
WorryProof WordPress - Backup Strategies for Your Web SiteWorryProof WordPress - Backup Strategies for Your Web Site
WorryProof WordPress - Backup Strategies for Your Web Site
Nathan Ingram
 
Testing Made Easy
Testing Made EasyTesting Made Easy
Testing Made Easy
Micah Wood
 
CSI: WordPress -- Getting Into the Guts
CSI: WordPress -- Getting Into the GutsCSI: WordPress -- Getting Into the Guts
CSI: WordPress -- Getting Into the Guts
Dougal Campbell
 
Using Web Fonts in WordPress
Using Web Fonts in WordPress Using Web Fonts in WordPress
Using Web Fonts in WordPress
Tadpole Collective
 
WordPress End-User Security - WordCamp Las Vegas 2011
WordPress End-User Security - WordCamp Las Vegas 2011WordPress End-User Security - WordCamp Las Vegas 2011
WordPress End-User Security - WordCamp Las Vegas 2011
Dre Armeda
 
Ten Things You Should Know About WordPress
Ten Things You Should Know About WordPressTen Things You Should Know About WordPress
Ten Things You Should Know About WordPress
sereedmedia
 
Acessibilidade Web agora é obrigatória. Estamos preparados?
Acessibilidade Web agora é obrigatória. Estamos preparados?Acessibilidade Web agora é obrigatória. Estamos preparados?
Acessibilidade Web agora é obrigatória. Estamos preparados?
Hans Mösl
 
Rapid application development for WordPress using AWF
Rapid application development for WordPress using AWFRapid application development for WordPress using AWF
Rapid application development for WordPress using AWF
Tim Plummer
 

Viewers also liked (20)

Make WordPress Fit: The Cinderella Shoe Approach to Custom Theming
Make WordPress Fit: The Cinderella Shoe Approach to Custom ThemingMake WordPress Fit: The Cinderella Shoe Approach to Custom Theming
Make WordPress Fit: The Cinderella Shoe Approach to Custom Theming
 
Wordpress para seus Clientes
Wordpress para seus ClientesWordpress para seus Clientes
Wordpress para seus Clientes
 
WordPress as a CMS
WordPress as a CMSWordPress as a CMS
WordPress as a CMS
 
Quanto è sicuro il tuo wordpress?
Quanto è sicuro il tuo wordpress? Quanto è sicuro il tuo wordpress?
Quanto è sicuro il tuo wordpress?
 
Building Your First Widget
Building Your First WidgetBuilding Your First Widget
Building Your First Widget
 
WordPress 101 - Foundation Friday at WordCamp Chicago 2014 #WCChi
WordPress 101 - Foundation Friday at WordCamp Chicago 2014 #WCChiWordPress 101 - Foundation Friday at WordCamp Chicago 2014 #WCChi
WordPress 101 - Foundation Friday at WordCamp Chicago 2014 #WCChi
 
Getting an eCommerce Site Running in 30 Minutes
Getting an eCommerce Site Running in 30 MinutesGetting an eCommerce Site Running in 30 Minutes
Getting an eCommerce Site Running in 30 Minutes
 
Scoping and Estimating WordPress Projects as an Agency
Scoping and Estimating WordPress Projects as an AgencyScoping and Estimating WordPress Projects as an Agency
Scoping and Estimating WordPress Projects as an Agency
 
Work, Life, Blog Balance
Work, Life, Blog BalanceWork, Life, Blog Balance
Work, Life, Blog Balance
 
Introduction to WordPress Multisite
Introduction to WordPress MultisiteIntroduction to WordPress Multisite
Introduction to WordPress Multisite
 
Congrats. You're having a WordPress Site. WordCamp Philly
Congrats. You're having a WordPress Site. WordCamp PhillyCongrats. You're having a WordPress Site. WordCamp Philly
Congrats. You're having a WordPress Site. WordCamp Philly
 
Como oferecer boas experiências online com a criação de sites de qualidade - ...
Como oferecer boas experiências online com a criação de sites de qualidade - ...Como oferecer boas experiências online com a criação de sites de qualidade - ...
Como oferecer boas experiências online com a criação de sites de qualidade - ...
 
WorryProof WordPress - Backup Strategies for Your Web Site
WorryProof WordPress - Backup Strategies for Your Web SiteWorryProof WordPress - Backup Strategies for Your Web Site
WorryProof WordPress - Backup Strategies for Your Web Site
 
Testing Made Easy
Testing Made EasyTesting Made Easy
Testing Made Easy
 
CSI: WordPress -- Getting Into the Guts
CSI: WordPress -- Getting Into the GutsCSI: WordPress -- Getting Into the Guts
CSI: WordPress -- Getting Into the Guts
 
Using Web Fonts in WordPress
Using Web Fonts in WordPress Using Web Fonts in WordPress
Using Web Fonts in WordPress
 
WordPress End-User Security - WordCamp Las Vegas 2011
WordPress End-User Security - WordCamp Las Vegas 2011WordPress End-User Security - WordCamp Las Vegas 2011
WordPress End-User Security - WordCamp Las Vegas 2011
 
Ten Things You Should Know About WordPress
Ten Things You Should Know About WordPressTen Things You Should Know About WordPress
Ten Things You Should Know About WordPress
 
Acessibilidade Web agora é obrigatória. Estamos preparados?
Acessibilidade Web agora é obrigatória. Estamos preparados?Acessibilidade Web agora é obrigatória. Estamos preparados?
Acessibilidade Web agora é obrigatória. Estamos preparados?
 
Rapid application development for WordPress using AWF
Rapid application development for WordPress using AWFRapid application development for WordPress using AWF
Rapid application development for WordPress using AWF
 

Similar to Less js-&-wp

Do more with {less}
Do more with {less}Do more with {less}
Do more with {less}
Jesper Wøldiche
 
One Sass File, So Many Sites
One Sass File, So Many SitesOne Sass File, So Many Sites
One Sass File, So Many Sites
Mina Markham
 
LESS is More
LESS is MoreLESS is More
LESS is More
jsmith92
 
Doing More With Less
Doing More With LessDoing More With Less
Doing More With Less
David Engel
 
Building an e:commerce site with PHP
Building an e:commerce site with PHPBuilding an e:commerce site with PHP
Building an e:commerce site with PHP
webhostingguy
 
Brian Hoke: WordCamp Toronto 2014 Presentation "Sass & WordPress"
Brian Hoke: WordCamp Toronto 2014 Presentation "Sass & WordPress"Brian Hoke: WordCamp Toronto 2014 Presentation "Sass & WordPress"
Brian Hoke: WordCamp Toronto 2014 Presentation "Sass & WordPress"
bentleyhoke
 
Less & Sass
Less & SassLess & Sass
Work and play with SASS & Compass
Work and play with SASS & CompassWork and play with SASS & Compass
Work and play with SASS & Compass
Andreas Dantz
 
CoffeeScript, An Introduction for Nodejs developers
CoffeeScript, An Introduction for Nodejs developersCoffeeScript, An Introduction for Nodejs developers
CoffeeScript, An Introduction for Nodejs developers
Mehdi Valikhani
 
Less
LessLess
PSGI and Plack from first principles
PSGI and Plack from first principlesPSGI and Plack from first principles
PSGI and Plack from first principles
Perl Careers
 
Less css
Less cssLess css
Less css
Bill Chea
 
Phphacku iitd
Phphacku iitdPhphacku iitd
Phphacku iitd
Sorabh Jain
 
Advanced Technology for Web Application Design
Advanced Technology for Web Application DesignAdvanced Technology for Web Application Design
Advanced Technology for Web Application Design
Bryce Kerley
 
Using SASS in the WordPress environment - Ran Bar Zik
Using SASS in the WordPress environment - Ran Bar ZikUsing SASS in the WordPress environment - Ran Bar Zik
Using SASS in the WordPress environment - Ran Bar Zik
Miriam Schwab
 
Perl on Amazon Elastic MapReduce
Perl on Amazon Elastic MapReducePerl on Amazon Elastic MapReduce
Perl on Amazon Elastic MapReduce
Pedro Figueiredo
 
Introduction to LESS
Introduction to LESSIntroduction to LESS
Introduction to LESS
Manish Shekhawat
 
Your Business. Your Language. Your Code - dpc13
Your Business. Your Language. Your Code - dpc13Your Business. Your Language. Your Code - dpc13
Your Business. Your Language. Your Code - dpc13
Stephan Hochdörfer
 
Programming For Designers V3
Programming For Designers V3Programming For Designers V3
Programming For Designers V3
sqoo
 
Going crazy with Node.JS and CakePHP
Going crazy with Node.JS and CakePHPGoing crazy with Node.JS and CakePHP
Going crazy with Node.JS and CakePHP
Mariano Iglesias
 

Similar to Less js-&-wp (20)

Do more with {less}
Do more with {less}Do more with {less}
Do more with {less}
 
One Sass File, So Many Sites
One Sass File, So Many SitesOne Sass File, So Many Sites
One Sass File, So Many Sites
 
LESS is More
LESS is MoreLESS is More
LESS is More
 
Doing More With Less
Doing More With LessDoing More With Less
Doing More With Less
 
Building an e:commerce site with PHP
Building an e:commerce site with PHPBuilding an e:commerce site with PHP
Building an e:commerce site with PHP
 
Brian Hoke: WordCamp Toronto 2014 Presentation "Sass & WordPress"
Brian Hoke: WordCamp Toronto 2014 Presentation "Sass & WordPress"Brian Hoke: WordCamp Toronto 2014 Presentation "Sass & WordPress"
Brian Hoke: WordCamp Toronto 2014 Presentation "Sass & WordPress"
 
Less & Sass
Less & SassLess & Sass
Less & Sass
 
Work and play with SASS & Compass
Work and play with SASS & CompassWork and play with SASS & Compass
Work and play with SASS & Compass
 
CoffeeScript, An Introduction for Nodejs developers
CoffeeScript, An Introduction for Nodejs developersCoffeeScript, An Introduction for Nodejs developers
CoffeeScript, An Introduction for Nodejs developers
 
Less
LessLess
Less
 
PSGI and Plack from first principles
PSGI and Plack from first principlesPSGI and Plack from first principles
PSGI and Plack from first principles
 
Less css
Less cssLess css
Less css
 
Phphacku iitd
Phphacku iitdPhphacku iitd
Phphacku iitd
 
Advanced Technology for Web Application Design
Advanced Technology for Web Application DesignAdvanced Technology for Web Application Design
Advanced Technology for Web Application Design
 
Using SASS in the WordPress environment - Ran Bar Zik
Using SASS in the WordPress environment - Ran Bar ZikUsing SASS in the WordPress environment - Ran Bar Zik
Using SASS in the WordPress environment - Ran Bar Zik
 
Perl on Amazon Elastic MapReduce
Perl on Amazon Elastic MapReducePerl on Amazon Elastic MapReduce
Perl on Amazon Elastic MapReduce
 
Introduction to LESS
Introduction to LESSIntroduction to LESS
Introduction to LESS
 
Your Business. Your Language. Your Code - dpc13
Your Business. Your Language. Your Code - dpc13Your Business. Your Language. Your Code - dpc13
Your Business. Your Language. Your Code - dpc13
 
Programming For Designers V3
Programming For Designers V3Programming For Designers V3
Programming For Designers V3
 
Going crazy with Node.JS and CakePHP
Going crazy with Node.JS and CakePHPGoing crazy with Node.JS and CakePHP
Going crazy with Node.JS and CakePHP
 

More from rfair404

Gotta have vs must use plugins for WordPress multisite
Gotta have vs must use plugins for WordPress multisiteGotta have vs must use plugins for WordPress multisite
Gotta have vs must use plugins for WordPress multisite
rfair404
 
Front End Publishing for WordPress
Front End Publishing for WordPressFront End Publishing for WordPress
Front End Publishing for WordPress
rfair404
 
WordPress Child Themes
WordPress Child ThemesWordPress Child Themes
WordPress Child Themes
rfair404
 
Creating seo blogposts
Creating seo blogpostsCreating seo blogposts
Creating seo blogposts
rfair404
 
Creating a Business Plan for a fake blog
Creating a Business Plan for a fake blogCreating a Business Plan for a fake blog
Creating a Business Plan for a fake blog
rfair404
 
WordPress 3.0 and BuddyPress
WordPress 3.0 and BuddyPressWordPress 3.0 and BuddyPress
WordPress 3.0 and BuddyPress
rfair404
 

More from rfair404 (6)

Gotta have vs must use plugins for WordPress multisite
Gotta have vs must use plugins for WordPress multisiteGotta have vs must use plugins for WordPress multisite
Gotta have vs must use plugins for WordPress multisite
 
Front End Publishing for WordPress
Front End Publishing for WordPressFront End Publishing for WordPress
Front End Publishing for WordPress
 
WordPress Child Themes
WordPress Child ThemesWordPress Child Themes
WordPress Child Themes
 
Creating seo blogposts
Creating seo blogpostsCreating seo blogposts
Creating seo blogposts
 
Creating a Business Plan for a fake blog
Creating a Business Plan for a fake blogCreating a Business Plan for a fake blog
Creating a Business Plan for a fake blog
 
WordPress 3.0 and BuddyPress
WordPress 3.0 and BuddyPressWordPress 3.0 and BuddyPress
WordPress 3.0 and BuddyPress
 

Recently uploaded

AppSec PNW: Android and iOS Application Security with MobSF
AppSec PNW: Android and iOS Application Security with MobSFAppSec PNW: Android and iOS Application Security with MobSF
AppSec PNW: Android and iOS Application Security with MobSF
Ajin Abraham
 
Your One-Stop Shop for Python Success: Top 10 US Python Development Providers
Your One-Stop Shop for Python Success: Top 10 US Python Development ProvidersYour One-Stop Shop for Python Success: Top 10 US Python Development Providers
Your One-Stop Shop for Python Success: Top 10 US Python Development Providers
akankshawande
 
“Temporal Event Neural Networks: A More Efficient Alternative to the Transfor...
“Temporal Event Neural Networks: A More Efficient Alternative to the Transfor...“Temporal Event Neural Networks: A More Efficient Alternative to the Transfor...
“Temporal Event Neural Networks: A More Efficient Alternative to the Transfor...
Edge AI and Vision Alliance
 
Session 1 - Intro to Robotic Process Automation.pdf
Session 1 - Intro to Robotic Process Automation.pdfSession 1 - Intro to Robotic Process Automation.pdf
Session 1 - Intro to Robotic Process Automation.pdf
UiPathCommunity
 
Introduction of Cybersecurity with OSS at Code Europe 2024
Introduction of Cybersecurity with OSS  at Code Europe 2024Introduction of Cybersecurity with OSS  at Code Europe 2024
Introduction of Cybersecurity with OSS at Code Europe 2024
Hiroshi SHIBATA
 
Dandelion Hashtable: beyond billion requests per second on a commodity server
Dandelion Hashtable: beyond billion requests per second on a commodity serverDandelion Hashtable: beyond billion requests per second on a commodity server
Dandelion Hashtable: beyond billion requests per second on a commodity server
Antonios Katsarakis
 
9 CEO's who hit $100m ARR Share Their Top Growth Tactics Nathan Latka, Founde...
9 CEO's who hit $100m ARR Share Their Top Growth Tactics Nathan Latka, Founde...9 CEO's who hit $100m ARR Share Their Top Growth Tactics Nathan Latka, Founde...
9 CEO's who hit $100m ARR Share Their Top Growth Tactics Nathan Latka, Founde...
saastr
 
Taking AI to the Next Level in Manufacturing.pdf
Taking AI to the Next Level in Manufacturing.pdfTaking AI to the Next Level in Manufacturing.pdf
Taking AI to the Next Level in Manufacturing.pdf
ssuserfac0301
 
Apps Break Data
Apps Break DataApps Break Data
Apps Break Data
Ivo Velitchkov
 
A Deep Dive into ScyllaDB's Architecture
A Deep Dive into ScyllaDB's ArchitectureA Deep Dive into ScyllaDB's Architecture
A Deep Dive into ScyllaDB's Architecture
ScyllaDB
 
High performance Serverless Java on AWS- GoTo Amsterdam 2024
High performance Serverless Java on AWS- GoTo Amsterdam 2024High performance Serverless Java on AWS- GoTo Amsterdam 2024
High performance Serverless Java on AWS- GoTo Amsterdam 2024
Vadym Kazulkin
 
Astute Business Solutions | Oracle Cloud Partner |
Astute Business Solutions | Oracle Cloud Partner |Astute Business Solutions | Oracle Cloud Partner |
Astute Business Solutions | Oracle Cloud Partner |
AstuteBusiness
 
Biomedical Knowledge Graphs for Data Scientists and Bioinformaticians
Biomedical Knowledge Graphs for Data Scientists and BioinformaticiansBiomedical Knowledge Graphs for Data Scientists and Bioinformaticians
Biomedical Knowledge Graphs for Data Scientists and Bioinformaticians
Neo4j
 
GNSS spoofing via SDR (Criptored Talks 2024)
GNSS spoofing via SDR (Criptored Talks 2024)GNSS spoofing via SDR (Criptored Talks 2024)
GNSS spoofing via SDR (Criptored Talks 2024)
Javier Junquera
 
Skybuffer SAM4U tool for SAP license adoption
Skybuffer SAM4U tool for SAP license adoptionSkybuffer SAM4U tool for SAP license adoption
Skybuffer SAM4U tool for SAP license adoption
Tatiana Kojar
 
Christine's Product Research Presentation.pptx
Christine's Product Research Presentation.pptxChristine's Product Research Presentation.pptx
Christine's Product Research Presentation.pptx
christinelarrosa
 
Overcoming the PLG Trap: Lessons from Canva's Head of Sales & Head of EMEA Da...
Overcoming the PLG Trap: Lessons from Canva's Head of Sales & Head of EMEA Da...Overcoming the PLG Trap: Lessons from Canva's Head of Sales & Head of EMEA Da...
Overcoming the PLG Trap: Lessons from Canva's Head of Sales & Head of EMEA Da...
saastr
 
Connector Corner: Seamlessly power UiPath Apps, GenAI with prebuilt connectors
Connector Corner: Seamlessly power UiPath Apps, GenAI with prebuilt connectorsConnector Corner: Seamlessly power UiPath Apps, GenAI with prebuilt connectors
Connector Corner: Seamlessly power UiPath Apps, GenAI with prebuilt connectors
DianaGray10
 
Christine's Supplier Sourcing Presentaion.pptx
Christine's Supplier Sourcing Presentaion.pptxChristine's Supplier Sourcing Presentaion.pptx
Christine's Supplier Sourcing Presentaion.pptx
christinelarrosa
 
Northern Engraving | Modern Metal Trim, Nameplates and Appliance Panels
Northern Engraving | Modern Metal Trim, Nameplates and Appliance PanelsNorthern Engraving | Modern Metal Trim, Nameplates and Appliance Panels
Northern Engraving | Modern Metal Trim, Nameplates and Appliance Panels
Northern Engraving
 

Recently uploaded (20)

AppSec PNW: Android and iOS Application Security with MobSF
AppSec PNW: Android and iOS Application Security with MobSFAppSec PNW: Android and iOS Application Security with MobSF
AppSec PNW: Android and iOS Application Security with MobSF
 
Your One-Stop Shop for Python Success: Top 10 US Python Development Providers
Your One-Stop Shop for Python Success: Top 10 US Python Development ProvidersYour One-Stop Shop for Python Success: Top 10 US Python Development Providers
Your One-Stop Shop for Python Success: Top 10 US Python Development Providers
 
“Temporal Event Neural Networks: A More Efficient Alternative to the Transfor...
“Temporal Event Neural Networks: A More Efficient Alternative to the Transfor...“Temporal Event Neural Networks: A More Efficient Alternative to the Transfor...
“Temporal Event Neural Networks: A More Efficient Alternative to the Transfor...
 
Session 1 - Intro to Robotic Process Automation.pdf
Session 1 - Intro to Robotic Process Automation.pdfSession 1 - Intro to Robotic Process Automation.pdf
Session 1 - Intro to Robotic Process Automation.pdf
 
Introduction of Cybersecurity with OSS at Code Europe 2024
Introduction of Cybersecurity with OSS  at Code Europe 2024Introduction of Cybersecurity with OSS  at Code Europe 2024
Introduction of Cybersecurity with OSS at Code Europe 2024
 
Dandelion Hashtable: beyond billion requests per second on a commodity server
Dandelion Hashtable: beyond billion requests per second on a commodity serverDandelion Hashtable: beyond billion requests per second on a commodity server
Dandelion Hashtable: beyond billion requests per second on a commodity server
 
9 CEO's who hit $100m ARR Share Their Top Growth Tactics Nathan Latka, Founde...
9 CEO's who hit $100m ARR Share Their Top Growth Tactics Nathan Latka, Founde...9 CEO's who hit $100m ARR Share Their Top Growth Tactics Nathan Latka, Founde...
9 CEO's who hit $100m ARR Share Their Top Growth Tactics Nathan Latka, Founde...
 
Taking AI to the Next Level in Manufacturing.pdf
Taking AI to the Next Level in Manufacturing.pdfTaking AI to the Next Level in Manufacturing.pdf
Taking AI to the Next Level in Manufacturing.pdf
 
Apps Break Data
Apps Break DataApps Break Data
Apps Break Data
 
A Deep Dive into ScyllaDB's Architecture
A Deep Dive into ScyllaDB's ArchitectureA Deep Dive into ScyllaDB's Architecture
A Deep Dive into ScyllaDB's Architecture
 
High performance Serverless Java on AWS- GoTo Amsterdam 2024
High performance Serverless Java on AWS- GoTo Amsterdam 2024High performance Serverless Java on AWS- GoTo Amsterdam 2024
High performance Serverless Java on AWS- GoTo Amsterdam 2024
 
Astute Business Solutions | Oracle Cloud Partner |
Astute Business Solutions | Oracle Cloud Partner |Astute Business Solutions | Oracle Cloud Partner |
Astute Business Solutions | Oracle Cloud Partner |
 
Biomedical Knowledge Graphs for Data Scientists and Bioinformaticians
Biomedical Knowledge Graphs for Data Scientists and BioinformaticiansBiomedical Knowledge Graphs for Data Scientists and Bioinformaticians
Biomedical Knowledge Graphs for Data Scientists and Bioinformaticians
 
GNSS spoofing via SDR (Criptored Talks 2024)
GNSS spoofing via SDR (Criptored Talks 2024)GNSS spoofing via SDR (Criptored Talks 2024)
GNSS spoofing via SDR (Criptored Talks 2024)
 
Skybuffer SAM4U tool for SAP license adoption
Skybuffer SAM4U tool for SAP license adoptionSkybuffer SAM4U tool for SAP license adoption
Skybuffer SAM4U tool for SAP license adoption
 
Christine's Product Research Presentation.pptx
Christine's Product Research Presentation.pptxChristine's Product Research Presentation.pptx
Christine's Product Research Presentation.pptx
 
Overcoming the PLG Trap: Lessons from Canva's Head of Sales & Head of EMEA Da...
Overcoming the PLG Trap: Lessons from Canva's Head of Sales & Head of EMEA Da...Overcoming the PLG Trap: Lessons from Canva's Head of Sales & Head of EMEA Da...
Overcoming the PLG Trap: Lessons from Canva's Head of Sales & Head of EMEA Da...
 
Connector Corner: Seamlessly power UiPath Apps, GenAI with prebuilt connectors
Connector Corner: Seamlessly power UiPath Apps, GenAI with prebuilt connectorsConnector Corner: Seamlessly power UiPath Apps, GenAI with prebuilt connectors
Connector Corner: Seamlessly power UiPath Apps, GenAI with prebuilt connectors
 
Christine's Supplier Sourcing Presentaion.pptx
Christine's Supplier Sourcing Presentaion.pptxChristine's Supplier Sourcing Presentaion.pptx
Christine's Supplier Sourcing Presentaion.pptx
 
Northern Engraving | Modern Metal Trim, Nameplates and Appliance Panels
Northern Engraving | Modern Metal Trim, Nameplates and Appliance PanelsNorthern Engraving | Modern Metal Trim, Nameplates and Appliance Panels
Northern Engraving | Modern Metal Trim, Nameplates and Appliance Panels
 

Less js-&-wp

  • 1. LESS, JS & WP for #WPN12
  • 2. RUSSELL FAIR developer / open source code junkie r@q21.co
  • 3.
  • 4. 1 LESS joke LESS != 'more'; LESS $beer != 'happy coder'; LESS $money != 'happy coder'; LESS $time_writing_css == 'happy coder';
  • 5.
  • 6.
  • 7. doing LESS work is good saves time easier to navigate #!watch drawbacks? slow,
  • 8. more variables = LESS code @color1: #e4e9c2; @padding1: 1%; body { background: @color1; } .hfeed { background:@color1; padding:@padding1; }
  • 9.
  • 10.
  • 11.
  • 12. custom LESS functions .recolor( @color4:purple ) { body.blog { .hfeed { background:@color4; } } } .recolor();
  • 13. native LESS functions body.blog { background: saturate(@color2, 90%); } .hfeed a { color: spin(@color2, 20); }
  • 14. more native LESS functions .hentry:nth-child(3n+1) { background: lighten( @color2 , 20% ); } .hentry:nth-child(3n+2) { background: darken( @color2 , 5% ); } .hentry:nth-child(3n+3) { background: saturate( spin( @color3, -50 ), 30% ); }
  • 15. LESS math .multiplication { margin: @padding1 * 2; } .division { margin: @padding2 / 2; } .addition(@width1, @width2) { width: @width1 + @width2; } .subtraction(@width1, @width2) { width: @width1 - @width2; }