mstar/linstrom
1
0
Fork 0
Code Issues 27 Pull requests Projects Releases Packages 1 Wiki Activity Actions

Found font! Also tests and styling

Browse source
This commit is contained in:
Melody Becker 2024-09-23 17:09:19 +02:00
parent 23aefa268a
commit 83b45a5e46
36 changed files with 616 additions and 415 deletions
Download patch file Download diff file Expand all files Collapse all files

47
frontend-reactive/app/styles/notes.css
View file

@ -1,14 +1,17 @@
.note {
display: flex;
flex-direction: column;
width: fit-content;
/* width: fit-content; */
height: fit-content;
/* align-items: center; */
border: 1px dashed red;
max-width: 50em;
/* max-width: 50em; */
padding: 0.5em;
background-color: #eee;
background-color: var(--background-100);
color: var(--text);
}
.note-user-header {
@ -41,7 +44,7 @@
}
.note-user-handle {
font-size: 85%;
/* font-size: 85%; */
color: #555;
margin: 0;
}
@ -52,9 +55,9 @@
}
.note-timestamp {
font-size: 0.8em;
/* font-size: 0.8em; */
margin: -0.1em;
color: gray;
color: var(--text-700);
}
.note-content {
@ -76,31 +79,34 @@
margin-top: 0.3em;
margin-bottom: 0.3em;
cursor: pointer;
background-color: #ccc;
background-color: var(--secondary-300);
padding: 0.1em 0.3em 0.2em;
border-radius: 8px;
border: 1px solid #aaa;
}
.note-content-toggle:hover {
background-color: #aaa;
background-color: var(--secondary-200);
}
.note-interactions-wrapper {
display: flex;
flex-direction: row;
align-items: center;
border-top: 1px solid black;
padding-top: 0.5em;
}
.note-interactions-interaction-button {
display: flex;
flex-direction: row;
padding-right: 1em;
align-items: center;
border: 1px solid #aaa;
padding: 0.3em;
padding-left: 0.6em;
/* padding-right: 0.6em; */
border-radius: 8px;
margin-right: 0.5em;
margin-top: 0.2em;
margin-right: 0.7em;
cursor: pointer;
}
@ -111,20 +117,23 @@
}
.note-interactions-interaction-counter {
font-weight: bolder;
margin-top: -0.08em;
margin-bottom: -0.08em;
font-weight: bold;
padding: 0.3em;
margin-top: -0.01em;
margin-bottom: -0.01em;
margin-right: 0.2em;
}
.note-interactions-interactions-button-like {
display: flex;
flex-direction: row;
align-items: center;
}
.note-interactions-interactions-button-custom {
align-items: center;
border-left: 1px black solid;
margin-left: 0.3em;
padding-left: 0.3em;
padding-top: 0.2em;
margin-bottom: -0.1em;
padding-top: 0.5em;
padding-left: 0.4em;
padding-right: 0.4em;
}