diff --git a/components/03_Organisms/linkList/_linkList.scss b/components/03_Organisms/linkList/_linkList.scss index 464ab5d..500874b 100644 --- a/components/03_Organisms/linkList/_linkList.scss +++ b/components/03_Organisms/linkList/_linkList.scss @@ -9,6 +9,28 @@ border-left: 1px solid $-light-brown; width: calc(100% - 1px); margin-top: 12px; + position: relative; + + &--add{ + input[type=checkbox]:checked ~ .LP-LinkList__Add{ + display: block; + } + + .LP-LinkList__Add{ + position: absolute; + top: 7px; + display: none; + + .LP-Form__Fieldset{ + min-width:unset; + } + + .LP-Form{ + display: block; + min-width: 0px; + } + } + } .LP-Link{ $-link-padding: 1em; diff --git a/components/03_Organisms/linkList/linkList.hbs b/components/03_Organisms/linkList/linkList.hbs index f6ff720..68829ec 100644 --- a/components/03_Organisms/linkList/linkList.hbs +++ b/components/03_Organisms/linkList/linkList.hbs @@ -6,8 +6,11 @@ - + + Link hinzufügen + + + +
+
+
+ +
+
+ +
+
+
+
+ \ No newline at end of file diff --git a/public/main.css b/public/main.css index 5af6813..c2b8c50 100644 --- a/public/main.css +++ b/public/main.css @@ -592,7 +592,19 @@ body { .LP-LinkList__List .LP-LinkList__Item { border-left: 1px solid #C09F80; width: calc(100% - 1px); - margin-top: 12px; } + margin-top: 12px; + position: relative; } + .LP-LinkList__List .LP-LinkList__Item--add input[type=checkbox]:checked ~ .LP-LinkList__Add { + display: block; } + .LP-LinkList__List .LP-LinkList__Item--add .LP-LinkList__Add { + position: absolute; + top: 7px; + display: none; } + .LP-LinkList__List .LP-LinkList__Item--add .LP-LinkList__Add .LP-Form__Fieldset { + min-width: unset; } + .LP-LinkList__List .LP-LinkList__Item--add .LP-LinkList__Add .LP-Form { + display: block; + min-width: 0px; } .LP-LinkList__List .LP-LinkList__Item .LP-Link { padding: 1em 0 1em 1em; width: calc(100% - 1em);