Library developed using JavaScript for HarmonyOS
Watch the video to view how the appointment-card and article-card would be.
CardLibrary.Recording.Video.mp4
Use the below code to import the Card Component
in your entrty/src/main/js/default/pages/index/index.html
file
<element name="Card" src="../../../../../../node_modules/CardComponent/Card/index.hml"></element>
<div class="container">
// for Appointment-Card
<Card type="appointment-card" name="Sai Sumedh" sub_title="Dental" image="https://lh3.googleusercontent.com/ogw/ADea4I5L0IsuKGGz3Ne1DGm44fm2W3x2zq9vS9kiMlDP3A=s32-c-mo"></Card>
// for Article-Card
<Card type="article" name="The developer guide" sub_title="5 days ago" desc="This is a sample article. Please use this library to get awesome article components." likes="300" views="967" btncolor="gray" image="https://static4.depositphotos.com/1004590/372/i/600/depositphotos_3729494-stock-photo-new-paper-article.jpg"></Card>
</div>
It has a prop named
type it denotes which type of card should be displayed in the app.
Parameter | Default | Description |
---|---|---|
name | null | It denotes the name of the doctor for which we have scheduled the appointment |
sub_title | null | Sub_title specifies the a text with doctor's specialization |
image | null | It will be an image of the doctor |
Parameter | Default | Description |
---|---|---|
name | null | value which specifies name of the article |
sub_title | null | value that specifies the sub_title of a particular article |
image | null | image of an article |
desc | null | description of the article |
likes | null | count of likes for the article |
views | null | count of article views |
btncolor | null | the text we specify here will display the background-color of the Read-More button |
Licensed under the Apache License