gryf/window-maker.github.io
1
0
Fork 0
mirror of https://github.com/gryf/window-maker.github.io.git synced 2025-12-17 11:10:18 +01:00
Code Issues Projects Releases Wiki Activity

Added window decortation for main wrapper.

Browse Source
This commit is contained in:
gryf
2019-02-11 18:59:23 +01:00
parent 6edad8eefc
commit 58ec317db5
4 changed files with 94 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
_layouts/default.html
View File

@@ -6,6 +6,9 @@
</head>
<body>
<div id="wrapper">
<div id="titlebar">
<div id="minimize"></div><div id="titlebar-inner">Window Maker: {{ page.title }}</div><div id="close"></div>
</div>
<header>
<h1>
<a href="{{ site.baseurl }}/">
@@ -17,6 +20,9 @@
<article>
{{ content }}
</article>
<div id="resizebar">
<div id="resizel"></div><div id="resizebar-inner"></div><div id="resizer"></div>
</div>
</div>
</body>
</html>

BIN
img/close.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 197 B

BIN
img/minimize.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 173 B

91
style.css
View File

@@ -30,24 +30,109 @@ header h1 a {
text-decoration: none;
color: black;
}
header h1 span.second {color: white;}
header h1 span:first {color: black;}
#resizel, #resizer {
margin: 0;
padding: 0;
height: 6px;
width: 28px;
border-left: 1px solid white;
border-top: 1px solid white;
border-right: 1px solid #555555;
}
#resizebar {
position: absolute;
bottom: 2px;
display: inline-flex;
width: 100%;
margin: 0;
margin-top: 0px;
padding: 0;
background: #aaaaaa;
height: 5px;
border-top: 1px solid #555555;
}
#resizebar-inner {
margin: 0;
padding: 0;
margin-top: 0px;
height: 6px;
width: 100%;
border-left: 1px solid white;
border-top: 1px solid white;
border-right: 1px solid #555555;
}
#minimize, #close {
margin: 0;
padding: 0;
height: 19px;
width: 19px;
border-left: 1px solid #b6b6b6;
border-top: 1px solid #b6b6b6;
border-right: 1px solid #616161;
border-bottom: 1px solid #616161;
background-repeat: no-repeat;
background-position: center center;
}
#minimize {
margin-right: 1px;
background-image: url(/img/minimize.png);
}
#close {
margin-left: 1px;
background-image: url(/img/close.png);
}
#titlebar {
display: inline-flex;
width: 100%;
margin: 0;
margin-top: 0px;
padding: 0;
background: black;
height: 22px;
}
#titlebar-inner {
margin: 0;
padding: 0;
margin-top: 0px;
background: black;
height: 19px;
width: 100%;
border-left: 1px solid #b6b6b6;
border-top: 1px solid #b6b6b6;
border-right: 1px solid #616161;
border-bottom: 1px solid #616161;
font-size: 0.8em;
font-color: white;
text-align: center;
vertical-align: middle;
}
#wrapper {
position: relative;
width: 900px;
margin: 0 auto;
/* padding: 1em; */
padding: 0;
/* padding: 0; */
margin-top: 1em;
margin-bottom: 1em;
box-shadow: 0 0 15px #000000;
background-color: #aeaaae;
border: 1px solid black;
}
article {
padding: 1em;
border-right: 1px solid #333;
/* border-bottom: 1px solid #333; */
}
.nav {