X-Git-Url: https://jxself.org/git/?p=mudsync.git;a=blobdiff_plain;f=data%2Fweb-static%2Fcss%2Fmain.css;h=308a556f1ded375d1228cd2d23cc520a3e7f5640;hp=43ecd077043d5ae0ea6e99e921baebb3622dc07c;hb=829df0120213f2bf7420b8ae153e761feb675106;hpb=f19d236c49f1145138e2274d2f5ab3fb1be3e890 diff --git a/data/web-static/css/main.css b/data/web-static/css/main.css index 43ecd07..308a556 100644 --- a/data/web-static/css/main.css +++ b/data/web-static/css/main.css @@ -1,30 +1,104 @@ +@font-face { + font-family: 'Inconsolata'; + font-style: normal; + font-weight: 400; + src: local('Inconsolata-Regular'), local('Inconsolata'), local('Inconsolata Regular'), url('../fonts/inconsolata/Inconsolata-Regular.ttf'); +} + +@font-face { + font-family: 'Inconsolata'; + font-style: normal; + font-weight: 700; + src: local('Inconsolata-Bold'), local('Inconsolata Bold'), url('../fonts/inconsolata/Inconsolata-Bold.ttf'); +} + *, *:before, *:after { box-sizing: border-box; } - body { height: 100%; display: flex; flex-direction: column; border: 0px; margin: 0px; + font-family: 'Inconsolata', monospace; + font-size: 12pt; } #stream-metabox { - flex: 1; + flex-direction: column; + display: flex; min-height: 85vh; max-height: 85vh; background-color: #d5d5d5; - padding: 10px; - overflow-y: scroll; + padding-left: 15px; + padding-right: 15px; + padding-bottom: 0px; + padding-top: 0px; + overflow-y: auto; +} + +/* + Alignment hack: + http://stackoverflow.com/a/37515194 +*/ +#stream-metabox > :first-child { + margin-top: auto !important; +} + +#stream { + background-color: #fbfbfb; + padding-bottom: .25em; } + +.stream-entry { + background-color: #fdfdfd; + padding-left: 5px; + padding-right: 5px; + padding-top: 0px; + padding-bottom: 0px; + border-left-style: solid; + border-left-width: 2px; + border-left-color: #7b7b7b; + margin-top: .5em; + margin-bottom: 0px; + margin-left: -2px; + margin-right: 0px; +} + +.stream-entry p { + margin-top: .25em; + margin-bottom: 0px; +} + + +.self-sent { + color: #494949; + border-left-color: #b4b4b4; +} + + + #input-metabox { flex: 1; min-height: 15vh; max-height: 15vh; background-color: #414141; color: #d5d5d5; - padding: 10px; + padding: 15px; +} + +input { + border-top-left-radius: 8px; + border-top-right-radius: 8px; + border-bottom-left-radius: 8px; + border-bottom-right-radius: 8px; + border: 3px solid #e6e6e6; + background-color: #ffffff; + padding: 5px; + width: 75%; + font-family: 'Inconsolata', monospace; + font-size: 12pt; }