<!DOCTYPE html>
<
html
lang
=
"en"
dir
=
"ltr"
>
<
head
>
<
meta
charset
=
"utf-8"
>
<
title
>Text Editor</
title
>
<
link
rel
=
"stylesheet"
href
=
integrity
=
"sha384-TX8t27EcRE3e/ihU7zmQxVncDAy5uIKz4rEkgIXeMed4M0jlfIDPvg6uqKI2xXr2"
crossorigin
=
"anonymous"
>
<
link
rel
=
"stylesheet"
href
=
integrity
=
"sha512-PgQMlq+nqFLV4ylk1gwUOgm6CtIIXkKwaIHp/PAIWHzig/lKZSEGKEysh0TCVbHJXCLN7WetD8TFecIky75ZfQ=="
crossorigin
=
"anonymous"
/>
<
link
rel
=
"stylesheet"
href
=
integrity
=
"sha384-AYmEC3Yw5cVb3ZcuHtOA93w35dYTsvhLPVnYs9eStHfGJvOvKxVfELGroGkvsg+p"
crossorigin
=
"anonymous"
/>
<
style
>
h1 {
padding-top: 40px;
padding-bottom: 40px;
text-align: center;
color: #957dad;
font-family: 'Montserrat', sans-serif;
}
section {
padding: 5%;
padding-top: 0;
height: 100vh;
}
.side {
margin-left: 0;
}
button {
margin: 10px;
border-color: #957dad !important;
color: #888888 !important;
margin-bottom: 25px;
}
button:hover {
background-color: #fec8d8 !important;
}
textarea {
padding: 3%;
border-color: #957dad;
border-width: thick;
}
.flex-box {
display: flex;
justify-content: center;
}
</
style
>
</
head
>
<
body
>
<
section
class
=
""
>
<
h1
class
=
"shadow-sm"
>TEXT EDITOR</
h1
>
<
div
class
=
"flex-box"
>
<
div
class
=
"row"
>
<
div
class
=
"col"
>
<
button
type
=
"button"
onclick
=
"f1()"
class
=
" shadow-sm btn btn-outline-secondary"
data-toggle
=
"tooltip"
data-placement
=
"top"
title
=
"Bold Text"
>
Bold</
button
>
<
button
type
=
"button"
onclick
=
"f2()"
class
=
"shadow-sm btn btn-outline-success"
data-toggle
=
"tooltip"
data-placement
=
"top"
title
=
"Italic Text"
>
Italic</
button
>
<
button
type
=
"button"
onclick
=
"f3()"
class
=
" shadow-sm btn btn-outline-primary"
data-toggle
=
"tooltip"
data-placement
=
"top"
title
=
"Left Align"
>
<
i
class
=
"fas fa-align-left"
></
i
></
button
>
<
button
type
=
"button"
onclick
=
"f4()"
class
=
"btn shadow-sm btn-outline-secondary"
data-toggle
=
"tooltip"
data-placement
=
"top"
title
=
"Center Align"
>
<
i
class
=
"fas fa-align-center"
></
i
></
button
>
<
button
type
=
"button"
onclick
=
"f5()"
class
=
"btn shadow-sm btn-outline-primary"
data-toggle
=
"tooltip"
data-placement
=
"top"
title
=
"Right Align"
>
<
i
class
=
"fas fa-align-right"
></
i
></
button
>
<
button
type
=
"button"
onclick
=
"f6()"
class
=
"btn shadow-sm btn-outline-secondary"
data-toggle
=
"tooltip"
data-placement
=
"top"
title
=
"Uppercase Text"
>
Upper Case</
button
>
<
button
type
=
"button"
onclick
=
"f7()"
class
=
"btn shadow-sm btn-outline-primary"
data-toggle
=
"tooltip"
data-placement
=
"top"
title
=
"Lowercase Text"
>
Lower Case</
button
>
<
button
type
=
"button"
onclick
=
"f8()"
class
=
"btn shadow-sm btn-outline-primary"
data-toggle
=
"tooltip"
data-placement
=
"top"
title
=
"Capitalize Text"
>
Capitalize</
button
>
<
button
type
=
"button"
onclick
=
"f9()"
class
=
"btn shadow-sm btn-outline-primary side"
data-toggle
=
"tooltip"
data-placement
=
"top"
title
=
"Tooltip on top"
>
Clear Text</
button
>
</
div
>
</
div
>
</
div
>
<
br
>
<
div
class
=
"row"
>
<
div
class
=
"col-md-3 col-sm-3"
>
</
div
>
<
div
class
=
"col-md-6 col-sm-9"
>
<
div
class
=
"flex-box"
>
<
textarea
id
=
"textarea1"
class
=
"input shadow"
name
=
"name"
rows
=
"15"
cols
=
"100"
placeholder
=
"Your text here "
>
</
textarea
>
</
div
>
</
div
>
<
div
class
=
"col-md-3"
>
</
div
>
</
div
>
</
section
>
<
br
>
<
br
>
<
h6
style
=
"text-align:center;"
>Priyansh Jha 2021.</
h6
>
<
script
src
=
"home.js"
></
script
>
</
body
>
</
html
>