Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
2
2021-155
Project overview
Project overview
Details
Activity
Releases
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Analytics
Analytics
CI / CD
Repository
Value Stream
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
2021-155
2021-155
Commits
d3972ede
Commit
d3972ede
authored
Jun 28, 2021
by
Thennakoon T.M.K.H.B. IT18004564
Browse files
Options
Browse Files
Download
Plain Diff
Merge branch 'it18004564' into 'master'
add blog card See merge request
!5
parents
33705cd0
510b5cd7
Changes
1
Hide whitespace changes
Inline
Side-by-side
Showing
1 changed file
with
124 additions
and
0 deletions
+124
-0
client/components/portfolio/blog-card/blog-card.js
client/components/portfolio/blog-card/blog-card.js
+124
-0
No files found.
client/components/portfolio/blog-card/blog-card.js
0 → 100644
View file @
d3972ede
import
React
from
'
react
'
;
import
{
makeStyles
}
from
'
@material-ui/core/styles
'
;
import
clsx
from
'
clsx
'
;
import
Card
from
'
@material-ui/core/Card
'
;
import
CardHeader
from
'
@material-ui/core/CardHeader
'
;
import
CardMedia
from
'
@material-ui/core/CardMedia
'
;
import
CardContent
from
'
@material-ui/core/CardContent
'
;
import
CardActions
from
'
@material-ui/core/CardActions
'
;
import
Collapse
from
'
@material-ui/core/Collapse
'
;
import
Avatar
from
'
@material-ui/core/Avatar
'
;
import
IconButton
from
'
@material-ui/core/IconButton
'
;
import
Typography
from
'
@material-ui/core/Typography
'
;
import
{
red
}
from
'
@material-ui/core/colors
'
;
import
FavoriteIcon
from
'
@material-ui/icons/Favorite
'
;
import
ShareIcon
from
'
@material-ui/icons/Share
'
;
import
ExpandMoreIcon
from
'
@material-ui/icons/ExpandMore
'
;
import
MoreVertIcon
from
'
@material-ui/icons/MoreVert
'
;
const
useStyles
=
makeStyles
((
theme
)
=>
({
root
:
{
maxWidth
:
345
,
},
media
:
{
height
:
0
,
paddingTop
:
'
56.25%
'
,
// 16:9
},
expand
:
{
transform
:
'
rotate(0deg)
'
,
marginLeft
:
'
auto
'
,
transition
:
theme
.
transitions
.
create
(
'
transform
'
,
{
duration
:
theme
.
transitions
.
duration
.
shortest
,
}),
},
expandOpen
:
{
transform
:
'
rotate(180deg)
'
,
},
avatar
:
{
backgroundColor
:
red
[
500
],
},
}));
export
default
function
BlogCard
()
{
const
classes
=
useStyles
();
const
[
expanded
,
setExpanded
]
=
React
.
useState
(
false
);
const
handleExpandClick
=
()
=>
{
setExpanded
(
!
expanded
);
};
return
(
<
Card
className
=
{
classes
.
root
}
>
<
CardHeader
avatar
=
{
<
Avatar
aria
-
label
=
"
recipe
"
className
=
{
classes
.
avatar
}
>
R
<
/Avatar
>
}
action
=
{
<
IconButton
aria
-
label
=
"
settings
"
>
<
MoreVertIcon
/>
<
/IconButton
>
}
title
=
"
Shrimp and Chorizo Paella
"
subheader
=
"
September 14, 2016
"
/>
<
CardMedia
className
=
{
classes
.
media
}
image
=
"
/images/portfolio/javaLogo.png
"
title
=
"
Paella dish
"
/>
<
CardContent
>
<
Typography
variant
=
"
body2
"
color
=
"
textSecondary
"
component
=
"
p
"
>
This
impressive
paella
is
a
perfect
party
dish
and
a
fun
meal
to
cook
together
with
your
guests
.
Add
1
cup
of
frozen
peas
along
with
the
mussels
,
if
you
like
.
<
/Typography
>
<
/CardContent
>
<
CardActions
disableSpacing
>
<
IconButton
aria
-
label
=
"
add to favorites
"
>
<
FavoriteIcon
/>
<
/IconButton
>
<
IconButton
aria
-
label
=
"
share
"
>
<
ShareIcon
/>
<
/IconButton
>
<
IconButton
className
=
{
clsx
(
classes
.
expand
,
{
[
classes
.
expandOpen
]:
expanded
,
})}
onClick
=
{
handleExpandClick
}
aria
-
expanded
=
{
expanded
}
aria
-
label
=
"
show more
"
>
<
ExpandMoreIcon
/>
<
/IconButton
>
<
/CardActions
>
<
Collapse
in
=
{
expanded
}
timeout
=
"
auto
"
unmountOnExit
>
<
CardContent
>
<
Typography
paragraph
>
Method
:
<
/Typography
>
<
Typography
paragraph
>
Heat
1
/
2
cup
of
the
broth
in
a
pot
until
simmering
,
add
saffron
and
set
aside
for
10
minutes
.
<
/Typography
>
<
Typography
paragraph
>
Heat
oil
in
a
(
14
-
to
16
-
inch
)
paella
pan
or
a
large
,
deep
skillet
over
medium
-
high
heat
.
Add
chicken
,
shrimp
and
chorizo
,
and
cook
,
stirring
occasionally
until
lightly
browned
,
6
to
8
minutes
.
Transfer
shrimp
to
a
large
plate
and
set
aside
,
leaving
chicken
and
chorizo
in
the
pan
.
Add
piment
ó
n
,
bay
leaves
,
garlic
,
tomatoes
,
onion
,
salt
and
pepper
,
and
cook
,
stirring
often
until
thickened
and
fragrant
,
about
10
minutes
.
Add
saffron
broth
and
remaining
4
1
/
2
cups
chicken
broth
;
bring
to
a
boil
.
<
/Typography
>
<
Typography
paragraph
>
Add
rice
and
stir
very
gently
to
distribute
.
Top
with
artichokes
and
peppers
,
and
cook
without
stirring
,
until
most
of
the
liquid
is
absorbed
,
15
to
18
minutes
.
Reduce
heat
to
medium
-
low
,
add
reserved
shrimp
and
mussels
,
tucking
them
down
into
the
rice
,
and
cook
again
without
stirring
,
until
mussels
have
opened
and
rice
is
just
tender
,
5
to
7
minutes
more
.
(
Discard
any
mussels
that
don
’
t
open
.)
<
/Typography
>
<
Typography
>
Set
aside
off
of
the
heat
to
let
rest
for
10
minutes
,
and
then
serve
.
<
/Typography
>
<
/CardContent
>
<
/Collapse
>
<
/Card
>
);
}
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment