Files
fleet/website/assets/styles/components/animated-arrow-button.component.less
43125442b0 Website: Remove 'Want to learn more?' from homepage banner (#42433)
## Summary
- Removes the phrase "Want to learn more?" from the blue announcement
banner on the Fleet homepage
- The rest of the banner text and link remain intact: "We are
experiencing a high volume of Jamf replacement inquiries. Click here
compare Fleet vs. Jamf"

## Changes
- `website/views/pages/homepage.ejs`: Removed "Want to learn more?" from
the `<animated-arrow-button>` text content inside the
`announcement-banner` div
- Updated the margin of the announcement banner to match the page
margins at smaller widths.


---

Built for [Ashish
Kuthiala](https://fleetdm.slack.com/archives/D0AG9JQ53GA/p1774487591893139)
by [Kilo for Slack](https://kilo.ai/features/slack-integration)

---------

Co-authored-by: kiloconnect[bot] <240665456+kiloconnect[bot]@users.noreply.github.com>
Co-authored-by: Ashish Kuthiala <53918208+akuthiala@users.noreply.github.com>
Co-authored-by: Eric <eashaw@sailsjs.com>
2026-03-26 10:38:22 -05:00

66 lines
1.4 KiB
Plaintext
Vendored

/**
* <animated-arrow-button>
*
* App-wide styles for our animated arrow buttons.
*/
[parasails-component='animated-arrow-button'] {
width: fit-content;
display: flex;
align-items: center;
padding: 6px 0px;
text-decoration: none;
font-weight: 700;
cursor: pointer;
[purpose='button-text'] {
color: @core-fleet-black;
}
[purpose='animated-arrow'] {
margin-left: 8px;
stroke-width: 2px;
min-height: 12px;
min-width: 12px;
fill: none;
// stroke: #FF5C83; « Note: this is overridden by the arrow-color prop;
}
[purpose='arrow-line'] {
opacity: 0;
transition: opacity 10ms ease-out;
}
[purpose='chevron'] {
transition: transform 200ms ease-out;
}
// FUTURE: uncomment this section and add support for multiple button types.
// &.secondary {
// [purpose='animated-arrow'] {
// stroke: #FF5C83;
// }
// }
// &.primary {
// padding: 6px 12px 6px 16px;
// background: #FF5C83;
// border-radius: 18px;
// margin-right: 32px;
// [purpose='button-text'] {
// color: #FFF;
// }
// [purpose='animated-arrow'] {
// stroke: #FFF;
// }
// }
&:hover {
text-decoration: none;
[purpose='button-text'] {
color: @core-fleet-black;
}
[purpose='arrow-line'] {
opacity: 1;
transition: opacity 300ms ease-out;
}
[purpose='chevron'] {
transform: translateX(5px);
}
}
}