From 16f5b16ee235809ac62369418faac482c631bc3f Mon Sep 17 00:00:00 2001 From: clairetay96 Date: Thu, 6 Aug 2020 22:01:17 +0800 Subject: [PATCH] iOS mockup addded --- .DS_Store | Bin 0 -> 6148 bytes index.html | 112 ++++++++++++++++++++++++++++++++++++++++++++++++ style.css | 122 +++++++++++++++++++++++++++++++++++++++++++++++++++++ 3 files changed, 234 insertions(+) create mode 100644 .DS_Store create mode 100644 index.html create mode 100644 style.css diff --git a/.DS_Store b/.DS_Store new file mode 100644 index 0000000000000000000000000000000000000000..ef9939cee6fcac97eefccb501b0d72c7498e093c GIT binary patch literal 6148 zcmeHKI|>3Z5S{S@f{mqRuHX%VXkqOI1O*#eLD70E&*jm4^J$jFP7CD?OkOgXmylQN z?1+diZ-<4*OhhJdLwVTHH`_Pw*&rhdgyW3seS2w6=jPbUeHSq9ST?ekvosyP?a-(I z6`%rCfC^B7Pb-iWb~63+!90%&P=TLUz`hR!ZdeoBK>u`L@D>0#Lf8#+?GNs z1|kB}paO%c* + + + + + + + +
+
+
IIIIIII
+
10:05
+
+
+
+
+
+
+
+ +
+
+
+

Old Radio

+
+
+
+

TextSpeak

+
+
+
+

Tesserax

+
+
+
+

CalcFriend

+
+
+
+

SmugFox

+
+
+
+

Hipsta

+
+
+
+

Better

+
+
+
+

SubTracker

+
+
+
+

All Heart

+
+
+
+

WhereWear

+
+
+
+

Vindicate

+
+
+
+

EvilCorpCareers

+
+
+ +

BlackMail

+
+
+ +

Astro

+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
+
+ +
+
+ +
+ +
+ + + + +
+ +
+ + + + + + \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..f66f85b --- /dev/null +++ b/style.css @@ -0,0 +1,122 @@ + +.screen { + width: 100%; + height: 1736px; + background-image: url("Wallpaper/Default.jpg"); + background-size: cover; + position:relative; +} + +.battery-icon { + width: 64px; + position: absolute; + height: 23px; + background-color: white; + right: 15px; + top: 4px; +} + + +.battery-icon1 { + width: 66px; + position: absolute; + right: 11px; + height: 25px; + border: 3px solid white; + +} + +header { + color: white; + font-family: arial; + font-size: 30px; + padding: 5px; +} + +header::after { + content: ""; + clear: both; + display:table; +} + +header div { + width: calc((100% - 45px) / 3); + float: left; + margin: 5px; +} + +.time { + text-align: center; +} + +.battery { + position: relative; + text-align: right; +} + +.all-icons { + margin: 20px; + +} + +.all-icons::after, .footer-icons::after { + content: ""; + clear: both; + display:table; +} + +.icon { + float: left; + width: calc((100% - 144px) / 4); + margin: 2% 18px; +} + +.icon-img { + width: 100%; + border-radius: 12px; +} + +.icon p { + text-align: center; + font-family: arial; + color: white; + margin-top: 5%; +} + + +.footer-icons { + position: absolute; + bottom: 0; + padding: 10px; + margin-left: -20px; + background-color: rgba(255,255,255,0.5); + +} + + +.hidden { + display: none; +} + +@media (min-width:981px){ + + .screen { + width: 100%; + height: 950px; + } + + .icon { + width: calc((100% - 216px) / 6); + margin: 4% 18px; + border-radius: 12px; + } + + .hidden { + display: inline-block; + } + + .hidden1 { + display: none; + } + +} \ No newline at end of file