Bách khoa Toàn thư Việt Nam - Đóng góp của thành viên [vi]

Bản mẫu:Trang Chính/styles.css

2020-10-04T09:35:32Z

Tientm93:

.main-page-summary {
min-height: 125px;
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.1);
border: 1px solid #E0E0E0;
border-radius: 3px;
display: flex;
align-items: center;
flex-wrap: wrap;
padding: 0 20px;
}

.main-page-summary ul {
display: flex;
flex: 0 0 50%;
flex-wrap: wrap;
list-style: none;
padding: 0;
}

.main-page-summary ul li {
flex: 0 0 33%;
font-size: 14px;
padding: 5px 0;
}

.main-page-summary ul li img {
margin-right: 6px;
}

.main-page .section-title {
font-size: 24px;
font-weight: bold;
padding: 20px 0;
}

.article-1 {
background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/3/35/Bromine_vial_in_acrylic_cube.jpg/1000px-Bromine_vial_in_acrylic_cube.jpg);
background-size: cover;
width: 100%;
padding-top: 100%;
position: relative;
}

.article-2 {
background-image: url(https://upload.wikimedia.org/wikipedia/commons/a/a8/NASA-Apollo8-Dec24-Earthrise.jpg);
background-size: cover;
width: 100%;
padding-top: 100%;
position: relative;
}

.article-3 {
background-image: url(https://upload.wikimedia.org/wikipedia/commons/a/af/Fogo%2C_Cape_Verde_Islands.jpg);
background-size: cover;
width: 100%;
padding-top: 100%;
position: relative;
}

.article-4 {
background-image: url('https://upload.wikimedia.org/wikipedia/commons/9/96/Descripción_histórica_y_cronológica_de_las_dos_piedras_que_con_ocasión_del_nuevo_empedrado_que_se_está_formando_en_la_plaza_principal_de_México%2C_se_hallaron_en_ella_el_año_de_1790-1b.jpg');
background-size: cover;
width: 100%;
padding-top: 100%;
position: relative;
}

.article-5 {
background-image: url(https://upload.wikimedia.org/wikipedia/commons/3/3b/11-09-fotofluege-cux-allg-25a.jpg);
background-size: cover;
width: 100%;
padding-top: 100%;
position: relative;
}

.article-6 {
background-image: url(https://upload.wikimedia.org/wikipedia/commons/c/c3/Organic_home-grown_tomatoes_-_unripe_to_ripe.jpg);
background-size: cover;
width: 100%;
padding-top: 100%;
position: relative;
}

.article-7 {
background-image: url(https://upload.wikimedia.org/wikipedia/commons/a/ab/Eastern_greenish_black-tip_%28Euchloe_penia%29_underside_Macedonia.jpg);
background-size: cover;
width: 100%;
padding-top: 100%;
position: relative;
}

.article-text {
padding-bottom: 6px;
padding-left: 6px;
position: absolute;
bottom: 0;
background-image: linear-gradient(rgba(240, 240, 240, 0), rgba(240, 240, 240, 1));
width: calc(100% - 5px);
}

.article-mobile-text {
padding-bottom: 1px;
padding-left: 1px;
position: absolute;
bottom: 0;
background-image: linear-gradient(rgba(240, 240, 240, 0), rgba(240, 240, 240, 1));
width: calc(100% - 1px);
visibility: hidden;
display:none;
text-align: center;
}

@media only screen and (max-width: 1100px) {
.welcome-container {
text-align: center;
flex: 0 0 100%;
}

.main-page-summary ul {
flex: 0 0 100%;
}
.main-page-summary ul li {
text-align: center;
}

.main-page .group-layout .group-item {
flex: 0 0 100%;
}

.main-page .featured-article-container .big-focus {
flex: 0 0 100%;
height: calc(100vw - 44px);
margin-bottom: 20px;
}

.main-page .featured-article-container .small-focus {
flex: 0 0 100%;
}

.main-page .small-focus .article {
flex: 0 0 100%;
margin: 0 0 20px 0;
height: calc(100vw - 44px);
}

.main-page .big-focus .article {
flex: 0 0 100%;
height: calc(100vw - 44px);
}

.article-text {
visibility: hidden;
display:none;
}

.article-mobile-text {
visibility: visible;
display:initial;
}
}

.main-page .group-layout {
display: flex;
flex-wrap: wrap;
}

.main-page .group-layout .group-item {
flex: 0 0 calc(50% - 10px);
}

.main-page .group-layout .group-box {
box-shadow: 0 3px 6px #000000;
border: 1px solid #E0E0E0;
border-radius: 3px;
padding: 20px;
}

.main-page .group-layout .group-item:nth-child(odd) {
margin-right: 20px;
}

.main-page .group-layout .group-box-item {
margin-bottom: 10px;
}

.main-page .group-layout .group-box-item img {
margin-right: 6px;
}

.main-page .group-layout .group-box-item-image {
display: flex;
margin-bottom: 23px;
}

.main-page .group-layout .group-box-item-image .img-container {
flex: 0 0 80px;
width: 80px;
height: 80px;
display: flex;
align-items: center;
justify-content: center;
margin-right: 16px;
}

.main-page .group-layout .group-box-item-image .img-container img {
max-width: 100%;
max-height: 100%;
}

.main-page .item-title {
font-weight: bold;
}

.text-red {
color: #FF5A28;
}

@media only screen and (max-width: 1100px) {
.welcome-container {
text-align: center;
flex: 0 0 100%;
}

.main-page-summary ul {
flex: 0 0 100%;
}
.main-page-summary ul li {
text-align: center;
}

.main-page .group-layout .group-item {
flex: 0 0 100%;
}

.main-page .featured-article-container .big-focus {
flex: 0 0 100%;
height: calc(100vw - 44px);
margin-bottom: 20px;
}

.main-page .featured-article-container .small-focus {
flex: 0 0 100%;
}

.main-page .small-focus .article {
flex: 0 0 100%;
margin: 0 0 20px 0;
height: calc(100vw - 44px);
}

.main-page .big-focus .article {
flex: 0 0 100%;
height: calc(100vw - 44px);
}
}

Trang Chính

2020-10-04T09:22:34Z

Tientm93:

<templatestyles src="Bản mẫu:Trang Chính/styles.css" />
<div class="main-page-summary">
<div class="welcome-container">
<b style="font-size: 24px"><span style="color: #FF5A28;">Bách khoa Toàn thư Việt Nam</span></b> <br>
với các mục từ [[BKTT:Giới thiệu|<span style="color: #FF5A28;">chính thức</span>]] và đóng góp bởi [[Help:Hướng dẫn|<span style="color: #FF5A28;">cộng đồng</span>]]
</div>
<div style="flex: 1 1 1px;"></div>
<ul>
<li><span style="color: #FF5A28;">●</span> [[Đặc biệt:Trang mới|<span class="text-red">'''Mới viết'''</span>]]</li>
<li><span style="color: #FF5A28;">●</span> [[BKTT:Văn học|<span style="color: #FF5A28;">Văn học</span>]]</li>
<li><span style="color: #FF5A28;">●</span> [[BKTT:Toán học, Cơ học|<span style="color: #FF5A28;">Toán học</span>]]</li>
<li><span style="color: #FF5A28;">●</span> [[BKTT:Vật lý học, Thiên văn học|<span style="color: #FF5A28;">Vật lý học</span>]]</li>
<li><span style="color: #FF5A28;">●</span> [[BKTT:Hóa học, Công nghệ hóa học|<span style="color: #FF5A28;">Hóa học</span>]]</li>
<li><span style="color: #FF5A28;">●</span> [[BKTT:Sinh học, Công nghệ sinh học|<span style="color: #FF5A28;">Sinh học</span>]]</li>
<li><span style="color: #FF5A28;">●</span> [[BKTT:Địa lý học, Địa lý thế giới|<span style="color: #FF5A28;">Địa lý học</span>]]</li>
<li><span style="color: #FF5A28;">●</span> [[BKTT:Công nghệ thông tin|<span style="color: #FF5A28;">Công nghệ thông tin</span>]]</li>
<li><span style="color: #FF5A28;">●</span> '''[[BKTT:Toàn bộ|<span style="color: #FF5A28;">Toàn bộ</span>]]'''</li>
</ul>
</div>
</div>
<div> </div>
{| style="width: 100%"
|-
| rowspan="2" style="width: 40%;border-right: 0.5vw solid white;" | <div class="article-1"><div class="article-text"><br/><br/>[[Tập tin:viewmore.svg|frameless|15px|link=Brôm]]  [[Brôm|<span style="color:#424242;font-size:20px;color: #FF5A28;">'''Brôm'''</span>]]<br/>'''Brôm''' (theo tiếng Pháp ''brome'' /bʁom/) là [[nguyên tố hóa học]] thứ 3 thuộc nhóm [[Halogen]] (bao gồm [[flo]], [[clo]], brôm, [[iốt]], [[astatin]]), có ký hiệu '''Br''' và [[số nguyên tử]] 35. Cả nhóm Halogen thuộc [[halogen|nhóm VIIA]] trong [[bảng tuần hoàn|bảng hệ thống tuần hoàn]].</div><div class="article-mobile-text"><br/><br/>[[Brôm|<span style="color:#FF5A28">'''Brôm'''</span>]]</div></div> || style="width: 20.15%;border: 0.5vw solid white;" | <div class="article-2" onclick="location.href='https://bktt.vn/index.php/M%E1%BA%B7t_tr%C4%83ng';" ><div class="article-text"><br/><br/>[[Tập tin:viewmore.svg|frameless|15px|link=Mặt trăng]]  [[Mặt trăng|<span style="color:#FF5A28;font-size:20px">'''Mặt trăng'''</span>]]</div><div class="article-mobile-text"><br/><br/>[[Mặt trăng|<span style="color:#FF5A28;font-size:8px">'''Mặt trăng'''</span>]]</div></div> || style="width: 20.15%;border: 0.5vw solid white;" | <div class="article-3"><div class="article-text"><br/><br/>[[Tập tin:viewmore.svg|frameless|15px|link=Núi lửa]]  [[Núi lửa|<span style="color:#FF5A28;font-size:20px">'''Núi lửa''']]</div><div class="article-mobile-text"><br/><br/>[[Núi lửa|<span style="color:#FF5A28;font-size:8px">'''Núi lửa'''</span>]]</div></div> || style="width: 19.6%;border-left: 0.5vw solid white;border-top: 0.5vw solid white;border-bottom: 0.5vw solid white;" | <div class="article-4"><div class="article-text"><br/><br/>[[Tập tin:viewmore.svg|frameless|15px|link=Lịch Aztec]]  [[Lịch Aztec|<span style="color:#FF5A28;font-size:20px">'''Lịch Aztec'''</span>]]</div><div class="article-mobile-text"><br/><br/>[[Lịch Aztec|<span style="color:#FF5A28;font-size:8px">'''Lịch Aztec'''</span>]]</div></div>
|-
| style="width: 20.15%;border: 0.5vw solid white;" | <div class="article-5"><div class="article-text"><br/><br/>[[Tập tin:viewmore.svg|frameless|15px|link=Giàn khoan dầu]]  [[Giàn khoan dầu|<span style="color:#FF5A28;font-size:20px">'''Khoan dầu'''</span>]]</div><div class="article-mobile-text"><br/><br/>[[Giàn khoan dầu|<span style="color:#FF5A28;font-size:8px">'''Khoan dầu'''</span>]]</div></div>|| style="width: 20.15%;border: 0.5vw solid white;" | <div class="article-6"><div class="article-text"><br/><br/>[[Tập tin:viewmore.svg|frameless|15px|link=Cà chua]]  [[Cà chua|<span style="color:#FF5A28;font-size:20px">'''Cà chua'''</span>]]</div><div class="article-mobile-text"><br/><br/>[[Cà chua|<span style="color:#FF5A28;font-size:8px">'''Cà chua'''</span>]]</div></div> || style="width: 19.6%;border-left: 0.5vw solid white;border-top: 0.5vw solid white;border-bottom: 0.5vw solid white;" | <div class="article-7"><div class="article-text"><br/><br/>[[Tập tin:viewmore.svg|frameless|15px|link=Euchloe penia]]  [[Euchloe penia|<span style="color:#FF5A28;font-size:20px">'''''Euchloe penia'''''</span>]]</div><div class="article-mobile-text"><br/><br/>[[Euchloe penia|<span style="color:#FF5A28;font-size:8px">'''''Euchloe penia''''</span>]]</div></div>
|}
<div class="group-layout">
<div class="group-item">
<div class="section-title">New articles</div>
<div class="group-box">
<div class="group-box-item">
<div class="centerY">
<img src="icon/right-arrow.svg" alt="">
<span class="item-title">Alexandra Rud</span>
</div>
that only five Jain temples (one pictured) remain in the <span class="text-red">Kumbhariya</span>
district of Gujarat out of hundreds that were destroyed by volcanic activity?
</div>
<div class="group-box-item">
<div class="centerY">
<img src="icon/right-arrow.svg" alt="">
<span class="item-title">Venus</span>
</div>
Venus is the second planet from the Sun. It is named after the <span class="text-red">Roman</span>
goddess of love and beauty. As the second-brightest natural object in the night sky after the <span class="text-red">Moon</span>,
Venus can cast shadows and can be, on rare occasion, visible to the naked eye in broad daylight.
</div>
<div class="group-box-item">
<div class="centerY">
<img src="icon/right-arrow.svg" alt="">
<span class="item-title">Muriel Odessa “Nellie” Weekes</span>
</div>
Was a Bajan nurse and midwife who was active in women’s rights issues. Campaigning for better pay and working in social welfare
projects, she turned to politics in the 1940s at a time when most women were not politically active in Barbados.
</div>
<div class="group-box-item">
<div class="centerY">
<img src="icon/right-arrow.svg" alt="">
<span class="item-title">P. R. Krishna Kumar</span>
</div>
Was an Indian ayurvedic physician and the founder of the AVP Research Foundation, a non-profit research organisation promoting
research in the Indian medicine system of Ayurveda and managing director of The Arya Vaidya Pharmacy (Coimbatore) Ltd.
</div>
<div class="group-box-item">
<div class="centerY">
<img src="icon/right-arrow.svg" alt="">
<span class="item-title">Norman invasion of Ireland</span>
</div>
The Anglo-Norman invasion of Ireland took place during the late 12th century, when Anglo-Normans gradually conquered and acquired
large swathes of land from the Irish, which the kingdom of England then claimed sovereignty over.
</div>
<div class="group-box-item">
<div class="centerY">
<img src="icon/right-arrow.svg" alt="">
<span class="item-title">Rhodesian mission in Lisbon</span>
</div>
The Rhodesian mission in Lisbon (Portuguese: Missão da Rodésia em Lisboa), the capital of Portugal, operated from September 1965 to May 1975.
It was a diplomatic mission representing Rhodesia (or Southern Rhodesia), initially as a self-governing colony of Britain and
</div>
</div>
</div>
<div class="group-item">
<div class="section-title">Random articles</div>
<div class="group-box">
<div class="group-box-item">
<div class="centerY">
<img src="icon/right-arrow.svg" alt="">
<span class="item-title">Alexandra Rud</span>
</div>
that only five Jain temples (one pictured) remain in the <span class="text-red">Kumbhariya</span>
district of Gujarat out of hundreds that were destroyed by volcanic activity?
</div>
<div class="group-box-item">
<div class="centerY">
<img src="icon/right-arrow.svg" alt="">
<span class="item-title">Venus</span>
</div>
Venus is the second planet from the Sun. It is named after the <span class="text-red">Roman</span>
goddess of love and beauty. As the second-brightest natural object in the night sky after the <span class="text-red">Moon</span>,
Venus can cast shadows and can be, on rare occasion, visible to the naked eye in broad daylight.
</div>
<div class="group-box-item">
<div class="centerY">
<img src="icon/right-arrow.svg" alt="">
<span class="item-title">Muriel Odessa “Nellie” Weekes</span>
</div>
Was a Bajan nurse and midwife who was active in women’s rights issues. Campaigning for better pay and working in social welfare
projects, she turned to politics in the 1940s at a time when most women were not politically active in Barbados.
</div>
<div class="group-box-item">
<div class="centerY">
<img src="icon/right-arrow.svg" alt="">
<span class="item-title">P. R. Krishna Kumar</span>
</div>
Was an Indian ayurvedic physician and the founder of the AVP Research Foundation, a non-profit research organisation promoting
research in the Indian medicine system of Ayurveda and managing director of The Arya Vaidya Pharmacy (Coimbatore) Ltd.
</div>
<div class="group-box-item">
<div class="centerY">
<img src="icon/right-arrow.svg" alt="">
<span class="item-title">Norman invasion of Ireland</span>
</div>
The Anglo-Norman invasion of Ireland took place during the late 12th century, when Anglo-Normans gradually conquered and acquired
large swathes of land from the Irish, which the kingdom of England then claimed sovereignty over.
</div>
<div class="group-box-item">
<div class="centerY">
<img src="icon/right-arrow.svg" alt="">
<span class="item-title">Rhodesian mission in Lisbon</span>
</div>
The Rhodesian mission in Lisbon (Portuguese: Missão da Rodésia em Lisboa), the capital of Portugal, operated from September 1965 to May 1975.
It was a diplomatic mission representing Rhodesia (or Southern Rhodesia), initially as a self-governing colony of Britain and
</div>
</div>
</div>
<div class="group-item">
<div class="section-title">Social science</div>
<div class="group-box">
<div class="group-box-item-image">
<div class="img-container"><img src="img/rocket.jpg" alt=""></div>
<div>
<div class="item-title">Abu Ishaq Ibrahim</div>
<div>
Abu Ishaq was born on September 21, 953,[1] his father was <span class="text-red">Mu’izz al-Dawla</span>, while his mother was a
daughter of the Dailamite officer Ispahdost. Abu Ishaq had four brothers named
<span class="text-red">Bakhtiyar, Habashi, Marzuban, Abu Tahir</span>,
and a sister named <span class="text-red">Zubayda</span>. Abu Ishaq, during his youth, was tutored in <span class="text-red">Baghdad.[2]</span>
</div>
</div>
</div>
<div class="group-box-item-image">
<div class="img-container"><img src="img/rocket.jpg" alt=""></div>
<div>
<div class="item-title">Abu Ishaq Ibrahim</div>
<div>
Abu Ishaq was born on September 21, 953,[1] his father was <span class="text-red">Mu’izz al-Dawla</span>, while his mother was a
daughter of the Dailamite officer Ispahdost. Abu Ishaq had four brothers named
<span class="text-red">Bakhtiyar, Habashi, Marzuban, Abu Tahir</span>,
and a sister named <span class="text-red">Zubayda</span>. Abu Ishaq, during his youth, was tutored in <span class="text-red">Baghdad.[2]</span>
</div>
</div>
</div>
<div class="group-box-item-image">
<div class="img-container"><img src="img/rocket.jpg" alt=""></div>
<div>
<div class="item-title">Abu Ishaq Ibrahim</div>
<div>
Abu Ishaq was born on September 21, 953,[1] his father was <span class="text-red">Mu’izz al-Dawla</span>, while his mother was a
daughter of the Dailamite officer Ispahdost. Abu Ishaq had four brothers named
<span class="text-red">Bakhtiyar, Habashi, Marzuban, Abu Tahir</span>,
and a sister named <span class="text-red">Zubayda</span>. Abu Ishaq, during his youth, was tutored in <span class="text-red">Baghdad.[2]</span>
</div>
</div>
</div>
<div class="group-box-item-image">
<div class="img-container"><img src="img/rocket.jpg" alt=""></div>
<div>
<div class="item-title">Abu Ishaq Ibrahim</div>
<div>
Abu Ishaq was born on September 21, 953,[1] his father was <span class="text-red">Mu’izz al-Dawla</span>, while his mother was a
daughter of the Dailamite officer Ispahdost. Abu Ishaq had four brothers named
<span class="text-red">Bakhtiyar, Habashi, Marzuban, Abu Tahir</span>,
and a sister named <span class="text-red">Zubayda</span>. Abu Ishaq, during his youth, was tutored in <span class="text-red">Baghdad.[2]</span>
</div>
</div>
</div>
<div class="group-box-item-image">
<div class="img-container"><img src="img/rocket.jpg" alt=""></div>
<div>
<div class="item-title">Abu Ishaq Ibrahim</div>
<div>
Abu Ishaq was born on September 21, 953,[1] his father was <span class="text-red">Mu’izz al-Dawla</span>, while his mother was a
daughter of the Dailamite officer Ispahdost. Abu Ishaq had four brothers named
<span class="text-red">Bakhtiyar, Habashi, Marzuban, Abu Tahir</span>,
and a sister named <span class="text-red">Zubayda</span>. Abu Ishaq, during his youth, was tutored in <span class="text-red">Baghdad.[2]</span>
</div>
</div>
</div>
</div>
</div>
<div class="group-item">
<div class="section-title">Technique</div>
<div class="group-box">
<div class="group-box-item-image">
<div class="img-container"><img src="img/rocket.jpg" alt=""></div>
<div>
<div class="item-title">Abu Ishaq Ibrahim</div>
<div>
Abu Ishaq was born on September 21, 953,[1] his father was <span class="text-red">Mu’izz al-Dawla</span>, while his mother was a
daughter of the Dailamite officer Ispahdost. Abu Ishaq had four brothers named
<span class="text-red">Bakhtiyar, Habashi, Marzuban, Abu Tahir</span>,
and a sister named <span class="text-red">Zubayda</span>. Abu Ishaq, during his youth, was tutored in <span class="text-red">Baghdad.[2]</span>
</div>
</div>
</div>
<div class="group-box-item-image">
<div class="img-container"><img src="img/rocket.jpg" alt=""></div>
<div>
<div class="item-title">Abu Ishaq Ibrahim</div>
<div>
Abu Ishaq was born on September 21, 953,[1] his father was <span class="text-red">Mu’izz al-Dawla</span>, while his mother was a
daughter of the Dailamite officer Ispahdost. Abu Ishaq had four brothers named
<span class="text-red">Bakhtiyar, Habashi, Marzuban, Abu Tahir</span>,
and a sister named <span class="text-red">Zubayda</span>. Abu Ishaq, during his youth, was tutored in <span class="text-red">Baghdad.[2]</span>
</div>
</div>
</div>
<div class="group-box-item-image">
<div class="img-container"><img src="img/rocket.jpg" alt=""></div>
<div>
<div class="item-title">Abu Ishaq Ibrahim</div>
<div>
Abu Ishaq was born on September 21, 953,[1] his father was <span class="text-red">Mu’izz al-Dawla</span>, while his mother was a
daughter of the Dailamite officer Ispahdost. Abu Ishaq had four brothers named
<span class="text-red">Bakhtiyar, Habashi, Marzuban, Abu Tahir</span>,
and a sister named <span class="text-red">Zubayda</span>. Abu Ishaq, during his youth, was tutored in <span class="text-red">Baghdad.[2]</span>
</div>
</div>
</div>
<div class="group-box-item-image">
<div class="img-container"><img src="img/rocket.jpg" alt=""></div>
<div>
<div class="item-title">Abu Ishaq Ibrahim</div>
<div>
Abu Ishaq was born on September 21, 953,[1] his father was <span class="text-red">Mu’izz al-Dawla</span>, while his mother was a
daughter of the Dailamite officer Ispahdost. Abu Ishaq had four brothers named
<span class="text-red">Bakhtiyar, Habashi, Marzuban, Abu Tahir</span>,
and a sister named <span class="text-red">Zubayda</span>. Abu Ishaq, during his youth, was tutored in <span class="text-red">Baghdad.[2]</span>
</div>
</div>
</div>
<div class="group-box-item-image">
<div class="img-container"><img src="img/rocket.jpg" alt=""></div>
<div>
<div class="item-title">Abu Ishaq Ibrahim</div>
<div>
Abu Ishaq was born on September 21, 953,[1] his father was <span class="text-red">Mu’izz al-Dawla</span>, while his mother was a
daughter of the Dailamite officer Ispahdost. Abu Ishaq had four brothers named
<span class="text-red">Bakhtiyar, Habashi, Marzuban, Abu Tahir</span>,
and a sister named <span class="text-red">Zubayda</span>. Abu Ishaq, during his youth, was tutored in <span class="text-red">Baghdad.[2]</span>
</div>
</div>
</div>
</div>
</div>
</div>

Trang Chính

2020-10-04T09:13:24Z

Tientm93: