Widget
Glossary
No edit summary Tag: 2017 source edit |
No edit summary Tag: 2017 source edit |
||
| (8 intermediate revisions by the same user not shown) | |||
| Line 1: | Line 1: | ||
<style> | <style> | ||
.glossary-item { | .glossary-item { | ||
flex: 0 0 30%; | |||
flex: 0 0 | padding: 10px; | ||
padding-bottom: 40px; | |||
background-color: #F3F6F9; | |||
min-height: 200px; | |||
max-width: 30%; | |||
position: relative; | |||
} | |||
.glossary-title { | .glossary-title { | ||
font- | font-size: 18px; | ||
color: #333; | |||
margin-bottom: 5px; | |||
} | |||
.glossary-content { | .glossary-content { | ||
margin- | font-size: 14px; | ||
color: #666; | |||
margin-bottom: 30px; | |||
overflow: hidden; | |||
} | |||
.read-more { | .read-more { | ||
position: absolute; | |||
bottom: 10px; | |||
right: 10px; | |||
font-size: 14px; | |||
color: #0066cc; | |||
text-decoration: none; | text-decoration: none; | ||
} | |||
@media ( | .read-more:hover { | ||
text-decoration: underline; | |||
} | |||
@media (max-width: 768px) { | |||
.glossary-item { | .glossary-item { | ||
flex: 0 0 100%; | |||
padding-bottom: 40px; | |||
max-width: 100%; | |||
} | } | ||
} | |||
</style> | </style> | ||
<div class="glossary-item"> | <div class="glossary-item"> | ||
<div class="glossary-title"><!--{$heading|default:'Default Heading'}--></div> | <div class="glossary-title"><!--{$heading|default:'Default Heading'}--></div> | ||
<div class="glossary-content"> <!--{$description|default:'Default Description'}--></div> | <div class="glossary-content"> <!--{$description|default:'Default Description'}--></div> | ||
<a href="<!--{$link|default:'https://wiki.mdriven.net'}-->" class="read-more">Read more ></a> | <a href="<!--{$link|default:'https://wiki.mdriven.net'}-->" class="read-more">Read more ></a> | ||
</div> | </div> | ||
Revision as of 12:26, 3 May 2024
<style>
.glossary-item {
flex: 0 0 30%;
padding: 10px;
padding-bottom: 40px;
background-color: #F3F6F9;
min-height: 200px;
max-width: 30%;
position: relative;
}
.glossary-title {
font-size: 18px; color: #333; margin-bottom: 5px;
}
.glossary-content {
font-size: 14px; color: #666; margin-bottom: 30px; overflow: hidden;
}
.read-more {
position: absolute; bottom: 10px; right: 10px; font-size: 14px; color: #0066cc; text-decoration: none;
}
.read-more:hover {
text-decoration: underline;
}
@media (max-width: 768px) {
.glossary-item {
flex: 0 0 100%;
padding-bottom: 40px;
max-width: 100%;
}
} </style>
<a href="" class="read-more">Read more ></a>
This page was edited 4 days ago on 05/16/2024. What links here
Retrieved from "https://wiki.mdriven.net/index.php?title=Widget:Glossary&oldid=18302"