diff --git a/css/main.css b/css/main.css new file mode 100644 index 0000000..15de1df --- /dev/null +++ b/css/main.css @@ -0,0 +1,256 @@ +@CHARSET "UTF-8"; + +html, body { + height: 100%; +} + +body { + font-family: 'Open Sans', sans-serif; + margin: 0px; + font-size: 1em; + color: #2A2B2B; +} + +* { + margin: 0; +} + +/* Layout Styles */ + +#bodyContainer { + /*width: 700px;*/ + width: 60%; /*Could make this responsive this controls the width of everything within this div */ + margin: 0px auto; + padding-top: 30px; +} + +div.header { + border-bottom: dotted 1px #cccccc; + padding-bottom: 20px; + margin-bottom: 20px; + display: block; + clear: both; + overflow: auto; +} + +.wrapper { + min-height: 100%; + height: auto !important; + height: 100%; + margin: 0 auto -80px; +} + +div.col2 { + width: 50%; + float: left; +} + +div.blue-bg-list { + background-color: #0087C7; + padding: 3% 5%; + width: 35%; + margin-left: 5%; + text-shadow: 1px 1px 1px rgba(4, 30, 71, 1); +} + +.margin-left { + padding-left: 20px; +} + +#footer, .push { + height: 80px; + clear: both; +} + +#footer { + width: 100%; + background-color: #333; + color: #ffffff; + font-size: 0.8em; + text-align: center; +} + +#footer-inner p { + padding-top: 20px; +} + +/* Element Styling */ + +h1, h2 { + margin-bottom: 10px; + color: #0087C7; +} + +div.header h1 { + float: left; + margin: 10px 0px 0px 10px; +} + +div.header img { + float: left; +} + +h1 { + font-size: 2em; +} + +h2 { + margin-top: 0px; + font-size: 1.1em; + font-weight: normal; +} + +div.blue-bg-list h2{ + color: #ffffff; +} + +p { + margin-bottom: 25px; + font-size: 0.9em; +} + +a { + text-decoration: none; + color: #0087C7; +} + +a:hover { + color: #32BAFA; +} + +p.contact a{ + margin-right: 12px; + margin-top: 0px; +} + +p.contact i.fa-twitter-square { + color: #0087C7; +} + +ul, ol { + font-size: 0.9em; + color: #ffffff; +} + +ul li { + margin-bottom: 4px; + margin-left: -4px; +} + +img#logo { + height: 60px; +} + +img.image-top { + margin-bottom: 15px; + width: 100%; +} + +/* Table styles */ +table.devices { + width: 100%; + margin-bottom: 20px; + cell-padding: 0; + border-spacing: 0; + border-collapse: collapse; +} + +table.devices th { + background-color: #0087C7; + color: #ffffff; + padding: 8px 5px; + margin-left: 5%; + text-shadow: 1px 1px 1px rgba(4, 30, 71, 1); + border-right: 1px dotted #ffffff; +} + +table.devices td { + border-right: 1px dotted #C9C7C9; + border-bottom: 1px dotted #C9C7C9; + padding: 5px; + font-size: 0.8em; + text-align: center; +} + +table.devices th.right { + border-right: #0087C7 solid 1px; +} + +table.devices .left { + text-align: left; + padding-left: 12px; +} + +table.devices td.left { + border-left: 1px dotted #C9C7C9; +} + +/* + *** Status *** + Change the icon from 'fa-check' to 'fa-times' if you want to mark a device as unavilable +*/ +td.status i.fa-check{ + color: #21b384; +} + +td.status i.fa-times{ + color: #C40000; +} + + +/* Alert Box */ + +.alert-info { + background-color: #d9edf7; + color: #3a87ad; + padding: 8px 35px 8px 14px; + margin-bottom: 18px; + text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5); + border: 1px solid #bce8f1; + -webkit-border-radius: 4px; + -moz-border-radius: 4px; + border-radius: 4px; +} + +.alert-block { + padding-top: 14px; + padding-bottom: 14px; +} + + +/* Media Queries */ + +@media all and (min-width: 1001px) { + #bodyContainer { + width: 700px; + } +} + +@media all and (max-width: 650px) { + #bodyContainer { + width: 400px; + } + + table.devices { + font-size: 0.8em; + } + + table.devices .left { + padding-left: 2%; + } + +} + + +@media all and (max-width: 420px) { + #bodyContainer { + width: 90%; + font-size: 0.8em; + margin: 0 5%; + } + + .alert-info { + padding-right: 14px; + } + +} \ No newline at end of file diff --git a/images/logo.png b/images/logo.png new file mode 100644 index 0000000..fc12361 Binary files /dev/null and b/images/logo.png differ diff --git a/images/phones.jpg b/images/phones.jpg new file mode 100644 index 0000000..630516a Binary files /dev/null and b/images/phones.jpg differ diff --git a/index.html b/index.html index c97aeae..a7fe954 100644 --- a/index.html +++ b/index.html @@ -1 +1,240 @@ -Hello world! 2 + + + + + Switch Systems Device Library - A free device service to test out your apps and websites + + + + + + + + +
+ +
+ +
+ +

Device Library

+
+ + + +

Welcome to our device library - a free service provided by us (Switch Systems Ltd) where you can take devices to test out your apps and websites on.

+ +

We offer this service to local developers who have registered themselves as part of the Exeter_Web community. If you wish to borrow a device simply email or tweet us and we'll get back to you within 24 hours. We can often have devices ready for collection from our Southernhay Offices within minutes!

+ +
If you have an old un-used device, why not donate it to the library so the community can benefit!
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Device NameiOSAndroidWindowsOtherAvailable
iPad 4th Gen8.1.1 + +
iPhone 3GS5.1.1 + +
iPhone 3G4.2.1 + +
iPhone3.1.2 + +
iPod3.1.2 (4th Gen) + +
Nexus 7 (2012)4.4.2 + +
HTC Nexus One2.3.6 + +
T-Mobile Pulse Mini2.1 + +
HTC S620Mobile 6 + +
ZTE OpenFirefox OS 1.0.1.0 + +
Blackberry 8520 CurveBlackberry OS 5 + +
Blackberry Dev AlphaBlackberry OS 10 + +
Blackberry PlaybookPlaybook OS 2.1.0.1753 + +
Nokia C3-01 (RM-640)Series 40 V6.0.0 + +
Nokia 5530Symbian OS S60 5th Edition + +
Samsung Wave Y S5380DBada 2.012 + +
Samsung Chat 335 Samsung Proprietary + +
+ +

Borrow a device:

+ +

Tweet Us Email us at: support (at) switchsystems (dot) co (dot) uk

+ +
+ +
+ +
+ + + + + + + \ No newline at end of file