Commander1024
/
lostplaces-frontend
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Compare commits

base: Commander1024:7eb19a147ced0509cf2b9df54ac41f3fd35ca374
Branches Tags
Commander1024:master
Commander1024:linklist-add
...
compare: Commander1024:b7d177004429759f61fe0cb3f4c5489fe8e679d4
Branches Tags
Commander1024:master
Commander1024:linklist-add

8 Commits
7eb19a147c ... b7d1770044

Author SHA1 Message Date
reverend b7d1770044 Housekeeping 2021-10-18 16:02:28 +02:00
reverend 612052e0ce Adapting LinkList to new RCSS 2021-10-18 16:02:20 +02:00
reverend 4ad580674a so stupid js scss shit shuts the fuck up 2021-10-18 16:02:09 +02:00
reverend 739acb2e77 Iconzied Link Variant 2021-10-18 16:01:36 +02:00
reverend 2ba096e8f0 Checking Atoms 2021-10-18 16:01:28 +02:00
reverend e775c11cc2 Removing imports in order to fix scss 2021-10-18 16:00:32 +02:00
reverend 6aa31e975f New RCSS Version 2021-10-18 15:59:45 +02:00
reverend 0f909daeff Fixing Watcher 2021-10-18 15:59:32 +02:00
16 changed files with 1068 additions and 541 deletions
Show Stats Expand all files Collapse all files

8
components/01_Atoms/checkbox/_checkbox.scss
View File

