Browse Source

UI tweaks for mobile

pull/2/head
Noah Petherbridge 6 years ago
parent
commit
2453f0696f
2 changed files with 26 additions and 9 deletions
  1. +4
    -1
      www/layout.html
  2. +22
    -8
      www/solar/ui.css

+ 4
- 1
www/layout.html View File

@@ -13,6 +13,9 @@
<!-- Kirsle.net Solar -->
<link rel="stylesheet" type="text/css" media="screen" href="/solar/ui.css">
<link rel="stylesheet" type="text/css" media="print" href="/solar/print.css">
<link rel="stylesheet" type="text/css" href="/solar/monokai.css">
<link rel="stylesheet" type="text/css" href="/solar/vim-syntax.css">
<link rel="alternate" type="application/rss+xml" title="Kirsle's RSS Feed" href="/blog/rss">

<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
@@ -239,4 +242,4 @@
<!-- End Piwik Code -->

</body>
</html>
</html>

+ 22
- 8
www/solar/ui.css View File

@@ -51,7 +51,8 @@ h4 {
pre,code {
font-family: "Lucida Console","DejaVu LGC Sans Mono","DejaVu Sans Mono","Bitstream Vera Sans Mono",monospace;
font-size: 9pt;
color: #00CCCC
color: #00CCCC;
background-color: transparent;
}
pre {
display: block;
@@ -62,11 +63,11 @@ pre {
margin-top: 10px;
margin-bottom: 10px;
max-height: 550px;
background-color: transparent;
overflow: auto
}
code {
display: inline
display: inline;
padding: 0
}
label {
cursor: pointer
@@ -397,15 +398,21 @@ ul.blog-categories li:last-child:after {

.k-supernova {
/* Main BG image */
position: fixed;
position: absolute;
z-index: -100;
top: 0px;
left: 0px;
top: 0;
left: 0;
width: 960px;
height: 1000px;
background-image: url("supernova.jpg");
background-repeat: no-repeat;
background-position: 0px 0px
background-position: 0 0;
}

@media (min-width: 768px) {
.k-supernova {
position: fixed;
}
}
.k-kirsle {
/* Kirsle logo */
@@ -478,7 +485,6 @@ ul.blog-categories li:last-child:after {
background-repeat: repeat;
background-position: 0px 0px;
z-index: 300;
margin: 0px 10px;
padding: 6px;
border: 2px ridge #0099FF;
border-radius: 10px;
@@ -500,3 +506,11 @@ ul.blog-categories li:last-child:after {
background-position: 0px 0px;
height: 50px
}

/* Simplify panels for mobile */
@media (max-width: 768px) {
.k-navpanel, .k-content-panel {
background-image: none;
background-color: #000000;
}
}

Loading…
Cancel
Save