Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

replace IconComponent with icon partials #874

Merged
merged 18 commits into from
Jul 6, 2021
Merged

replace IconComponent with icon partials #874

Show file tree
Hide file tree
Changes from 16 commits
Commits
Show all changes
18 commits
Select commit Hold shift + click to select a range
2bd6f5c
product-standard HitchhikerCTA-icon
oshi97 Jul 1, 2021
0b7f0dd
HitchhikerCTA-icon when the div tags are on the same line
oshi97 Jul 1, 2021
8dc40be
show more show less chevron icons
oshi97 Jul 1, 2021
db613f3
HitchhikerCTA-icon v3
oshi97 Jul 1, 2021
ea3c6b3
accordion card icon
oshi97 Jul 1, 2021
b12de24
HitchhikerCTA-icon v4
oshi97 Jul 1, 2021
25ca8fd
HitchhikerCTA-icon v5
oshi97 Jul 1, 2021
e600d7a
HitchhikerCTA-icon v6
oshi97 Jul 1, 2021
7a9c958
universal section templates
oshi97 Jul 1, 2021
5b76d89
grid chevron
oshi97 Jul 1, 2021
9ccab77
directanswer titleIconWrapper
oshi97 Jul 1, 2021
d6001b3
da card thumb up icon
oshi97 Jul 1, 2021
6d43fb0
da card thumb down icon
oshi97 Jul 1, 2021
9e7cf92
doc search da card thumb icons
oshi97 Jul 1, 2021
1a68ab0
other one-off icon usages
oshi97 Jul 1, 2021
34b9b25
point to feature/develop-i18n
oshi97 Jul 1, 2021
33589d9
param spacing
oshi97 Jul 6, 2021
a4fc570
bakedInIcon -> builtInIcon
oshi97 Jul 6, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions cards/document-standard/template.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -76,10 +76,10 @@
{{#if ariaLabel}}aria-label="{{ariaLabel}}"{{/if}}>
{{#if (any iconName iconUrl)}}
<div class="HitchhikerCTA-iconWrapper">
<div class="HitchhikerCTA-icon" data-component="IconComponent" data-opts='{
"iconUrl": "{{#if iconUrl}}{{#unless (isNonRelativeUrl iconUrl)}}{{@root.relativePath}}/{{/unless}}{{iconUrl}}{{/if}}",
"iconName": "{{iconName}}"
}'></div>
{{> icons/iconPartial
iconName=iconName
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

do you know why an extra space is showing up on these diffs? It might not be an issue

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

not sure I see the extra spaces

iconUrl=(relativePathHandler url=iconUrl [email protected])
}}
</div>
{{/if}}
<div class='HitchhikerCTA-iconLabel'>
Expand Down
19 changes: 11 additions & 8 deletions cards/event-standard/template.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -73,13 +73,15 @@
{{#if showExcessDetailsToggle}}
<button class="HitchhikerCard-detailsToggle js-HitchhikerCard-detailsToggle">
{{card.showMoreDetails.showMoreText}}
<span data-component="IconComponent"
data-opts='{ "iconName": "chevron", "classNames": "Icon--sm Icon-collapseDown" }'></span>
<span>
{{> icons/bakedInIcon iconName='chevron' classNames='Icon--sm Icon--collapseDown' }}
oshi97 marked this conversation as resolved.
Show resolved Hide resolved
</span>
</button>
<button class="HitchhikerCard-detailsToggle js-HitchhikerCard-detailsToggle js-hidden">
{{card.showMoreDetails.showLessText}}
<span data-component="IconComponent"
data-opts='{ "iconName": "chevron", "classNames": "Icon--sm Icon-collapseUp" }'></span>
<span>
{{> icons/bakedInIcon iconName='chevron' classNames='Icon--sm Icon--collapseUp' }}
</span>
</button>
{{/if}}
</div>
Expand All @@ -95,10 +97,11 @@
{{#if ariaLabel}}aria-label="{{ariaLabel}}"{{/if}}>
{{#if (any iconName iconUrl)}}
<div class="HitchhikerCTA-iconWrapper">
<div class="HitchhikerCTA-icon" data-component="IconComponent" data-opts='{
"iconUrl": "{{#if iconUrl}}{{#unless (isNonRelativeUrl iconUrl)}}{{@root.relativePath}}/{{/unless}}{{iconUrl}}{{/if}}",
"iconName": "{{iconName}}"
}'>
<div class="HitchhikerCTA-icon">
{{> icons/iconPartial
iconName=iconName
iconUrl=(relativePathHandler url=iconUrl [email protected])
tmeyer2115 marked this conversation as resolved.
Show resolved Hide resolved
}}
</div>
</div>
{{/if}}
Expand Down
25 changes: 13 additions & 12 deletions cards/faq-accordion/template.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,10 +7,8 @@
<h3 class="HitchhikerFaqAccordion-title">
{{{card.title}}}
</h3>
<div class="HitchhikerFaqAccordion-icon js-HitchhikerFaqAccordion-icon{{#if card.isExpanded}} HitchhikerFaqAccordion-icon--expanded{{/if}}"
data-component="IconComponent"
data-opts='{"iconName": "chevron"}'
data-prop="icon">
<div class="HitchhikerFaqAccordion-icon js-HitchhikerFaqAccordion-icon{{#if card.isExpanded}} HitchhikerFaqAccordion-icon--expanded{{/if}}">
{{> icons/bakedInIcon iconName='chevron' }}
</div>
</button>
<div class="HitchhikerFaqAccordion-content js-HitchhikerFaqAccordion-content"
Expand Down Expand Up @@ -61,13 +59,15 @@
{{#if showExcessDetailsToggle}}
<button class="HitchhikerCard-detailsToggle js-HitchhikerCard-detailsToggle">
{{card.showMoreDetails.showMoreText}}
<span data-component="IconComponent"
data-opts='{ "iconName": "chevron", "classNames": "Icon--sm Icon-collapseDown" }'></span>
<span>
{{> icons/bakedInIcon iconName='chevron' classNames='Icon--sm Icon--collapseDown' }}
</span>
</button>
<button class="HitchhikerCard-detailsToggle js-HitchhikerCard-detailsToggle js-hidden">
{{card.showMoreDetails.showLessText}}
<span data-component="IconComponent"
data-opts='{ "iconName": "chevron", "classNames": "Icon--sm Icon-collapseUp" }'></span>
<span>
{{> icons/bakedInIcon iconName='chevron' classNames='Icon--sm Icon--collapseUp' }}
</span>
</button>
{{/if}}
</div>
Expand All @@ -83,10 +83,11 @@
{{#if ariaLabel}}aria-label="{{ariaLabel}}"{{/if}}>
{{#if (any iconName iconUrl)}}
<div class="HitchhikerCTA-iconWrapper">
<div class="HitchhikerCTA-icon" data-component="IconComponent" data-opts='{
"iconUrl": "{{#if iconUrl}}{{#unless (isNonRelativeUrl iconUrl)}}{{@root.relativePath}}/{{/unless}}{{iconUrl}}{{/if}}",
"iconName": "{{iconName}}"
}'>
<div class="HitchhikerCTA-icon">
{{> icons/iconPartial
iconName=iconName
iconUrl=(relativePathHandler url=iconUrl [email protected])
}}
</div>
</div>
{{/if}}
Expand Down
19 changes: 11 additions & 8 deletions cards/financial-professional-location/template.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -102,13 +102,15 @@
{{#if showExcessDetailsToggle}}
<button class="HitchhikerCard-detailsToggle js-HitchhikerCard-detailsToggle">
{{card.showMoreDetails.showMoreText}}
<span data-component="IconComponent"
data-opts='{ "iconName": "chevron", "classNames": "Icon--sm Icon-collapseDown" }'></span>
<span>
{{> icons/bakedInIcon iconName='chevron' classNames='Icon--sm Icon--collapseDown' }}
</span>
</button>
<button class="HitchhikerCard-detailsToggle js-HitchhikerCard-detailsToggle js-hidden">
{{card.showMoreDetails.showLessText}}
<span data-component="IconComponent"
data-opts='{ "iconName": "chevron", "classNames": "Icon--sm Icon-collapseUp" }'></span>
<span>
{{> icons/bakedInIcon iconName='chevron' classNames='Icon--sm Icon--collapseUp' }}
</span>
</button>
{{/if}}
</div>
Expand Down Expand Up @@ -172,10 +174,11 @@
{{#if ariaLabel}}aria-label="{{ariaLabel}}"{{/if}}>
{{#if (any iconName iconUrl)}}
<div class="HitchhikerCTA-iconWrapper">
<div class="HitchhikerCTA-icon" data-component="IconComponent" data-opts='{
"iconUrl": "{{iconUrl}}",
"iconName": "{{iconName}}"
}'>
<div class="HitchhikerCTA-icon">
{{> icons/iconPartial
iconName=iconName
iconUrl=(relativePathHandler url=iconUrl [email protected])
}}
</div>
</div>
{{/if}}
Expand Down
18 changes: 10 additions & 8 deletions cards/job-standard/template.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -65,13 +65,15 @@
{{#if showExcessDetailsToggle}}
<button class="HitchhikerCard-detailsToggle js-HitchhikerCard-detailsToggle">
{{card.showMoreDetails.showMoreText}}
<span data-component="IconComponent"
data-opts='{ "iconName": "chevron", "classNames": "Icon--sm Icon-collapseDown" }'></span>
<span>
{{> icons/bakedInIcon iconName='chevron' classNames='Icon--sm Icon--collapseDown' }}
</span>
</button>
<button class="HitchhikerCard-detailsToggle js-HitchhikerCard-detailsToggle js-hidden">
{{card.showMoreDetails.showLessText}}
<span data-component="IconComponent"
data-opts='{ "iconName": "chevron", "classNames": "Icon--sm Icon-collapseUp" }'></span>
<span>
{{> icons/bakedInIcon iconName='chevron' classNames='Icon--sm Icon--collapseUp' }}
</span>
</button>
{{/if}}
</div>
Expand All @@ -96,10 +98,10 @@
{{#if ariaLabel}}aria-label="{{ariaLabel}}"{{/if}}>
{{#if (any iconName iconUrl)}}
<div class="HitchhikerCTA-iconWrapper">
<div class="HitchhikerCTA-icon" data-component="IconComponent" data-opts='{
"iconUrl": "{{#if iconUrl}}{{#unless (isNonRelativeUrl iconUrl)}}{{@root.relativePath}}/{{/unless}}{{iconUrl}}{{/if}}",
"iconName": "{{iconName}}"
}'></div>
{{> icons/iconPartial
iconName=iconName
iconUrl=(relativePathHandler url=iconUrl [email protected])
}}
</div>
{{/if}}
<div class='HitchhikerCTA-iconLabel'>
Expand Down
10 changes: 6 additions & 4 deletions cards/link-standard/template.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -62,13 +62,15 @@
{{#if showExcessDetailsToggle}}
<button class="HitchhikerCard-detailsToggle js-HitchhikerCard-detailsToggle">
{{card.showMoreDetails.showMoreText}}
<span data-component="IconComponent"
data-opts='{ "iconName": "chevron", "classNames": "Icon--sm Icon-collapseDown" }'></span>
<span>
{{> icons/bakedInIcon iconName='chevron' classNames='Icon--sm Icon--collapseDown' }}
</span>
</button>
<button class="HitchhikerCard-detailsToggle js-HitchhikerCard-detailsToggle js-hidden">
{{card.showMoreDetails.showLessText}}
<span data-component="IconComponent"
data-opts='{ "iconName": "chevron", "classNames": "Icon--sm Icon-collapseUp" }'></span>
<span>
{{> icons/bakedInIcon iconName='chevron' classNames='Icon--sm Icon--collapseUp' }}
</span>
</button>
{{/if}}
</div>
Expand Down
19 changes: 11 additions & 8 deletions cards/location-standard/template.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -90,10 +90,11 @@
{{#if ariaLabel}}aria-label="{{ariaLabel}}"{{/if}}>
{{#if (any iconName iconUrl)}}
<div class="HitchhikerCTA-iconWrapper">
<div class="HitchhikerCTA-icon" data-component="IconComponent" data-opts='{
"iconUrl": "{{#if iconUrl}}{{#unless (isNonRelativeUrl iconUrl)}}{{@root.relativePath}}/{{/unless}}{{iconUrl}}{{/if}}",
"iconName": "{{iconName}}"
}'>
<div class="HitchhikerCTA-icon">
{{> icons/iconPartial
iconName=iconName
iconUrl=(relativePathHandler url=iconUrl [email protected])
}}
</div>
</div>
{{/if}}
Expand Down Expand Up @@ -185,13 +186,15 @@
{{#if showExcessDetailsToggle}}
<button class="HitchhikerCard-detailsToggle js-HitchhikerCard-detailsToggle">
{{card.showMoreDetails.showMoreText}}
<span data-component="IconComponent"
data-opts='{ "iconName": "chevron", "classNames": "Icon--sm Icon-collapseDown" }'></span>
<span>
{{> icons/bakedInIcon iconName='chevron' classNames='Icon--sm Icon--collapseDown' }}
</span>
</button>
<button class="HitchhikerCard-detailsToggle js-HitchhikerCard-detailsToggle js-hidden">
{{card.showMoreDetails.showLessText}}
<span data-component="IconComponent"
data-opts='{ "iconName": "chevron", "classNames": "Icon--sm Icon-collapseUp" }'></span>
<span>
{{> icons/bakedInIcon iconName='chevron' classNames='Icon--sm Icon--collapseUp' }}
</span>
</button>
{{/if}}
</div>
Expand Down
19 changes: 11 additions & 8 deletions cards/menuitem-standard/template.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -92,13 +92,15 @@
{{#if showExcessDetailsToggle}}
<button class="HitchhikerCard-detailsToggle js-HitchhikerCard-detailsToggle">
{{card.showMoreDetails.showMoreText}}
<span data-component="IconComponent"
data-opts='{ "iconName": "chevron", "classNames": "Icon--sm Icon-collapseDown" }'></span>
<span>
{{> icons/bakedInIcon iconName='chevron' classNames='Icon--sm Icon--collapseDown' }}
</span>
</button>
<button class="HitchhikerCard-detailsToggle js-HitchhikerCard-detailsToggle js-hidden">
{{card.showMoreDetails.showLessText}}
<span data-component="IconComponent"
data-opts='{ "iconName": "chevron", "classNames": "Icon--sm Icon-collapseUp" }'></span>
<span>
{{> icons/bakedInIcon iconName='chevron' classNames='Icon--sm Icon--collapseUp' }}
</span>
</button>
{{/if}}
</div>
Expand All @@ -116,10 +118,11 @@
{{#if ariaLabel}}aria-label="{{ariaLabel}}"{{/if}}>
{{#if (any iconName iconUrl)}}
<div class="HitchhikerCTA-iconWrapper">
<div class="HitchhikerCTA-icon" data-component="IconComponent" data-opts='{
"iconUrl": "{{#if iconUrl}}{{#unless (isNonRelativeUrl iconUrl)}}{{@root.relativePath}}/{{/unless}}{{iconUrl}}{{/if}}",
"iconName": "{{iconName}}"
}'>
<div class="HitchhikerCTA-icon">
{{> icons/iconPartial
iconName=iconName
iconUrl=(relativePathHandler url=iconUrl [email protected])
}}
</div>
</div>
{{/if}}
Expand Down
19 changes: 11 additions & 8 deletions cards/multilang-event-standard/template.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -73,13 +73,15 @@
{{#if showExcessDetailsToggle}}
<button class="HitchhikerCard-detailsToggle js-HitchhikerCard-detailsToggle">
{{card.showMoreDetails.showMoreText}}
<span data-component="IconComponent"
data-opts='{ "iconName": "chevron", "classNames": "Icon--sm Icon-collapseDown" }'></span>
<span>
{{> icons/bakedInIcon iconName='chevron' classNames='Icon--sm Icon--collapseDown' }}
</span>
</button>
<button class="HitchhikerCard-detailsToggle js-HitchhikerCard-detailsToggle js-hidden">
{{card.showMoreDetails.showLessText}}
<span data-component="IconComponent"
data-opts='{ "iconName": "chevron", "classNames": "Icon--sm Icon-collapseUp" }'></span>
<span>
{{> icons/bakedInIcon iconName='chevron' classNames='Icon--sm Icon--collapseUp' }}
</span>
</button>
{{/if}}
</div>
Expand All @@ -95,10 +97,11 @@
{{#if ariaLabel}}aria-label="{{ariaLabel}}"{{/if}}>
{{#if (any iconName iconUrl)}}
<div class="HitchhikerCTA-iconWrapper">
<div class="HitchhikerCTA-icon" data-component="IconComponent" data-opts='{
"iconUrl": "{{#if iconUrl}}{{#unless (isNonRelativeUrl iconUrl)}}{{@root.relativePath}}/{{/unless}}{{iconUrl}}{{/if}}",
"iconName": "{{iconName}}"
}'>
<div class="HitchhikerCTA-icon">
tmeyer2115 marked this conversation as resolved.
Show resolved Hide resolved
{{> icons/iconPartial
iconName=iconName
iconUrl=(relativePathHandler url=iconUrl [email protected])
}}
</div>
</div>
{{/if}}
Expand Down
25 changes: 13 additions & 12 deletions cards/multilang-faq-accordion/template.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,10 +7,8 @@
<h3 class="HitchhikerFaqAccordion-title">
{{{card.title}}}
</h3>
<div class="HitchhikerFaqAccordion-icon js-HitchhikerFaqAccordion-icon{{#if card.isExpanded}} HitchhikerFaqAccordion-icon--expanded{{/if}}"
data-component="IconComponent"
data-opts='{"iconName": "chevron"}'
data-prop="icon">
<div class="HitchhikerFaqAccordion-icon js-HitchhikerFaqAccordion-icon{{#if card.isExpanded}} HitchhikerFaqAccordion-icon--expanded{{/if}}">
{{> icons/bakedInIcon iconName='chevron' }}
</div>
</button>
<div class="HitchhikerFaqAccordion-content js-HitchhikerFaqAccordion-content"
Expand Down Expand Up @@ -61,13 +59,15 @@
{{#if showExcessDetailsToggle}}
<button class="HitchhikerCard-detailsToggle js-HitchhikerCard-detailsToggle">
{{card.showMoreDetails.showMoreText}}
<span data-component="IconComponent"
data-opts='{ "iconName": "chevron", "classNames": "Icon--sm Icon-collapseDown" }'></span>
<span>
{{> icons/bakedInIcon iconName='chevron' classNames='Icon--sm Icon--collapseDown' }}
</span>
</button>
<button class="HitchhikerCard-detailsToggle js-HitchhikerCard-detailsToggle js-hidden">
{{card.showMoreDetails.showLessText}}
<span data-component="IconComponent"
data-opts='{ "iconName": "chevron", "classNames": "Icon--sm Icon-collapseUp" }'></span>
<span>
{{> icons/bakedInIcon iconName='chevron' classNames='Icon--sm Icon--collapseUp' }}
</span>
</button>
{{/if}}
</div>
Expand All @@ -83,10 +83,11 @@
{{#if ariaLabel}}aria-label="{{ariaLabel}}"{{/if}}>
{{#if (any iconName iconUrl)}}
<div class="HitchhikerCTA-iconWrapper">
<div class="HitchhikerCTA-icon" data-component="IconComponent" data-opts='{
"iconUrl": "{{#if iconUrl}}{{#unless (isNonRelativeUrl iconUrl)}}{{@root.relativePath}}/{{/unless}}{{iconUrl}}{{/if}}",
"iconName": "{{iconName}}"
}'>
<div class="HitchhikerCTA-icon">
{{> icons/iconPartial
iconName=iconName
iconUrl=(relativePathHandler url=iconUrl [email protected])
}}
</div>
</div>
{{/if}}
Expand Down
19 changes: 11 additions & 8 deletions cards/multilang-financial-professional-location/template.hbs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -102,13 +102,15 @@
{{#if showExcessDetailsToggle}}
<button class="HitchhikerCard-detailsToggle js-HitchhikerCard-detailsToggle">
{{card.showMoreDetails.showMoreText}}
<span data-component="IconComponent"
data-opts='{ "iconName": "chevron", "classNames": "Icon--sm Icon-collapseDown" }'></span>
<span>
{{> icons/bakedInIcon iconName='chevron' classNames='Icon--sm Icon--collapseDown' }}
</span>
</button>
<button class="HitchhikerCard-detailsToggle js-HitchhikerCard-detailsToggle js-hidden">
{{card.showMoreDetails.showLessText}}
<span data-component="IconComponent"
data-opts='{ "iconName": "chevron", "classNames": "Icon--sm Icon-collapseUp" }'></span>
<span>
{{> icons/bakedInIcon iconName='chevron' classNames='Icon--sm Icon--collapseUp' }}
</span>
</button>
{{/if}}
</div>
Expand Down Expand Up @@ -172,10 +174,11 @@
{{#if ariaLabel}}aria-label="{{ariaLabel}}"{{/if}}>
{{#if (any iconName iconUrl)}}
<div class="HitchhikerCTA-iconWrapper">
<div class="HitchhikerCTA-icon" data-component="IconComponent" data-opts='{
"iconUrl": "{{iconUrl}}",
tmeyer2115 marked this conversation as resolved.
Show resolved Hide resolved
"iconName": "{{iconName}}"
}'>
<div class="HitchhikerCTA-icon">
{{> icons/iconPartial
iconName=iconName
iconUrl=(relativePathHandler url=iconUrl [email protected])
}}
</div>
</div>
{{/if}}
Expand Down
Loading