[{"data":1,"prerenderedAt":860},["ShallowReactive",2],{"article-bootstrap-with-less-part-2":3},{"article":4,"tags":334,"previous":335,"next":801},{"id":5,"title":6,"author":7,"body":8,"createdAt":7,"description":326,"extension":327,"img":7,"meta":328,"navigation":329,"path":330,"seo":331,"stem":332,"tags":7,"updatedAt":7,"__hash__":333},"articles\u002Farticles\u002Fbootstrap-with-less-part-2.md","Bootstrap With Less Part 2",null,{"type":9,"value":10,"toc":324},"minimark",[11,14,31,38,40,49,52,55,58,64,72,75,78,81,89,92,98,101,106,112,307,310,317,320],[12,13],"hr",{},[15,16,17,18,21,22,24,25,27,28,30],"p",{},"title: Bootstrap with LESS (Part 2)",[19,20],"br",{},"\ndescription: CSS has become complex, lets figure it out\ncreatedAt: 2015-06-05T11:07:35.2100000-04:00\nupdatedAt: 2015-06-05T11:07:35.2100000-04:00\nimg: \u002Farticles\u002Fimages\u002Fwindows-live-writer-bootstrap-with-less-part-2_11b1b-grunt_thumb.png",[19,23],{},"\nauthor:",[19,26],{},"\nname: David",[19,29],{},"\ntags:",[32,33,34],"ul",{},[35,36,37],"li",{},"aspnet",[12,39],{},[15,41,42,43,48],{},"Ok, so how did css become so complex and what the heck is ",[44,45,47],"a",{"href":46},"http:\u002F\u002Fgruntjs.com\u002F","Grunt","? Grunt is a task runner.  There are a number of open source task runners.  Grunt is just one of the more popular ones.  In our scenario we will be using Grunt (a task runner) to convert less into css as well as to uglify and minify and copy files to different directories.",[15,50,51],{},"The following are steps that I recently used to setup our environment to edit the most recent release of Bootstrap (3.x) while taking advantage of all the existing Less files.  Grunt will automate a number of tasks for us.  In addition the details below will setup a Visual Studio 2013 environment to use Grunt to build and deploy our Bootstrap files.",[15,53,54],{},"1.) Create Empty MVC project",[15,56,57],{},"2.) Include bootstrap files into project (all folders and files when unzipping bootstrap source) i.e. dist, docs, fonts, grunt, js, less etc. Note: do not include node_modules  I had issues with long path with one of the node modules (besides these will be downloaded automatically after install)",[59,60],"img",{"src":61,"border":62,"alt":63,"title":63},"\u002Farticles\u002Fimages\u002Fwindows-live-writer-bootstrap-with-less-part-2_715f-solutionexplorer_thumb.jpg",0,"solutionexplorer",[15,65,66,67,71],{},"3.) Ensure you have ",[44,68,70],{"href":69},"https:\u002F\u002Fnodejs.org\u002F","node.js"," installed on your workstation.   Node what is node…is a open source cross-platform environment for easily building fast, scalable network applications.  Node.js applications are written in JavaScript and can be run within the runtime on OS X, Windows, Linux etc.  However in our usage we will be using this platform to download install other JavaScript applications.",[15,73,74],{},"4.) Open a command prompt to your project location and run > npm install (this will read the grunt packages json file and download necessary modules).  As information, npm is short for Node Package Manager.  NPM is to Node as Nuget is to Visual Studio.  That is a good way of thinking about it.",[15,76,77],{},"5.) At the command prompt > grunt (this will execute all tasks and run the tests)",[15,79,80],{},"6.) Now the task is to get grunt to run upon project building (yes we are wanting to automatically run grunt after we build the empty mvc project within vs.net).  Download and install the Web Essentials extension from the gallery.",[15,82,83,84,88],{},"7.) Download install the ",[44,85,87],{"href":86},"https:\u002F\u002Fvisualstudiogallery.msdn.microsoft.com\u002F8e1b4368-4afb-467a-bc13-9650572db708","Task Runner Explorer"," extension as well.",[15,90,91],{},"8.) Open the MVC project and right click on Gruntfile.js  You will see a new option.",[59,93],{"src":94,"border":62,"alt":95,"title":95,"width":96,"height":97},"\u002Farticles\u002Fimages\u002Fwindows-live-writer-bootstrap-with-less-part-2_715f-taskrunner_thumb.jpg","taskrunner",244,165,[15,99,100],{},"9.) Add dist to the after build task (you can do this by dragging to the after build folder).  This will connect grunt to run dist task after vs.net builds.",[59,102],{"src":103,"border":62,"alt":104,"title":104,"width":96,"height":105},"\u002Farticles\u002Fimages\u002Fwindows-live-writer-bootstrap-with-less-part-2_715f-taskrunner_2_thumb.jpg","taskrunner_2",81,[15,107,108,109,111],{},"10.) Now after I build my project, what I want is for grunt to build the css based on the less, the copy the output to a particular directory on my pc.",[19,110],{},"\nAt this point, I opened gruntfile.js.  I am going to extend the current copy task to include a copyToServer option.",[113,114,119],"pre",{"className":115,"code":116,"language":117,"meta":118,"style":118},"language-json shiki shiki-themes github-light github-dark","copy: {\n  fonts: {\n    expand: true,\n    src: 'fonts\u002F*',\n    dest: 'dist\u002F'\n  },\n  docs: {\n    expand: true,\n    cwd: 'dist\u002F',\n    src: [\n      '**\u002F*'\n    ],\n    dest: 'docs\u002Fdist\u002F'\n  },\n copyToServer: {\n      expand: true,\n      cwd: 'dist\u002F',\n      src: ['**\u002F*'],\n      dest: 'c:\u002Finetpub\u002Fwwwroot\u002Fserver\u002Fstylesheets\u002Fbootstrap\u002F'\n  }\n},  \n","json","",[120,121,122,131,141,157,172,178,184,190,196,202,208,217,225,236,241,249,261,274,289,295,301],"code",{"__ignoreMap":118},[123,124,127],"span",{"class":125,"line":126},"line",1,[123,128,130],{"class":129},"sVt8B","copy: {\n",[123,132,134,138],{"class":125,"line":133},2,[123,135,137],{"class":136},"s7hpK","  fonts",[123,139,140],{"class":129},": {\n",[123,142,144,147,150,154],{"class":125,"line":143},3,[123,145,146],{"class":136},"    expand",[123,148,149],{"class":129},": ",[123,151,153],{"class":152},"sj4cs","true",[123,155,156],{"class":129},",\n",[123,158,160,163,165,168],{"class":125,"line":159},4,[123,161,162],{"class":136},"    src",[123,164,149],{"class":129},[123,166,167],{"class":136},"'fonts",[123,169,171],{"class":170},"sJ8bj","\u002F*',\n",[123,173,175],{"class":125,"line":174},5,[123,176,177],{"class":170},"    dest: 'dist\u002F'\n",[123,179,181],{"class":125,"line":180},6,[123,182,183],{"class":170},"  },\n",[123,185,187],{"class":125,"line":186},7,[123,188,189],{"class":170},"  docs: {\n",[123,191,193],{"class":125,"line":192},8,[123,194,195],{"class":170},"    expand: true,\n",[123,197,199],{"class":125,"line":198},9,[123,200,201],{"class":170},"    cwd: 'dist\u002F',\n",[123,203,205],{"class":125,"line":204},10,[123,206,207],{"class":170},"    src: [\n",[123,209,211,214],{"class":125,"line":210},11,[123,212,213],{"class":170},"      '**\u002F",[123,215,216],{"class":136},"*'\n",[123,218,220,223],{"class":125,"line":219},12,[123,221,222],{"class":136},"    ]",[123,224,156],{"class":129},[123,226,228,231,233],{"class":125,"line":227},13,[123,229,230],{"class":136},"    dest",[123,232,149],{"class":129},[123,234,235],{"class":136},"'docs\u002Fdist\u002F'\n",[123,237,239],{"class":125,"line":238},14,[123,240,183],{"class":129},[123,242,244,247],{"class":125,"line":243},15,[123,245,246],{"class":136}," copyToServer",[123,248,140],{"class":129},[123,250,252,255,257,259],{"class":125,"line":251},16,[123,253,254],{"class":136},"      expand",[123,256,149],{"class":129},[123,258,153],{"class":152},[123,260,156],{"class":129},[123,262,264,267,269,272],{"class":125,"line":263},17,[123,265,266],{"class":136},"      cwd",[123,268,149],{"class":129},[123,270,271],{"class":136},"'dist\u002F'",[123,273,156],{"class":129},[123,275,277,280,283,286],{"class":125,"line":276},18,[123,278,279],{"class":136},"      src",[123,281,282],{"class":129},": [",[123,284,285],{"class":136},"'**",[123,287,288],{"class":170},"\u002F*'],\n",[123,290,292],{"class":125,"line":291},19,[123,293,294],{"class":170},"      dest: 'c:\u002Finetpub\u002Fwwwroot\u002Fserver\u002Fstylesheets\u002Fbootstrap\u002F'\n",[123,296,298],{"class":125,"line":297},20,[123,299,300],{"class":170},"  }\n",[123,302,304],{"class":125,"line":303},21,[123,305,306],{"class":170},"},\n",[15,308,309],{},"I also added a new task so that I could execute this after a build with",[15,311,312,313,316],{},"\u002F\u002F new copy to server or local vdir\n  grunt.registerTask('copyToServer', ",[123,314,315],{},"'copy:copyToServer'",");",[15,318,319],{},"Finally, I am going to add this task to the after build step, so every time Visual Studio builds, it will execute Grunt to build the css via Less then it will copy the files to a particular directory after I build my Visual Studio project.  You can do this by right clicking on the copyToServer task and select After Build binding.",[321,322,323],"style",{},"html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .s7hpK, html code.shiki .s7hpK{--shiki-default:#B31D28;--shiki-default-font-style:italic;--shiki-dark:#FDAEB7;--shiki-dark-font-style:italic}html pre.shiki code .sj4cs, html code.shiki .sj4cs{--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sJ8bj, html code.shiki .sJ8bj{--shiki-default:#6A737D;--shiki-dark:#6A737D}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":118,"searchDepth":133,"depth":133,"links":325},[],"title: Bootstrap with LESS (Part 2)\ndescription: CSS has become complex, lets figure it out\ncreatedAt: 2015-06-05T11:07:35.2100000-04:00\nupdatedAt: 2015-06-05T11:07:35.2100000-04:00\nimg: \u002Farticles\u002Fimages\u002Fwindows-live-writer-bootstrap-with-less-part-2_11b1b-grunt_thumb.png\nauthor:\nname: David\ntags:","md",{},true,"\u002Farticles\u002Fbootstrap-with-less-part-2",{"description":326},"articles\u002Fbootstrap-with-less-part-2","mPxMED8Q645tR3tafSYbNmj55ZL7zdCq0B-mTtudJ98",[],{"id":336,"title":337,"author":7,"body":338,"createdAt":7,"description":795,"extension":327,"img":7,"meta":796,"navigation":329,"path":797,"seo":798,"stem":799,"tags":7,"updatedAt":7,"__hash__":800},"articles\u002Farticles\u002Fbootstrap-with-less-part-1.md","Bootstrap With Less Part 1",{"type":9,"value":339,"toc":793},[340,342,351,355,357,370,373,376,562,568,692,702,705,779,790],[12,341],{},[15,343,344,345,24,347,27,349,30],{},"title: Bootstrap with LESS (Part 1)\ndescription: Customize and extend Bootstrap with LESS, a CSS preprocessor, to take advantage of the variables, mixins, and more used to build Bootstrap's CSS\ncreatedAt: 2015-06-05T01:00:15.1300000-04:00\nupdatedAt: 2015-06-05T01:00:15.1300000-04:00\nimg: \u002Farticles\u002Fimages\u002Fwindows-live-writer-bootstrap-with-less-part-1_11c5b-less_thumb.png",[19,346],{},[19,348],{},[19,350],{},[32,352,353],{},[35,354,37],{},[12,356],{},[15,358,359,360,364,365,369],{},"The latest version of ",[44,361,363],{"href":362},"http:\u002F\u002Fgetbootstrap.com\u002F","Bootstrap"," uses LESS (a CSS preprocessor) to build the distributed css files.  Confused yet? So, lets focus on what is LESS and how can you compile css.  The best source of less documentation can be found ",[44,366,368],{"href":367},"http:\u002F\u002Fwww.lesscss.org\u002F","here",". ",[15,371,372],{},"“Less is a CSS pre-processor, meaning that it extends the CSS language, adding features that allow variables, mixins, functions and many other techniques that allow you to make CSS that is more maintainable, themable and extendable.  Less runs inside Node, in the browser and inside Rhino. There are also many 3rd party tools that allow you to compile your files and watch for changes. ",[15,374,375],{},"For example:",[113,377,381],{"className":378,"code":379,"language":380,"meta":118,"style":118},"language-css shiki shiki-themes github-light github-dark","@base: #f938ab;  \n.box-shadow(@style, @c) when (iscolor(@c)) { \n   -webkit-box-shadow: @style @c; \n   box-shadow: @style @c; \n} \n.box-shadow(@style, @alpha: 50%) when (isnumber(@alpha)) { \n   .box-shadow(@style, rgba(0, 0, 0, @alpha)); \n} \n.box { \n   color: saturate(@base, 5%); \n   border-color: lighten(@base, 30%); \n   div { \n.box-shadow(0 0 5px, 30%) } \n}  \n","css",[120,382,383,400,408,421,432,437,444,472,476,485,514,534,541,557],{"__ignoreMap":118},[123,384,385,388,392,394,397],{"class":125,"line":126},[123,386,387],{"class":129},"@",[123,389,391],{"class":390},"s9eBZ","base",[123,393,149],{"class":129},[123,395,396],{"class":136},"#f938ab;",[123,398,399],{"class":129},"  \n",[123,401,402,405],{"class":125,"line":133},[123,403,404],{"class":136},".box-shadow(@style",[123,406,407],{"class":129},", @c) when (iscolor(@c)) { \n",[123,409,410,413,416,418],{"class":125,"line":143},[123,411,412],{"class":152},"   -webkit-box-shadow",[123,414,415],{"class":129},": @",[123,417,321],{"class":152},[123,419,420],{"class":129}," @c; \n",[123,422,423,426,428,430],{"class":125,"line":159},[123,424,425],{"class":152},"   box-shadow",[123,427,415],{"class":129},[123,429,321],{"class":152},[123,431,420],{"class":129},[123,433,434],{"class":125,"line":174},[123,435,436],{"class":129},"} \n",[123,438,439,441],{"class":125,"line":180},[123,440,404],{"class":136},[123,442,443],{"class":129},", @alpha: 50%) when (isnumber(@alpha)) { \n",[123,445,446,449,452,455,457,460,463,466,469],{"class":125,"line":186},[123,447,448],{"class":129},"   .",[123,450,451],{"class":152},"box-shadow",[123,453,454],{"class":129},"(@",[123,456,321],{"class":152},[123,458,459],{"class":129},", ",[123,461,462],{"class":152},"rgba",[123,464,465],{"class":129},"(0, 0, 0, @",[123,467,468],{"class":152},"alpha",[123,470,471],{"class":129},")); \n",[123,473,474],{"class":125,"line":192},[123,475,436],{"class":129},[123,477,478,482],{"class":125,"line":198},[123,479,481],{"class":480},"sScJk",".box",[123,483,484],{"class":129}," { \n",[123,486,487,490,492,495,498,502,504,507,511],{"class":125,"line":204},[123,488,489],{"class":152},"   color",[123,491,149],{"class":129},[123,493,494],{"class":152},"saturate",[123,496,497],{"class":129},"(",[123,499,501],{"class":500},"s4XuR","@base",[123,503,459],{"class":129},[123,505,506],{"class":152},"5",[123,508,510],{"class":509},"szBVR","%",[123,512,513],{"class":129},"); \n",[123,515,516,519,521,524,527,530,532],{"class":125,"line":210},[123,517,518],{"class":152},"   border-color",[123,520,149],{"class":129},[123,522,523],{"class":152},"lighten",[123,525,526],{"class":129},"(@base, ",[123,528,529],{"class":152},"30",[123,531,510],{"class":509},[123,533,513],{"class":129},[123,535,536,539],{"class":125,"line":219},[123,537,538],{"class":152},"   div",[123,540,484],{"class":129},[123,542,543,546,548,551,554],{"class":125,"line":227},[123,544,545],{"class":129},".",[123,547,451],{"class":152},[123,549,550],{"class":129},"(0 0 5",[123,552,553],{"class":152},"px",[123,555,556],{"class":129},", 30%) } \n",[123,558,559],{"class":125,"line":238},[123,560,561],{"class":129},"}\n",[15,563,564],{},[565,566,567],"strong",{},"will compile to…",[113,569,571],{"className":378,"code":570,"language":380,"meta":118,"style":118},".box { \n   color: #fe33ac; border-color: #fdcdea; \n} \n.box div { \n   -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); \n   box-shadow: 0 0 5px rgba(0, 0, 0, 0.3); \n}  \n",[120,572,573,579,602,606,615,654,688],{"__ignoreMap":118},[123,574,575,577],{"class":125,"line":126},[123,576,481],{"class":480},[123,578,484],{"class":129},[123,580,581,583,585,588,591,594,596,599],{"class":125,"line":133},[123,582,489],{"class":152},[123,584,149],{"class":129},[123,586,587],{"class":152},"#fe33ac",[123,589,590],{"class":129},"; ",[123,592,593],{"class":152},"border-color",[123,595,149],{"class":129},[123,597,598],{"class":152},"#fdcdea",[123,600,601],{"class":129},"; \n",[123,603,604],{"class":125,"line":143},[123,605,436],{"class":129},[123,607,608,610,613],{"class":125,"line":159},[123,609,481],{"class":480},[123,611,612],{"class":390}," div",[123,614,484],{"class":129},[123,616,617,619,621,624,627,630,632,635,637,639,641,643,645,647,649,652],{"class":125,"line":174},[123,618,412],{"class":152},[123,620,149],{"class":129},[123,622,623],{"class":152},"0",[123,625,626],{"class":152}," 0",[123,628,629],{"class":152}," 5",[123,631,553],{"class":509},[123,633,634],{"class":152}," rgba",[123,636,497],{"class":129},[123,638,623],{"class":152},[123,640,459],{"class":129},[123,642,623],{"class":152},[123,644,459],{"class":129},[123,646,623],{"class":152},[123,648,459],{"class":129},[123,650,651],{"class":152},"0.3",[123,653,513],{"class":129},[123,655,656,658,660,662,664,666,668,670,672,674,676,678,680,682,684,686],{"class":125,"line":180},[123,657,425],{"class":152},[123,659,149],{"class":129},[123,661,623],{"class":152},[123,663,626],{"class":152},[123,665,629],{"class":152},[123,667,553],{"class":509},[123,669,634],{"class":152},[123,671,497],{"class":129},[123,673,623],{"class":152},[123,675,459],{"class":129},[123,677,623],{"class":152},[123,679,459],{"class":129},[123,681,623],{"class":152},[123,683,459],{"class":129},[123,685,651],{"class":152},[123,687,513],{"class":129},[123,689,690],{"class":125,"line":186},[123,691,561],{"class":129},[15,693,694,695,698,699],{},"Essentially, LESS code will get compiled into CSS.  In order to compile there are command line applications.  Currently, I am using ",[44,696,697],{"href":69},"Node.js"," with a npm package installed via ",[565,700,701],{},"npm install –g less",[15,703,704],{},"Technically, you can also compile ‘client-side’ but in production it is recommended that the css is precompiled (remember compiling just means translating the less css code to simple css files).  Include your styles.less via the following link as well s the less.js file to perform compilation.",[113,706,710],{"className":707,"code":708,"language":709,"meta":118,"style":118},"language-html shiki shiki-themes github-light github-dark","\u003Clink rel=\"stylesheet\u002Fless\" type=\"text\u002Fcss\" href=\"styles.less\" \u002F>\n\u003Cscript src=\"less.js\" type=\"text\u002Fjavascript\">\u003C\u002Fscript>  \n","html",[120,711,712,749],{"__ignoreMap":118},[123,713,714,717,720,723,726,730,733,735,738,741,743,746],{"class":125,"line":126},[123,715,716],{"class":129},"\u003C",[123,718,719],{"class":390},"link",[123,721,722],{"class":480}," rel",[123,724,725],{"class":129},"=",[123,727,729],{"class":728},"sZZnC","\"stylesheet\u002Fless\"",[123,731,732],{"class":480}," type",[123,734,725],{"class":129},[123,736,737],{"class":728},"\"text\u002Fcss\"",[123,739,740],{"class":480}," href",[123,742,725],{"class":129},[123,744,745],{"class":728},"\"styles.less\"",[123,747,748],{"class":129}," \u002F>\n",[123,750,751,753,756,759,761,764,766,768,771,774,776],{"class":125,"line":133},[123,752,716],{"class":129},[123,754,755],{"class":390},"script",[123,757,758],{"class":480}," src",[123,760,725],{"class":129},[123,762,763],{"class":728},"\"less.js\"",[123,765,732],{"class":480},[123,767,725],{"class":129},[123,769,770],{"class":728},"\"text\u002Fjavascript\"",[123,772,773],{"class":129},">\u003C\u002F",[123,775,755],{"class":390},[123,777,778],{"class":129},">\n",[15,780,781,782,786],{},"Reference: ",[44,783],{"href":784,"target":785},"https:\u002F\u002Fgetbootstrap.com\u002F2.0.1\u002Fless.html","_blank",[44,787,784],{"href":784,"rel":788},[789],"nofollow",[321,791,792],{},"html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .s9eBZ, html code.shiki .s9eBZ{--shiki-default:#22863A;--shiki-dark:#85E89D}html pre.shiki code .s7hpK, html code.shiki .s7hpK{--shiki-default:#B31D28;--shiki-default-font-style:italic;--shiki-dark:#FDAEB7;--shiki-dark-font-style:italic}html pre.shiki code .sj4cs, html code.shiki .sj4cs{--shiki-default:#005CC5;--shiki-dark:#79B8FF}html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .s4XuR, html code.shiki .s4XuR{--shiki-default:#E36209;--shiki-dark:#FFAB70}html pre.shiki code .szBVR, html code.shiki .szBVR{--shiki-default:#D73A49;--shiki-dark:#F97583}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}",{"title":118,"searchDepth":133,"depth":133,"links":794},[],"title: Bootstrap with LESS (Part 1)\ndescription: Customize and extend Bootstrap with LESS, a CSS preprocessor, to take advantage of the variables, mixins, and more used to build Bootstrap's CSS\ncreatedAt: 2015-06-05T01:00:15.1300000-04:00\nupdatedAt: 2015-06-05T01:00:15.1300000-04:00\nimg: \u002Farticles\u002Fimages\u002Fwindows-live-writer-bootstrap-with-less-part-1_11c5b-less_thumb.png\nauthor:\nname: David\ntags:",{},"\u002Farticles\u002Fbootstrap-with-less-part-1",{"description":795},"articles\u002Fbootstrap-with-less-part-1","4zKmRuw9qM0LzxbznU6VsGSAVT01GDunYSwbJsbSFTk",{"id":802,"title":803,"author":7,"body":804,"createdAt":7,"description":854,"extension":327,"img":7,"meta":855,"navigation":329,"path":856,"seo":857,"stem":858,"tags":7,"updatedAt":7,"__hash__":859},"articles\u002Farticles\u002Fnew-blog-engine-static.md","New Blog Engine Static",{"type":9,"value":805,"toc":852},[806,808,816,821,823,836,841,844],[12,807],{},[15,809,810,811,813,814,30],{},"title: Update to Blog\ndescription: Just a quick note about updating to new blog theme\u002Fapproach\u002Fplatform.\ncreatedAt: 2021-04-24\nupdatedAt: 2021-04-24\nimg: \u002Farticles\u002Fimages\u002Fwebhost.jpg\nauthor:",[19,812],{},"\nname: Admin",[19,815],{},[32,817,818],{},[35,819,820],{},"general",[12,822],{},[15,824,825,826,830,831,835],{},"Yes I am updating blog and web site as part of personal brand update.  I have been hosting on ",[44,827,829],{"href":828,"target":785},"https:\u002F\u002Fwww.a2hosting.com\u002F","A2 Hosting","\nfor the last few years.  Recently, they sold their Windows hosting to ",[44,832,834],{"href":833,"target":785},"https:\u002F\u002Fwww.mochahost.com\u002F","Mochahost","  While service and uptime has improved there are other much lower cost alternatives.",[15,837,838],{},[59,839],{"alt":118,"src":840},"\u002Farticles\u002Fimages\u002Fkramer.png",[15,842,843],{},"Yes, I do question myself when I do these things, but overall it is a good investment both technology and the constant learning effort required in the technology field.",[15,845,846,847,851],{},"I decided to invest in the ",[44,848,850],{"target":785,"href":849},"https:\u002F\u002Fnuxtjs.org\u002F","Nuxt.js","  After I evaluated a number of different blogging platforms,\nI found this to be the most aligned with my areas of interest.  Nuxt is a modular framework optimized out of the box based on Vue.js.  Nuxt suppports\nequally server side rendered (SSR) and static site generation approaches.  I hope to blogging more about my experience with this platform for the\nforeseeable future (until the next platform change).",{"title":118,"searchDepth":133,"depth":133,"links":853},[],"title: Update to Blog\ndescription: Just a quick note about updating to new blog theme\u002Fapproach\u002Fplatform.\ncreatedAt: 2021-04-24\nupdatedAt: 2021-04-24\nimg: \u002Farticles\u002Fimages\u002Fwebhost.jpg\nauthor:\nname: Admin\ntags:",{},"\u002Farticles\u002Fnew-blog-engine-static",{"description":854},"articles\u002Fnew-blog-engine-static","A5bAV-jKLqEpJpj3LibYl2gI4xq66-qtVBQONxX4Ra8",1781574772280]