Skip to content

Commit cc4f766

Browse files
authored
fix: styles for the TeamDashboard and the TeamJoinList widgets (#162)
1 parent 4d8eb0a commit cc4f766

File tree

3 files changed

+138
-122
lines changed

3 files changed

+138
-122
lines changed

src/Modules/StatCan.OrchardCore.Hackathon/Migrations/queries.recipe.json

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -30,6 +30,13 @@
3030
"Schema": null,
3131
"Source": "Sql",
3232
"Template": "SELECT * FROM HackathonItemsIndex where ContentType ='ScoreEntry' and TeamContentItemId = '{{teamContentItemId}}' and Owner = '{{owner}}'"
33+
},
34+
{
35+
"Name": "GetTeam",
36+
"ReturnDocuments": true,
37+
"Schema": null,
38+
"Source": "Sql",
39+
"Template": "SELECT DocumentId FROM HackathonItemsIndex where ContentType ='Team' and ContentItemId = '{{teamContentItemId}}'"
3340
}
3441
]
3542
}

src/Modules/StatCan.OrchardCore.Hackathon/Views/Widget-TeamDashboardWidget.liquid

Lines changed: 101 additions & 91 deletions
Original file line numberDiff line numberDiff line change
@@ -3,96 +3,106 @@
33
{% assign user = User | user_id | users_by_id %}
44
{% assign teamContentItemId = user.Properties.Hacker.Hacker.Team.ContentItemIds | first %}
55
{% assign teamMembers = Queries.GetHackersForTeam | query: teamContentItemId: teamContentItemId %}
6+
{% assign team = Queries.GetTeam | query: teamContentItemId: teamContentItemId %}
67

