From 085ba26b40b31aeabbbaeea478c38a9f4755c7c8 Mon Sep 17 00:00:00 2001 From: AngeloChristian1 Date: Mon, 3 Apr 2023 09:01:05 +0200 Subject: [PATCH 01/16] Adding menu changes to the product page --- assets/css/product.css | 169 +++++++++++++++++++++++++++++++++++++++++ pages/product.html | 133 ++++++++++++++++++++++++++++++++ 2 files changed, 302 insertions(+) diff --git a/assets/css/product.css b/assets/css/product.css index e69de29..2201c9e 100644 --- a/assets/css/product.css +++ b/assets/css/product.css @@ -0,0 +1,169 @@ +.prodContainer{ + margin:40px; + display:block; + align-items: center; + justify-content: center; + font-size: 1.2em; + position:relative; + font-family: monospace; + +} +.upperPart{ + margin:15px 100px; + justify-self: center; + +} +.title{ + text-align: center; + margin:0px 00px; + +} +.mainTitle{ + margin-left:250px; + + width:200px; + padding:auto 0px; + font-size: 1.5em; +} + .mainTitle::before, + .mainTitle::after{ + content: ""; + font-size: .5px; + width:10px; + margin: 0px 20px 4px 20px; + padding:5px 60px 0px 60px; + flex: 1 0 20px; + background: black; + +} + +.amount{ + font-size:1.15em; + font-weight : 0; +} +.btn{ + padding:10px 20px; + background: rgb(219, 219, 219); + border-radius:30px; + border:none; + margin-top: -30px; + +} + +.btn.active{ + background: orange; + font-weight: 700; +} + +.status{ + justify-items: center; + padding-left:20%; +} +.status .btn{ + padding:15px 25px; + margin:5px; +} +.align{ + display:flex +} +.lowerPart { + margin:60px 5px; +} +.align{ + margin-bottom: 0; + padding-bottom:0; +} + +.align .btn{ + margin-top: 10px; +} +.align .accomplished p{ + font-size: 1.3em; + margin-right:20px; + margin-top: 15px; + font-weight: 900; +} +.accomplished .amount{ + font-weight: 100; + font-size: 1em; +} +.feedBack{ + + margin:0 0 0 30px; +} +/* card boxes */ + +.cards{ + +} +.upperCards{ + display:flex; +} +.lowerCards{ + display:flex; +} +.box{ + height: 320px; + width:300px; + border:1px solid black; + margin: 10px 40px 20px 10px; + border-radius: 5%; + padding:10px 15px 10px 15px; +} +.rateStar{ + display: flex; + flex-direction: row-reverse; + /* margin-right: 25px; */ +} +.rateStar img{ + width:20px; + height:20px; + margin:5px; + margin-top: 15px; +} +.rateStar p{ + font-weight: 900; +} +.sttImages img{ + align-self: flex-end; + margin-left: 25px; + width:230px; + height: 100px +} +.fileImages{ + width:50px; + margin-left: 100px; + margin-top: -40px; +} +.ttsImages{ + width:100px; + margin-left: 55px; + margin-right: 5px; + margin-bottom: 50px;; +} +.boxText{ + text-align: center; +} +.boxOptions{ + display:flex; + text-align: center; + +} +.boxOptions p{ + margin:10px 45px 0 20px; + font-weight: 600; + flex-direction: column; + font-size: 1.04em; +} +.boxOptions p:hover{ + color:orange; +} +.boxOptionsp1{ + margin-left: 30px; +} + +/* responsive try */ +@media only sreen and (max-width=1920) +{ + +} \ No newline at end of file diff --git a/pages/product.html b/pages/product.html index 789c4a9..4f6991b 100644 --- a/pages/product.html +++ b/pages/product.html @@ -9,6 +9,139 @@
+
+
+

Projects

+
+
+ + +
+
+
+
+
+

Projects accomplished (131)

+
+
+ + + +
+
+
+ +
+
+ +
+
+
+
+ +

4.5

+
+
+ +
+
+

Speech To Text

+

Speak Kinyarwanda and get the test of the spoken words

+
+
+

Try it out

+

Read more

+
+
+
+
+ +

4.5

+
+
+ +
+
+

Text to Speech

+

Write Kinyarwanda and get audio voice of the written sentence

+
+
+

Try it out

+

Read more

+
+
+
+
+ +

4.5

+
+
+ +
+
+

Kinyarwanda Dataset SST

+

Over 2000 hours of Kinyarwanda voice data, making it the second-biggest open voice dataset on the common voice platform

+
+
+

Download

+

Read more

+
+
+
+
+
+
+ +

4.5

+
+
+ +
+
+

Speech To Text

+

Speak Kinyarwanda and get the test of the spoken words

+
+
+

Try it out

+

Read more

+
+
+
+
+ +

4.5

+
+
+ +
+
+

Text to Speech

+

Write Kinyarwanda and get audio voice of the written sentence

+
+
+

Try it out

+

Read more

+
+
+
+
+ +

4.5

+
+
+ +
+
+

Kinyarwanda Dataset SST

+

Over 2000 hours of Kinyarwanda voice data, making it the second-biggest open voice dataset on the common voice platform

+
+
+

Download

+

Read more

