Add html code for voting

develop
Le Libre Au Quotidien 3 years ago
parent 128e4b6281
commit 6cc09aebb5
  1. 2
      src/app/app.module.ts
  2. 2
      src/app/pages/kind/kind.component.html
  3. 15
      src/app/vote-choice/vote-choice.component.html
  4. 5
      src/app/vote-choice/vote-choice.component.scss
  5. 25
      src/app/vote-choice/vote-choice.component.spec.ts
  6. 15
      src/app/vote-choice/vote-choice.component.ts
  7. 6
      src/assets/img/check-2.svg
  8. 3
      src/assets/img/check.svg
  9. 3
      src/assets/img/croix.svg
  10. 10
      src/assets/img/votant-pas-sur.svg
  11. 9
      src/assets/img/votant-sur.svg
  12. 2
      src/assets/scss/variables.scss

@ -28,6 +28,7 @@ import { VotingGraphComponent } from './pages/voting-graph/voting-graph.componen
import { VotingChoiceComponent } from './pages/voting-choice/voting-choice.component';
import { PasswordComponent } from './pages/password/password.component';
import { HomeComponent } from './pages/home/home.component';
import { VoteChoiceComponent } from './vote-choice/vote-choice.component';
registerLocaleData(localeFr, 'fr');
@ -52,6 +53,7 @@ registerLocaleData(localeFr, 'fr');
VotingChoiceComponent,
PasswordComponent,
HomeComponent,
VoteChoiceComponent,
],
imports: [

@ -142,7 +142,7 @@
<section>
<h1>Molecules</h1>
<framadate-vote-choice></framadate-vote-choice>
<article>
<h2>Useful classes</h2>

@ -0,0 +1,15 @@
<div class="choice_container">
<section id="info">
<h2>Jeudi <span>17</span> aout</h2>
<h2>08:00</h2>
</section>
<section id="nombre_vote">
<p>14</p><img src="../../assets/img/votant-sur.svg">
<p>76</p><img src="../../assets/img/votant-pas-sur.svg">
</section>
<section id="vote">
<img src="../../assets/img/check.svg">
<img src="../../assets/img/check-2.svg">
<img src="../../assets/img/croix.svg">
</section>
</div>

@ -0,0 +1,5 @@
.choice_container{
width:320px;
height:172px;
box-shadow: 0 3px 6px 0 rgba(black, 0.2);
}

@ -0,0 +1,25 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { VoteChoiceComponent } from './vote-choice.component';
describe('VoteChoiceComponent', () => {
let component: VoteChoiceComponent;
let fixture: ComponentFixture<VoteChoiceComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ VoteChoiceComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(VoteChoiceComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

@ -0,0 +1,15 @@
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'framadate-vote-choice',
templateUrl: './vote-choice.component.html',
styleUrls: ['./vote-choice.component.scss']
})
export class VoteChoiceComponent implements OnInit {
constructor() { }
ngOnInit() {
}
}

@ -0,0 +1,6 @@
<svg xmlns="http://www.w3.org/2000/svg" width="19" height="15" viewBox="0 0 19 15">
<g fill="#F5A623" fill-rule="evenodd">
<path d="M13.412 0C16.749 1.504 19 4.347 19 7.607c0 3.11-2.051 5.843-5.14 7.393l-.053-1.766c2.095-1.366 3.353-3.41 3.353-5.627 0-2.34-1.402-4.484-3.696-5.841L13.412 0zM5.588 0C2.251 1.504 0 4.347 0 7.607 0 10.717 2.051 13.45 5.14 15l.053-1.766C3.098 11.868 1.84 9.824 1.84 7.607c0-2.34 1.402-4.484 3.696-5.841L5.588 0z"/>
<path d="M8.326 12.692L4.648 8.588a.891.891 0 0 1 .038-1.114.681.681 0 0 1 .999-.043l2.641 2.947 4.989-5.565a.681.681 0 0 1 .999.043.891.891 0 0 1 .038 1.114l-6.026 6.722z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 656 B

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="12" viewBox="0 0 16 12">
<path fill="#429A00" fill-rule="evenodd" d="M6.133 12L.281 5.903a1.257 1.257 0 0 1 .062-1.656 1.136 1.136 0 0 1 1.589-.064l4.201 4.378L14.068.293a1.136 1.136 0 0 1 1.59.064c.432.45.458 1.172.06 1.656L6.134 12z"/>
</svg>

After

Width:  |  Height:  |  Size: 308 B

@ -0,0 +1,3 @@
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 12 12">
<path fill="#CD0000" fill-rule="evenodd" d="M7.314 6.05l4.465-4.461A.918.918 0 0 0 10.484.294L6.018 4.71 1.525.22A.92.92 0 0 0 .229 1.516l4.484 4.536-4.392 4.333a.918.918 0 1 0 1.296 1.295L6 7.299l4.355 4.353a.92.92 0 0 0 1.295-1.295L7.314 6.05z"/>
</svg>

After

Width:  |  Height:  |  Size: 344 B

@ -0,0 +1,10 @@
<svg xmlns="http://www.w3.org/2000/svg" width="22" height="24" viewBox="0 0 22 24">
<g fill="none" fill-rule="evenodd">
<path fill="#4A4A4A" fill-rule="nonzero" d="M16.556 13.749a10.963 10.963 0 0 0-16.112 0 .965.965 0 0 0-.25.639v3.833a.958.958 0 0 0 .959.946h14.694c.53 0 .959-.43.959-.959v-3.833a.965.965 0 0 0-.25-.626z"/>
<circle cx="8.5" cy="4.472" r="4.472" fill="#4A4A4A" fill-rule="nonzero"/>
<path fill="#FFF" fill-rule="nonzero" stroke="#FFF" stroke-width="4" d="M14.067 20.083l-2.926-3.048a.629.629 0 0 1 .03-.828.568.568 0 0 1 .795-.032l2.1 2.189 3.968-4.134a.568.568 0 0 1 .795.032c.216.225.23.586.03.828l-4.792 4.993z"/>
<path fill="#F5A623" fill-rule="nonzero" d="M14.067 20.083l-2.926-3.048a.629.629 0 0 1 .03-.828.568.568 0 0 1 .795-.032l2.1 2.189 3.968-4.134a.568.568 0 0 1 .795.032c.216.225.23.586.03.828l-4.792 4.993zM19 12.083c1.792.903 3 2.609 3 4.564 0 1.867-1.101 3.506-2.76 4.436l-.028-1.06c1.125-.819 1.8-2.046 1.8-3.376 0-1.403-.753-2.69-1.984-3.504L19 12.083z"/>
<path fill="#FFF" fill-rule="nonzero" stroke="#FFF" stroke-width="3" d="M10 12.083c-1.792.903-3 2.609-3 4.564 0 1.867 1.101 3.506 2.76 4.436l.028-1.06c-1.125-.819-1.8-2.046-1.8-3.376 0-1.403.753-2.69 1.984-3.504l.028-1.06z"/>
<path fill="#F5A623" fill-rule="nonzero" d="M10 12.083c-1.792.903-3 2.609-3 4.564 0 1.867 1.101 3.506 2.76 4.436l.028-1.06c-1.125-.819-1.8-2.046-1.8-3.376 0-1.403.753-2.69 1.984-3.504l.028-1.06z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.4 KiB

@ -0,0 +1,9 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="21" viewBox="0 0 20 21">
<defs>
<path id="a" d="M8.667 10.205c2.13-.029 4.221.541 6.03 1.638l.336.212-4.56 5.008L7.9 14.338a1.887 1.887 0 0 0-2.017-.472 1.84 1.84 0 0 0-1.216 1.653c-.024.44.114.873.385 1.22l.108.126 2.047 2.165H1.493a1.325 1.325 0 0 1-1.286-1.18L.2 17.718v-3.537a.65.65 0 0 1 .133-.4 10.822 10.822 0 0 1 7.655-3.573l.339-.007zm8.466 5.046v2.468c0 .71-.572 1.291-1.293 1.312h-2.127l3.42-3.78zM8.66.361c2.507 0 4.54 2 4.54 4.469 0 2.468-2.033 4.47-4.54 4.47S4.12 7.297 4.12 4.83 6.153.36 8.66.36z"/>
</defs>
<g fill="none" fill-rule="nonzero">
<use fill="#4A4A4A" xlink:href="#a"/>
<path fill="#429A00" d="M19.18 10.25a.673.673 0 0 0-.947.053l-7.746 8.531-3.467-3.668a.67.67 0 0 0-.94-.072.651.651 0 0 0 0 .932l4.453 4.725 8.694-9.595a.649.649 0 0 0-.047-.905z"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 933 B

@ -10,6 +10,7 @@ $dark-lavender: #7d6c99;
$dusty-orange: #f18647;
$violet: #bd10e0;
$red: #cd0000;
$cool-grey: #aeafb1;
// interpretations in app
$primary_color: $ugly-purple;
@ -17,6 +18,7 @@ $secondary_color: $lavender-pink;
$font_color: $black;
$logo_color: $dark-lavender;
$logo_color_2: $camo;
$choice_select_border_color: $cool-grey;
// FONT
$default_font : "pt_sans";

Loading…
Cancel
Save