7-
<div {%if Model.Id != null%}id="{{ Model.Id }}"{%endif%} class="{{ Model.Classes | join: ' ' }}">
8-
{% if user.Properties.Hacker.Hacker.Team.ContentItemIds | first != null %}
9-
<div class="d-flex align-items-center">
10-
<div class="icon-col">
11-
<i class="fas fa-users"></i>
12-
</div>
13-
<div class="col d-flex align-items-center justify-content-between">
14-
<span class="h1-sub">{{ "Team" | t }}</span>
15-
{% if Site.Properties.HackathonCustomSettings.TeamCustomSettings.TeamEditable.Value == true %}
16-
<button class="team-clipboard" tabindex="0" onclick="select_all_and_copy(document.getElementById('team-id'));$('#clipboard-icon').addClass('fa-clipboard fa-clipboard-check');">
17-
<span class="d-flex align-items-center">{{ "ID:" | t }}
18-
<span id="team-id" class="mx-1">{{ user.Properties.Hacker.Hacker.Team.ContentItemIds | first }}</span>
19-
<i id="clipboard-icon" class="fas fa-clipboard mx-1" aria-label="{{ "Copy team identification" | t }}"></i>
20-
</span>
21-
</button>
22-
{% endif %}
23-
</div>
24-
</div>
25-
{% if Site.Properties.HackathonCustomSettings.TeamCustomSettings.TeamEditable.Value == true %}
26-
<div class="d-flex">
27-
<div class="icon-col"></div>
28-
<div class="col">
29-
{{ Model.ContentItem.Content.TeamDashboardWidget.TeamMessage.Html | liquid | sanitize_html | raw }}
30-
</div>
31-
</div>
32-
{% endif %}
33-
<div class="d-flex">
34-
<ul class="list-unstyled">
35-
{% for teamMember in teamMembers %}
36-
<li class="d-flex">
37-
<div class="icon-sm-col">
38-
<i class="fas fa-user-circle small"></i>
39-
</div>
40-
<div class="col">
41-
{{ teamMember.FirstName }}
42-
{{ teamMember.LastName }}
43-
</div>
44-
</li>
45-
{% endfor %}
46-
</ul>
47-
</div>
48-
{% if Site.Properties.HackathonCustomSettings.TeamCustomSettings.TeamEditable.Value == true %}
49-
<div class="d-flex">
50-
<div class="icon-col"></div>
51-
<div class="col d-flex justify-content-md-start justify-content-end">
52-
<form class="my-2" method="post" action="{{"~/team/leave" | href}}">
53-
{% antiforgerytoken%}
54-
<input type="hidden" name="returnUrl" value="{{ Model.Dashboard.Content.AutoroutePart.Path }}">
55-
<button type="submit" class="btn btn-primary btn-sm"><span>{{ "Leave team" | t }}</span></button>
56-
</form>
57-
</div>
58-
</div>
59-
{% endif %}
60-
{% else %}
61-
<div class="d-flex align-items-center">
62-
<div class="icon-col">
63-
<i class="fas fa-user"></i>
64-
</div>
65-
<div class="col">
66-
<div class="h1-sub">{{ "Solo" | t }}</div>
67-
</div>
68-
</div>
69-
<div class="d-flex mb-4">
70-
<div class="icon-col"></div>
71-
<div class="col">
72-
{{ Model.ContentItem.Content.TeamDashboardWidget.SoloMessage.Html | liquid | sanitize_html | raw }}
73-
</div>
74-
</div>
75-
{% if Site.Properties.HackathonCustomSettings.TeamCustomSettings.TeamEditable.Value == true %}
76-
<div class="d-flex align-items-baseline mt-4">
77-
<form class="my-2" method="post" action="{{"~/team/create" | href}}">
78-
{% antiforgerytoken%}
79-
<input type="hidden" name="returnUrl" value="{{ Model.Dashboard.Content.AutoroutePart.Path }}">
80-
<button class="btn btn-primary btn-sm" type="submit"><span>{{ "Create team" | t }}</span></button>
81-
</form>
82-
<span class="mx-3">{{ "or" | t }}</span>
83-
<form class="my-2" method="post" action="{{"~/team/join" | href}}">
84-
{% antiforgerytoken%}
85-
<div class="input-group">
86-
<input id="teamId" type="text" name="teamContentItemId" class="form-control" placeholder="{{ "Team ID" | t }}" aria-label="{{ "Team identification" | t }}" aria-describedby="team-submit">
87-
<input type="hidden" name="returnUrl" value="{{ Model.Dashboard.Content.AutoroutePart.Path }}">
88-
<div class="input-group-append">
89-
<button class="btn btn-primary btn-sm" type="submit" id="team-submit-addon"><span>{{ "Join" | t }}</span></button>
8+
{% if user.Properties.Hacker.Hacker.Team.ContentItemIds | first != null %}
9+
<v-container>
10+
<v-row justify="center">
11+
<v-col cols="8">
12+
<v-card>
13+
<v-card outlined>
14+
<v-card-text>
15+
{% if Site.Properties.HackathonCustomSettings.TeamCustomSettings.TeamEditable.Value == true %}
16+
<div class="d-flex">
17+
<div class="icon-col"></div>
18+
<div class="col">
19+
{{ Model.ContentItem.Content.TeamDashboardWidget.TeamMessage.Html | liquid | sanitize_html | raw }}
20+
</div>
21+
</div>
22+
{% endif %}
23+
</v-card-text>
24+
</v-card>
25+
26+
<v-card-title>{{ team | dispaly_text }}</v-card-title>
27+
<v-card-text>
28+
{% if Site.Properties.HackathonCustomSettings.TeamCustomSettings.TeamEditable.Value == true %}
29+
<button class="team-clipboard" tabindex="0" onclick="select_all_and_copy(document.getElementById('team-id'));$('#clipboard-icon').addClass('fa-clipboard fa-clipboard-check');">
30+
<span class="d-flex align-items-center">{{ "ID:" | t }}
31+
<span id="team-id" class="mx-1">{{ user.Properties.Hacker.Hacker.Team.ContentItemIds | first }}</span>
32+
<i id="clipboard-icon" class="fas fa-clipboard mx-1" aria-label="{{ "Copy team identification" | t }}"></i>
33+
</span>
34+
</button>
35+
{% endif %}
36+
</v-card-text>
37+
38+
<v-card-title>{{ "Members" | t }}</v-card-title>
39+
<v-card-text>
40+
{% for teamMember in teamMembers %}
41+
<li class="d-flex">
42+
<div class="icon-sm-col">
43+
<i class="fas fa-user-circle small"></i>
44+
</div>
45+
<div class="col">
46+
{{ teamMember.FirstName }}
47+
{{ teamMember.LastName }}
48+
</div>
49+
</li>
50+
{% endfor %}
51+
52+
{% if Site.Properties.HackathonCustomSettings.TeamCustomSettings.TeamEditable.Value == true %}
53+
<div class="d-flex">
54+
<div class="icon-col"></div>
55+
<div class="col d-flex justify-content-md-start justify-content-end">
56+
<form class="my-2" method="post" action="{{"~/team/leave" | href}}">
57+
{% antiforgerytoken%}
58+
<input type="hidden" name="returnUrl" value="{{ Model.Dashboard.Content.AutoroutePart.Path }}">
59+
<v-btn type="submit">{{ "Leave team" | t }}</v-btn>
60+
</form>
61+
</div>
9062
</div>
91-
</div>
92-
</form>
93-
</div>
94-
{% endif %}
95-
{% endif %}
96-
</div>
97-
{% script src:'~/OrchardCore.Workflows/Scripts/crossbrowserclipboardcopy.min.js', debug_src:'~/OrchardCore.Workflows/Scripts/crossbrowserclipboardcopy.js', at:"Foot" %}
98-
{% endif %}
63+
{% endif %}
64+
</v-card-text>
65+
</v-card>
66+
</v-col>
67+
</v-row>
68+
</v-container>
69+
{% else %}
70+
<v-container>
71+
<v-row justify="center">
72+
<v-col cols="8">
73+
<v-card>
74+
<v-card outlined>
75+
<v-card-text>
76+
{{ Model.ContentItem.Content.TeamDashboardWidget.SoloMessage.Html | liquid | sanitize_html | raw }}
77+
</v-card-text>
78+
</v-card>
79+
80+
{% if Site.Properties.HackathonCustomSettings.TeamCustomSettings.TeamEditable.Value == true %}
81+
<v-card-text>
82+
<form class="my-2" method="post" action="{{"~/team/create" | href}}">
83+
{% antiforgerytoken%}
84+
<input type="hidden" name="returnUrl" value="{{ Model.Dashboard.Content.AutoroutePart.Path }}">
85+
<v-btn type="submit">{{ "Create team" | t }}</v-btn>
86+
</form>
87+
88+
<v-card-title>{{ "Or" | t }}</v-card-title>
89+
90+
<form class="my-2" method="post" action="{{"~/team/join" | href}}">
91+
{% antiforgerytoken%}
92+
<div class="input-group">
93+
<v-text-field id="teamId" type="text" name="teamContentItemId" class="form-control" placeholder="{{ "Team ID" | t }}" aria-label="{{ "Team identification" | t }}" aria-describedby="team-submit"></v-text-field>
94+
<input type="hidden" name="returnUrl" value="{{ Model.Dashboard.Content.AutoroutePart.Path }}">
95+
<div class="input-group-append">
96+
<v-btn type="submit" id="team-submit-addon">{{ "Join" | t }}</v-btn>
97+
</div>
98+
</div>
99+
</form>
100+
</v-card-text>
101+
{% endif %}
102+
</v-card>
103+
</v-col>
104+
</v-row>
105+
</v-container>
106+
{% endif %}
107+
{% endif %}
108+
{% script src:'~/OrchardCore.Workflows/Scripts/crossbrowserclipboardcopy.min.js', debug_src:'~/OrchardCore.Workflows/Scripts/crossbrowserclipboardcopy.js', at:"Foot" %}

