[OCTANE] change ember-core-concepts.png to use </> syntax (ember-learn#631)

* Replace core-concepts image w/ svg that includes angle bracket syntax

* Components, not templates, in the bottom row.

* Fix fi ligature problem.

* Change fonts to match css of Ember guides.

* Clean up classnames and code section.

* Add text anchors for first lines.

* Change template variable to camelCase

Author: muziejus

guides/release/getting-started/core-concepts.md

@@ -1,7 +1,7 @@
 Before you start writing any Ember code, it's a good idea to get an overview of how an
 Ember application works.
 
-![ember core concepts](/images/ember-core-concepts/ember-core-concepts.png)
+![ember core concepts](/images/ember-core-concepts/ember-core-concepts.svg)
 
 ## Router and Route Handlers
 Imagine we are writing a web app for a site that lets users list their properties to rent. At any given time, we should be able to answer questions about the current state like _What rental are they looking at?_ and _Are they editing it?_ In Ember, the answer to these questions is determined by the URL.