+
+
+
+
From 9892fe4ee0dd6479e55df9b1b9c48dcc4c9f6cd5 Mon Sep 17 00:00:00 2001 From: Gatete Ishema Angelo Chrristian Date: Thu, 6 Apr 2023 19:14:57 +0200 Subject: [PATCH 02/16] Adding responsive changes on product page --- assets/css/product.css | 563 +++++++++++++++++++++++++++++++---------- pages/product.html | 295 +++++++++++---------- 2 files changed, 589 insertions(+), 269 deletions(-) diff --git a/assets/css/product.css b/assets/css/product.css index 2201c9e..8080b1e 100644 --- a/assets/css/product.css +++ b/assets/css/product.css @@ -1,169 +1,468 @@ -.prodContainer{ - margin:40px; - display:block; - align-items: center; - justify-content: center; - font-size: 1.2em; - position:relative; - font-family: monospace; +.prodContainer { + margin: 40px; + display: block; + align-items: center; + justify-content: center; + font-size: 1.2em; + position: relative; + font-family: monospace; +} +.upperPart { + margin: 15px 100px; + justify-self: center; +} +.title { + text-align: center; + margin: 0px 00px; +} +.mainTitle { + margin-left: 250px; + width: 200px; + padding: auto 0px; + font-size: 1.5em; +} +.mainTitle::before, +.mainTitle::after { + content: ""; + font-size: 0.5px; + width: 10px; + margin: 0px 20px 4px 20px; + padding: 5px 60px 0px 60px; + flex: 1 0 20px; + background: black; } -.upperPart{ - margin:15px 100px; - justify-self: center; - + +.amount { + font-size: 1.15em; + font-weight: 0; } -.title{ - text-align: center; - margin:0px 00px; - +.btn { + padding: 10px 20px; + background: rgb(219, 219, 219); + border-radius: 30px; + border: none; + margin-top: -30px; } -.mainTitle{ - margin-left:250px; - width:200px; - padding:auto 0px; - font-size: 1.5em; -} - .mainTitle::before, - .mainTitle::after{ - content: ""; - font-size: .5px; - width:10px; - margin: 0px 20px 4px 20px; - padding:5px 60px 0px 60px; - flex: 1 0 20px; - background: black; - +.btn:hover { + background: rgb(171, 171, 171); } - -.amount{ - font-size:1.15em; - font-weight : 0; -} -.btn{ - padding:10px 20px; - background: rgb(219, 219, 219); - border-radius:30px; - border:none; - margin-top: -30px; - +.btn.active { + background: orange; + font-weight: 700; + transition: 0.5s; } - -.btn.active{ - background: orange; - font-weight: 700; +.btn.active:hover { + background: rgb(227, 148, 2); } -.status{ - justify-items: center; - padding-left:20%; +.status { + position: static; + margin-left: 320px; + width: 350px; + margin-right: 350px; } -.status .btn{ - padding:15px 25px; - margin:5px; +.status .btn { + padding: 15px 25px; + margin: 5px; } -.align{ - display:flex +.align { + display: flex; } -.lowerPart { - margin:60px 5px; +.lowerPart { + margin: 60px 5px; } -.align{ - margin-bottom: 0; - padding-bottom:0; +.align { + margin-bottom: 0; + padding-bottom: 0; } -.align .btn{ - margin-top: 10px; +.align .btn { + margin-top: 10px; } -.align .accomplished p{ - font-size: 1.3em; - margin-right:20px; - margin-top: 15px; - font-weight: 900; +.align .accomplished p { + font-size: 1.3em; + margin-right: 20px; + margin-top: 15px; + font-weight: 900; } -.accomplished .amount{ - font-weight: 100; - font-size: 1em; +.accomplished .amount { + font-weight: 100; + font-size: 1em; } -.feedBack{ - - margin:0 0 0 30px; +.feedBack { + margin: 0 0 0 30px; } /* card boxes */ -.cards{ - -} -.upperCards{ - display:flex; +.cards { + margin-left: 60px; + /* */ +} +.upperCards { + display: flex; +} +.lowerCards { + display: flex; +} +.box { + height: 320px; + width: 25%; + border: 1px solid black; + margin: 10px 40px 20px 10px; + border-radius: 5%; + padding: 10px 15px 10px 15px; +} +.rateStar { + display: flex; + flex-direction: row-reverse; + /* margin-right: 25px; */ +} +.rateStar img { + width: 20px; + height: 20px; + margin: 5px; + margin-top: 15px; +} +.rateStar p { + font-weight: 900; +} +.sttImages img { + align-self: flex-end; + margin-left: 25px; + width: 230px; + height: 100px; +} +.fileImages { + width: 50px; + margin-left: 100px; + margin-top: -40px; +} +.ttsImages { + width: 100px; + margin-left: 55px; + margin-right: 5px; + margin-bottom: 50px; +} +.boxText { + text-align: center; +} +.boxOptions { + display: flex; + text-align: center; +} +.boxOptions p { + margin: 10px 45px 0 20px; + font-weight: 600; + flex-direction: column; + font-size: 1.04em; +} +.boxOptions p:hover { + color: orange; +} +.boxOptionsp1 { + margin-left: 30px; +} +.box6.boxOptions { +} +.fileText { + font-size: 150%; } -.lowerCards{ - display:flex; -} -.box{ + +/* responsive try */ +@media screen and (max-width: 1920px) { + body { + } + .upperCards { + display: flex; + } + .status { + margin-left: 400px; + width: 350px; + margin-right: 350px; + } + .lowerCards { + display: flex; + } + .box { height: 320px; - width:300px; - border:1px solid black; + width: 300px; + border: 1px solid black; margin: 10px 40px 20px 10px; border-radius: 5%; - padding:10px 15px 10px 15px; -} -.rateStar{ - display: flex; - flex-direction: row-reverse; - /* margin-right: 25px; */ + padding: 10px 15px 10px 15px; + } + .cards { + margin-left: 60px; + } + .title { + text-align: center; + margin: 0px 00px; + } + .mainTitle { + margin-left: 320px; + } + .fileText { + font-size: 0.95em; + } } -.rateStar img{ - width:20px; - height:20px; - margin:5px; - margin-top: 15px; + +@media screen and (max-width: 1285px) { + .title { + text-align: center; + margin: 0px 00px; + } + .mainTitle { + margin-left: 270px; + } + .status { + margin-left: 340px; + width: 350px; + margin-right: 350px; + } + + .fileText { + font-size: 0.95em; + } + .boxOptions { + font-size: 0.9em; + } } -.rateStar p{ - font-weight: 900; +@media screen and (max-width: 1270px) { } -.sttImages img{ - align-self: flex-end; - margin-left: 25px; - width:230px; - height: 100px +@media screen and (max-width: 1256px) { + .boxOptions { + display: flex; + text-align: center; + } + .cards { + margin-left: 40px; + /* */ + } + .boxOptions p { + font-size: 1em; + font-weight: 600; + } + .box { + height: 310px; + width: 280px; + margin: 10px 40px 20px 10px; + border-radius: 5%; + padding: 10px 15px 10px 15px; + } + .fileText { + font-size: 100%; + } } -.fileImages{ - width:50px; - margin-left: 100px; - margin-top: -40px; + +@media screen and (max-width: 1206px) { + .box { + height: 310px; + width: 260px; + margin: 10px 35px 20px 10px; + border-radius: 5%; + padding: 10px 15px 10px 15px; + } + .fileImages { + width: 45px; + height: 90px; + margin-left: 90px; + margin-top: -45px; + } } -.ttsImages{ - width:100px; - margin-left: 55px; + +@media screen and (max-width: 1199px) { + .fileImages { + width: 45px; + height: 90px; + margin-left: 90px; + margin-top: -45px; + } + .ttsImages { + width: 95px; + margin-left: 52px; margin-right: 5px; - margin-bottom: 50px;; -} -.boxText{ + margin-bottom: 40px; + margin-top: -12px; + } + .sttImages { + margin-right: 0px; + margin-left: -15px; + margin-top: -12px; + } +} +@media screen and (max-width: 1100px) { + .fileText { + font-size: 0.91em; + margin-top: -5px; + } + .sttImages { + margin-right: 0px; + margin-left: -15px; + margin-top: -15px; + } + .sttText { + font-size: 0.91em; + } + .ttsText { + font-size: 0.91em; + } + .card { + margin-left: 20px; + } + .mainTitle { + margin-left: 270px; + } + .status { + margin-left: 310px; + width: 350px; + margin-right: 350px; + } +} +@media screen and (max-width: 1030px) { + .status { + margin-left: 200px; + width: 350px; + margin-right: 350px; + } + .lowerCards { + display: flex; + } + .box { + height: 320px; + width: 300px; + border: 1px solid black; + margin: 10px 40px 20px 10px; + border-radius: 5%; + padding: 10px 15px 10px 15px; + } + .title { text-align: center; -} -.boxOptions{ - display:flex; + margin: 0px 00px; + } + .mainTitle { + margin-left: 130px; + } + .upperCards { + flex-wrap: wrap; + display: inline-flex; + } + .lowerCards { + flex-wrap: wrap; + display: inline-flex; + } +} +@media screen and (max-width: 900px) { + .title { text-align: center; - -} -.boxOptions p{ - margin:10px 45px 0 20px; - font-weight: 600; - flex-direction: column; - font-size: 1.04em; + margin: 0px 00px; + } + .mainTitle { + margin-left: 10%; + } + .status { + margin-left: 23%; + width: 350px; + } +} +@media screen and (max-width: 765px) { + .btn { + padding: 7px 17px; + margin-top: -30px; + } + .status .btn { + padding: 12px 22px; + margin: 5px; + } + .lowerPart { + margin: 40px 5px; + } + .align { + margin-bottom: 0; + padding-bottom: 0; + } + + .align .btn { + margin-top: 10px; + } + .align .accomplished p { + font-size: 1.15em; + margin-right: 20px; + margin-top: 15px; + font-weight: 900; + } + .accomplished .amount { + font-weight: 100; + font-size: 1em; + } } -.boxOptions p:hover{ - color:orange; +@media screen and (max-width: 715px) { + .align .accomplished p { + font-size: 1.15em; + margin-right: 20px; + margin-top: 15px; + font-weight: 900; + } + .accomplished .amount { + font-weight: 100; + font-size: 1em; + } + .align .btn { + margin-top: 10px; + } + .upperPart { + margin: 15px 100px; + } + .align { + display: block; + margin-left: 27%; + margin-bottom: 15px; + } + .align p { + margin-left: 20px; + } + .cards { + margin-left: 20%; + } + .feed { + margin-left: 15%; + } +} +@media screen and (max-width: 705px) { + .mainTitle { + margin-left: 5%; + margin-right: 5%; + } + .status { + margin-left: 23%; + width: 350px; + } + .mainTitle::before, + .mainTitle::after { + width: 6px; + margin: 0px 20px 4px 20px; + padding: 5px 40px 0px 40px; + flex: 1 0 20px; + background: black; + } } -.boxOptionsp1{ - margin-left: 30px; +@media screen and (max-width: 585px) { + .prodContainer { + margin-left: -10px; + } } -/* responsive try */ -@media only sreen and (max-width=1920) -{ - -} \ No newline at end of file +@media screen and (max-width: 500px) { + .prodContainer { + margin-left: -15px; + } + .mainTitle { + margin-left: 0%; + margin-right: 5%; + } + .status { + margin-left: 10%; + width: 350px; + } +} diff --git a/pages/product.html b/pages/product.html index 4f6991b..e5bd292 100644 --- a/pages/product.html +++ b/pages/product.html @@ -1,148 +1,169 @@ - - - - + + + + Mbaza product List - - - + + +
-
-
-

Projects

+
+
+

+ Projects +

+
+
+ + +
+
+
+
+
+

Projects accomplished (131)

+
+
+ + + +
+
+
+ +
+
+ +
+
+
+
+ +

4.5

+
+
+ +
+
+

Speech To Text

+

Speak Kinyarwanda and get the test of the spoken words

+
+
+

Try it out

+

Read more

+
+
+
+
+ +

4.5

+
+
+ +
+
+

Text to Speech

+

+ Write Kinyarwanda and get audio voice of the written sentence +

+
+
+

Try it out

+

Read more

+
+
+
+
+ +

4.5

+
+
+
-
- - +
+

Kinyarwanda Dataset SST

+

+ Over 2000 hours of Kinyarwanda voice data, making it the + second-biggest open voice dataset on the common voice platform +

+
+

Download

+

Read more

+
+
-
-
-
-

Projects accomplished (131)

-
-
- - - -
-
-
- -
+
+
+
+ +

4.5

- -
-
-
-
- -

4.5

-
-
- -
-
-

Speech To Text

-

Speak Kinyarwanda and get the test of the spoken words

-
-
-

Try it out

-

Read more

-
-
-
-
- -

4.5

-
-
- -
-
-

Text to Speech

-

Write Kinyarwanda and get audio voice of the written sentence

-
-
-

Try it out

-

Read more

-
-
-
-
- -

4.5

-
-
- -
-
-

Kinyarwanda Dataset SST

-

Over 2000 hours of Kinyarwanda voice data, making it the second-biggest open voice dataset on the common voice platform

-
-
-

Download

-

Read more

-
-
-
-
-
-
- -

4.5

-
-
- -
-
-

Speech To Text

-

Speak Kinyarwanda and get the test of the spoken words

-
-
-

Try it out

-

Read more

-
-
-
-
- -

4.5

-
-
- -
-
-

Text to Speech

-

Write Kinyarwanda and get audio voice of the written sentence

-
-
-

Try it out

-

Read more

-
-
-
-
- -

4.5

-
-
- -
-
-

Kinyarwanda Dataset SST

-

Over 2000 hours of Kinyarwanda voice data, making it the second-biggest open voice dataset on the common voice platform

-
-
-

Download

-

Read more

-
-
+
+ +
+
+

Speech To Text

+

Speak Kinyarwanda and get the test of the spoken words

+
+
+

Try it out

+

Read more

+
+
+
+
+ +

4.5

+
+
+ +
+
+

Text to Speech

+

+ Write Kinyarwanda and get audio voice of the written sentence +

+
+

Try it out

+

Read more

+
+
+
+
+ +

4.5

+
+
+ +
+
+

Kinyarwanda Dataset SST

+

+ Over 2000 hours of Kinyarwanda voice data, making it the + second-biggest open voice dataset on the common voice platform +

+
+
+

Download

+

Read more

+
+
- +
- - \ No newline at end of file + + From fa6e33049380e41ad00cbf56d759ab483c317afe Mon Sep 17 00:00:00 2001 From: MUNYESHURImanzi Date: Sat, 8 Apr 2023 16:06:42 +0200 Subject: [PATCH 03/16] descrition text --- assets/css/product-details.css | 108 +++++++++++++++++++++++++++++++++ pages/product-details.html | 72 +++++++++++++++++++++- 2 files changed, 179 insertions(+), 1 deletion(-) diff --git a/assets/css/product-details.css b/assets/css/product-details.css index e69de29..d3310a4 100644 --- a/assets/css/product-details.css +++ b/assets/css/product-details.css @@ -0,0 +1,108 @@ +@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700;800&display=swap"); +body{ + + margin: 2px 0px 0px 171px; + background: #F5F5F5; +} +.container{ + height: 10vh; + text-decoration: none; + text-align: center; + display: flex; + justify-content: center; + margin-right: 400px; + +} +.heading{ + padding-right: 20px; + display: grid; + grid-template-columns: repeat(3,1fr); + align-items: center; + font-family: 'Inter'; + font-style: normal; + font-weight: 700; + font-size: 16px; + line-height: 19px; + color: #000000; +} +.heading::before{ + content: ""; + background: #000100; + display: block; + margin-left: 20px; + height: 1px; + width: 50px; +} +.heading::after{ + content: ""; + background: #000100; + margin-left: 20px; + display: block; + width: 50px; + height: 1px; +} +.text h1{ + + font-family: 'Inter'; + font-style: normal; + font-weight: 700; + font-size: 16px; + padding-bottom: 0px; + + color: #000000; +} +.text h1 i { + font-family: 'Inter'; + font-style: normal; + font-weight: 400; + font-size: 14px; + padding-bottom: 0px; +} +em{ + font-family: 'Inter'; + font-style: normal; + font-weight: 700; + font-size: 14px; + line-height: 17px; + color: #699BF7; +} +i{ + font-family: 'Inter'; + font-style: normal; + font-weight: 400; + font-size: 14px; + color: #000000; +} +.text p { + padding-bottom: 0px; + font-family: 'Inter'; + font-style: normal; + font-weight: 400; + font-size: 14px; + line-height: 17px; + margin-left: 19px; + color: #000000; +} +.metrics{ + display: flex; + margin-left: 19px; +} +.metrics small{ + font-family: 'Inter'; + font-style: normal; + font-weight: 400; + font-size: 12px; + line-height: 17px; + color: #000000; +} +.number b img{ + display: inline; +} +.number { + margin-left: 10px; + font-family: 'Inter'; + font-style: normal; + font-weight: 700; + font-size: 12px; + line-height: 20px; +} diff --git a/pages/product-details.html b/pages/product-details.html index 22dbc58..b2844b1 100644 --- a/pages/product-details.html +++ b/pages/product-details.html @@ -9,8 +9,78 @@
-
+ +
+ +

Speech to Text

+ +
+
+

Name: Speech to text (STT) model

+ +

Description :

+

+ The Kinyarwanda Speech-to-Text (STT) Model project is focused on creating an accurate machine learning model for transcribing spoken
+ Kinyarwanda into written text. With over 12 million speakers worldwide, Kinyarwanda is an important language to develop speech
+ recognition technology for.

+ + The project will involve collecting a large dataset of spoken Kinyarwanda and using it to train a deep learning model. The model will be
+ evaluated using metrics such as accuracy and word error rate, and its performance will be compared to other existing STT models for
+ African languages.,
+ The ultimate goal of the project is to improve access to information and communication for Kinyarwanda speakers by enabling them to use
+ voice-enabled technology to interact with digital devices and services. Overall, the Kinyarwanda STT Model project has the potential to
+ make a significant impact in improving accessibility and inclusivity for Kinyarwanda speakers.
+ +

+

License : Speech to text (STT) model

+

Scope :

+

+ The ultimate goal of the project is to improve access to information and communication for Kinyarwanda speakers by enabling them to use
+ voice-enabled technology to interact with digital devices and services. The project's scope appears to be focused on developing a
+ language model for Kinyarwanda specifically, with potential for future applications in speech recognition and natural language processing.
+

+

Timeline : Feb 2023 - March 2023

+

Price : Free

+

Contributors : Rene Promesse, Arnaud, Floris, Samuel

+

Partners/Sponsors : MiniICT

+

Metrics

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Transcription accuracy:4.5 ./s
Word Error Rate (WER):4.5 ./s
Character Error Rate (CER): 4.5 ./s
Sentence Error Rate (SER): 4.5 ./s
Recognition Accuracy:4.5 ./s
Latency:5s ./s
+
+
From f9369f8dfdf4d8070f056b4d8a14bc9218145429 Mon Sep 17 00:00:00 2001 From: Y-elv Date: Sat, 8 Apr 2023 16:30:29 +0200 Subject: [PATCH 04/16] cards --- assets/css/product.css | 205 +++++++++++++++++++++++++++++++++++++++++ pages/product.html | 112 ++++++++++++++++++++++ 2 files changed, 317 insertions(+) diff --git a/assets/css/product.css b/assets/css/product.css index e69de29..eca0c98 100644 --- a/assets/css/product.css +++ b/assets/css/product.css @@ -0,0 +1,205 @@ + +.prodContainer{ + width: 100%; + + margin-left: 200px; + margin-top: 80px; + display: flex; + flex-direction: column; + + + + +} +.container{ + + border: 1px solid; + margin-top: 0%; + justify-content: space-between; + border-radius: 20px 20px 20px 20px; + margin-right: 30px; + width: 21% ; + height:9% ; +} +.under{ + display: flex; +flex-direction: row; + +} +.above{ + + padding-bottom: 10px; + display: flex; + flex-direction: row; + +} + +.first { + padding-right: 10px; + margin-bottom: -20px; +} + + + + +.first { + display: flex; + flex-direction:row; + justify-content: flex-end; +} +.first p{ + font-family: sans-serif; + + font-weight: bolder; +} +.first img{ + padding-top: 15px; + height: 19px; +} +.first { + padding-right: 10px; + margin-bottom: -20px; +} + + + + +.first2 { + display: flex; + flex-direction:row; + justify-content: flex-end; +} +.first2 p{ + + font-weight: bolder; +} +.first2 img{ + padding-top: 15px; + + height: 19px; +} +.first2 { + padding-right: 10px; + +} + + +.second img{ + padding-left: 49px; + height: 100px; +} +.second-img{ + padding-left: 49px; + height: 109px; + padding-top: 25px; + +} + +.secon img{ + height: 73px; + padding-left: 100px; +} +.third h3{ + padding-left: 70px; + font-size: 14px; + font-family: sans-serif; + font-weight: bold; + align-items: center; + justify-content: center; +} +.third1 h3{ + padding-left: 50px; + padding-top: 12px; + font-size: 14px; + font-family: sans-serif; + font-weight: bold; + align-items: center; + justify-content: center; +} +.third1 p{ + font-family: sans-serif; + font-size: smaller; + align-items: center; + justify-content: center; + padding-left: 4px; +} + +.third p{ + font-family: sans-serif; + font-size: small; + align-items: center; + justify-content: center; + padding-left: 4px; +} +.third1 { + align-items: center; + justify-content: center; + padding-left: 10px; + padding-top: 5px; + +} + +.third { + align-items: center; + justify-content: center; + padding-left: 10px; + font-size: 10px; +} +.third span{ + align-items: center; + justify-content: center; + padding-left: 65px; +} +.third1 span{ + align-items: center; + justify-content: center; + padding-left: -4px; + +} +.third2 span{ + align-items: center; + justify-content: center; + padding-left: 12px; + +} +.third2 { + align-items: center; + justify-content: center; + margin-top: -32px; + padding-left: 10px; +} +.third2 h3{ + padding-left: 70px; + font-size: 14px; + font-family: sans-serif; + font-weight: bold; + align-items: center; + justify-content: center; +} +.third2 p{ + font-family: sans-serif; + font-size: small; + align-items: center; + justify-content: center; + padding-left: 9px; +} + +.fourth{ + display: flex; + flex-direction: row; + + justify-content: space-around; +} +.fourth p{ + padding-top: -8px; + font-size:14px; + cursor: pointer; +} + + #line3{ +padding-left: 8px; + } + #line2{ + padding-left: 70px; + } + diff --git a/pages/product.html b/pages/product.html index 789c4a9..28deaef 100644 --- a/pages/product.html +++ b/pages/product.html @@ -9,7 +9,119 @@
+
+
+
+

4.5

+ +
+
+ +
+
+

speech to Text

+

Speak Kinyarwanda and get the text of the spoken words

+
+
+

Try it out

+

Read More

+
+
+
+
+

4.8

+ +
+
+ +
+
+

Text to speech

+

Write Kinyarwanda and getthe Audio voice written sentence

+
+
+

Try it out

+

Read More

+
+
+ +
+
+

4.8

+ +
+
+ +
+
+

Kinyarwanda Dataset STT

+

Over 2000 hours of Kinyarwanda voice data, making it the second-biggest open voice dataset on the common voice platform.

+
+
+

Download

+

Read More

+
+
+
+ +
+
+
+

4.5

+ +
+
+ +
+
+

speech to Text

+

Speak Kinyarwanda and get the text of the spoken words

+
+
+

Try it out

+

Read More

+
+
+ +
+
+

4.8

+ +
+
+ +
+
+

Text to speech

+

Write Kinyarwanda and getthe Audio voice written sentence

+
+
+

Try it out

+

Read More

+
+
+ +
+
+

4.8

+ +
+
+ +
+
+

Kinyarwanda Dataset STT

+

Over 2000 hours of Kinyarwanda voice data, making it the second-biggest open voice dataset on the common voice platform.

+
+
+

Download

+

Read More

+
+
+ +
+ \ No newline at end of file From bee32d340ca3fe4b41129388facd850f0ae72d0d Mon Sep 17 00:00:00 2001 From: Y-elv Date: Sat, 8 Apr 2023 17:26:51 +0200 Subject: [PATCH 05/16] implement card --- assets/css/product.css | 119 +++++----------------------------------- assets/img/nlp pic.svg | 9 +++ assets/img/nlp pic2.png | Bin 0 -> 414 bytes pages/product.html | 101 +--------------------------------- 4 files changed, 26 insertions(+), 203 deletions(-) create mode 100644 assets/img/nlp pic.svg create mode 100644 assets/img/nlp pic2.png diff --git a/assets/css/product.css b/assets/css/product.css index eca0c98..8c3debf 100644 --- a/assets/css/product.css +++ b/assets/css/product.css @@ -1,18 +1,14 @@ - +body{ + width: 100vw; + height: 100vh; +} .prodContainer{ - width: 100%; - - margin-left: 200px; - margin-top: 80px; + width: 90%; + margin: 20px auto; display: flex; flex-direction: column; - - - - } .container{ - border: 1px solid; margin-top: 0%; justify-content: space-between; @@ -21,18 +17,6 @@ width: 21% ; height:9% ; } -.under{ - display: flex; -flex-direction: row; - -} -.above{ - - padding-bottom: 10px; - display: flex; - flex-direction: row; - -} .first { padding-right: 10px; @@ -64,26 +48,7 @@ flex-direction: row; -.first2 { - display: flex; - flex-direction:row; - justify-content: flex-end; -} -.first2 p{ - font-weight: bolder; -} -.first2 img{ - padding-top: 15px; - - height: 19px; -} -.first2 { - padding-right: 10px; - -} - - .second img{ padding-left: 49px; height: 100px; @@ -107,22 +72,8 @@ flex-direction: row; align-items: center; justify-content: center; } -.third1 h3{ - padding-left: 50px; - padding-top: 12px; - font-size: 14px; - font-family: sans-serif; - font-weight: bold; - align-items: center; - justify-content: center; -} -.third1 p{ - font-family: sans-serif; - font-size: smaller; - align-items: center; - justify-content: center; - padding-left: 4px; -} + + .third p{ font-family: sans-serif; @@ -131,13 +82,7 @@ flex-direction: row; justify-content: center; padding-left: 4px; } -.third1 { - align-items: center; - justify-content: center; - padding-left: 10px; - padding-top: 5px; - -} + .third { align-items: center; @@ -150,56 +95,20 @@ flex-direction: row; justify-content: center; padding-left: 65px; } -.third1 span{ - align-items: center; - justify-content: center; - padding-left: -4px; - -} -.third2 span{ - align-items: center; - justify-content: center; - padding-left: 12px; - -} -.third2 { - align-items: center; - justify-content: center; - margin-top: -32px; - padding-left: 10px; -} -.third2 h3{ - padding-left: 70px; - font-size: 14px; - font-family: sans-serif; - font-weight: bold; - align-items: center; - justify-content: center; -} -.third2 p{ - font-family: sans-serif; - font-size: small; - align-items: center; - justify-content: center; - padding-left: 9px; -} + .fourth{ display: flex; flex-direction: row; - justify-content: space-around; } .fourth p{ - padding-top: -8px; + font-size:14px; cursor: pointer; } - #line3{ -padding-left: 8px; - } - #line2{ - padding-left: 70px; - } + .read{ + +} diff --git a/assets/img/nlp pic.svg b/assets/img/nlp pic.svg new file mode 100644 index 0000000..5091371 --- /dev/null +++ b/assets/img/nlp pic.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/assets/img/nlp pic2.png b/assets/img/nlp pic2.png new file mode 100644 index 0000000000000000000000000000000000000000..38ef02c02ce065ddb904d527930d763cd4f82d2b GIT binary patch literal 414 zcmV;P0b%}$P)mDxS2A>GeATis{B3&zv^r~0W@=C)_ZOt8xrrBn51{;{; z1}(DE8t6hz)dC?X%ySLX^&C?+caLydpN~qP#
-

4.5

- +

speech to Text

Speak Kinyarwanda and get the text of the spoken words

-

Try it out

-

Read More

+

+

Read More

- -
-
-

4.8

- -
-
- -
-
-

Text to speech

-

Write Kinyarwanda and getthe Audio voice written sentence

-
-
-

Try it out

-

Read More

-
-
- -
-
-

4.8

- -
-
- -
-
-

Kinyarwanda Dataset STT

-

Over 2000 hours of Kinyarwanda voice data, making it the second-biggest open voice dataset on the common voice platform.

-
-
-

Download

-

Read More

-
-
-
- -
-
-
-

4.5

- -
-
- -
-
-

speech to Text

-

Speak Kinyarwanda and get the text of the spoken words

-
-
-

Try it out

-

Read More

-
-
- -
-
-

4.8

- -
-
- -
-
-

Text to speech

-

Write Kinyarwanda and getthe Audio voice written sentence

-
-
-

Try it out

-

Read More

-
-
- -
-
-

4.8

- -
-
- -
-
-

Kinyarwanda Dataset STT

-

Over 2000 hours of Kinyarwanda voice data, making it the second-biggest open voice dataset on the common voice platform.

-
-
-

Download

-

Read More

-
-
- -
From c46622e3999cbd794434a5f319b1e14abc1678a8 Mon Sep 17 00:00:00 2001 From: Y-elv Date: Sat, 8 Apr 2023 17:26:51 +0200 Subject: [PATCH 06/16] implement card --- assets/css/product.css | 178 +++++----------------------------------- assets/img/nlp pic.svg | 9 ++ assets/img/nlp pic2.png | Bin 0 -> 414 bytes pages/product.html | 123 +++++++-------------------- 4 files changed, 59 insertions(+), 251 deletions(-) create mode 100644 assets/img/nlp pic.svg create mode 100644 assets/img/nlp pic2.png diff --git a/assets/css/product.css b/assets/css/product.css index eca0c98..3809f7e 100644 --- a/assets/css/product.css +++ b/assets/css/product.css @@ -1,51 +1,27 @@ - +body{ + width: 100vw; + height: 100vh; +} .prodContainer{ - width: 100%; - - margin-left: 200px; - margin-top: 80px; + width: 90%; + margin: 20px auto; display: flex; - flex-direction: column; - - - - + gap: 30px; } .container{ - border: 1px solid; margin-top: 0%; justify-content: space-between; border-radius: 20px 20px 20px 20px; - margin-right: 30px; width: 21% ; height:9% ; } -.under{ - display: flex; -flex-direction: row; - -} -.above{ - - padding-bottom: 10px; - display: flex; - flex-direction: row; - -} - -.first { - padding-right: 10px; - margin-bottom: -20px; -} - - - .first { display: flex; flex-direction:row; justify-content: flex-end; + padding-right: 10px; } .first p{ font-family: sans-serif; @@ -56,150 +32,34 @@ flex-direction: row; padding-top: 15px; height: 19px; } -.first { - padding-right: 10px; - margin-bottom: -20px; -} - - - -.first2 { - display: flex; - flex-direction:row; - justify-content: flex-end; -} -.first2 p{ - - font-weight: bolder; -} -.first2 img{ - padding-top: 15px; - - height: 19px; -} -.first2 { - padding-right: 10px; - -} - - .second img{ padding-left: 49px; height: 100px; } -.second-img{ - padding-left: 49px; - height: 109px; - padding-top: 25px; - -} - -.secon img{ - height: 73px; - padding-left: 100px; +.third{ + width: 80%; + margin: 5px auto; } .third h3{ - padding-left: 70px; font-size: 14px; - font-family: sans-serif; font-weight: bold; - align-items: center; - justify-content: center; -} -.third1 h3{ - padding-left: 50px; - padding-top: 12px; - font-size: 14px; - font-family: sans-serif; - font-weight: bold; - align-items: center; - justify-content: center; -} -.third1 p{ - font-family: sans-serif; - font-size: smaller; - align-items: center; - justify-content: center; - padding-left: 4px; -} - -.third p{ - font-family: sans-serif; - font-size: small; - align-items: center; - justify-content: center; - padding-left: 4px; -} -.third1 { - align-items: center; - justify-content: center; - padding-left: 10px; - padding-top: 5px; - -} - -.third { - align-items: center; - justify-content: center; - padding-left: 10px; - font-size: 10px; -} -.third span{ - align-items: center; - justify-content: center; - padding-left: 65px; -} -.third1 span{ - align-items: center; - justify-content: center; - padding-left: -4px; - -} -.third2 span{ - align-items: center; - justify-content: center; - padding-left: 12px; - -} -.third2 { - align-items: center; - justify-content: center; - margin-top: -32px; - padding-left: 10px; -} -.third2 h3{ - padding-left: 70px; - font-size: 14px; - font-family: sans-serif; - font-weight: bold; - align-items: center; - justify-content: center; -} -.third2 p{ - font-family: sans-serif; - font-size: small; - align-items: center; - justify-content: center; - padding-left: 9px; } .fourth{ + width: 80%; + margin: 5px auto; display: flex; - flex-direction: row; - - justify-content: space-around; + justify-content: space-between; + align-items: center; } .fourth p{ - padding-top: -8px; + font-size:14px; cursor: pointer; } - #line3{ -padding-left: 8px; - } - #line2{ - padding-left: 70px; - } + .read{ + +} diff --git a/assets/img/nlp pic.svg b/assets/img/nlp pic.svg new file mode 100644 index 0000000..5091371 --- /dev/null +++ b/assets/img/nlp pic.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/assets/img/nlp pic2.png b/assets/img/nlp pic2.png new file mode 100644 index 0000000000000000000000000000000000000000..38ef02c02ce065ddb904d527930d763cd4f82d2b GIT binary patch literal 414 zcmV;P0b%}$P)mDxS2A>GeATis{B3&zv^r~0W@=C)_ZOt8xrrBn51{;{; z1}(DE8t6hz)dC?X%ySLX^&C?+caLydpN~qP#
-

4.5

- +

speech to Text

-

Speak Kinyarwanda and get the text of the spoken words

+

Speak Kinyarwanda and get the text of the spoken words

-

Try it out

-

Read More

+

+

Read More

- -
-
-

4.8

- -
-
- -
-
-

Text to speech

-

Write Kinyarwanda and getthe Audio voice written sentence

-
-
-

Try it out

-

Read More

-
-
- -
+
-

4.8

+

4.5

-
- +
+
-
-

Kinyarwanda Dataset STT

-

Over 2000 hours of Kinyarwanda voice data, making it the second-biggest open voice dataset on the common voice platform.

+
+

speech to Text

+

Speak Kinyarwanda and get the text of the spoken words

-

Download

-

Read More

+

+

Read More

-
-
- -
-
-
-

4.5

- -
-
- -
-
-

speech to Text

-

Speak Kinyarwanda and get the text of the spoken words

-
-
-

Try it out

-

Read More

-
-
- -
-
-

4.8

- -
-
- -
-
-

Text to speech

-

Write Kinyarwanda and getthe Audio voice written sentence

-
-
-

Try it out

-

Read More

-
-
- -
-
-

4.8

- -
-
- -
-
-

Kinyarwanda Dataset STT

-

Over 2000 hours of Kinyarwanda voice data, making it the second-biggest open voice dataset on the common voice platform.

-
-
-

Download

-

Read More

-
-
- -
+
+
+
+

4.5

+ +
+
+ +
+
+

speech to Text

+

Speak Kinyarwanda and get the text of the spoken words

+
+
+

+

Read More

+
+
From fdc8f32a4e7c78333adb9282f303eb8a9148cc7f Mon Sep 17 00:00:00 2001 From: Y-elv Date: Sat, 8 Apr 2023 18:04:25 +0200 Subject: [PATCH 07/16] project intro --- assets/css/product.css | 28 ++++++++- pages/product.html | 127 ++++++++++++++++++++++------------------- 2 files changed, 94 insertions(+), 61 deletions(-) diff --git a/assets/css/product.css b/assets/css/product.css index eee28ec..beb7935 100644 --- a/assets/css/product.css +++ b/assets/css/product.css @@ -1,14 +1,36 @@ +:root{ + --yellow:#F59221 +} body{ width: 100vw; height: 100vh; } -.prodContainer{ +.conttainer{ width: 90%; - margin: 20px auto; + margin: 30px auto; + display: flex; + flex-direction: column; +} +.projects-intro{ + padding: 10px 0px; + margin-bottom: 20px; +} + +.projects-intro button{ + border-radius: 12px; + padding: 5px 30px; + border: none; + background-color: var(--yellow); + color: white; + text-align: center; + font-weight: bold; +} + +.projects-Container{ display: flex; gap: 30px; } -.container{ +.card-container{ border: 1px solid; margin-top: 0%; justify-content: space-between; diff --git a/pages/product.html b/pages/product.html index 6106c26..b6da596 100644 --- a/pages/product.html +++ b/pages/product.html @@ -1,66 +1,77 @@ + - - - - Mbaza product List - + + + + Mbaza product List + - -
-
-
-

4.5

- -
-
- -
-
-

speech to Text

-

Speak Kinyarwanda and get the text of the spoken words

-
-
-

-

Read More

-
-
-
-
-

4.5

- -
-
- -
-
-

speech to Text

-

Speak Kinyarwanda and get the text of the spoken words

-
-
-

-

Read More

-
-
-
-
-

4.5

- -
-
- -
-
-

speech to Text

-

Speak Kinyarwanda and get the text of the spoken words

-
-
-

-

Read More

-
-
+ + +
+
+

Projects under debvelopment [3]

+

would you like to join and continue

+ +
+
+
+
+

4.5

+ +
+
+ +
+
+

speech to Text

+

Speak Kinyarwanda and get the text of the spoken words

+
+
+

+

Read More

+
+
+
+
+

4.5

+ +
+
+ +
+
+

speech to Text

+

Speak Kinyarwanda and get the text of the spoken words

+
+
+

+

Read More

+
+
+
+
+

4.5

+ +
+
+ +
+
+

speech to Text

+

Speak Kinyarwanda and get the text of the spoken words

+
+
+

+

Read More

+
+
+
+ + \ No newline at end of file From e62b13f25cce431238b645edb380911dccbafae6 Mon Sep 17 00:00:00 2001 From: Gatete Ishema Angelo Chrristian Date: Sat, 8 Apr 2023 18:06:50 +0200 Subject: [PATCH 08/16] Adding other changes for merge --- assets/css/product.css | 500 ++++++++++++++++++++++------------------- pages/product.html | 83 ++++++- 2 files changed, 351 insertions(+), 232 deletions(-) diff --git a/assets/css/product.css b/assets/css/product.css index 8080b1e..7c80cbe 100644 --- a/assets/css/product.css +++ b/assets/css/product.css @@ -5,7 +5,8 @@ justify-content: center; font-size: 1.2em; position: relative; - font-family: monospace; + + font-family: "Inter", sans-serif; } .upperPart { margin: 15px 100px; @@ -16,7 +17,7 @@ margin: 0px 00px; } .mainTitle { - margin-left: 250px; + margin-left: 300px; width: 200px; padding: auto 0px; @@ -25,10 +26,10 @@ .mainTitle::before, .mainTitle::after { content: ""; - font-size: 0.5px; + font-size: 0.2px; width: 10px; margin: 0px 20px 4px 20px; - padding: 5px 60px 0px 60px; + padding: 2px 40px 0px 40px; flex: 1 0 20px; background: black; } @@ -38,7 +39,7 @@ font-weight: 0; } .btn { - padding: 10px 20px; + padding: 7px 15px; background: rgb(219, 219, 219); border-radius: 30px; border: none; @@ -64,7 +65,7 @@ margin-right: 350px; } .status .btn { - padding: 15px 25px; + padding: 10px 20px; margin: 5px; } .align { @@ -82,10 +83,10 @@ margin-top: 10px; } .align .accomplished p { - font-size: 1.3em; + font-size: 1em; margin-right: 20px; - margin-top: 15px; - font-weight: 900; + margin-top: 12px; + font-weight: 700; } .accomplished .amount { font-weight: 100; @@ -107,23 +108,32 @@ display: flex; } .box { - height: 320px; - width: 25%; + height: 300px; + width: 20%; border: 1px solid black; - margin: 10px 40px 20px 10px; + margin: 10px 20px 20px 10px; border-radius: 5%; padding: 10px 15px 10px 15px; + font-size: 1em; +} +.box p { + font-size: 0.8em; + margin-bottom: 30px; } .rateStar { display: flex; flex-direction: row-reverse; /* margin-right: 25px; */ + font-size: 0.9em; +} +.rateStar p { + margin-top: 0px; } .rateStar img { width: 20px; height: 20px; margin: 5px; - margin-top: 15px; + margin-top: 2.5px; } .rateStar p { font-weight: 900; @@ -133,6 +143,7 @@ margin-left: 25px; width: 230px; height: 100px; + margin-top: -10px; } .fileImages { width: 50px; @@ -150,13 +161,14 @@ } .boxOptions { display: flex; + justify-content: space-between; text-align: center; } .boxOptions p { margin: 10px 45px 0 20px; font-weight: 600; - flex-direction: column; - font-size: 1.04em; + /* flex-direction: column; */ + font-size: 0.74em; } .boxOptions p:hover { color: orange; @@ -167,7 +179,7 @@ .box6.boxOptions { } .fileText { - font-size: 150%; + font-size: 130%; } /* responsive try */ @@ -226,230 +238,262 @@ font-size: 0.95em; } .boxOptions { - font-size: 0.9em; - } -} -@media screen and (max-width: 1270px) { -} -@media screen and (max-width: 1256px) { - .boxOptions { - display: flex; - text-align: center; - } - .cards { - margin-left: 40px; - /* */ + /* font-size: 0.94em; */ } .boxOptions p { - font-size: 1em; + margin: 10px 45px 0 20px; font-weight: 600; - } - .box { - height: 310px; - width: 280px; - margin: 10px 40px 20px 10px; - border-radius: 5%; - padding: 10px 15px 10px 15px; - } - .fileText { - font-size: 100%; - } -} + font-size: 0.74em; + } + @media screen and (max-width: 1270px) { + } + @media screen and (max-width: 1256px) { + .boxOptions { + display: flex; + text-align: center; + font-size: 0.94em; + } + .cards { + margin-left: 40px; + /* */ + } + .boxOptions p { + margin: 10px 45px 0 20px; + font-weight: 600; + font-size: 0.74em; + } -@media screen and (max-width: 1206px) { - .box { - height: 310px; - width: 260px; - margin: 10px 35px 20px 10px; - border-radius: 5%; - padding: 10px 15px 10px 15px; - } - .fileImages { - width: 45px; - height: 90px; - margin-left: 90px; - margin-top: -45px; + .box { + height: 310px; + width: 280px; + margin: 10px 40px 20px 10px; + border-radius: 5%; + padding: 10px 15px 10px 15px; + } + .fileText { + font-size: 100%; + margin-bottom: 0px; + } + .boxOptions { + margin-top: -15px; + } } -} -@media screen and (max-width: 1199px) { - .fileImages { - width: 45px; - height: 90px; - margin-left: 90px; - margin-top: -45px; - } - .ttsImages { - width: 95px; - margin-left: 52px; - margin-right: 5px; - margin-bottom: 40px; - margin-top: -12px; - } - .sttImages { - margin-right: 0px; - margin-left: -15px; - margin-top: -12px; - } -} -@media screen and (max-width: 1100px) { - .fileText { - font-size: 0.91em; - margin-top: -5px; - } - .sttImages { - margin-right: 0px; - margin-left: -15px; - margin-top: -15px; - } - .sttText { - font-size: 0.91em; - } - .ttsText { - font-size: 0.91em; - } - .card { - margin-left: 20px; - } - .mainTitle { - margin-left: 270px; - } - .status { - margin-left: 310px; - width: 350px; - margin-right: 350px; - } -} -@media screen and (max-width: 1030px) { - .status { - margin-left: 200px; - width: 350px; - margin-right: 350px; - } - .lowerCards { - display: flex; - } - .box { - height: 320px; - width: 300px; - border: 1px solid black; - margin: 10px 40px 20px 10px; - border-radius: 5%; - padding: 10px 15px 10px 15px; - } - .title { - text-align: center; - margin: 0px 00px; - } - .mainTitle { - margin-left: 130px; - } - .upperCards { - flex-wrap: wrap; - display: inline-flex; - } - .lowerCards { - flex-wrap: wrap; - display: inline-flex; - } -} -@media screen and (max-width: 900px) { - .title { - text-align: center; - margin: 0px 00px; - } - .mainTitle { - margin-left: 10%; - } - .status { - margin-left: 23%; - width: 350px; - } -} -@media screen and (max-width: 765px) { - .btn { - padding: 7px 17px; - margin-top: -30px; - } - .status .btn { - padding: 12px 22px; - margin: 5px; - } - .lowerPart { - margin: 40px 5px; - } - .align { - margin-bottom: 0; - padding-bottom: 0; + @media screen and (max-width: 1206px) { + .box { + height: 300px; + width: 260px; + margin: 10px 35px 20px 10px; + border-radius: 5%; + padding: 10px 15px 10px 15px; + } + .fileImages { + width: 45px; + height: 90px; + margin-left: 90px; + margin-top: -45px; + } + .fileText .fileOption p { + font-size: 0.4em; + } } - .align .btn { - margin-top: 10px; - } - .align .accomplished p { - font-size: 1.15em; - margin-right: 20px; - margin-top: 15px; - font-weight: 900; - } - .accomplished .amount { - font-weight: 100; - font-size: 1em; - } -} -@media screen and (max-width: 715px) { - .align .accomplished p { - font-size: 1.15em; - margin-right: 20px; - margin-top: 15px; - font-weight: 900; - } - .accomplished .amount { - font-weight: 100; - font-size: 1em; - } - .align .btn { - margin-top: 10px; - } - .upperPart { - margin: 15px 100px; - } - .align { - display: block; - margin-left: 27%; - margin-bottom: 15px; - } - .align p { - margin-left: 20px; - } - .cards { - margin-left: 20%; - } - .feed { - margin-left: 15%; - } -} -@media screen and (max-width: 705px) { - .mainTitle { - margin-left: 5%; - margin-right: 5%; - } - .status { - margin-left: 23%; - width: 350px; - } - .mainTitle::before, - .mainTitle::after { - width: 6px; - margin: 0px 20px 4px 20px; - padding: 5px 40px 0px 40px; - flex: 1 0 20px; - background: black; + @media screen and (max-width: 1199px) { + .fileImages { + width: 45px; + height: 87px; + margin-left: 90px; + margin-top: -45px; + } + .ttsImages { + width: 95px; + margin-left: 52px; + margin-right: 5px; + margin-bottom: 40px; + margin-top: -12px; + } + .sttImages { + margin-right: 0px; + margin-left: -15px; + margin-top: -12px; + } + .box { + height: 285px; + } + } + @media screen and (max-width: 1100px) { + .fileText { + font-size: 0.91em; + margin-top: -5px; + } + .sttImages { + margin-right: 0px; + margin-left: -15px; + margin-top: -15px; + } + .sttText { + font-size: 0.91em; + } + .ttsText { + font-size: 0.91em; + } + .card { + margin-left: 20px; + } + .mainTitle { + margin-left: 270px; + } + .status { + margin-left: 310px; + width: 350px; + margin-right: 350px; + } + } + @media screen and (max-width: 1030px) { + .status { + margin-left: 200px; + width: 350px; + margin-right: 350px; + } + .lowerCards { + display: flex; + } + .box { + height: 320px; + width: 300px; + border: 1px solid black; + margin: 10px 40px 20px 10px; + border-radius: 5%; + padding: 10px 15px 10px 15px; + } + .title { + text-align: center; + margin: 0px 00px; + } + .mainTitle { + margin-left: 130px; + } + .upperCards { + flex-wrap: wrap; + display: inline-flex; + } + .lowerCards { + flex-wrap: wrap; + display: inline-flex; + } + } + @media screen and (max-width: 900px) { + .title { + text-align: center; + margin: 0px 00px; + } + .mainTitle { + margin-left: 10%; + } + .status { + margin-left: 23%; + width: 350px; + } + } + @media screen and (max-width: 765px) { + .btn { + padding: 7px 17px; + margin-top: -30px; + } + .status .btn { + padding: 12px 22px; + margin: 5px; + } + .lowerPart { + margin: 40px 5px; + } + .align { + margin-bottom: 0; + padding-bottom: 0; + } + + .align .btn { + margin-top: 10px; + } + .align .accomplished p { + font-size: 1.15em; + margin-right: 20px; + margin-top: 15px; + font-weight: 900; + } + .accomplished .amount { + font-weight: 100; + font-size: 1em; + } + } + @media screen and (max-width: 715px) { + .align .accomplished p { + font-size: 1.15em; + margin-right: 20px; + margin-top: 15px; + font-weight: 900; + } + .accomplished .amount { + font-weight: 100; + font-size: 1em; + } + .align .btn { + margin-top: 10px; + } + .upperPart { + margin: 15px 100px; + } + .align { + display: block; + margin-left: 27%; + margin-bottom: 15px; + } + .align p { + margin-left: 20px; + } + .cards { + margin-left: 20%; + } + .feed { + margin-left: 15%; + } + } + @media screen and (max-width: 705px) { + .status { + margin-left: 23%; + width: 350px; + } + .mainTitle::before, + .mainTitle::after { + width: 6px; + margin: 0px 20px 4px 20px; + padding: 2px 30px 0px 30px; + flex: 1 0 20px; + background: black; + } + .prodContainer { + margin: auto; + margin-right: 100px; + } + .accomplished { + font-size: 0.8em; + } + .btn { + margin: 5px; + } + .feedBack { + font-size: 0.85em; + margin-left: 60px; + } } } @media screen and (max-width: 585px) { .prodContainer { - margin-left: -10px; + margin: auto; + margin-right: 100px; + } + .btn { + margin: 2px; } } diff --git a/pages/product.html b/pages/product.html index e5bd292..3713a5c 100644 --- a/pages/product.html +++ b/pages/product.html @@ -6,8 +6,79 @@ Mbaza product List + + + + + + + + + + + + +
+
+ + +
+
+ + +
+
+
+
+
+ +
+
+ +
+
+
+ + + +
+
+ Blog +
+
+
+
+
+
@@ -61,8 +132,12 @@

Speech To Text

Speak Kinyarwanda and get the test of the spoken words

-

Try it out

-

Read more

+
+

Try it out

+
+
+

Read more

+
@@ -100,8 +175,8 @@

Kinyarwanda Dataset SST

-

Download

-

Read more

+

Download

+

Read more

From e9bfc991d5ffa5f2bb92d16e09b0302c04ab6aef Mon Sep 17 00:00:00 2001 From: mugisha Date: Sat, 15 Apr 2023 18:16:01 +0200 Subject: [PATCH 09/16] responsiveness --- assets/css/product.css | 81 +++++++------------ assets/img/product/sts.png | Bin 0 -> 10529 bytes pages/product.html | 156 +++++++++++++------------------------ 3 files changed, 80 insertions(+), 157 deletions(-) create mode 100644 assets/img/product/sts.png diff --git a/assets/css/product.css b/assets/css/product.css index 56a00f7..37e1981 100644 --- a/assets/css/product.css +++ b/assets/css/product.css @@ -1,3 +1,4 @@ + :root{ --yellow:#F59221 } @@ -28,60 +29,11 @@ body{ .projects-Container{ display: flex; - gap: 30px; -} -.card-container{ - border: 1px solid; - margin-top: 0%; - justify-content: space-between; - border-radius: 20px 20px 20px 20px; - width: 21% ; - height:9% ; -} - -.first { - display: flex; - flex-direction:row; - justify-content: flex-end; - padding-right: 10px; -} -.first p{ - font-family: sans-serif; - - font-weight: bolder; -} -.first img{ - padding-top: 15px; - height: 19px; + } -.second img{ - padding-left: 49px; - height: 100px; -} -.third{ - width: 80%; - margin: 5px auto; -} -.third h3{ - font-size: 14px; - font-weight: bold; -} - -.fourth{ - width: 80%; - margin: 5px auto; - display: flex; - justify-content: space-between; - align-items: center; -} -.fourth p{ - - font-size:14px; - cursor: pointer; -} .prodContainer { - margin: 40px; + margin: 65px; display: block; align-items: center; justify-content: center; @@ -215,7 +167,7 @@ body{ width: 20px; height: 20px; margin: 5px; - margin-top: 2.5px; + margin-top: 0px; } .rateStar p { font-weight: 900; @@ -227,17 +179,36 @@ body{ height: 100px; margin-top: -10px; } +.sttImages-project img { + align-self: flex-end; + margin-left: 25px; + width: 230px; + height: 100px; + margin-top: 10px; + } .fileImages { width: 50px; margin-left: 100px; margin-top: -40px; } +.fileImages-project { + width: 50px; + margin-left: 100px; + margin-top: 10px; + } .ttsImages { width: 100px; margin-left: 55px; margin-right: 5px; margin-bottom: 50px; } +.ttsImages-project { + margin-top: 40px; + width: 100px; + margin-left: 55px; + margin-right: 5px; + margin-bottom: 50px; + } .boxText { text-align: center; } @@ -257,13 +228,15 @@ body{ } .boxOptionsp1 { margin-left: 30px; + } -.box6.boxOptions { -} + + .fileText { font-size: 130%; } + /* responsive try */ @media screen and (max-width: 1920px) { body { diff --git a/assets/img/product/sts.png b/assets/img/product/sts.png new file mode 100644 index 0000000000000000000000000000000000000000..365602ef456283037b64e407d92e61ee4f3e5c70 GIT binary patch literal 10529 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 -
-
- - -
-
- - - + +
@@ -121,8 +69,8 @@

- -

4.5

+ +

4.5

@@ -239,64 +187,66 @@

Kinyarwanda Dataset SST

+

Projects under debvelopment [3]

would you like to join and continue

-
-
-

4.5

- -
-
- -
-
-

speech to Text

-

Speak Kinyarwanda and get the text of the spoken words

-
-
-

-

Read More

-
-
-
-
-

4.5

- -
-
- -
-
-

speech to Text

-

Speak Kinyarwanda and get the text of the spoken words

-
-
-

-

Read More

-
-
-
-
-

4.5

- -
-
- + +
+
+ +
+ +
+
+

Speech To Text

+

Speak Kinyarwanda and get the test of the spoken words

+
+
+

+

Read more

+
-
-

speech to Text

-

Speak Kinyarwanda and get the text of the spoken words

+
+ +
+ +
+
+

Text to Speech

+

+ Write Kinyarwanda and get audio voice of the written sentence +

+
+
+

+

Read more

+
-
-

-

Read More

+
+ +
+ +
+
+

Kinyarwanda Dataset SST

+

+ Over 2000 hours of Kinyarwanda voice data, making it the + second-biggest open voice dataset on the common voice platform +

+
+
+

+

Read more

+
+
+
From 98432723baa4929d2ceb697a093ce78345fee704 Mon Sep 17 00:00:00 2001 From: Gatete Ishema Angelo Chrristian Date: Sat, 15 Apr 2023 19:06:20 +0200 Subject: [PATCH 10/16] Adding nav bar --- assets/css/product.css | 241 ++++++++++++++++++++++-------- assets/img/shape/Vector white.svg | 3 + assets/img/shape/Vector.svg | 3 + pages/product.html | 70 +++------ 4 files changed, 208 insertions(+), 109 deletions(-) create mode 100644 assets/img/shape/Vector white.svg create mode 100644 assets/img/shape/Vector.svg diff --git a/assets/css/product.css b/assets/css/product.css index 56a00f7..0663594 100644 --- a/assets/css/product.css +++ b/assets/css/product.css @@ -1,84 +1,186 @@ -:root{ - --yellow:#F59221 +:root { + --yellow: #f59221; +} +body { + width: 100vw; + box-sizing: border-box; + height: 100vh; + overflow: hidden; +} +.conttainer { + width: 90%; + margin: 30px auto; + display: flex; + flex-direction: column; } -body{ - width: 100vw; - height: 100vh; +/* Header */ +header { + width: 100vw; + background: #002701; + margin-top: -10px; + margin-left: -10px; + margin-right: -10px; + overflow: hidden; + box-sizing: border-box; + display: flex; + justify-content: center; + height: 120px; } -.conttainer{ - width: 90%; - margin: 30px auto; - display: flex; - flex-direction: column; +.logo { + width: 300px; + height: 100px; + margin-top: 10px; + background: red; +} +.logo img { + width: 200px; + height: 130px; +} +.menu { +} +.menu ul { + display: flex; + list-style: none; +} +.menu ul li { + text-decoration: none; + margin: 30px 15px; +} +.menu ul li a { + text-decoration: none; + font-size: 1em; + color: white; + font-weight: 500; + font-family: "poppins", monospace; + transition: 0.4s; +} +.menu ul li a:hover { + color: #f59221; +} +.blog-button { + justify-self: flex-end; + margin: 40px; + float: right; + margin-left: 500px; +} +.blog-button button { + padding: 15px 30px; + border-radius: 40px; + color: black; + font-size: 1em; + font-weight: 600; + font-family: "inter", "poppins", sans-serif; + background: #f59221; + border: none; + display: flex; + animation: move; + transition: 0.4s; } -.projects-intro{ - padding: 10px 0px; - margin-bottom: 20px; +.blog-button button:hover { + background: #04391b; + color: white; + border: 1px solid #f59221; + box-shadow: 1px 1px 5px #f59221; +} +.blog-button button img:hover { + transition: translateX(0.2mm); } -.projects-intro button{ - border-radius: 12px; - padding: 5px 30px; - border: none; - background-color: var(--yellow); - color: white; - text-align: center; - font-weight: bold; +/* @keyframes move { + 100% { + background: #04391b; + } +} */ +/* .blog-button button::before { + content: "BLOG"; + padding: 15px 30px; + background: #04391b; + color: white; +} */ +.blog-button button img { + width: 50%; + height: 20px; + margin: 0px 10px; +} +@media screen and (max-width: 1600px) { + .logo { + margin-left: 20px; + } +} +@media screen and (max-width: 1100px) { + .logo { + margin-left: 20px; + } } -.projects-Container{ - display: flex; - gap: 30px; +/* Header end */ +.projects-intro { + padding: 10px 0px; + margin-bottom: 20px; +} + +.projects-intro button { + border-radius: 12px; + padding: 5px 30px; + border: none; + background-color: var(--yellow); + color: white; + text-align: center; + font-weight: bold; } -.card-container{ - border: 1px solid; - margin-top: 0%; - justify-content: space-between; - border-radius: 20px 20px 20px 20px; - width: 21% ; - height:9% ; + +.projects-Container { + display: flex; + gap: 30px; } - +.card-container { + border: 1px solid; + margin-top: 0%; + justify-content: space-between; + border-radius: 20px 20px 20px 20px; + width: 21%; + height: 9%; +} + .first { - display: flex; - flex-direction:row; - justify-content: flex-end; - padding-right: 10px; + display: flex; + flex-direction: row; + justify-content: flex-end; + padding-right: 10px; } -.first p{ - font-family: sans-serif; - - font-weight: bolder; +.first p { + font-family: sans-serif; + + font-weight: bolder; } -.first img{ +.first img { padding-top: 15px; - height: 19px; + height: 19px; } -.second img{ - padding-left: 49px; - height: 100px; +.second img { + padding-left: 49px; + height: 100px; } -.third{ - width: 80%; - margin: 5px auto; +.third { + width: 80%; + margin: 5px auto; } -.third h3{ - font-size: 14px; - font-weight: bold; +.third h3 { + font-size: 14px; + font-weight: bold; } -.fourth{ - width: 80%; - margin: 5px auto; - display: flex; - justify-content: space-between; - align-items: center; +.fourth { + width: 80%; + margin: 5px auto; + display: flex; + justify-content: space-between; + align-items: center; } -.fourth p{ - - font-size:14px; - cursor: pointer; +.fourth p { + font-size: 14px; + cursor: pointer; } .prodContainer { margin: 40px; @@ -265,9 +367,17 @@ body{ } /* responsive try */ -@media screen and (max-width: 1920px) { +@media screen and (max-width: 1950px) { body { } + header { + height: 160px; + } + + .menu { + margin-top: 20px; + font-size: 1.3em; + } .upperCards { display: flex; } @@ -303,6 +413,13 @@ body{ } @media screen and (max-width: 1285px) { + .logo { + width: 300px; + height: 100px; + } + .menu { + margin: 20px; + } .title { text-align: center; margin: 0px 00px; diff --git a/assets/img/shape/Vector white.svg b/assets/img/shape/Vector white.svg new file mode 100644 index 0000000..8343774 --- /dev/null +++ b/assets/img/shape/Vector white.svg @@ -0,0 +1,3 @@ + + + diff --git a/assets/img/shape/Vector.svg b/assets/img/shape/Vector.svg new file mode 100644 index 0000000..49cb0b9 --- /dev/null +++ b/assets/img/shape/Vector.svg @@ -0,0 +1,3 @@ + + + diff --git a/pages/product.html b/pages/product.html index 00da956..7e6ca9e 100644 --- a/pages/product.html +++ b/pages/product.html @@ -12,6 +12,10 @@ href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,900;1,800;1,900&display=swap" rel="stylesheet" /> + + + + @@ -32,53 +36,25 @@
- - + +
+ + +
+ +
+
From 9920b70d2e0962e31dfe0117b63c5a38cccadd7c Mon Sep 17 00:00:00 2001 From: Gatete Ishema Angelo Chrristian Date: Tue, 25 Apr 2023 23:13:34 +0200 Subject: [PATCH 11/16] adding updated menu --- assets/css/product.css | 141 +++++++++++++++++++++++++---------------- pages/product.html | 24 ++++--- 2 files changed, 101 insertions(+), 64 deletions(-) diff --git a/assets/css/product.css b/assets/css/product.css index e6ccacf..0cf7634 100644 --- a/assets/css/product.css +++ b/assets/css/product.css @@ -1,17 +1,14 @@ -<<<<<<< HEAD :root { --yellow: #f59221; -======= - -:root{ - --yellow:#F59221 ->>>>>>> e9bfc991d5ffa5f2bb92d16e09b0302c04ab6aef +} +:root { + --yellow: #f59221; } body { width: 100vw; box-sizing: border-box; height: 100vh; - overflow: hidden; + overflow-x: hidden; } .conttainer { width: 90%; @@ -22,7 +19,8 @@ body { /* Header */ header { width: 100vw; - background: #002701; + background: rgba(0, 39, 1, 1); + filter: blur(0.4); margin-top: -10px; margin-left: -10px; margin-right: -10px; @@ -30,16 +28,17 @@ header { box-sizing: border-box; display: flex; justify-content: center; - height: 120px; + height: 100px; + position: sticky; + top: 0px; } .logo { - width: 300px; + width: 320px; height: 100px; margin-top: 10px; - background: red; } .logo img { - width: 200px; + width: 220px; height: 130px; } .menu { @@ -68,6 +67,9 @@ header { margin: 40px; float: right; margin-left: 500px; + + height: 50px; + width: 140px; } .blog-button button { padding: 15px 30px; @@ -88,26 +90,62 @@ header { border: 1px solid #f59221; box-shadow: 1px 1px 5px #f59221; } -.blog-button button img:hover { - transition: translateX(0.2mm); +.line { + width: 22px; + height: 2px; + background: black; + margin-top: 5px; + position: absolute; + right: 0px; +} +.blog { + z-index: 3; } +.arrow { + border-right: 3px solid black; + border-top: 3px solid black; + height: 10px; + width: 10px; + rotate: 45deg; + border-radius: 2px; + position: absolute; + right: 0; +} +.arr { + display: flex; + gap: -5px; + position: relative; + width: 30px; -/* @keyframes move { - 100% { - background: #04391b; - } -} */ -/* .blog-button button::before { - content: "BLOG"; - padding: 15px 30px; - background: #04391b; + margin-left: 5px; +} +.blog-button::before { + content: ""; + text-align: center; + height: inherit; + width: inherit; + display: none; + border-radius: 40px; + background: #002701; + transition: 0.5s cubic-bezier(1, 0, 0.6, 1); + position: absolute; +} +.blog-button button:hover .arr { + -ms-transform-origin-x: 12px; + margin-left: 5px; +} +.blog-button button:hover .arrow { + border-right: 3px solid white; + border-top: 3px solid white; +} +.blog-button button:hover .line { + background: white; +} +.blog-button button:hover .blog-button::before { + display: block; color: white; -} */ -.blog-button button img { - width: 50%; - height: 20px; - margin: 0px 10px; } + @media screen and (max-width: 1600px) { .logo { margin-left: 20px; @@ -119,7 +157,6 @@ header { } } -<<<<<<< HEAD /* Header end */ .projects-intro { padding: 10px 0px; @@ -189,13 +226,10 @@ header { font-size: 14px; cursor: pointer; } -======= -.projects-Container{ - display: flex; - +.projects-Container { + display: flex; } ->>>>>>> e9bfc991d5ffa5f2bb92d16e09b0302c04ab6aef .prodContainer { margin: 65px; display: block; @@ -344,22 +378,22 @@ header { margin-top: -10px; } .sttImages-project img { - align-self: flex-end; - margin-left: 25px; - width: 230px; - height: 100px; - margin-top: 10px; - } + align-self: flex-end; + margin-left: 25px; + width: 230px; + height: 100px; + margin-top: 10px; +} .fileImages { width: 50px; margin-left: 100px; margin-top: -40px; } .fileImages-project { - width: 50px; - margin-left: 100px; - margin-top: 10px; - } + width: 50px; + margin-left: 100px; + margin-top: 10px; +} .ttsImages { width: 100px; margin-left: 55px; @@ -367,12 +401,12 @@ header { margin-bottom: 50px; } .ttsImages-project { - margin-top: 40px; - width: 100px; - margin-left: 55px; - margin-right: 5px; - margin-bottom: 50px; - } + margin-top: 40px; + width: 100px; + margin-left: 55px; + margin-right: 5px; + margin-bottom: 50px; +} .boxText { text-align: center; } @@ -392,15 +426,12 @@ header { } .boxOptionsp1 { margin-left: 30px; - } - .fileText { font-size: 130%; } - /* responsive try */ @media screen and (max-width: 1950px) { body { @@ -471,9 +502,7 @@ header { .fileText { font-size: 0.95em; } - .boxOptions { - /* font-size: 0.94em; */ - } + .boxOptions p { margin: 10px 45px 0 20px; font-weight: 600; diff --git a/pages/product.html b/pages/product.html index 6ef24a3..9b5f051 100644 --- a/pages/product.html +++ b/pages/product.html @@ -29,7 +29,6 @@ -<<<<<<< HEAD
@@ -38,7 +37,7 @@
-
+ -======= - - ->>>>>>> e9bfc991d5ffa5f2bb92d16e09b0302c04ab6aef +

- Projects + Projects

From 516d53c84c4468c216a7f9ec61f6052f9cde852c Mon Sep 17 00:00:00 2001 From: Gatete Ishema Angelo Chrristian Date: Tue, 25 Apr 2023 23:22:19 +0200 Subject: [PATCH 12/16] adding menu --- assets/css/product.css | 1 + pages/product.html | 3 +-- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/assets/css/product.css b/assets/css/product.css index 0cf7634..d3ac526 100644 --- a/assets/css/product.css +++ b/assets/css/product.css @@ -31,6 +31,7 @@ header { height: 100px; position: sticky; top: 0px; + z-index: 5; } .logo { width: 320px; diff --git a/pages/product.html b/pages/product.html index 9b5f051..d6a95f0 100644 --- a/pages/product.html +++ b/pages/product.html @@ -59,9 +59,8 @@ const nav = document.getElementsById('nav'); const offset = nav.offsetTop; window.addEventListener('scroll', () =>{ - if(window.pageXOffset >= 10){ + if(window.pageXOffset >= navOffset){ nav.style.position= 'sticky' - nav.style.background= '#002701' } else{ nav.classListremove('sticky'); From 86b0e29f030e8e6328b94e4938f680b67c01c3a7 Mon Sep 17 00:00:00 2001 From: mugisha Date: Sat, 29 Apr 2023 16:17:14 +0200 Subject: [PATCH 13/16] screening --- assets/css/product.css | 9 +++++++++ pages/product.html | 6 +++--- 2 files changed, 12 insertions(+), 3 deletions(-) diff --git a/assets/css/product.css b/assets/css/product.css index 37e1981..a7f5fb8 100644 --- a/assets/css/product.css +++ b/assets/css/product.css @@ -213,6 +213,7 @@ body{ text-align: center; } .boxOptions { + display: flex; justify-content: space-between; text-align: center; @@ -225,10 +226,18 @@ body{ } .boxOptions p:hover { color: orange; + cursor: pointer; } .boxOptionsp1 { margin-left: 30px; + +} +.boxOptions #more { + +margin-top: 21px; + + } diff --git a/pages/product.html b/pages/product.html index 6386630..3293902 100644 --- a/pages/product.html +++ b/pages/product.html @@ -207,7 +207,7 @@

Speech To Text

-

Read more

+

Read more

@@ -223,7 +223,7 @@

Text to Speech

-

Read more

+

Read more

@@ -240,7 +240,7 @@

Kinyarwanda Dataset SST

-

Read more

+

Read more

From e1106f4b2c20334de4ee48953c897c8ea9fbbe6a Mon Sep 17 00:00:00 2001 From: mugisha Date: Sat, 29 Apr 2023 18:00:47 +0200 Subject: [PATCH 14/16] additional --- assets/css/product.css | 2 ++ 1 file changed, 2 insertions(+) diff --git a/assets/css/product.css b/assets/css/product.css index 961db8c..8bc16f6 100644 --- a/assets/css/product.css +++ b/assets/css/product.css @@ -79,6 +79,8 @@ } .prodContainer { + width: 90%; + margin: auto; margin: 65px; display: block; align-items: center; From 02b728b305e14fed5e3ff5d3e134e00296bf0b1b Mon Sep 17 00:00:00 2001 From: Gatete Ishema Angelo Chrristian Date: Sun, 30 Apr 2023 16:55:14 +0300 Subject: [PATCH 15/16] Adding updated menu --- assets/css/product.css | 245 +++++++++++++++++++++++++++++++++++------ pages/product.html | 40 ++++++- 2 files changed, 251 insertions(+), 34 deletions(-) diff --git a/assets/css/product.css b/assets/css/product.css index d3ac526..b18718b 100644 --- a/assets/css/product.css +++ b/assets/css/product.css @@ -7,8 +7,10 @@ body { width: 100vw; box-sizing: border-box; - height: 100vh; + /* height: 100vh; */ overflow-x: hidden; + padding: 0px; + margin: 0px; } .conttainer { width: 90%; @@ -17,44 +19,48 @@ body { flex-direction: column; } /* Header */ -header { - width: 100vw; +#nav { + height: 110px; background: rgba(0, 39, 1, 1); - filter: blur(0.4); - margin-top: -10px; - margin-left: -10px; - margin-right: -10px; - overflow: hidden; +} +header { + width: 100%; + height: 60px; box-sizing: border-box; display: flex; - justify-content: center; - height: 100px; + justify-content: space-around; + gap: 10px; + z-index: 2; position: sticky; top: 0px; - z-index: 5; } .logo { - width: 320px; - height: 100px; + width: 100px; + height: 120px; margin-top: 10px; + margin-left: 40px; } .logo img { - width: 220px; - height: 130px; + width: 80px; + height: 80px; } + .menu { } .menu ul { display: flex; list-style: none; + margin-left: -150px; + transform: translate(-60px); } + .menu ul li { text-decoration: none; - margin: 30px 15px; + margin: 0px 15px; } .menu ul li a { text-decoration: none; - font-size: 1em; + font-size: 0.8em; color: white; font-weight: 500; font-family: "poppins", monospace; @@ -65,15 +71,13 @@ header { } .blog-button { justify-self: flex-end; - margin: 40px; - float: right; - margin-left: 500px; - - height: 50px; + /* margin-left: 500px; */ + transform: translateY(50%); + height: 40px; width: 140px; } .blog-button button { - padding: 15px 30px; + padding: 13px 25px; border-radius: 40px; color: black; font-size: 1em; @@ -93,7 +97,7 @@ header { } .line { width: 22px; - height: 2px; + height: 2.5px; background: black; margin-top: 5px; position: absolute; @@ -117,7 +121,6 @@ header { gap: -5px; position: relative; width: 30px; - margin-left: 5px; } .blog-button::before { @@ -128,9 +131,14 @@ header { display: none; border-radius: 40px; background: #002701; - transition: 0.5s cubic-bezier(1, 0, 0.6, 1); + /* transition: 0.5s cubic-bezier(1, 0, 0.6, 1); */ + transition: width 2s; + transition-timing-function: cubic-bezier(0.4, 0.7, 1, 0.1); position: absolute; } +.blog-button button:hover .blog-button::before { + width: 100px; +} .blog-button button:hover .arr { -ms-transform-origin-x: 12px; margin-left: 5px; @@ -147,24 +155,200 @@ header { color: white; } -@media screen and (max-width: 1600px) { +@media screen and (max-width: 1920px) { + .header { + height: 50px; + } + .menu ul { + display: flex; + list-style: none; + /* margin-left: -100px; */ + transform: translate(-30px); + } + .logo { margin-left: 20px; } } + @media screen and (max-width: 1100px) { .logo { margin-left: 20px; } } +@media screen and (max-width: 800px) { + .menu ul { + transform: translateX(-60px); + } + .menu ul li { + margin: 0px 12px; + } + .menu ul li a { + font-size: 0.65em; + } + .blog-button { + transform: translateY(50px); + transform: translateX(-30px); + height: 35px; + width: 120px; + } + .blog-button button { + transform: translateY(100%); + padding: 10px 17px; + font-size: 0.75em; + } + .arrow { + border-right: 2px solid black; + border-top: 2px solid black; + height: 10px; + width: 10px; + } + .line { + width: 19px; + height: 2px; + background: black; + } + .arr { + width: 30px; + margin-left: 0px; + } +} +@media screen and (max-width: 600px) { + .blog-button { + display: none; + } + .logo img { + width: 70px; + height: 70px; + } + .menu { + display: none; + } + + .burger { + display: block; + } +} /* Header end */ +/* burger menu */ +.burger { + height: 30px; + width: 20px; + /* background: white; */ + transform: translateY(50px); + transform: translateX(-20px); + margin-top: 30px; + padding: 0px 1px; + align-items: center; + display: none; +} +.bline { + background: black; + height: 14%; + width: 100%; + margin: auto; + margin-bottom: 4px; +} +.burger-menu { + display: none; + z-index: 5; + width: 40%; + background: rgb(34, 26, 26); + height: 100%; + position: fixed; + right: 0; + top: 0; + text-align: center; +} +.bmenu { + width: 150px; + text-align: center; + margin: 200px auto; + /* background: red; */ +} +.bmenu ul { + display: block; + list-style: none; +} + +.bmenu ul li { + text-decoration: none; + margin: 15px; +} +.bmenu ul li a { + text-decoration: none; + font-size: 1.05em; + color: white; + font-weight: 500; + font-family: "poppins", monospace; + transition: 0.4s; +} +.bmenu ul li a:hover { + color: #f59221; +} +.cross { + height: 30px; + width: 30px; + border-radius: 50%; + /* background: grey; */ + position: absolute; + top: 50px; + left: 50px; +} +.cross:hover .cro { + background: red; + /* box-shadow: 1px 3px 6px 1px red; */ +} +.cro { + width: 70%; + height: 3px; + background: white; + transition: cubic-bezier(0.075, 0.82, 0.165, 1); + transition: 0.4s; +} +.cross1 { + position: absolute; + top: 13px; + transform: rotate(45deg); + left: 4px; +} +.cross2 { + transform: rotate(135deg); + position: absolute; + top: 13px; + left: 4px; +} + +@media screen and (max-width: 700px) { + .blog-button { + display: none; + } + .logo img { + width: 70px; + height: 70px; + } + .menu { + display: none; + } + + .burger { + display: block; + } + .burger-menu { + width: 70%; + } + .bmenu ul li a { + font-size: 1em; + } +} +/* burger menu end */ .projects-intro { padding: 10px 0px; margin-bottom: 20px; } -.projects-intro button { +/* .projects-intro button { border-radius: 12px; padding: 5px 30px; border: none; @@ -172,7 +356,7 @@ header { color: white; text-align: center; font-weight: bold; -} +} */ .projects-Container { display: flex; @@ -437,9 +621,6 @@ header { @media screen and (max-width: 1950px) { body { } - header { - height: 160px; - } .menu { margin-top: 20px; diff --git a/pages/product.html b/pages/product.html index d6a95f0..7c1bedc 100644 --- a/pages/product.html +++ b/pages/product.html @@ -37,10 +37,11 @@
+ +
+
+
+
+
+ +
+ +
@@ -231,7 +267,7 @@

Kinyarwanda Dataset SST

Projects under debvelopment [3]

would you like to join and continue

- +
From 2bb194874dbb6a37bcd5a1ad80ed96a64d56642c Mon Sep 17 00:00:00 2001 From: Gatete Ishema Angelo Chrristian Date: Sun, 30 Apr 2023 17:38:07 +0300 Subject: [PATCH 16/16] Merging to product list --- assets/css/product.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/assets/css/product.css b/assets/css/product.css index 827c40f..c6f23c1 100644 --- a/assets/css/product.css +++ b/assets/css/product.css @@ -62,7 +62,7 @@ header { text-decoration: none; font-size: 0.8em; color: white; - font-weight: 500; + font-weight: 400; font-family: "poppins", monospace; transition: 0.4s; }