Replaced financial document icon with new example icon

fec/fec/static/scss/_icon-variables.scss

@@ -41,6 +41,7 @@ $disbursement: 'data:image/svg+xml;charset=utf8, %3Csvg%20xmlns%3D%22http%3A%2F%
 $document: 'data:image/svg+xml;charset=utf8, %3Csvg%20width%3D%2216%22%20height%3D%2220%22%20viewBox%3D%220%200%2016%2020%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M0%20.494C0%20.221.23%200%20.502%200h11.552C13%201%2015%202.506%2016%203.5v16c0%20.276-.226.5-.496.5H.496A.497.497%200%200%201%200%2019.506V.494zM2%202v16h12V4.5h-2.5V2H2zm2.094%208.206h7.662c.328%200%20.594-.27.594-.603A.599.599%200%200%200%2011.756%209H4.094a.599.599%200%200%200-.594.603c0%20.333.266.603.594.603zm0%203h7.662c.328%200%20.594-.27.594-.603a.599.599%200%200%200-.594-.603H4.094a.599.599%200%200%200-.594.603c0%20.333.266.603.594.603zm7.662%203c.328%200%20.594-.27.594-.603a.599.599%200%200%200-.594-.603H4.094a.599.599%200%200%200-.594.603c0%20.333.266.603.594.603h7.662z%22%2F%3E%3C%2Fsvg%3E';
 $download: 'data:image/svg+xml;charset=utf8, %3Csvg%20width%3D%2220%22%20height%3D%2218%22%20viewBox%3D%220%200%2020%2018%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M18%2011v6l1-1H1l1%201v-6H0v1a1%201%200%200%200%202%200v-1c0-1.333-2-1.333-2%200v6a1%201%200%200%200%201%201h18a1%201%200%200%200%201-1v-6a1%201%200%200%200-2%200zm-7.24%201.161a1.016%201.016%200%200%201-1.518-.002l-3.07-3.407a1.023%201.023%200%200%201%20.76-1.707c.302%200%20.57.134.757.342l1.288%201.425v-7.29a1.023%201.023%200%201%201%202.046%200v7.29l1.285-1.428a1.023%201.023%200%200%201%201.783.684c0%20.263-.102.5-.265.682l-3.066%203.411z%22%2F%3E%3C%2Fsvg%3E';
 $election: 'data:image/svg+xml;charset=utf8, %3Csvg%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M12.665%202.202l.074.075a.52.52%200%201%200-.736-.737l-2.89%202.89h.149L7.756%202.924a.52.52%200%200%200-.89.368c0%20.14.056.272.153.369l1.8%201.8a.52.52%200%200%200%20.736%200l3.184-3.184-.074-.075zM0%209.996C0%209.446.455%209%20.992%209h18.016c.548%200%20.992.445.992.996v9.008c0%20.55-.455.996-.992.996H.992A.993.993%200%200%201%200%2019.004V9.996zm2.537-9c0-.55.458-.996.99-.996h12.765c.547%200%20.99.447.99.996V7.5H2.538V.996zM4.202%2011.68c-.021-.04-.045-.066-.071-.074-.045-.015-.083.01-.115.074l-.423.857-.947.14c-.056.006-.09.027-.102.063-.011.036.004.073.046.112l.685.668-.161.942c-.011.07.006.113.05.127.025.008.058.003.1-.016l.847-.448.846.445a.219.219%200%200%200%20.035.015.11.11%200%200%200%20.07.002c.021-.007.036-.023.044-.048a.16.16%200%200%200%20.001-.079l-.162-.942.684-.668a.154.154%200%200%200%20.045-.065.066.066%200%200%200-.008-.063.111.111%200%200%200-.057-.04.244.244%200%200%200-.037-.009l-.947-.137-.423-.856zm5.788%200c-.021-.04-.045-.066-.071-.074-.044-.015-.083.01-.115.074l-.423.857-.947.14c-.055.006-.09.027-.101.063-.012.036.003.073.045.112l.685.668-.161.942c-.01.07.006.113.05.127.025.008.059.003.1-.016l.847-.448.846.445a.219.219%200%200%200%20.035.015.11.11%200%200%200%20.07.002c.021-.007.036-.023.044-.048a.16.16%200%200%200%20.002-.079l-.163-.942.684-.668a.154.154%200%200%200%20.045-.065.066.066%200%200%200-.008-.063.111.111%200%200%200-.057-.04.244.244%200%200%200-.037-.009l-.946-.137-.424-.856zm5.788%200c-.02-.04-.045-.066-.07-.074-.045-.015-.084.01-.116.074l-.422.857-.947.14c-.056.006-.09.027-.102.063-.012.036.003.073.045.112l.685.668-.16.942c-.012.07.005.113.05.127.025.008.058.003.1-.016l.846-.448.847.445a.219.219%200%200%200%20.034.015.11.11%200%200%200%20.07.002c.022-.007.036-.023.044-.048a.16.16%200%200%200%20.002-.079l-.162-.942.683-.668a.154.154%200%200%200%20.045-.065.066.066%200%200%200-.008-.063.111.111%200%200%200-.057-.04.244.244%200%200%200-.037-.009l-.946-.137-.424-.856z%22%2F%3E%3C%2Fsvg%3E';
