Hi Charlie,
I removed *width:94vw;left:3vw;height:94vh;top:3vh *
from the code given below
*.tc-modal
{width:94vw;left:3vw;height:94vh;top:3vh;resize:both;overflow:auto;}*
Now the modal is centered and resizable.
Arun
On Sunday, May 15, 2022 at 2:17:08 AM UTC+5:30 [email protected] wrote:
> Oh boy, that I don't know how to do. I suggest you do the tiddler in an
> open window thing instead of modal. That's really easy.
>
> On Saturday, May 14, 2022 at 5:22:12 PM UTC-3 [email protected] wrote:
>
>> Hi Charlie,
>>
>> I tried to resize the modal by dragging the margin.
>> I also tried to reduce the 94vh to a lesser value for the width and
>> height.
>> On both occasions, the modal was aligned to the left of the screen.
>> Is there any way to make the modal align to the the center on resizing by
>> both methods.
>> I tried adding *margin:auto; align-content:center; *to the code
>> But it was not working.
>>
>>
>> Also is there a way to close the modal by clicking anywhere outside the
>> modal window (instead of reaching for and clicking the close button within
>> the modal)
>>
>> Arun
>>
>> On Sunday, May 15, 2022 at 1:33:54 AM UTC+5:30 arun babu wrote:
>>
>>> Hi Charlie,
>>>
>>> I meant resizing only (resizing by dragging at the margins of the
>>> modal). Sorry for creating the confusion.
>>> Your above solution works for me. Thank you.
>>> The word *drag and resize* I took from the link I shared above.
>>>
>>> Arun
>>>
>>> On Sunday, May 15, 2022 at 1:22:09 AM UTC+5:30 [email protected] wrote:
>>>
>>>> I think drag requires javascript:
>>>> https://www.w3schools.com/howto/howto_js_draggable.asp
>>>>
>>>> Yuck. I don't do TiddlyWiki things with javascript.
>>>>
>>>> To do that kind of stuff, I would switch from using a modal to using
>>>> WidgetMessage:
>>>> tm-open-window
>>>> <https://tiddlywiki.com/#WidgetMessage:%20tm-open-window>
>>>>
>>>> A modal is meant to do something there and only there until done.
>>>> Opening up tiddlers in their own windows, that allows for
>>>> multi-tasking/viewing.
>>>>
>>>>
>>>> On Saturday, May 14, 2022 at 4:46:58 PM UTC-3 Charlie Veniot wrote:
>>>>
>>>>> drag I don't know how to do.
>>>>>
>>>>> resize, yes: ``` .tc-modal {width:94vw;left:3vw;height:94vh;top:3vh;
>>>>> *resize:both;overflow:auto;*} ```
>>>>>
>>>>> On Saturday, May 14, 2022 at 4:30:03 PM UTC-3 [email protected]
>>>>> wrote:
>>>>>
>>>>>> Hi Charlie,
>>>>>>
>>>>>> Is drag and resize <https://embed.plnkr.co/plunk/C240xY> possible
>>>>>> for modals?
>>>>>>
>>>>>> Arun
>>>>>> On Saturday, May 14, 2022 at 10:11:10 AM UTC+5:30 [email protected]
>>>>>> wrote:
>>>>>>
>>>>>>> I should not watch the news and post at the same time.
>>>>>>>
>>>>>>> On Saturday, May 14, 2022 at 1:40:18 AM UTC-3 Charlie Veniot wrote:
>>>>>>>
>>>>>>>> Yeah, CSS does not easy to me come together.
>>>>>>>>
>>>>>>>> Now I have what I want. Attached.
>>>>>>>>
>>>>>>>> On Friday, May 13, 2022 at 11:06:06 PM UTC-3 Charlie Veniot wrote:
>>>>>>>>
>>>>>>>>> Oops, width works A-1, but height adjustment doesn't. So part-way
>>>>>>>>> to where I want to be.
>>>>>>>>>
>>>>>>>>> On Friday, May 13, 2022 at 10:45:49 PM UTC-3 Charlie Veniot wrote:
>>>>>>>>>
>>>>>>>>>> I'm pretty sure I'm going to be adding the attached tiddler to
>>>>>>>>>> all my TiddlyWiki instances.
>>>>>>>>>>
>>>>>>>>>> I make heavy use of modals, and I want them all to be width:80%
>>>>>>>>>> and max-height:80%.
>>>>>>>>>>
>>>>>>>>>> Well, unless/until I find a reason not to.
>>>>>>>>>>
>>>>>>>>>> Download the attached JSON file and drag into any TiddlyWiki
>>>>>>>>>> (TiddlyWiki.com !) to see and adjust.
>>>>>>>>>>
>>>>>>>>>>
>>>>>>>>>>
--
You received this message because you are subscribed to the Google Groups
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To view this discussion on the web visit
https://groups.google.com/d/msgid/tiddlywiki/59941139-ba72-407f-b427-190d22555756n%40googlegroups.com.
