Widget: Compass: Difference between revisions
From LINKS Community Center
Eschmidt (talk | contribs) No edit summary |
Eschmidt (talk | contribs) No edit summary |
||
| Line 3: | Line 3: | ||
<includeonly> | <includeonly> | ||
<style> | <style> | ||
.plus.icon { | |||
color: #000; | |||
position: absolute; | |||
margin-left: 3px; | |||
margin-top: 10px; | |||
} | |||
.plus.icon:before { | |||
content: ''; | |||
position: absolute; | |||
width: 15px; | |||
height: 1px; | |||
background-color: currentColor; | |||
} | |||
.plus.icon:after { | |||
content: ''; | |||
position: absolute; | |||
width: 15px; | |||
height: 1px; | |||
background-color: currentColor; | |||
-webkit-transform: rotate(90deg); | |||
transform: rotate(90deg); | |||
} | |||
#cmp-container { | #cmp-container { | ||
font-family: 'Open Sans'; | font-family: 'Open Sans'; | ||
| Line 28: | Line 53: | ||
} | } | ||
#cmp-container h2::after { | /* #cmp-container h2::after { | ||
display: inline-block; | display: inline-block; | ||
content: "→"; | content: "→"; | ||
transform: rotate(90deg); | transform: rotate(90deg); | ||
margin-left: .5em; | margin-left: .5em; | ||
} | } */ | ||
#cmp-container h2.opened::after { | /* #cmp-container h2.opened::after { | ||
transform: rotate(-90deg); | transform: rotate(-90deg); | ||
} | } */ | ||
#cmp-container h3 { | #cmp-container h3 { | ||
| Line 91: | Line 116: | ||
} | } | ||
.choice small { font-size: 70%; } | .choice small { | ||
font-size: 70%; | |||
} | |||
.choice.tech { | |||
color: var(--links-blue); | |||
border: 1px solid var(--links-blue); | |||
} | |||
.choice.guide { | |||
color: var(--links-orange); | |||
border: 1px solid var(--links-orange); | |||
} | |||
.choice.tech { color: var(--links-blue); | .choice.tech:hover { | ||
background-color: var(--links-blue); | |||
color: #fff; | |||
} | |||
.choice. | .choice.guide:hover { | ||
background-color: var(--links-orange); | |||
color: #fff; | |||
} | |||
</style> | </style> | ||
| Line 104: | Line 145: | ||
<h2>Engaging Citizens</h2> | <h2>Engaging Citizens</h2> | ||
<div class="subtheme"> | <div class="subtheme"> | ||
<h3>Collecting and Analysing Information from SMCS</h3> | <h3>Collecting and Analysing Information from SMCS <div class="plus icon"></div></h3> | ||
<div class="question" data-aspect="Social"> | <div class="question" data-aspect="Social"> | ||
Whom do you want to include in your collection and analysis of information, and from whom do you | Whom do you want to include in your collection and analysis of information, and from whom do you | ||
| Line 112: | Line 153: | ||
<div class="answer-wrapper"> | <div class="answer-wrapper"> | ||
<div class="choice tech">Technologies<br><small>Lorem ipsum dolor sit amet</small></div> | <div class="choice tech">Technologies<br><small>Lorem ipsum dolor sit amet</small></div> | ||
<div class="choice guide">Guidelines<br><small>Consectetur adipiscing coconut wigwam</small></div> | <div class="choice guide">Guidelines<br><small>Consectetur adipiscing coconut wigwam</small> | ||
</div> | |||
<div class="choice tech">Technologies<br><small>Lorem ipsum dolor sit amet</small></div> | <div class="choice tech">Technologies<br><small>Lorem ipsum dolor sit amet</small></div> | ||
<div class="choice guide">Guidelines<br><small>Consectetur adipiscing coconut wigwam</small></div> | <div class="choice guide">Guidelines<br><small>Consectetur adipiscing coconut wigwam</small> | ||
<div class="choice guide">Guidelines<br><small>Consectetur adipiscing coconut wigwam</small></div> | </div> | ||
<div class="choice guide">Guidelines<br><small>Consectetur adipiscing coconut wigwam</small> | |||
</div> | |||
</div> | </div> | ||
</div> | </div> | ||
| Line 125: | Line 169: | ||
<div class="answer-wrapper"> | <div class="answer-wrapper"> | ||
<div class="choice tech">Technologies<br><small>Lorem ipsum dolor sit amet</small></div> | <div class="choice tech">Technologies<br><small>Lorem ipsum dolor sit amet</small></div> | ||
<div class="choice guide">Guidelines<br><small>Consectetur adipiscing coconut wigwam</small></div> | <div class="choice guide">Guidelines<br><small>Consectetur adipiscing coconut wigwam</small> | ||
</div> | |||
</div> | </div> | ||
</div> | </div> | ||
Revision as of 10:20, 23 November 2022
Development version of the Compass.
Not ready for production!