mirror of
https://github.com/R0m1k3/Socialflow.git
synced 2026-10-11 17:26:45 +02:00
Adjust banner text positioning and size for better visibility
Update CSS styles in client/src/pages/image-editor.tsx to correct the positioning and sizing of ribbon text elements for improved banner text display. Replit-Commit-Author: Agent Replit-Commit-Session-Id: ae4037a0-2a6f-4530-9bac-79b543286bda Replit-Commit-Checkpoint-Type: full_checkpoint Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/397bca8c-984f-43ff-841a-10897aeb8140/ae4037a0-2a6f-4530-9bac-79b543286bda/VEZwUqa
This commit is contained in:
1 parent
13afecfa45
commit
ecac937e0d
1 file changed
+25
-9
@@ -248,30 +248,46 @@ export default function ImageEditor() {
|
||||
}
|
||||
|
||||
.ribbon-text.north_west {
|
||||
top: 30px;
|
||||
left: 5px;
|
||||
top: 22px;
|
||||
left: 22px;
|
||||
transform: rotate(-45deg);
|
||||
transform-origin: left center;
|
||||
transform-origin: center center;
|
||||
}
|
||||
|
||||
.ribbon-text.north_east {
|
||||
top: 30px;
|
||||
right: 5px;
|
||||
top: 22px;
|
||||
right: 22px;
|
||||
transform: rotate(45deg);
|
||||
transform-origin: right center;
|
||||
transform-origin: center center;
|
||||
}
|
||||
|
||||
/* Adaptive text sizes for ribbon */
|
||||
.ribbon-text.small {
|
||||
font-size: 10px;
|
||||
font-size: 11px;
|
||||
top: 28px;
|
||||
left: 18px;
|
||||
}
|
||||
|
||||
.ribbon-text.small.north_east {
|
||||
top: 28px;
|
||||
right: 18px;
|
||||
left: auto;
|
||||
}
|
||||
|
||||
.ribbon-text.medium {
|
||||
font-size: 14px;
|
||||
font-size: 13px;
|
||||
top: 25px;
|
||||
left: 20px;
|
||||
}
|
||||
|
||||
.ribbon-text.medium.north_east {
|
||||
top: 25px;
|
||||
right: 20px;
|
||||
left: auto;
|
||||
}
|
||||
|
||||
.ribbon-text.large {
|
||||
font-size: 16px;
|
||||
font-size: 15px;
|
||||
}
|
||||
`}</style>
|
||||
|
||||
|
||||
Reference in new issue
Block a user