Improved styles

This commit is contained in:
Devine Lu Linvega 2018-07-04 13:23:41 +12:00
parent 6c8abf03a2
commit f63d189188
7 changed files with 32 additions and 9 deletions

View File

@ -3,6 +3,7 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css" href="links/fonts.css"/>
<link rel="stylesheet" type="text/css" href="links/main.css"/> <link rel="stylesheet" type="text/css" href="links/main.css"/>
<script src="scripts/portal.js"></script> <script src="scripts/portal.js"></script>
<title>Webring</title> <title>Webring</title>

22
links/fonts.css Normal file
View File

@ -0,0 +1,22 @@
/* Input Mono */
@font-face {
font-family: 'input_mono_regular';
src: url('../media/fonts/input_mono_regular.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'input_mono_medium';
src: url('../media/fonts/input_mono_medium.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'input_mono_thin';
src: url('../media/fonts/input_mono_thin.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}

View File

@ -1,13 +1,13 @@
body { background:#f4f4f4; padding:0px; margin:0px; } body { background:#f4f4f4; padding:0px; margin:0px; }
body div { display:block; background: #ccc;min-height: calc(100vh - 60px);width: calc(100vw - 60px);margin: 15px;color: #555;padding: 15px;font-family: 'Monospaced','Courier New',courier;font-size:12px; position: relative; border-radius: 2px } body div { display:block; background: #ddd;min-height: calc(100vh - 60px);width: calc(100vw - 60px);margin: 15px;color: #555;padding: 15px;font-family:'input_mono_regular', 'Monospaced','Courier New',courier;font-size:11px; position: relative; border-radius: 2px }
body div #icon { display: block;width: 30px;height: 30px;background-image: url(../icon.white.svg);background-size: cover;background-repeat: no-repeat;position: absolute;bottom: 10px;right:10px;background-position: center;padding:0px } body div #icon { display: block;width: 30px;height: 30px;background-image: url(../icon.white.svg);background-size: cover;background-repeat: no-repeat;position: absolute;bottom: 10px;right:10px;background-position: center;padding:0px }
body div p { display:block; padding:0px 5px} body div p { display:block; padding:0px 5px; line-height: 20px}
body div p a { color:black; text-decoration: none; } body div p a { color:black; text-decoration: none; text-decoration: underline;}
body div p a:hover { text-decoration: underline; } body div p a:hover { text-decoration: underline; }
body div p b { font-weight: normal; color:#000; text-decoration: underline; } body div p b { font-weight: normal; color:#000; font-family: 'input_mono_medium' }
body div p.readme { max-width:500px; } body div p.readme { max-width:500px; }
body div list { display:block; max-width: 800px; columns:3; border-bottom: 2px solid white;padding-bottom: 15px;margin-bottom:15px; overflow: hidden;} body div list { display:block; max-width: 800px; columns:3; border-bottom: 2px solid white;padding-bottom: 15px;margin-bottom:15px; overflow: hidden;}
body div list ln { width: 16em; display:block; padding-left:5px; overflow: hidden; text-overflow: ellipsis; } body div list ln { width: 22em; display:block; padding-left:5px; overflow: hidden; text-overflow: ellipsis; }
body div list ln a { line-height: 20px; display: inline-block; color:#000; padding:0px 5px;} body div list ln a { line-height: 20px; display: inline-block; color:#000; padding:0px 5px; text-decoration: none;}
body div list ln a:visited { color:#777; text-decoration: none;} body div list ln a:visited { color:#999; text-decoration: none;}
body div list ln a:hover { background:black; color:#fff; text-decoration: none; } body div list ln a:hover { background:#ccc; color:#000; text-decoration: none; border-radius: 2px }

Binary file not shown.

Binary file not shown.

Binary file not shown.

View File

@ -16,7 +16,7 @@ function Portal(sites)
this.readme = function() this.readme = function()
{ {
return `<p class='readme'>This webring is an attempt to inspire artists & developers to build their own website and share traffic among each other. The ring welcomes personalized websites such as <b>diaries, wikis & portfolios</b>To add yourself to the ring, submit a <a href='https://github.com/XXIIVV/webring/edit/master/index.html' target='_blank'>Pull Request</a>.</p>` return `<p class='readme'>This webring is an attempt to inspire artists & developers to build their own website and share traffic among each other. The ring welcomes personalized websites such as <b>diaries, wikis & portfolios</b>.</p><p>To add yourself to the ring, submit a <a href='https://github.com/XXIIVV/webring/edit/master/index.html' target='_blank'>Pull Request</a>.<br />If you found a broken link, please <a href='https://github.com/XXIIVV/webring/issues/new' target='_blank'>report it</a>.</p>`
} }
this.buttons = function() this.buttons = function()