+$example-document: 'data:image/svg+xml;charset=utf8, %3Csvg%20width%3D%2260px%22%20height%3D%2260px%22%20viewBox%3D%220%200%2060%2060%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cg%20stroke%3D%22none%22%20stroke-width%3D%221%22%3E%3Cellipse%20fill%3D%22%23FFFFFF%22%20cx%3D%2230%22%20cy%3D%2229.6666667%22%20rx%3D%2230%22%20ry%3D%2229.6666667%22%3E%3C%2Fellipse%3E%3Cpath%20d%3D%22M44.87%2C23.4132914%20L44.87%2C43.0935146%20C44.87%2C43.5128893%2044.5281184%2C43.8532514%2044.11938%2C43.8532514%20L16.75062%2C43.8532514%20C16.3358037%2C43.8532514%2016%2C43.5113698%2016%2C43.1011119%20L16%2C15.4011067%20C16%2C14.9862904%2016.3266868%2C14.6504867%2016.7475811%2C14.6504867%20L36.6207774%2C14.6504867%20C36.1618963%2C15.5317814%2035.8792742%2C16.5179198%2035.8792742%2C17.5785125%20C35.8792742%2C17.6164993%2035.8899105%2C17.6514472%2035.8899105%2C17.689434%20L19.0389474%2C17.689434%20L19.0389474%2C40.8143041%20L41.8310526%2C40.8143041%20L41.8310526%2C23.9299125%20C41.9799611%2C23.9390293%2042.1227916%2C23.9739772%2042.2732195%2C23.9739772%20C43.2000984%2C23.9739772%2044.0753153%2C23.7673288%2044.87%2C23.4132914%20L44.87%2C23.4132914%20Z%22%20fill%3D%22%23F77B42%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M39.3239211%2C23.2339935%20L39.3239211%2C23.5302909%20C39.3239211%2C24.3629625%2038.6295216%2C25.0360893%2037.7922916%2C25.0360893%20L22.8497874%2C25.0360893%20C22.0034405%2C25.0360893%2021.3181579%2C24.3508067%2021.3181579%2C23.5302909%20L21.3181579%2C21.8072077%20C21.3181579%2C20.9745362%2022.0125574%2C20.3014093%2022.8497874%2C20.3014093%20L36.4946611%2C20.3014093%20C37.0918142%2C21.5656114%2038.0885889%2C22.5882172%2039.3239211%2C23.2339935%20L39.3239211%2C23.2339935%20Z%22%20fill%3D%22%23F77B42%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M38.98052%2C28.9821625%20C39.2335124%2C28.9821625%2039.4378816%2C28.5673462%2039.4378816%2C28.0552835%20C39.4378816%2C27.5432209%2039.2335124%2C27.1268851%2038.98052%2C27.1268851%20L30.7784011%2C27.1268851%20C30.5254087%2C27.1268851%2030.3210395%2C27.5432209%2030.3210395%2C28.0552835%20C30.3210395%2C28.5673462%2030.5254087%2C28.9821625%2030.7784011%2C28.9821625%20L38.98052%2C28.9821625%20Z%22%20fill%3D%22%23F77B42%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M38.9808854%2C33.1971825%20C39.2332335%2C33.1971825%2039.4378816%2C32.7869246%2039.4378816%2C32.2809398%20C39.4378816%2C31.7749551%2039.2332335%2C31.3646972%2038.9808854%2C31.3646972%20L30.7780356%2C31.3646972%20C30.5256876%2C31.3646972%2030.3210395%2C31.7749551%2030.3210395%2C32.2809398%20C30.3210395%2C32.7869246%2030.5256876%2C33.1971825%2030.7780356%2C33.1971825%20L38.9808854%2C33.1971825%20Z%22%20fill%3D%22%23F77B42%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M35.9390272%2C37.5656693%20C36.1929826%2C37.5656693%2036.3989342%2C37.1554114%2036.3989342%2C36.6494267%20C36.3989342%2C36.1434419%2036.1929826%2C35.7331841%2035.9390272%2C35.7331841%20L30.7809464%2C35.7331841%20C30.5269911%2C35.7331841%2030.3210395%2C36.1434419%2030.3210395%2C36.6494267%20C30.3210395%2C37.1554114%2030.5269911%2C37.5656693%2030.7809464%2C37.5656693%20L35.9390272%2C37.5656693%20Z%22%20fill%3D%22%23F77B42%22%3E%3C%2Fpath%3E%3Cpath%20d%3D%22M41.6473436%2C20.0087871%20C41.4985898%2C20.1612278%2041.2927498%2C20.2557299%2041.0652279%2C20.2557299%20C40.8379805%2C20.2557299%2040.6321405%2C20.1612278%2040.4831123%2C20.0087871%20L38.6534814%2C18.5254456%20C38.5044532%2C18.3727235%2038.4122368%2C18.1617815%2038.4122368%2C17.9286202%20C38.4122368%2C17.462579%2038.7808277%2C17.0848521%2039.2355969%2C17.0848521%20C39.4631188%2C17.0848521%2039.6686845%2C17.1793541%2039.8177126%2C17.3320762%20L41.0652279%2C18.2188736%20L43.3688149%2C15.6147504%20C43.517843%2C15.4620283%2043.7236831%2C15.3675263%2043.9509305%2C15.3675263%20C44.4056997%2C15.3675263%2044.7742906%2C15.7452532%2044.7742906%2C16.2112945%20C44.7742906%2C16.4441745%2044.6820742%2C16.6553977%2044.5333205%2C16.8081198%20L41.6473436%2C20.0087871%20Z%22%20fill%3D%22%23F77B42%22%3E%3C%2Fpath%3E%3Crect%20fill%3D%22%23F77B42%22%20x%3D%2221.3181579%22%20y%3D%2226.9155263%22%20width%3D%227.2175%22%20height%3D%2210.6363158%22%20rx%3D%221%22%3E%3C%2Frect%3E%3C%2Fg%3E%3C%2Fsvg%3E';
 $facebook-circle: 'data:image/svg+xml;charset=utf8, %3Csvg%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M8.588%2015.44h2.248V10h1.5l.199-1.875h-1.699l.003-.939c0-.489.046-.751.748-.751h.937V4.56h-1.5c-1.802%200-2.436.91-2.436%202.439v1.126H7.465V10h1.123v5.44zM10%2020C4.477%2020%200%2015.523%200%2010S4.477%200%2010%200s10%204.477%2010%2010-4.477%2010-10%2010z%22%2F%3E%3C%2Fsvg%3E';
 $fax: 'data:image/svg+xml;charset=utf8, %3Csvg%20id%3D%22fax%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%3E%3Cdefs%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M5.27%206.64a1.28%201.28%200%200%200-1.4%201V14a1.28%201.28%200%200%200%201.4%201%201.27%201.27%200%200%200%201.42-1V7.67a1.29%201.29%200%200%200-1.42-1.03zM12.42%203.8v1.87h1.87L12.42%203.8z%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M14.62%207.91V6.73h-2.73a.54.54%200%200%201-.53-.53V3.47H6.62a.25.25%200%200%200-.24.24v2.18a2%202%200%200%201%201.29%202h6.93zM15.73%2014.51V9.42a.52.52%200%200%200-.51-.53H7.67V14a1.69%201.69%200%200%201-.33%201h7.91a.52.52%200%200%200%20.51-.53zm-5.31-.71a.51.51%200%200%201%200-1%20.53.53%200%200%201%20.51.51.5.5%200%200%201-.51.49zm0-1.31a.5.5%200%200%201-.51-.49.52.52%200%200%201%20.51-.51.53.53%200%200%201%20.51.51.5.5%200%200%201-.51.49zm0-1.33a.5.5%200%201%201%200-1%20.53.53%200%200%201%20.51.51.5.5%200%200%201-.51.49zM12%2013.8a.51.51%200%200%201%200-1%20.53.53%200%200%201%20.51.51.5.5%200%200%201-.51.49zm0-1.31a.5.5%200%200%201-.53-.49.51.51%200%200%201%20.53-.53.53.53%200%200%201%20.51.51.5.5%200%200%201-.51.51zm0-1.33a.49.49%200%200%201-.49-.49.5.5%200%200%201%20.49-.51.53.53%200%200%201%20.51.51.5.5%200%200%201-.51.49zm1.56%202.64a.51.51%200%201%201%200-1%20.53.53%200%200%201%20.51.51.5.5%200%200%201-.56.49zm0-1.31A.5.5%200%200%201%2013%2012a.52.52%200%200%201%20.51-.51.53.53%200%200%201%20.49.51.5.5%200%200%201-.49.49zm0-1.33a.5.5%200%201%201%200-1%20.53.53%200%200%201%20.51.51.5.5%200%200%201-.56.49z%22%2F%3E%3C%2Fsvg%3E';
 $file-box: 'data:image/svg+xml;charset=utf8, %3Csvg%20id%3D%22file-box%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2220%22%20height%3D%2218%22%20viewBox%3D%220%200%2020%2018%22%3E%3Cdefs%2F%3E%3Cg%20id%3D%22file-box-2%22%20data-name%3D%22file-box%22%3E%3Crect%20width%3D%2220%22%20height%3D%225.52%22%20rx%3D%221.99%22%20ry%3D%221.99%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M1.67%206.54v10.61a.84.84%200%200%200%20.83.85h15a.84.84%200%200%200%20.83-.85V6.54H1.67zm12.08%204.84a.67.67%200%200%201-.67.68H6.92a.67.67%200%200%201-.67-.68v-1.19a.67.67%200%200%201%20.67-.68h6.17a.67.67%200%200%201%20.67.68v1.19z%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E';

