links/main.css · webring

git.iko.soy/webring

97 lines 6.8 kB history raw

1* { margin:0;padding:0;border:0;outline:0;text-decoration:none;font-weight:inherit;font-style:inherit;color:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;list-style:none;border-collapse:collapse;border-spacing:0; -webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}

3body { background:#f4f4f4; padding:0px; margin:0px; }

4body > div { display:block; background: #111;min-height: calc(100vh - 60px);width: calc(100vw - 60px);margin: 15px;color: #333;padding: 15px;font-family:'input_mono_regular', 'Monospaced','Courier New',courier;font-size:11px; position: relative; border-radius: 2px; color:white; overflow: hidden;}

5body > div > ul { max-width: 800px; padding-bottom: 15px;margin-bottom:15px; overflow: hidden;}

6body div p { display:block; padding:0px 5px; line-height: 20px; max-width: 600px}

7body div p a { text-decoration: underline; cursor: pointer;}

8body div p a:hover { text-decoration: underline; }

9body strong { font-weight: normal; font-family: 'input_mono_medium' }

10body div p.readme { max-width:500px; }

11body .col3 { columns:3; }

12body .selected { background: white; color:black; }

14body #sidebar { position: absolute;top: 0px;right: 0px;padding: 15px;width: 200px; overflow: hidden;}

15body #sidebar > * { border-bottom: 0px; line-height: 16px; padding-bottom: 0px }

16body #sidebar ul { margin-bottom: 15px }

17body #sidebar > * li { text-transform: lowercase; }

18body #sidebar > * li:hover { cursor: pointer; }

19body #sidebar > * li span.right { color:#555; float:right; }

20body #sidebar > * li span.right:after { content: " msgs"; }

21body #sidebar #channels li:before, body #sidebar #categories li:before { content:'/'; }

22body #sidebar #users li:before { content:'@'; }

23body #footer { padding-left: 60px; background-image: url(../icon.white.svg); background-size: 40px; background-repeat: no-repeat; background-position: 0px 10px; border-top: 2px solid white; padding-top: 15px; margin-top: 15px; max-width: calc(100% - 300px); min-height: 45px; line-height: 15px;}

25@media only screen and (min-width:200px) and (max-width: 800px) {

26 body #hallway #sidebar { position: absolute;top: 0px;right: 0px;padding: 15px;width: 200px;display: none;background-color: #000; }

27 body #hallway #sidebar #channels { margin-top: 30px; }

28}

30/* Hallway */

32body #hallway #entries { width: calc(100vw - 300px) !important; }

34body #hallway #pagination { margin: 10px; text-align: center; }

35body #hallway #pagination span { padding: 3px; margin: 2px; cursor: pointer; }

37body #hallway .entry { line-height: 16px; display: block; position: relative; padding-left:100px; }

38body #hallway .entry .date { color: #555;display: block;float:right; margin-left:20px; padding-bottom: 16px;}

39body #hallway .entry .author { font-family: 'input_mono_medium'; position: absolute;left: 0px; }

40body #hallway .entry .body { display: block;border-bottom: 1px solid #333;padding-bottom: 10px;margin-bottom: 10px; }

41body #hallway .entry .body a { text-decoration: underline; }

42body #hallway .entry .body .channel { display: inline-block;border-radius: 1px;font-family: 'input_mono_medium';color: #777; }

43body #hallway .entry .body .user { display: inline-block;border-radius: 1px;font-family: 'input_mono_medium';color: #777; }

44body #hallway .entry .body .user.local::before { content:'@';color: #777; }

45body #hallway .entry .body .user.external::before { content:'^';color: #777; }

46body #hallway .entry .body .tag { display: inline-block;border-radius: 1px;font-family: 'input_mono_medium';color: #777; }

47body #hallway .entry.highlight .author { color:#555; }

48body #hallway .entry:hover .author { color:#ccc; }

49body #hallway .entry:hover .date { color:#ccc; }

50body #hallway .entry:hover .body { color:#ccc; border-bottom-color: #555 }

51body #hallway ul { max-width: 100%; }

52body #hallway ul li:last-child { border-bottom:0px; }

54@media only screen and (min-width:200px) and (max-width: 800px) {

55 body #hallway #entries { width: 100% !important;margin-top: 30px; }

56 body #hallway #showbar { position: absolute;top: 0px;width: 92%;height: 50px; background-image: url("data:image/svg+xml; utf8,<svg xmlns='http://www.w3.org/2000/svg' width='22' height='22'><path d='M11,4 L11,18 M4,4 L 4,18 M18,4 L18,18' stroke='%23555' fill='none' stroke-width='2' stroke-linecap='round'/></svg>");background-repeat: no-repeat;background-position: right;background-size: 25px; }

57 body #hallway #hidebar { position: absolute;top: 0px;width: 100%;height: 50px;background-image: url("data:image/svg+xml; utf8,<svg xmlns='http://www.w3.org/2000/svg' width='22' height='22'><path d='M5,5 L17,17 M17,5 L5,17' stroke='%23555' fill='none' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/></svg>");background-repeat: no-repeat;background-position: left;background-size: 25px; }

58}

60/* Portal */

62body #portal #icon { display: block;width: 30px;height: 30px;background-image: url(../icon.white.svg);background-size: cover;background-repeat: no-repeat;position: absolute;bottom: 15px;right:15px;background-position: center;padding:0px }

63body #portal ul { columns:3; }

64body #portal ul li { display:block; padding-left:5px; text-overflow: ellipsis; text-transform: lowercase;}

65body #portal ul li:before { content: attr(id) ")"; }

66body #portal ul li[data-type]::after { content:"<" attr(data-type) ">"; color:#555; }

67body #portal ul li a { line-height: 20px; padding:0px 5px; text-decoration: none;}

68body #portal ul li a:visited { color:#ccc; text-decoration: none;}

69body #portal ul li a:hover { text-decoration: underline; }

71@media (max-width: 730px) {

72 body #portal ul li:before { display: none }

73}

74@media (max-width: 630px) {

75 body #portal ul { columns: 2 !important; }

76 body #portal ul li:before { display: none }

77}

78@media (max-width: 530px) {

79 body #portal ul { columns: 1 !important; }

80 body #portal ul li:before { display: inline }

81}

83/* Wiki */

85body #wiki { background: #ccc; color:#333; }

86body #wiki #entry { max-width: calc(100% - 230px); margin-bottom: 30px; line-height: 15px }

87body #wiki #entry a { text-decoration: underline; }

88body #wiki #sidebar { overflow-y: scroll; height: calc(100% - 15px); }

89body #wiki #sidebar a { display: inline-block; width: 120px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding: 7px; }

90body #wiki #sidebar li { line-height: 7px; }

91body #wiki #sidebar li:before { display: none; }

92body #wiki #sidebar a:before { content: '/'; }

93body #wiki #sidebar a:after { content: attr(data-msgs) " msgs"; position: absolute; right: 20px; color:#555; }

94body #wiki ul.term { border-bottom: 0px; margin-bottom: 0px; padding-bottom: 0px}

95body #wiki ul.term li { margin-bottom: 5px }

96body #wiki ul.term li.name { margin-bottom: 5px }

97body #wiki ul.term li a.author { color:#555; text-decoration: none !important; }