moon
/
soapbox
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix issue with instance pin overflow, restyle

This commit is contained in:
matty 2024-07-20 13:35:36 -04:00
parent d67b10a376
commit a8ddffce22
2 changed files with 40 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/styles/application.scss
View File

@ -8,6 +8,7 @@
@import 'accessibility';
@import 'navigation';
@import 'autosuggest';
@import 'instance-pins';
// COMPONENTS
@import 'components/buttons';

39
src/styles/instance-pins.scss Normal file
View File

@ -0,0 +1,39 @@
.flex.rtl\:space-x-reverse.space-x-2.mb-4 {
display: flex;
flex-wrap: wrap;
align-items: start;
justify-content: space-between;
justify-items: start;
padding: 0.5rem 0;
}
.flex.rtl\:space-x-reverse.space-x-2.mb-4 a {
margin: 0.25rem 0.75rem;
width: 25%;
overflow: hidden;
}
.flex.rtl\:space-x-reverse.space-x-2.mb-4 button {
overflow: hidden;
}
.flex.rtl\:space-x-reverse.space-x-2.mb-4 button span {
text-overflow: ellipsis;
overflow: hidden;
}
@media (width <= 600px) {
.flex.rtl\:space-x-reverse.space-x-2.mb-4 {
border-bottom: 1px solid rgba(46, 46, 46, 0.7);
}
.flex.rtl\:space-x-reverse.space-x-2.mb-4 button span {
overflow: hidden;
}
.flex.rtl\:space-x-reverse.space-x-2.mb-4 button {
font-size: 0.75rem;
}
}