fec/fec/static/scss/components/_icon-headings.scss

@@ -274,10 +274,10 @@
   }
 }
 
-.icon-heading--financial-document {
+.icon-heading--election-circle {
   &::before {
     $size: u(4rem);
-    @include u-icon-circle($financial-document, $inverse, $secondary-contrast, $size);
+    @include u-icon-circle($election, $inverse, $secondary-contrast, $size);
     background-size: 50%;
     content: '';
     float: left;
@@ -286,16 +286,34 @@
 
   &.primary{
     &::before {
-      @include u-icon-circle($financial-document, $primary, $inverse, 4.5rem);
+      @include u-icon-circle($election, $primary, $inverse, 4.5rem);
       background-size: 40%;
       }
   }
 }
 
-.icon-heading--election-circle {
+.icon-heading--example-document {
   &::before {
     $size: u(4rem);
-    @include u-icon-circle($election, $inverse, $secondary-contrast, $size);
+    @include u-icon-circle($example-document, $inverse, $secondary-contrast, $size);
+    background-size: 100%;
+    content: '';
+    float: left;
+    margin-right: u(1.5rem);
+  }
+
+  &.primary{
+    &::before {
+      @include u-icon-circle($example-document, $primary, $inverse, 4.5rem);
+      background-size: 40%;
+      }
+  }
+}
+
+.icon-heading--financial-document {
+  &::before {
+    $size: u(4rem);
+    @include u-icon-circle($financial-document, $inverse, $secondary-contrast, $size);
     background-size: 50%;
     content: '';
     float: left;
@@ -304,7 +322,7 @@
 
   &.primary{
     &::before {
-      @include u-icon-circle($election, $primary, $inverse, 4.5rem);
+      @include u-icon-circle($financial-document, $primary, $inverse, 4.5rem);
       background-size: 40%;
       }
   }
@@ -321,8 +339,9 @@
 .icon-heading--individual-contributions-circle,
 .icon-heading--person-location-circle,
 .icon-heading--direction-sign-circle,
-.icon-heading--financial-document,
-.icon-heading--election-circle
+.icon-heading--election-circle,
+.icon-heading--example-document,
+.icon-heading--financial-document
  {
   border-bottom: none;
   display: table;

fec/home/templates/blocks/reporting-example-cards.html

@@ -11,7 +11,7 @@
         {% if card.specific.featured_image %}
           {% image card.specific.featured_image fill-80x80 class="card__image" %}
         {% else %}
-          <img src="{% static 'img/financial-document-circle.svg' %}" alt="Icon of a document" class="card__image">
+          <img src="{% static 'img/example-circle.svg' %}" alt="Icon of an example" class="card__image">
         {% endif %}
       </div>
       <div class="card__content">

fec/home/templates/home/collection_page.html

@@ -55,7 +55,7 @@ <h2>{{ block.value.title }}</h2>
   {% endfor %}
   {% if self.reporting_examples %}
     <section id="reporting-examples" class="sidebar--secondary t-sans">
-      <h2 class="sidebar__title sidebar__title--large icon-heading--financial-document">Reporting examples</h2>
+      <h2 class="sidebar__title sidebar__title--large icon-heading--example-document">Reporting examples</h2>
       <div class="sidebar__content">
         <div class="grid grid--2-wide">
         {% for example in self.reporting_examples %}