mirror of
https://github.com/ilyakooo0/webring.git
synced 2024-11-22 22:57:39 +03:00
Improved styles
This commit is contained in:
parent
6c8abf03a2
commit
f63d189188
@ -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
22
links/fonts.css
Normal 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;
|
||||||
|
}
|
@ -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 }
|
BIN
media/fonts/input_mono_medium.ttf
Normal file
BIN
media/fonts/input_mono_medium.ttf
Normal file
Binary file not shown.
BIN
media/fonts/input_mono_regular.ttf
Normal file
BIN
media/fonts/input_mono_regular.ttf
Normal file
Binary file not shown.
BIN
media/fonts/input_mono_thin.ttf
Normal file
BIN
media/fonts/input_mono_thin.ttf
Normal file
Binary file not shown.
@ -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()
|
||||||
|
Loading…
Reference in New Issue
Block a user