mirror of
https://github.com/storytold/artcraft.git
synced 2026-11-04 09:28:11 +00:00
timeline styling updates
This commit is contained in:
1 parent
d70ada7d4a
commit
caba034bf2
5 files changed
+19
-11
No files matched your search
@@ -13,7 +13,7 @@ export const Audio = () => {
|
||||
className="block rounded-lg bg-audio-groupBg pb-5 pl-2 pr-4"
|
||||
style={{ width: fullWidth + 90 }}
|
||||
>
|
||||
<div className="mb-5 pt-2 text-xs font-medium text-white">
|
||||
<div className="prevent-select mb-5 pt-2 text-xs font-medium text-white">
|
||||
Global Audio
|
||||
</div>
|
||||
<div className="flex flex-col gap-2">
|
||||
@@ -33,7 +33,7 @@ export const Audio = () => {
|
||||
clip={clip}
|
||||
/>
|
||||
))}
|
||||
<div className="absolute ps-2 pt-1 text-xs font-medium text-white">
|
||||
<div className="prevent-select absolute ps-2 pt-1 text-xs font-medium text-white">
|
||||
Global Audio Track
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -21,7 +21,9 @@ export const Character = ({ characterId }: Props) => {
|
||||
className="block rounded-lg bg-character-groupBg pb-5 pl-2 pr-4"
|
||||
style={{ width: fullWidth + 90 }}
|
||||
>
|
||||
<div className="mb-5 pt-2 text-xs font-medium text-white">Character</div>
|
||||
<div className="prevent-select mb-5 pt-2 text-xs font-medium text-white">
|
||||
Character
|
||||
</div>
|
||||
<div className="flex flex-col gap-5">
|
||||
<div className="pl-16">
|
||||
<div className="relative mt-4 block h-9 rounded-lg bg-character-unselected">
|
||||
@@ -46,7 +48,7 @@ export const Character = ({ characterId }: Props) => {
|
||||
clip={clip}
|
||||
/>
|
||||
))}
|
||||
<div className="absolute ps-2 pt-1 text-xs font-medium text-white">
|
||||
<div className="prevent-select absolute ps-2 pt-1 text-xs font-medium text-white">
|
||||
Animation
|
||||
</div>
|
||||
</div>
|
||||
@@ -74,7 +76,7 @@ export const Character = ({ characterId }: Props) => {
|
||||
clip={clip}
|
||||
/>
|
||||
))}
|
||||
<div className="absolute ps-2 pt-1 text-xs font-medium text-white">
|
||||
<div className="prevent-select absolute ps-2 pt-1 text-xs font-medium text-white">
|
||||
Character Position/Rotation
|
||||
</div>
|
||||
</div>
|
||||
@@ -102,7 +104,7 @@ export const Character = ({ characterId }: Props) => {
|
||||
clip={clip}
|
||||
/>
|
||||
))}
|
||||
<div className="absolute ps-2 pt-1 text-xs font-medium text-white">
|
||||
<div className="prevent-select prevent-select absolute ps-2 pt-1 text-xs font-medium text-white">
|
||||
Lipsync Audio Track
|
||||
</div>
|
||||
<button
|
||||
|
||||
@@ -42,13 +42,13 @@ export const Timeline = (
|
||||
return (
|
||||
<>
|
||||
<LowerPanel>
|
||||
<div className="mt-4 flex h-3 text-xs text-white opacity-75">
|
||||
<div className="prevent-select mt-4 flex h-3 border-t border-t-ui-panel-border text-xs text-white opacity-75">
|
||||
{Array(length)
|
||||
.fill(0)
|
||||
.map((_, index) => (
|
||||
<Fragment key={index}>
|
||||
<div
|
||||
className="absolute ps-1"
|
||||
className="absolute ps-1 pt-1"
|
||||
style={{ left: index * sectionWidth + 92 }}
|
||||
>
|
||||
00:{index < 10 ? "0" + index.toString() : index.toString()}
|
||||
@@ -99,8 +99,7 @@ export const Timeline = (
|
||||
>
|
||||
<FontAwesomeIcon
|
||||
icon={faSortDown}
|
||||
style={{ top: 0, left: -2 }}
|
||||
className="text-brand-primary"
|
||||
className="absolute ml-[-5px] mt-[-10px] h-5 text-brand-primary"
|
||||
/>
|
||||
<div
|
||||
className="absolute block bg-brand-primary"
|
||||
|
||||
@@ -32,7 +32,7 @@ export const TrackClip = ({ clip, min, max, style, updateClip }: Props) => {
|
||||
...classes,
|
||||
"px-[6px] py-[3px]",
|
||||
"rounded",
|
||||
"text-xs font-medium text-white",
|
||||
"prevent-select text-xs font-medium text-white",
|
||||
].join(" ")}
|
||||
style={{ top: -28, left: offset * 4 * scale + 2 }}
|
||||
>
|
||||
|
||||
@@ -27,3 +27,10 @@ body {
|
||||
|
||||
width: 100vw;
|
||||
}
|
||||
|
||||
.prevent-select {
|
||||
-webkit-user-select: none; /* Safari */
|
||||
-ms-user-select: none; /* IE 10 and IE 11 */
|
||||
user-select: none; /* Standard syntax */
|
||||
pointer-events: none;
|
||||
}
|
||||
Reference in new issue
Block a user