Delete 100_projects/1- saudi_founding_day directory
This commit is contained in:
parent
f2025b09aa
commit
cd1d43d6a8
@ -1,9 +0,0 @@
|
||||
# تحدي يوم التأسيس
|
||||
`تفاصيل التحدي`
|
||||
|
||||
> 2023-2-22 يوم الاربعاء
|
||||
- رابط التحدي على [تويتر](https://twitter.com/b_wffa/status/1626264652211490819?s=20)
|
||||
- الصور المستخدمة في التصميم [اضغط هنا](https://dribbble.com/shots/20666330-foundation-day)
|
||||
- متوافق مع كل الشاشات
|
||||
- النتيجة النهائية [اضغط هنا](https://x39ome.github.io/saudi_founding_day/)
|
||||
- 2023 - 2 - 16 الخميس
|
File diff suppressed because one or more lines are too long
@ -1,168 +0,0 @@
|
||||
*{
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
transition: .3s;
|
||||
}
|
||||
/* Start Navigation */
|
||||
.header .nav{
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background:#F3EBD9;
|
||||
color: #000;
|
||||
width: 100%;
|
||||
height: 80px;
|
||||
padding: 10px 80px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-content: center;
|
||||
z-index: 999;
|
||||
}
|
||||
.header .nav p{
|
||||
align-self: center;
|
||||
}
|
||||
.header .nav #menuToggle{
|
||||
display: none;
|
||||
color: #fff;
|
||||
}
|
||||
.header .nav #navigation{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
list-style: none;
|
||||
gap: 20px;
|
||||
}
|
||||
.header .nav #navigation li{
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
}
|
||||
.header .nav #navigation li::before{
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: -5px;
|
||||
right: 0;
|
||||
height: 2px;
|
||||
width: 0;
|
||||
background-color: #715349;
|
||||
transition: .3s;
|
||||
}
|
||||
.header .nav #navigation li:hover:before{
|
||||
width: 100%;
|
||||
}
|
||||
.header .nav #navigation li a{
|
||||
text-decoration: none;
|
||||
color: #000;
|
||||
transition: .3s;
|
||||
font-size: 18px;
|
||||
}
|
||||
@media(max-width:767px){
|
||||
.header .nav #navigation{
|
||||
position: absolute;
|
||||
overflow: hidden;
|
||||
top: 80px;
|
||||
left: 0;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
background: #F3EBD9;
|
||||
width: 100%;
|
||||
height: 0;
|
||||
transition: .3s;
|
||||
}
|
||||
.header .nav #navigation.active{
|
||||
height: 185px;
|
||||
padding-top: 35px;
|
||||
}
|
||||
.header .nav #menuToggle{
|
||||
display: block;
|
||||
position: absolute;
|
||||
left: 20px;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
font-size: 24px;
|
||||
padding: 5px 10px;
|
||||
cursor: pointer;
|
||||
transition: .3s;
|
||||
color: #715349;
|
||||
}
|
||||
.header .nav #menuToggle:hover{
|
||||
border-radius: 5px;
|
||||
border: 2px solid #715349;
|
||||
}
|
||||
}
|
||||
/* End Navigation */
|
||||
.landing{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
background-color: #FEFBF0;
|
||||
padding: 80px 20px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
.landing .background{
|
||||
background-image: url(../imgs/original-4.webp);
|
||||
width: 110px;
|
||||
height: 100%;
|
||||
z-index: 998;
|
||||
position: absolute;
|
||||
opacity: .3;
|
||||
left: 0;
|
||||
background-position: center;
|
||||
background-size: contain;
|
||||
}
|
||||
.landing .boxImg{
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
.landing .boxImg img{
|
||||
max-width: 100%;
|
||||
}
|
||||
.landing .boxImg::before{
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
opacity: .3;
|
||||
top: -20px;
|
||||
right: 70px;
|
||||
background-image: url(../imgs/original-3.webp);
|
||||
}
|
||||
.landing .text{
|
||||
position: relative;
|
||||
z-index: 9;
|
||||
margin-left: 100px;
|
||||
}
|
||||
.landing .text h1{
|
||||
font-size: 51px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
.landing .text q, .landing .text p{
|
||||
margin-top: 20px;
|
||||
font-size: 18px;
|
||||
}
|
||||
.landing .text button{
|
||||
color: #fff;
|
||||
background-color: #715349;
|
||||
border: 1px solid #F3EBD9;
|
||||
padding: 10px 25px;
|
||||
margin-top: 20px;
|
||||
font-size: 17px;
|
||||
cursor: pointer;
|
||||
transition: .3s;
|
||||
}
|
||||
.landing .text button:hover{
|
||||
color: #715349;
|
||||
border: 1px solid #715349;
|
||||
background: #F3EBD9;
|
||||
}
|
||||
/* Media*/
|
||||
@media(max-width:767px){
|
||||
.landing{
|
||||
flex-direction: column;
|
||||
gap: 30px;
|
||||
}
|
||||
.landing .text{
|
||||
margin-left: 0;
|
||||
text-align:center;
|
||||
}
|
||||
}
|
Binary file not shown.
Before Width: | Height: | Size: 53 KiB |
Binary file not shown.
Before Width: | Height: | Size: 161 KiB |
Binary file not shown.
Before Width: | Height: | Size: 98 KiB |
Binary file not shown.
Before Width: | Height: | Size: 114 KiB |
Binary file not shown.
Before Width: | Height: | Size: 92 KiB |
@ -1,45 +0,0 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en" dir="rtl">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<link rel="stylesheet" href="css/style.css">
|
||||
<link rel="stylesheet" href="css/all.min.css">
|
||||
<title>يوم التأسيس</title>
|
||||
<link rel="icon" href="imgs/icon.png">
|
||||
</head>
|
||||
<body>
|
||||
<div class="header">
|
||||
<div class="nav">
|
||||
<img src="imgs/original.webp">
|
||||
<div id="menuToggle" onclick="menuToggle();">
|
||||
<i class="fa-solid fa-bars"></i>
|
||||
</div>
|
||||
<ul id="navigation">
|
||||
<li><a href="#">قصتنا</a></li>
|
||||
<li><a href="#">تحميل الهوية</a></li>
|
||||
<li><a href="#">تواصل معنا</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="landing">
|
||||
<div class="boxImg">
|
||||
<img src="imgs/original-2.webp" alt="header">
|
||||
</div>
|
||||
<div class="text">
|
||||
<h1>يوم بدينا</h1>
|
||||
<q> نعتز بذكرى تأسيس هذه الدولة المباركة في العام <br>
|
||||
1139هـ (1727م), منذ ذلك التاريخ وحتى اليوم؛ <br>
|
||||
أرست ركائز السلم والاستقرار وتحقيق العدل <br>
|
||||
والحمد لله على كل النعم
|
||||
</q>
|
||||
<p>الملك سلمان بن عبدالعزيز آل سعود</p>
|
||||
<button>تحميل الهوية</button>
|
||||
</div>
|
||||
<div class="background"></div>
|
||||
</div>
|
||||
</div>
|
||||
<script src="js/main.js"></script>
|
||||
<script src="js/all.min.js"></script>
|
||||
</body>
|
||||
</html>
|
File diff suppressed because one or more lines are too long
@ -1,13 +0,0 @@
|
||||
// Toggle Menu
|
||||
function menuToggle(){
|
||||
const menuToggle = document.getElementById('menuToggle');
|
||||
const navigation = document.getElementById('navigation');
|
||||
menuToggle.classList.toggle('active');
|
||||
navigation.classList.toggle('active');
|
||||
};
|
||||
|
||||
|
||||
// Time & Date (Footer)
|
||||
setInterval(function(){
|
||||
document.getElementById('date').innerHTML = Date();
|
||||
},1000);
|
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Loading…
Reference in New Issue
Block a user