Skip to content

Commit

Permalink
wip
Browse files Browse the repository at this point in the history
  • Loading branch information
@bekzodjonganiyev
bekzodjonganiyev committed Jan 28, 2023
1 parent ae9bbcd commit b385c17
Show file tree
Hide file tree
Showing 4 changed files with 156 additions and 148 deletions.
95 changes: 41 additions & 54 deletions src/components/mainheroslider/slider.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,29 @@ import slide_1 from "../../files/Qabul22.jpg";
import slide_6 from "../../files/Toshkent_kimyo_texnologiya_instituti.jpg";

function MainSlider() {
const { DataGetter, globalUrl } = useContext(Context);
const [banner, setBanner] = useState({
isFetched: false,
error: false,
data: {},
});

useEffect(() => {
fetch(`${globalUrl}/elon/all`, {
headers: {
"Content-Type": "application/json",
},
})
.then((res) => res.json())
.then(
(data) =>
data.success && setBanner({ data: data.data, isFetched: true })
)
.catch(() => setBanner({ error: true }));
}, []);

console.log(banner.data);

return (
<>
<div className="container-fluid">
Expand All @@ -19,63 +42,27 @@ function MainSlider() {
data-bs-ride="carousel"
>
<div className="carousel-inner">
<div className="carousel-item">
<img
className=""
src={`${slide_5}`}
width="100%"
height="100%"
alt=""
/>
</div>
<div className="carousel-item active">
<img
className=""
src={`${slide_1}`}
width="100%"
height="100%"
alt=""
/>
</div>
<div className="carousel-item">
<img
className=""
src={`${slide_2}`}
width="100%"
height="100%"
alt=""
/>
</div>{" "}
<div className="carousel-item">
<a href="http://www.double-degree.tcti.uz" target="_blank">
{" "}
{banner.isFetched && banner.data && banner.data.length > 0 ? (
banner.data.map((e, index) => (
<div key={index} className="carousel-item">
<img
src={`${globalUrl}/${e.banner_img}`}
width="100%"
height="100%"
alt={e.name}
/>
</div>
))
) : (
<div className="carousel-item active">
<img
className=""
src={`${slide_6}`}
src={slide_5}
width="100%"
height="100%"
alt=""
alt="Banner img"
/>
</a>
</div>
<div className="carousel-item">
<img
className=""
src={`${slide_3}`}
width="100%"
height="100%"
alt=""
/>
</div>
<div className="carousel-item">
<img
className=""
src={`${slide_4}`}
width="100%"
height="100%"
alt=""
/>
</div>
</div>
)}
</div>
<button
className="carousel-control-prev slider__btn"
Expand Down Expand Up @@ -105,4 +92,4 @@ function MainSlider() {
);
}

export default MainSlider;
export default MainSlider;
9 changes: 2 additions & 7 deletions src/components/news/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,13 +44,8 @@ function YangiliklarComp({ home }) {
alt="news img"
/>
<div className="news__body">
<h4>
{e[`title_${lang}`].split(" ").slice(0, 10).join(" ")}
...&#128279;
</h4>
{e[`body_${lang}`].map((a, ind) => (
<p key={ind}>{a}</p>
))}
<h4>{e[`title_${lang}`]}</h4>

<br />
<p>
<i className="fa-solid fa-calendar-days">
Expand Down
196 changes: 110 additions & 86 deletions src/components/news/style.css
View file
Original file line number Diff line number Diff line change
@@ -1,95 +1,119 @@
.news__list {
display: flex;
justify-content: space-evenly;
align-items: flex-start;
flex-wrap: wrap;
}

.news__card {
width: 300px;
height: 400px;
min-height: 300px;
margin: 20px;

}
.news__card:hover{
transition: all 1s;
box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}
.news__body {
padding: 10px;
}
.news__body h4 {
/* height: 40px; */
font-weight: 600;
font-size: 15px;
line-height: 130%;
color: #02307d !important;
}

.news__body p {
height: 60px;
font-weight: 400;
font-size: 14px;
line-height: 140%;
color: rgba(2, 48, 125, 0.75);
-webkit-box-orient: vertical;
display: -webkit-box;
-webkit-line-clamp: 3;
display: flex;
justify-content: space-evenly;
align-items: flex-start;
flex-wrap: wrap;
}

.news__card {
width: 300px;
height: 400px;
min-height: 300px;
margin: 20px;
margin: 5px;
border: 1px solid rgba(0, 0, 255, 0.447);
}
.news__card:hover {
transition: 0.5s;
box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}

.news__body {
padding: 15px;
}
.news__body h4 {
font-weight: 600;
font-size: 15px;
line-height: 130%;
color: #02307d !important;
width: 100%;
height: 60px;
/* white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
white-space: normal;
}

.news__body br + p {
font-weight: 400;
font-size: 14px;
line-height: 130%;
color: #41649d;
text-overflow: ellipsis; */

white-space: pre-line;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}

.news__body p {
font-weight: 400;
margin: 0 !important;
font-size: 14px;
line-height: 140%;
color: rgba(2, 48, 125, 0.75);
}

.news__body br + p {
font-weight: 400;
font-size: 14px;
line-height: 130%;
color: #41649d;
display: block;
margin-top: 10px;
}

.hj {
width: 40px;
margin: 20px auto !important;
display: flex;
justify-content: center;
border-radius: 50%;
border: 3px solid rgba(2, 48, 125, 0.75);
}

.news__item__card {
width: 70%;
height: auto;
}
.news__item__card img {
padding: 10px;
width: 50%;
height: auto;
}

.news_photo {
width: 300px;
height: 200px;
}

.news__nav {
width: calc(100% - 70%);
display: flex;
justify-content: right;
flex-wrap: wrap;
}

.news__nav__card {
width: 300px;
margin: 10px auto;
border: 1px solid rgba(2, 48, 125, 0.75);
padding: 10px;
text-decoration: none;
height: auto;
}
.elonDesc {
display: flex;
justify-content: space-between;
align-items: flex-start;
}
.card__html__content img,
.card__html__content iframe,
.card__html__content video {
max-width: 100%;
}
@media (max-width: 768px) {
.elonDesc {
display: block;
margin-top: 10px;
}

.hj {
width: 40px;
margin: 20px auto !important;
display: flex;
justify-content: center;
border-radius: 50%;
border: 3px solid rgba(2, 48, 125, 0.75);
}

.news__item__card{

.news__item__card {
width: 100%;
height: auto;
}
.news__item__card img{
padding: 10px;
width: 50%;
height: auto;
}


.news_photo{
width: 300px;
height: 200px;
}

.news__nav {
width: 100%;
display: flex;
justify-content: space-between;
align-items: flex-start;
flex-wrap: wrap;
}

.news__nav__card {
width: 300px;
margin: 10px auto;
border: 1px solid rgba(2, 48, 125, 0.75);
padding: 10px;
border-radius: 10px;
text-decoration: none;
}
}
4 changes: 3 additions & 1 deletion src/context/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,8 +21,10 @@ function Provider({ children }) {
const date = new Date(arg);
const kun = String(date.getDate()).padStart(2, 0);
const oy = String(date.getMonth() + 1).padStart(2, 0);
const soat = String(date.getHours()).padStart(2,0);
const minut = String(date.getMinutes()).padStart(2.0)
const yil = date.getFullYear();
return `${kun}.${oy}.${yil}`;
return `${soat}:${minut} | ${kun}.${oy}.${yil}`;
};

const textSytles = (size, weight) => {
Expand Down

0 comments on commit b385c17

Please sign in to comment.