From 1280b8d6a2a3f2a02179a1e51aef1891a04cc8dd Mon Sep 17 00:00:00 2001 From: cel 🌸 Date: Sun, 15 Jan 2023 21:43:21 +0000 Subject: set up rocket server --- static/style.css | 347 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 347 insertions(+) create mode 100644 static/style.css (limited to 'static/style.css') diff --git a/static/style.css b/static/style.css new file mode 100644 index 0000000..3063517 --- /dev/null +++ b/static/style.css @@ -0,0 +1,347 @@ +body { + background-color: #80a7e3; + color: #311f20; +} + +.page { + padding: 6vw; + display: flex; + flex-direction: column; +} + +img { + max-width: 100%; + border: 4px solid #311f20; +} + +.label, +.label * { + display: inline; + padding: 0; + border-radius: 0; + border: 0; + margin: 0 0.1em; + background-color: #0000; +} + +header { + display: flex; + align-items: end; + flex-wrap: wrap; +} + +header>#stream, +header>#scrobble { + flex: 0 1 auto; +} + +#stream { + background-color: #b52f6a; + max-width: 100%; + width: 550px; + aspect-ratio: 550/350; +} + +.panel { + margin: 2vw; + border: 4px solid #311f20; + padding: 2rem 4rem; + position: relative; + pointer-events: all; +} + +header, +main, +body { + pointer-events: none; +} + +#title { + z-index: 10; + display: inline-block; + font-family: kaerukaeru; + font-size: 2em; + padding: 0rem 4rem; + background-color: #d16a84; +} + +#scrobble { + background-color: #eb743b; + border-radius: 0; + color: #353070; +} + +iframe { + margin: 0; + padding: 0; +} + +ul { + list-style-type: none; + margin: rem 0; + padding: 0; +} + +a { + text-decoration: none; + color: #edc953; + background-color: #311f20; + padding: 0.5em; + border-radius: 2em; + display: inline-block; + margin: 0.5em; +} + +a:hover { + font-style: italic; +} + +a.active { + background-color: #edc953; + color: #311f20; +} + +nav { + padding: 1rem 4rem; + background-color: #5faf87; + z-index: -1; +} + +nav:hover { + z-index: 10; +} + +ul#nav { + display: flex; + justify-content: start; + flex-wrap: wrap; + gap: 0.2em; + font-size: 1.1rem; +} + +#nav img { + height: 1.1rem; + width: 1.1rem; +} + +#blog-list { + width: 100%; +} + +.blog-entry { + display: flex; + justify-content: space-between; + background-color: #0000; + border-radius: 0; + padding: 0; + margin: 0; + font-size: 1.1rem; +} + +#skinnyverse { + font-family: CherryBomb; + color: #e8c6e6; + border-color: #bf42a0; + background-color: #28446c; + flex: 1 1 15rem; + z-index: -1; +} + +#latest-skweets { + background-color: #0000; + padding: 0; + margin: 0; + border-radius: 0; + color: #bf42a0; +} + +#blogs { + z-index: -1; + background-color: #7f99e6; +} + +#footer { + z-index: -1; + background-color: #e8d2c5; +} + +#footer>a { + border-radius: 0; + padding: 0; + background-color: #0000; +} + +aside { + flex: 1 1 30rem; +} + +#skinnyverse:hover, +#blogs:hover, +#footer:hover { + z-index: 10; +} + +.post { + display: flex; + gap: 2em; + margin: 2em 0; +} + +.post h4, +h5 { + margin: 0; +} + +.post>.profile { + border: 4px solid #bf42a0; + width: 48px; + height: 48px; +} + +.post-content { + flex: 1 1 auto; +} + +.post>.post-content>div { + display: flex; + justify-content: space-between; +} + +.post>.post-content>.gallery { + display: flex; + max-width: 100%; + gap: 1em; +} + +.post>.post-content>.gallery>img { + border: 4px solid #bf42a0; + flex: 1 1 auto; + width: 10px; +} + +.branch { + border: none; + width: 100vw; + position: absolute; + pointer-events: none; +} + +main { + display: flex; + flex-wrap: wrap; + align-items: flex-start; +} + +.content { + flex: 12 1 0; + min-width: 50vw; + z-index: 3; + overflow-wrap: break-word; +} + +.content:hover { + z-index: 10; +} + +.p-name { + display: none; +} + +.info { + background-color: #d1a2e7; +} + +.info:hover { + z-index: 10; +} + +#branch6 { + top: 200vw; + -webkit-transform: scaleX(-1); + transform: scaleX(-1); + pointer-events: none; +} + +#branch2 { + top: 60vw; + + z-index: -2; + pointer-events: none; +} + +#branch3 { + top: 100vw; + z-index: -2; + pointer-events: none; +} + +#branch4 { + top: 270vw; + -webkit-transform: scaleX(-1); + transform: scaleX(-1); + z-index: 0; + pointer-events: none; +} + +#branch5 { + top: 0vw; + pointer-events: none; +} + +#branch1 { + top: 0vw; + -webkit-transform: scaleX(-1); + transform: scaleX(-1); + z-index: -1; + pointer-events: none; +} + +#branch7 { + top: 180vw; + pointer-events: none; +} + +#branch8 { + top: 260vw; + pointer-events: none; +} + +#branch9 { + top: 50vw; + -webkit-transform: scaleX(-1); + transform: scaleX(-1); + z-index: 4; + pointer-events: none; +} + +#branch10 { + top: 100vw; + pointer-events: none; +} + +#branch11 { + top: 145vw; + -webkit-transform: scaleX(-1); + transform: scaleX(-1); + pointer-events: none; +} + +#branch12 { + top: 180vw; + pointer-events: none; + z-index: 4; +} + +#branch13 { + top: 15vw; + z-index: -3; + pointer-events: none; +} + +#branch14 { + top: 105vw; + -webkit-transform: scaleX(-1); + transform: scaleX(-1); + z-index: 4; + pointer-events: none; +} \ No newline at end of file -- cgit