[Midnightbsd-cvs] www [643] U trunk/css: try to work on mobile handling
laffer1 at midnightbsd.org
laffer1 at midnightbsd.org
Sat Oct 10 11:35:04 EDT 2015
Revision: 643
http://svnweb.midnightbsd.org/www/?rev=643
Author: laffer1
Date: 2015-10-10 11:35:03 -0400 (Sat, 10 Oct 2015)
Log Message:
-----------
try to work on mobile handling
Modified Paths:
--------------
trunk/css/base.css
trunk/css/essence.css
trunk/css/font-normal.css
trunk/css/home.css
trunk/css/menu.css
Property Changed:
----------------
trunk/css/base.css
trunk/css/essence.css
trunk/css/font-normal.css
trunk/css/home.css
trunk/css/menu.css
trunk/css/xtra.css
Modified: trunk/css/base.css
===================================================================
--- trunk/css/base.css 2015-10-09 21:29:01 UTC (rev 642)
+++ trunk/css/base.css 2015-10-10 15:35:03 UTC (rev 643)
@@ -2,212 +2,140 @@
CSS Document for MidnightBSD.org
$MidnightBSD$
*/
-
@import "/css/font-normal.css";
body {
- color: black;
- background-color: white;
- margin: 0;
- font: 12px Helvetica, Arial, sans-serif;
- letter-spacing: 1px;
- line-height: 1.3em;
+ color: black;
+ background-color: white;
+ margin: 0;
+ font: 12px Helvetica, Arial, sans-serif;
+ letter-spacing: 1px;
+ line-height: 1.3em;
}
h3 {
- color: #6dcff6;
- background-color: transparent;
+ color: #6dcff6;
+ background-color: transparent;
}
a:link {
- color: blue;
- background-color: transparent;
- text-decoration: underline;
+ color: blue;
+ background-color: transparent;
+ text-decoration: underline;
}
a:visited {
- color: navy;
- background-color: transparent;
- text-decoration: underline;
+ color: navy;
+ background-color: transparent;
+ text-decoration: underline;
}
a:active {
- color: #6dcff6;
- background-color: transparent;
- text-decoration: underline;
+ color: #6dcff6;
+ background-color: transparent;
+ text-decoration: underline;
}
-a:hover {
- color: #6dcff6;
- background-color: transparent;
- text-decoration: underline;
+a:hover {
+ color: #6dcff6;
+ background-color: transparent;
+ text-decoration: underline;
}
-img {
- border: none;
+img {
+ border: none;
}
#header {
- width: 100%;
- height: 90px;
- background-color: #6dcff6;
- color: white;
- margin: 0;
- padding-bottom: 0;
+ width: 100%;
+ height: 90px;
+ background-color: #6dcff6;
+ color: white;
+ margin: 0;
+ padding-bottom: 0;
}
#content {
- background: white;
- width: 700px;
- margin: 0;
- margin-left: 160px;
- padding: 20px;
+ background: white;
+ width: 700px;
+ margin: 0;
+ margin-left: 160px;
+ padding: 20px;
}
#logo {
- margin-top: 20px;
- text-align: left;
- margin-left: 100px;
+ margin-top: 20px;
+ text-align: left;
+ margin-left: 100px;
}
#rnav {
- float: right;
- top: 0;
- left: 0;
+ float: right;
+ top: 0;
+ left: 0;
}
#topnav {
- text-align: left;
- color: white;
- background: black;
- font-size: 0.9em;
- margin: 0;
- padding: 0;
- height: 2em;
- overflow: visible;
- margin-top: 7px;
+ text-align: left;
+ color: white;
+ background: black;
+ font-size: 0.9em;
+ margin: 0;
+ padding: 0;
+ height: 2em;
+ overflow: visible;
+ margin-top: 7px;
}
#topnavlist {
- list-style: none;
- margin: 0;
- padding: 0;
- padding-left: 140px;
- padding-top: 1px;
- height: 2em;
+ list-style: none;
+ margin: 0;
+ padding: 0;
+ padding-left: 140px;
+ padding-top: 1px;
+ height: 2em;
}
#topnavlist li {
- padding: 0 1em 0 1.2em;
- display: inline;
- border-left: 1px solid #B4B4B4;
+ padding: 0 1em 0 1.2em;
+ display: inline;
+ border-left: 1px solid #B4B4B4;
}
#topnavlist li a {
- color: white;
- font-weight: bold;
- text-decoration: none;
+ color: white;
+ font-weight: bold;
+ text-decoration: none;
}
#topnavlist li:first-child {
- border-left: 0;
- padding-left: 0;
+ border-left: 0;
+ padding-left: 0;
}
-/* Category Navigation */
-/*
-#sidenav, #sidenav ul, #sidenav ul ul {
- margin: 0;
- padding: 0;
- list-style: none;
- font-size: 1.0em;
+#footer {
+ width: 100%;
+ background-color: #6dcff6;
+ color: white;
+ margin: 0;
+ padding: 5px;
+ left: 0;
}
-#sidenav {
- width: 150px;
- background-color: #eee;
- border: 1px solid #D4D4D4;
+#footertext {
+ margin-left: 175px;
}
-#sidenav ul {
- padding: 8px 4px 12px 4px;
-}
+ at media screen and (max-width: 900px) {
+ #footertext {
+ margin-left: 0;
+ }
-#sidenav ul ul {
- background: none;
- background-color: #eee;
- margin: 0;
- padding: 0;
- list-style: none;
-}
+ #content {
+ width: 100%;
+ }
-#sidenav ul ul li {
- background: none;
- border: none;
-}
-
-#sidenav ul li {
- border-bottom: 1px solid #eee;
- margin: 0;
- padding-left: 12px;
- background-image: url(../images/blt_red_arrow.png);
- background-repeat: no-repeat;
- background-position: 12px 0.65em;
-}
-
-#sidenav ul li.active {
- font-weight: bold;
-}
-
-#sidenav ul li.active span {
- display: none;
-}
-
-#sidenav ul li a {
- display: block;
- color: #990000;
- text-decoration: underline;
- padding: 3px 5px 3px 12px;
- margin: 0;
-}
-
-#sidenav ul ul li a.active {
- font-weight: bold;
-}
-
-#sidenav ul ul li a {
- display: block;
- padding-left: 12px;
- margin: 0;
-}
-
-#sidenav ul li a:hover {
- color: #000;
-}
-
-
-#sidewrap {
- float: left;
- width: 166px;
- margin-top: 15px;
- margin-right: -170px;
-}
-
-#contentwrap {
- margin-left: 170px;
- padding-top: 15px;
-}
-*/
-
-#footer {
- width: 100%;
- background-color: #6dcff6;
- color: white;
- margin: 0;
- padding: 5px;
- left: 0;
-}
-
-#footertext {
- margin-left: 175px;
-}
+ #logo {
+ margin-left: 0;
+ }
+}
\ No newline at end of file
Property changes on: trunk/css/base.css
___________________________________________________________________
Added: svn:keywords
## -0,0 +1 ##
+MidnightBSD=%H
\ No newline at end of property
Modified: trunk/css/essence.css
===================================================================
--- trunk/css/essence.css 2015-10-09 21:29:01 UTC (rev 642)
+++ trunk/css/essence.css 2015-10-10 15:35:03 UTC (rev 643)
@@ -2,113 +2,180 @@
@import url("home.css");
@import url("xtra.css");
-html, body { /* Normalize browser defaults */
- margin: 0;
- padding: 0;
- height: 100%;
+html, body {
+ /* Normalize browser defaults */
+ margin: 0;
+ padding: 0;
+ height: 100%;
}
+
body {
- background-color: #fff;
- color: #444;
- font: 100% helvetica, sans-serif;
+ background-color: #fff;
+ color: #444;
+ font: 100% helvetica, sans-serif;
}
-a:link, a:visited { /* Hyperlink defintions */
- color: #1373ce;
- text-decoration: none;
+a:link, a:visited {
+ /* Hyperlink defintions */
+ color: #1373ce;
+ text-decoration: none;
}
+
a:active, a:hover {
- color: #909090;
+ color: #909090;
}
-#globe { /* WRAPPER SURROUNDING ALL ELEMENTS */
- width: 1002px; /* Fits most 1024x768 in fullscreen */
- margin: 0 auto;
- padding: 0;
- background: url(//d2ibasrwfd3o7m.cloudfront.net/images/shadow.png) repeat-y;
+#globe {
+ /* WRAPPER SURROUNDING ALL ELEMENTS */
+ width: 1002px; /* Fits most 1024x768 in fullscreen */
+ margin: 0 auto;
+ padding: 0;
+ background: url(//d2ibasrwfd3o7m.cloudfront.net/images/shadow.png) repeat-y;
}
#header h1 {
- width: 928px;
- margin: 0 auto;
- z-index: 4; /* So IE has "layout" */
- font-size: 10px;
+ width: 928px;
+ margin: 0 auto;
+ z-index: 4; /* So IE has "layout" */
+ font-size: 10px;
}
-#header a { /* CSS Text-to-Image replacement */
- background-image: url("//d2ibasrwfd3o7m.cloudfront.net/images/logo.jpg");
- background-repeat: no-repeat;
- width: 928px;
- height: 0px !important;
- height /**/:189px; /* Exploit IE parsing error to give height */
- padding: 189px 0 0 0; /* Pushes the div down to reveal the image */
- margin: 0 auto;
- display: block;
- overflow: hidden; /* We don't want the text to show */
+
+#header a {
+ /* CSS Text-to-Image replacement */
+ background-image: url("//d2ibasrwfd3o7m.cloudfront.net/images/logo.jpg");
+ background-repeat: no-repeat;
+ width: 928px;
+ height: 0px !important;
+ height /**/: 189px; /* Exploit IE parsing error to give height */
+ padding: 189px 0 0 0; /* Pushes the div down to reveal the image */
+ margin: 0 auto;
+ display: block;
+ overflow: hidden; /* We don't want the text to show */
}
-.horiz { /* Horizontal-rule rules */
- width: 800px;
- margin: auto;
+.horiz {
+ /* Horizontal-rule rules */
+ width: 800px;
+ margin: auto;
}
-.horiz blockquote { /* Why so many wrappers? Examine. */
- width: 800px;
- float: left;
- margin: 0 auto;
- padding: 0;
+
+.horiz blockquote {
+ /* Why so many wrappers? Examine. */
+ width: 800px;
+ float: left;
+ margin: 0 auto;
+ padding: 0;
}
+
hr {
- height: 1px; /* Normalize look for Opera */
- color: #999;
- background: #999;
- border: 0;
- width: 100%;
- margin: 15px auto 0 auto;
+ height: 1px; /* Normalize look for Opera */
+ color: #999;
+ background: #999;
+ border: 0;
+ width: 100%;
+ margin: 15px auto 0 auto;
}
#footer {
- text-align: center;
- width: 928px;
- font-size: .9em;
- margin: 10px auto;
- border-bottom: 2px solid #ccc;
+ text-align: center;
+ width: 928px;
+ font-size: .9em;
+ margin: 10px auto;
+ border-bottom: 2px solid #ccc;
}
+
#footer p {
- line-height: 18px;
+ line-height: 18px;
}
#text {
- line-height: 135%;
+ line-height: 135%;
}
+
#text {
- width: 850px;
- margin: 0 auto;
+ width: 850px;
+ margin: 0 auto;
}
+
#text h2 {
- text-align: center;
- margin: 1em;
- line-height: 1em;
+ text-align: center;
+ margin: 1em;
+ line-height: 1em;
}
+
#text h2 img {
- vertical-align: middle;
- padding-bottom: 4px;
+ vertical-align: middle;
+ padding-bottom: 4px;
}
-table { margin: 0 auto; border: 1px solid #ccc; border-collapse: collapse; }
-th { padding: 10px; font-weight: bold; text-align: center; background: #f2fbff; }
-td { padding: 10px; border-width: 0; }
+table {
+ margin: 0 auto;
+ border: 1px solid #ccc;
+ border-collapse: collapse;
+}
+th {
+ padding: 10px;
+ font-weight: bold;
+ text-align: center;
+ background: #f2fbff;
+}
+
+td {
+ padding: 10px;
+ border-width: 0;
+}
+
/* GLOBAL RE-USABLES */
-.clear { clear: both; }
-.fleft { float: left; }
-.fright { float: right; }
+.clear {
+ clear: both;
+}
-#googlead { width: 470px; height: 60px; margin: 0 auto; }
+.fleft {
+ float: left;
+}
- at media screen and (max-width: 800px){
- html{
- overflow-x:auto !important;
- }
- body{
- overflow-x:auto !important;
- }
+.fright {
+ float: right;
}
+
+#googlead {
+ width: 470px;
+ height: 60px;
+ margin: 0 auto;
+}
+
+ at media screen and (max-width: 800px) {
+ html {
+ overflow-x: auto !important;
+ }
+
+ body {
+ overflow-x: auto !important;
+ }
+
+ #globe {
+ width: 100%;
+ background: none;
+ }
+
+ .horiz, .horiz blockquote {
+ width: 80%;
+ }
+
+ #header h1 {
+ width: 100%;
+ }
+
+ #header a {
+ width: 100%;
+ }
+
+ #footer {
+ width: 100%;
+ }
+
+ #text {
+ width: 80%;
+ }
+}
Property changes on: trunk/css/essence.css
___________________________________________________________________
Added: svn:keywords
## -0,0 +1 ##
+MidnightBSD=%H
\ No newline at end of property
Modified: trunk/css/font-normal.css
===================================================================
--- trunk/css/font-normal.css 2015-10-09 21:29:01 UTC (rev 642)
+++ trunk/css/font-normal.css 2015-10-10 15:35:03 UTC (rev 643)
@@ -1,5 +1,4 @@
-/* font-normal.css for justjournal.com */
-body {
+body {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 12px;
}
Property changes on: trunk/css/font-normal.css
___________________________________________________________________
Added: svn:keywords
## -0,0 +1 ##
+MidnightBSD=%H
\ No newline at end of property
Modified: trunk/css/home.css
===================================================================
--- trunk/css/home.css 2015-10-09 21:29:01 UTC (rev 642)
+++ trunk/css/home.css 2015-10-10 15:35:03 UTC (rev 643)
@@ -1,19 +1,5 @@
-#fp9 a { background-image: url("//d2ibasrwfd3o7m.cloudfront.net/images/ports/009.png"); }
-#fp8 a { background-image: url("//d2ibasrwfd3o7m.cloudfront.net/images/ports/008.png"); }
-#fp7 a { background-image: url("//d2ibasrwfd3o7m.cloudfront.net/images/ports/007.png"); }
-#fp6 a { background-image: url("//d2ibasrwfd3o7m.cloudfront.net/images/ports/006.png"); }
-#fp5 a { background-image: url("//d2ibasrwfd3o7m.cloudfront.net/images/ports/005.png"); }
-#fp4 a { background-image: url("//d2ibasrwfd3o7m.cloudfront.net/images/ports/004.png"); }
-#fp3 a { background-image: url("//d2ibasrwfd3o7m.cloudfront.net/images/ports/003.png"); }
-#fp2 a { background-image: url("//d2ibasrwfd3o7m.cloudfront.net/images/ports/002.png"); }
-#fp1 a { background-image: url("//d2ibasrwfd3o7m.cloudfront.net/images/ports/001.png"); }
-
blockquote { line-height: 130%; }
-#lang { width: 100px; height: 16px; margin-bottom: 5px; margin-top: 0px; margin-left: 250px; }
-#lang h5 { list-style: none; display: inline-block; margin: 0; }
-#lang h5 a { padding: 11px 0 0 0; overflow: hidden; background-repeat: no-repeat; width: 16px; height: 0px !important; float: left; margin: 0 5px; }
-
#welcomebox { width: 900px; margin-left: 30px}
#welcome { width: 625px; height: auto; float: left; }
#welcome h2 { text-align: center; margin: 0 0 0 25px; }
@@ -43,10 +29,7 @@
#gravity h2 a { color: #333; text-decoration: none; }
#gravity h2 a:hover { color: #666; }
-#news, #tweets, #ports, #security { width: 300px; font-size: 90% }
-#ports li { list-style: none; display: inline; }
-#ports ul { margin-left: -20px; }
-#ports li a { padding: 64px 0 0 0; margin: 15px 10px; overflow: hidden; background-repeat: no-repeat; float: left; width: 64px; height: 0px !important; height: /**/:64px; }
+#news, #tweets, #security { width: 300px; font-size: 90% }
.date { font-style: italic; color: #808080; text-align: center; }
.update { height: 3.8em; overflow: hidden; }
@@ -54,3 +37,26 @@
#midnight { float: left; margin: 0 10px 0 0; border: 1px solid #ccc; padding: 10px; text-align: center; font-size: 8pt; }
#text ul li { font-size: 14px; }
#text img { border: none; }
+
+ at media screen and (max-width: 900px) {
+ #tweets, #getbox, #gettext, #getcd {
+ display: none;
+ }
+
+ #welcomebox {
+ width: 100%;
+ }
+
+ #welcome {
+ width: 100%;
+ }
+
+ #gravity {
+ width: 100%;
+ }
+
+ #news, #security {
+ width: 30%;
+ }
+
+}
\ No newline at end of file
Property changes on: trunk/css/home.css
___________________________________________________________________
Added: svn:keywords
## -0,0 +1 ##
+MidnightBSD=%H
\ No newline at end of property
Modified: trunk/css/menu.css
===================================================================
--- trunk/css/menu.css 2015-10-09 21:29:01 UTC (rev 642)
+++ trunk/css/menu.css 2015-10-10 15:35:03 UTC (rev 643)
@@ -55,7 +55,7 @@
.menu ul li ul {
display: none; /* initially hide the entire list hierarchy */
- padding: 0px; /* this is our box border width */
+ padding: 0; /* this is our box border width */
}
.menu ul li a,
@@ -69,7 +69,7 @@
.menu ul li:hover a,
.menu ul li a:hover { /* selected top-level menu items */
- border-top: 0px solid #000; /* these 2 lines create the push-in illusion */
+ border-top: 0 solid #000; /* these 2 lines create the push-in illusion */
height: 28px;
color: #fff;
}
@@ -91,7 +91,7 @@
.menu ul li:hover ul.leftbutton,
.menu ul li a:hover ul.leftbutton {/* our first dropdown should not be skewed */
- left: 0px;
+ left: 0;
}
.menu ul li:hover ul.skinny,
Property changes on: trunk/css/menu.css
___________________________________________________________________
Added: svn:keywords
## -0,0 +1 ##
+MidnightBSD=%H
\ No newline at end of property
Index: trunk/css/xtra.css
===================================================================
--- trunk/css/xtra.css 2015-10-09 21:29:01 UTC (rev 642)
+++ trunk/css/xtra.css 2015-10-10 15:35:03 UTC (rev 643)
Property changes on: trunk/css/xtra.css
___________________________________________________________________
Added: svn:keywords
## -0,0 +1 ##
+MidnightBSD=%H
\ No newline at end of property
More information about the Midnightbsd-cvs
mailing list