commit 937f9c1f6479af318cbb4f2d0269728c5652d0fc Author: emil28092005 Date: Sat Sep 19 12:58:15 2026 +0300 Initial design study materials diff --git a/index.html b/index.html new file mode 100644 index 0000000..1bea6b8 --- /dev/null +++ b/index.html @@ -0,0 +1,34 @@ + + + + + + Document + + + + + +
+
+ Shop +
Shop the Latest
Mac
iPad
iPhone
Apple Watch
Apple Vision Pro
AirPods
Accessories
+
+ +
+ Quick Links +
Find a Store
Order Status
Apple Upgrade
Apple Trade In
Financing
Personal Setup
College Student Offer
+
+ +
+ Shop Special Stores +
Certified Refurbished
Education
Business
Veterans and Military
Government
+
+
+ + diff --git a/styles.css b/styles.css new file mode 100644 index 0000000..5ddda8f --- /dev/null +++ b/styles.css @@ -0,0 +1,91 @@ +* { + box-sizing: border-box; +} + +body { + margin: 0; + font-family: Arial, sans-serif; + background: #f5f5f7; + color: #333; +} + +.horizontal { + display: flex; + flex-direction: row; +} + +#navbar { + width: 80%; + height: 40px; + margin: 12px auto 25px; + padding: 0 12px; + + align-items: center; + justify-content: space-between; + + background-color: white; +} + +#navbar > div { + color: #555; + font-size: 11px; + text-decoration: none; +} + +#navbar > div:hover { + color: black; +} + +.logo { + color: black; + font-size: 18px; +} + +#navbar span { + color: #555; + font-size: 17px; +} + +.menu { + width: 55%; + margin-left: 11%; + + align-items: flex-start; + gap: 30px; +} + +.column { + display: flex; + flex-direction: column; + + background-color: #f5f5f7; +} + +.column small { + padding: 6px; + margin-bottom: 4px; + + color: #777; + font-size: 10px; + background-color: white; +} + +.column > div { + padding: 3px 6px; + + color: #444; + font-size: 11px; + font-weight: bold; +} + +.column > div:hover { + color: black; +} + +.first-column { + width: 160px; +} + +.first-column > div { + font-size: 18px; +}