src/Modules/StatCan.OrchardCore.Hackathon/Views/Widget-TeamJoinListWidget.liquid

Lines changed: 30 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -3,36 +3,35 @@
33
{% if User | is_in_role: "Hacker" %}
44
{% if Site.Properties.HackathonCustomSettings.TeamCustomSettings.TeamEditable.Value == true and user.Properties.Hacker.Hacker.Team.ContentItemIds | first == null %}
55
{% assign teams = Queries.GetItemsForHackathon | query: type: "Team" %}
6-
<div {%if Model.Id != null%}id="{{ Model.Id }}"{%endif%} class="{{ Model.Classes | join: ' ' }}">
7-
<div class="vg-header">
8-
<h2>{{ "Join a team" | t}}</h2>
9-
</div>
10-
<div class="join-team-max-vh-40 overflow-auto join-team-scroller vg-content">
11-
<ul class="list-group list-group-flush">
12-
{% for team in teams %}
13-
{% assign h = Queries.GetHackersForTeam | query: teamContentItemId: team.ContentItemId %}
14-
{% if h.size < Site.Properties.HackathonCustomSettings.TeamCustomSettings.TeamSize.Value %}
15-
<li class="list-group-item bg-transparent border-white">
16-
<div class="row">
17-
<div class="col flex-start">{{team | display_text}}</div>
18-
<div class="col">
19-
<form method="post" action="{{ "~/team/join" | href }}">
20-
<button type="submit" class="btn btn-danger float-right">{{ "Join" | t }}</button>
21-
{% antiforgerytoken %}
22-
<input type="hidden" name="returnUrl" value="{{Model.Dashboard.Content.AutoroutePart.Path}}">
23-
<input type="hidden" name="teamContentItemId" value="{{team.ContentItemId}}">
24-
</form>
25-
</div>
26-
</div>
27-
<div class="row">
28-
<div class="flex-start">{{h.size}}/{{ Site.Properties.HackathonCustomSettings.TeamCustomSettings.TeamSize.Value }}</div>
29-
</div>
30-
</li>
31-
{%endif%}
32-
33-
{% endfor %}
34-
</ul>
35-
</div>
36-
</div>
6+
<v-container>
7+
<v-row justify="center">
8+
<v-col cols="8">
9+
<v-card>
10+
<v-card-title>{{ "Join a team" | t }}</v-card-title>
11+
<v-card-text>
12+
{% for team in teams %}
13+
{% assign h = Queries.GetHackersForTeam | query: teamContentItemId: team.ContentItemId %}
14+
{% if h.size < Site.Properties.HackathonCustomSettings.TeamCustomSettings.TeamSize.Value or Site.Properties.HackathonCustomSettings.TeamCustomSettings.TeamSize.Value == null %}
15+
<div class="row">
16+
<div class="col flex-start">{{team | display_text}}</div>
17+
<form method="post" action="{{ "~/team/join" | href }}">
18+
<v-btn type="submit">{{ "Join" | t }}</v-btn>
19+
{% antiforgerytoken %}
20+
<input type="hidden" name="returnUrl" value="{{Model.Dashboard.Content.AutoroutePart.Path}}">
21+
<input type="hidden" name="teamContentItemId" value="{{team.ContentItemId}}">
22+
</form>
23+
</div>
24+
<div class="row">
25+
{% if Site.Properties.HackathonCustomSettings.TeamCustomSettings.TeamSize.Value != null %}
26+
<div class="flex-start">{{h.size}}/{{ Site.Properties.HackathonCustomSettings.TeamCustomSettings.TeamSize.Value }}</div>
27+
{%endif%}
28+
</div>
29+
{%endif%}
30+
{% endfor %}
31+
</v-card-text>
32+
</v-card>
33+
</v-col>
34+
</v-row>
35+
</v-container>
3736
{% endif %}
3837
{% endif %}

0 commit comments

Comments
 (0)