@ -1,12 +1,16 @@
.LP-Form{ .LP-Form{
.LP-Form__Checkbox{ .LP-Form__Checkbox{
display: none; display: none;
&:checked + .LP-Form__CheckBox__CheckMark {
background-color: $-light-brown;
}
} }
.LP-Form__CheckBox__CheckMark{ .LP-Form__CheckBox__CheckMark{
height: 1em; height: 1em;
width: 1em; width: 1em;
border: 1px solid black; border: 1px solid $-grey;
padding: 0 calc(.5em + 2px); padding: 0 calc(.5em + 2px);
margin-right: .7em; margin-right: .7em;
} }

6
components/01_Atoms/checkbox/checkbox.hbs
View File

@ -1,3 +1,7 @@
<form class="LP-Form"> <form class="LP-Form">
<label for="wurstwasser" class="LP-Form__Label"><span class="LP-Form__CheckBox__CheckMark"></span><input id="wurstwasser" type="checkbox" class="LP-Form__Checkbox"/>Check me</label> <label for="wurstwasser" class="LP-Form__Label">
<input id="wurstwasser" type="checkbox" class="LP-Form__Checkbox"/>
<span class="LP-Form__CheckBox__CheckMark"></span>
Check me
</label>
</form> </form>

1
components/01_Atoms/input/input.hbs
View File

@ -4,7 +4,6 @@
{{#if disabled}} {{#if disabled}}
disabled="disabled" disabled="disabled"
{{/if}} {{/if}}
/>
{{#if message}} {{#if message}}
<span class="LP-Input__Message">{{message}}</span> <span class="LP-Input__Message">{{message}}</span>
{{/if}} {{/if}}

6
components/01_Atoms/link/_link.scss
View File

@ -6,8 +6,4 @@
color: $-grey; color: $-grey;
text-decoration: underline; text-decoration: underline;
} }
} }
.LP-Link__IconWrapper{
display: inline;
}

10
components/01_Atoms/link/link--iconized.hbs Normal file
View File

@ -0,0 +1,10 @@
<a href="{{url}}" class="LP-Link">
<span class="RV-Iconized">
<span class="RV-Iconized__Text">
Iconized Text
</span>
<span class="RV-Iconized__Icon RV-Iconized__Icon--medium RV-Iconized__Icon--right">
<img src="/icons/debug.png"/>
</span>
</span>
</a>

4
components/01_Atoms/link/link.hbs
View File

@ -1,3 +1 @@
<p class="LP-Paragraph"> <a href="{{url}}" class="LP-Link"><span class="LP-Link__Text">{{text}}</span></a>
<a href="{{url}}" class="LP-Link"><span class="LP-Link__Text">{{text}}</span></a>
</p>

9
components/01_Atoms/tag/_tag.scss
View File

@ -3,10 +3,17 @@
background-color: $-beige; background-color: $-beige;
border-radius: 2px; border-radius: 2px;
width: max-content; width: max-content;
@include RV-FlexRow__Container; @include RV-Flex;
height: min-content; height: min-content;
gap: 3px; gap: 3px;
transition: background .3s; transition: background .3s;
.LP-Link {
color: $-grey;
&:hover {
text-decoration: none;
}
}
&__Remove { &__Remove {
.RV-Iconized__Icon { .RV-Iconized__Icon {

12
components/02_Molecules/_molecules.scss
View File

@ -1,6 +1,6 @@
@import 'textSection/textSection'; //@import 'textSection/textSection';
@import 'placeTeaser/placeTeaser'; //@import 'placeTeaser/placeTeaser';
@import 'tagList/tagList'; //@import 'tagList/tagList';
@import 'navigation/navigation'; //@import 'navigation/navigation';
@import 'messageList/messageList'; //@import 'messageList/messageList';
@import 'userInfo/userInfo'; //@import 'userInfo/userInfo';

4
components/02_Molecules/userInfo/_userInfo.scss
View File

@ -15,7 +15,7 @@
padding: 0; padding: 0;
margin: 0; margin: 0;
text-align: center; text-align: center;
padding: $-spacing-small / 2; padding: $-spacing-small;
font-size: 25px; font-size: 25px;
} }
} }
@ -26,7 +26,7 @@
font-size: 18px; font-size: 18px;
} }
padding: $-spacing-small / 2; padding: $-spacing-small;
.LP-UserInfo__Key { .LP-UserInfo__Key {
padding-right: $-spacing-medium; padding-right: $-spacing-medium;

18
components/03_Organisms/_organisms.scss
View File

@ -1,9 +1,9 @@
@import 'header/header'; //@import 'header/header';
@import 'placeGrid/placeGrid'; //@import 'placeGrid/placeGrid';
@import 'placeList/placeList'; //@import 'placeList/placeList';
@import 'linkList/linkList'; //@import 'linkList/linkList';
@import 'footer/footer'; //@import 'footer/footer';
@import 'form/form'; //@import 'form/form';
@import 'imageGrid/imageGrid'; //@import 'imageGrid/imageGrid';
@import 'osmMap/osmMap'; //@import 'osmMap/osmMap';
@import 'userProfile/userProfile'; //@import 'userProfile/userProfile';

6
components/03_Organisms/linkList/_linkList.scss
View File

@ -1,7 +1,5 @@
.LP-LinkList{ .LP-LinkList{
@include RV-FlexGrid(300px, 3em); @include RV-Grid;
@include RV-ElementList;
@include RV-Spacing__Inner--small;
align-items: center; align-items: center;
.LP-LinkList__Item{ .LP-LinkList__Item{
@ -11,7 +9,7 @@
transition: background .3s, color .5s; transition: background .3s, color .5s;
@include RV-Alignment--verticalCenter; @include RV-Alignment--verticalCenter;
@include RV-FlexRow__Container; @include RV-Flex;
.LP-LinkList__ItemHover { .LP-LinkList__ItemHover {
opacity: 0.5; opacity: 0.5;

6
components/04_Templates/_templates.scss
View File

@ -1,3 +1,3 @@
@import 'home/home'; //@import 'home/home';
@import 'placeDetail/placeDetail'; //@import 'placeDetail/placeDetail';
@import 'codex/codex'; //@import 'codex/codex';

2
components/05_Pages/_pages.scss
View File

@ -1 +1 @@
@import 'place/place'; //@import 'place/place';

4
components/main.scss
View File

@ -1,4 +1,4 @@
@import './rcss.bundled.scss'; @import 'rcss.bundled';
// Include primary fonts in regular, italic and bold each. // Include primary fonts in regular, italic and bold each.
@font-face { @font-face {
@ -197,4 +197,4 @@ body {
@import '04_Templates/templates'; @import '04_Templates/templates';
@import '05_Pages/pages'; @import '05_Pages/pages';
@import './tagify'; //@import './tagify';

1511
components/rcss.bundled.scss
View File

File diff suppressed because it is too large Load Diff

2
package.json
View File

@ -11,7 +11,7 @@
"sass-loader": "^10.0.5" "sass-loader": "^10.0.5"
}, },
"scripts": { "scripts": {
"sass": "node-sass -w components/main.scss -o public/ --recursive", "sass": "sass components/main.scss public/main.css --watch",
"styleguide": "fractal start --sync", "styleguide": "fractal start --sync",
"suite": "npm run sass & npm run styleguide" "suite": "npm run sass & npm run styleguide"
} }