franzz/spot
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Migrate SASS

Browse Source
This commit is contained in:
Franzz
2026-01-09 23:41:47 +01:00
parent d9bc89b7f6
commit ac9fcbe0ba
26 changed files with 1153 additions and 1124 deletions
Download Patch File Download Diff File Expand all files Collapse all files

79
src/styles/_page.project.feed.scss
View File

@@ -1,3 +1,8 @@
@use "fa/variables";
@use "var";
@use "color";
@use "fa";
#feed {
#feed-panel {
#feed-header {
@@ -33,17 +38,17 @@
}
.post-item {
margin-bottom: $block-spacing;
background: $post-bg;
color: $post-color;
border-radius: $block-radius;
width: calc(100% - #{$block-spacing});
margin-bottom: var.$block-spacing;
background: color.$post-bg;
color: color.$post;
border-radius: var.$block-radius;
width: calc(100% - var.$block-spacing);
box-shadow: 2px 2px 3px 0px rgba(0, 0, 0, 0.5);
a {
color: $post-color;
color: color.$post;
&:hover {
color: $post-color-hover;
color: color.$post-hover;
}
}
@@ -51,7 +56,7 @@
margin: 0;
}
.signature {
margin: $elem-spacing 0 0 0;
margin: var.$elem-spacing 0 0 0;
text-align: right;
font-style: italic;
@@ -62,19 +67,19 @@
}
}
.header {
padding: 0 $block-spacing;
padding: 0 var.$block-spacing;
position: relative;
div {
display: inline-block;
font-size: 0.8em;
padding: $elem-spacing 0px;
padding: var.$elem-spacing 0px;
&.index {
width: 25%;
.link {
margin-left: $elem-spacing;
margin-left: var.$elem-spacing;
padding: 0;
line-height: 1;
}
@@ -89,7 +94,7 @@
}
.body {
clear: both;
padding: 0em $block-spacing $block-spacing;
padding: 0em var.$block-spacing var.$block-spacing;
}
&.headerless {
@@ -97,7 +102,7 @@
display: none;
}
.body {
padding-top: $block-spacing;
padding-top: var.$block-spacing;
text-align: center;
p {
@@ -106,28 +111,28 @@
.fa {
display: inline-block;
font-size: 2em;
margin: $elem-spacing 0;
margin: var.$elem-spacing 0;
}
}
}
}
&.message {
background: $message-bg;
color: $message-color;
background: color.$message-bg;
color: color.$message;
p {
font-size: 0.9em;
height: 1em;
margin: 0 0 $elem-spacing 0;
margin: 0 0 var.$elem-spacing 0;
display: inline-block;
width: 100%;
}
a {
color: $message-color;
color: color.$message;
&:hover {
color: $message-color-hover;
color: color.$message-hover;
}
}
@@ -144,7 +149,7 @@
&:hover {
.fa-message {
@extend .#{$fa-css-prefix}-drill-message;
@extend .#{variables.$fa-css-prefix}-drill-message;
top: 13px;
left: 3px;
}
@@ -156,31 +161,31 @@
.weather {
position: absolute;
top: $block-spacing;
right: $block-spacing;
top: var.$block-spacing;
right: var.$block-spacing;
.fa {
font-size: 1.3em;
vertical-align: middle;
line-height: 1rem;
background: $message-color;
color: $message-bg;
border-radius: $block-radius 0 0 $block-radius;
padding: $elem-spacing;
background: color.$message;
color: color.$message-bg;
border-radius: var.$block-radius 0 0 var.$block-radius;
padding: var.$elem-spacing;
}
span {
vertical-align: middle;
padding: $elem-spacing;
background: $message-bg;
color: $message-color;
border-radius: 0 $block-radius $block-radius 0;
padding: var.$elem-spacing;
background: color.$message-bg;
color: color.$message;
border-radius: 0 var.$block-radius var.$block-radius 0;
}
}
.staticmap {
width: 100%;
border-radius: $block-radius;
border-radius: var.$block-radius;
}
}
@@ -191,22 +196,22 @@
}
&.media {
background: $media-bg;
color: $media-color;
background: color.$media-bg;
color: color.$message-hover;
.body {
a {
display: inline-block;
width: 100%;
margin: 0;
color: $media-color;
color: color.$message-hover;
position: relative;
line-height: 0;
&.drill {
&:hover {
.drill-icon .fa-drill-image, .drill-icon .fa-drill-video {
color: rgba($media-bg, 0.75);
color: rgba(color.$media-bg, 0.75);
}
.comment {
opacity: 0;
@@ -230,7 +235,7 @@
height: auto;
image-orientation: from-image;
outline: none;
border-radius: $block-radius;
border-radius: var.$block-radius;
}
.comment {
@@ -244,7 +249,7 @@
padding: 0.5em;
text-align: justify;
background: rgba(255, 255, 255, 0.6);
border-radius: 0 0 $block-radius $block-radius;
border-radius: 0 0 var.$block-radius var.$block-radius;
transition: opacity 0.3s;
opacity: 1;
}