mirror of
https://github.com/utopia-os/utopia-ui.git
synced 2025-12-13 07:46:10 +00:00
some css fixes
This commit is contained in:
parent
1e16a1406a
commit
eaa7eea7f5
@ -34,15 +34,15 @@
|
||||
inkscape:pagecheckerboard="0"
|
||||
inkscape:document-units="pt"
|
||||
showgrid="false"
|
||||
inkscape:zoom="0.13385319"
|
||||
inkscape:cx="-571.52168"
|
||||
inkscape:cy="395.9562"
|
||||
inkscape:zoom="0.189297"
|
||||
inkscape:cx="800.32966"
|
||||
inkscape:cy="697.31693"
|
||||
inkscape:window-width="1920"
|
||||
inkscape:window-height="1013"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:current-layer="layer2"
|
||||
inkscape:current-layer="layer3"
|
||||
fit-margin-top="0"
|
||||
fit-margin-left="0"
|
||||
fit-margin-right="0"
|
||||
@ -51,6 +51,19 @@
|
||||
id="metadata2">
|
||||
Created by potrace 1.15, written by Peter Selinger 2001-2017
|
||||
</metadata>
|
||||
<g
|
||||
inkscape:groupmode="layer"
|
||||
id="layer3"
|
||||
inkscape:label="Layer 3">
|
||||
<rect
|
||||
style="fill:#ffffff;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:30.7797;stroke-linecap:round;stroke-linejoin:bevel;stroke-opacity:0.988235"
|
||||
id="rect865"
|
||||
width="1195.2804"
|
||||
height="650.43323"
|
||||
x="229.13701"
|
||||
y="359.35092"
|
||||
ry="3.011488" />
|
||||
</g>
|
||||
<g
|
||||
inkscape:groupmode="layer"
|
||||
id="layer2"
|
||||
|
||||
|
Before Width: | Height: | Size: 12 KiB After Width: | Height: | Size: 12 KiB |
@ -8,19 +8,18 @@ type ChapterProps = {
|
||||
export function Welcome1({ clickAction }: ChapterProps) {
|
||||
return (
|
||||
<>
|
||||
<h3 className="tw-font-bold tw-text-lg">Welcome, glad you are here!</h3>
|
||||
<img className="tw-float-right tw-w-32 tw-m-2" src="/earth.svg"></img>
|
||||
<p className="tw-py-3">
|
||||
In the 21st century, humanity is at a special point in its history.
|
||||
<h3 className="font-bold text-lg">Welcome, glad you are here!</h3>
|
||||
<img className="float-right w-32 m-2" src="/earth.svg"></img>
|
||||
<p className="py-3">
|
||||
In the 21st century, humanity is at a special point in its history.
|
||||
</p>
|
||||
<p className="tw-py-1">
|
||||
<p className="py-1">
|
||||
On the one hand, the people of Planet Earth are facing a multitude of fundamental crises.
|
||||
</p>
|
||||
<p className="tw-py-1">
|
||||
</p>
|
||||
<p className="py-1">
|
||||
On the other hand, we have all the knowledge and technology to heal the planet and live in harmony with Mother Earth. </p>
|
||||
<div className="tw-modal-action">
|
||||
<label className="tw-btn" onClick={() => clickAction!()}>Next</label>
|
||||
|
||||
<div className="grid">
|
||||
<label className="btn place-self-end mt-4" onClick={() => clickAction!()}>Next</label>
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
@ -29,21 +28,21 @@ export function Welcome1({ clickAction }: ChapterProps) {
|
||||
export function Welcome2({ clickAction }: ChapterProps) {
|
||||
return (
|
||||
<>
|
||||
<h3 className="tw-font-bold tw-text-lg"> Hypnosis and Disillusion </h3>
|
||||
|
||||
<p className="tw-py-3">
|
||||
Most people are still stuck in old ways of thinking and living. </p>
|
||||
<img className="tw-float-right tw-w-32 tw-mx-4 tw-my-2" src="/fear2.svg"></img>
|
||||
<h3 className="font-bold text-lg"> Hypnosis and Disillusion </h3>
|
||||
|
||||
<p className="tw-py-1">
|
||||
Hypnotised, they sit in front of screens in concrete blocks, flooded and disillusioned by irrelevant information.
|
||||
<p className="py-3">
|
||||
Most people are still stuck in old ways of thinking and living. </p>
|
||||
<img className="float-right w-32 mx-4 my-2" src="/fear2.svg"></img>
|
||||
|
||||
<p className="py-1">
|
||||
Hypnotised, they sit in front of screens in concrete blocks, flooded and disillusioned by irrelevant information.
|
||||
</p>
|
||||
|
||||
<p className="tw-py-1">
|
||||
<p className="py-1">
|
||||
From an early age, they are trained to do alienated work and consume unhealthy and meaningless products.
|
||||
</p>
|
||||
<div className="tw-modal-action">
|
||||
<label className="tw-btn" onClick={() => clickAction!()}>next</label>
|
||||
</p>
|
||||
<div className="grid">
|
||||
<button className="btn place-self-end mt-4" onClick={() => clickAction!()}>next</button>
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
@ -52,19 +51,19 @@ export function Welcome2({ clickAction }: ChapterProps) {
|
||||
export function Welcome3({ clickAction }: ChapterProps) {
|
||||
return (
|
||||
<>
|
||||
<h3 className="tw-font-bold tw-text-lg">But Consciousness is rising </h3>
|
||||
<p className="tw-py-3">
|
||||
More and more people are waking up to what's really happening. </p>
|
||||
<p className="tw-py-1">
|
||||
They are in the process of understanding the potential that is within themselves and within the whole mankind.
|
||||
<h3 className="font-bold text-lg">But Consciousness is rising </h3>
|
||||
<p className="py-3">
|
||||
More and more people are waking up to what's really happening. </p>
|
||||
<p className="py-1">
|
||||
They are in the process of understanding the potential that is within themselves and within the whole mankind.
|
||||
</p>
|
||||
<img className="tw-float-left tw-w-32 tw-mx-4" src="/camp3.svg"></img>
|
||||
<img className="float-left w-32 mx-4" src="/camp3.svg"></img>
|
||||
|
||||
<p className="tw-py-1">
|
||||
Starting to reconnect with our Mother Earth and beginning to question things that long times have been taken for granted.
|
||||
</p>
|
||||
<div className="tw-modal-action">
|
||||
<label className="tw-btn" onClick={() => clickAction!()}>next</label>
|
||||
<p className="py-1">
|
||||
Starting to reconnect with our Mother Earth and beginning to question things that long times have been taken for granted.
|
||||
</p>
|
||||
<div className="grid">
|
||||
<label className="btn place-self-end mt-4" onClick={() => clickAction!()}>next</label>
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
@ -73,16 +72,16 @@ export function Welcome3({ clickAction }: ChapterProps) {
|
||||
export function Welcome4({ clickAction }: ChapterProps) {
|
||||
return (
|
||||
<>
|
||||
<h3 className="tw-font-bold tw-text-lg"> Gemeinsam erschaffen wir Strukturen </h3>
|
||||
<ul className='tw-flex-row tw-pl-4 tw-mt-4'>
|
||||
<h3 className="font-bold text-lg"> Gemeinsam erschaffen wir Strukturen </h3>
|
||||
<ul className='flex-row pl-4 mt-4'>
|
||||
<li>🥕 Essen & Trinken</li>
|
||||
<li>🏡 Wohn- & Lebensraum</li>
|
||||
<li>💬 Kommunikation</li>
|
||||
<li>💡 Energie</li>
|
||||
<li>🚐 Mobilität</li>
|
||||
</ul>
|
||||
<div className="tw-modal-action">
|
||||
<button className="tw-btn tw-btn-neutral" onClick={() => clickAction!()}>Ich mach mit</button>
|
||||
<div className="grid">
|
||||
<button className="btn btn-neutral place-self-end" onClick={() => clickAction!()}>Ich mach mit</button>
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
@ -96,7 +95,7 @@ export const ModalContent = () => {
|
||||
|
||||
const [chapter, setChapter] = useState<number>(1);
|
||||
//const setQuestsOpen = useSetQuestOpen()
|
||||
|
||||
|
||||
|
||||
|
||||
const ActiveChapter = () => {
|
||||
@ -107,19 +106,19 @@ export const ModalContent = () => {
|
||||
return <Welcome2 clickAction={() => { setChapter(3) }} />
|
||||
case 3:
|
||||
return <Welcome3 clickAction={() => {
|
||||
|
||||
|
||||
close();
|
||||
setTimeout(() => {
|
||||
// setQuestsOpen(true);
|
||||
// setQuestsOpen(true);
|
||||
setChapter(1);
|
||||
}, 1000);
|
||||
|
||||
|
||||
}} />
|
||||
default: return <></>
|
||||
};
|
||||
};
|
||||
|
||||
return (
|
||||
<ActiveChapter/>
|
||||
)
|
||||
return (
|
||||
<ActiveChapter />
|
||||
)
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user