function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Olga Kim 7Olga Kim 7 

lwc specialist superbadge challenge#5

Hello everyone,  
 I got stuck on challenge #5.
 
I get the error "Challenge Not yet complete... here's what's wrong:
We can’t find the correct settings for the h1 related to the boat name in the component boatTile. Make sure the component was created according to the requirements, including styling."

 
<template>
    <div onclick={selectBoat} class={tileClass}>
        <div style={backgroundStyle} class="tile"></div>
            <div class="lower-third">
                <h1 class="slds-truncate slds-text-heading_medium">{boat.Name}</h1>
                <h2 class="slds-truncate slds-text-heading_small">{boat.Contact__r.Name}</h2>
                <div class="slds-text-body_small">
                    Price: <lightning-formatted-number maximum-fraction-digits="2" format-style="currency" 
                    currency-code="USD" value={boat.Price__c}> </lightning-formatted-number>
                </div>
                <div class="slds-text-body_small"> Length: {boat.Length__c} </div>
                <div class="slds-text-body_small"> Type: {boat.BoatType__r.Name} </div>
            </div>
        </div>
    </div>
</template>

Could you help me to figure out what did I do wrong?

Thank you, in advance.


Olga 
AbhishekAbhishek (Salesforce Developers) 
Hi,

For all the Trailhead issues or Guidance please report it here,

https://trailhead.salesforce.com/en/help?support=home

https://trailhead.salesforce.com/help

So that our trailhead support engineers will look into it and get back to you.

Let me know if it helps you and close your query by marking it as solved so that it can help others in the future.

Regards,
Salesforce Support.
 
Akshay Parashar 13Akshay Parashar 13
Hi Olga,

In your html file of the component, there is one extra </div>, so please remove this and try. Hope it will help.
Rishmita SahaRishmita Saha

Hi Olga,

You can omit this line:

<div style={backgroundStyle} class="tile"></div>

Rodrigo de la Castilleja 15Rodrigo de la Castilleja 15
You need to change the boat lenght part to:
<div class = 'slds-text-body_small'>Length: <lightning-formatted-number value={boat.Length__c}></lightning-formatted-number></div>