mirrors/TiddlyWiki5
1
0
Fork 0
mirror of https://github.com/Jermolene/TiddlyWiki5 synced 2024-12-28 19:10:28 +00:00
Code Issues Releases Wiki Activity
13bedda377
TiddlyWiki5/editions/tw5.com/tiddlers/system/tw5.com-styles.tid

136 lines
2.6 KiB
Plaintext
Raw Normal View History

Visual changes to Saving Tiddler (#4640) * Styles and templates for visual changes to Saving methods listing * Color coding saver methods according to delivery * Changes to tags and few tiddlers - The tag InternetExplorer has been changed to [[Internet Explorer]] - A tag for Edge is added - Reclassified TiddlyServer as DIY instead of App The existing criteriion for classification is unclear. Here is my reasoning for the change. An app is something user can simply install and run. Like TiddlyDesktop or Tiddloid. A DIY is something user has to install additional runtimes for. Thus Nodejs is a DIY. In the same vein, TiddlyServer is a DIY * Adding Twexe * Reversing accidental changes to StoryList * Restyling Download button and Card Size * Removing "Read more" links Entire card is now clickable To give visual clues regarding the clickability of card, title will change color to blue on card hover * Removing margins from elements under link and adding padding instead. Why this change? Margins are not "clickable". Having margins under <a> tag means there are minute dead areas where the mouse pointer will change shape, is not clickable and degrade user experience. Paddings are "clickable"
2020-06-14 10:48:13 +00:00
created: 20200507002727378
[tw.com] Improve the saver cards (#6799) * [tw.com] Improve the saver cards * [tw.com] Improve the saver cards _ take 2 * Update tw5.com-styles.tid
2022-07-19 18:05:23 +00:00
modified: 20220719132112414
Deprecate `$:/tags/stylesheet` in favour of `$:/tags/Stylesheet` A warning message appears at the top of the story river if any `$:/tags/stylesheet` tags are found. Fixing the first half of #824
2014-09-10 08:13:21 +00:00
tags: $:/tags/Stylesheet
Visual changes to Saving Tiddler (#4640) * Styles and templates for visual changes to Saving methods listing * Color coding saver methods according to delivery * Changes to tags and few tiddlers - The tag InternetExplorer has been changed to [[Internet Explorer]] - A tag for Edge is added - Reclassified TiddlyServer as DIY instead of App The existing criteriion for classification is unclear. Here is my reasoning for the change. An app is something user can simply install and run. Like TiddlyDesktop or Tiddloid. A DIY is something user has to install additional runtimes for. Thus Nodejs is a DIY. In the same vein, TiddlyServer is a DIY * Adding Twexe * Reversing accidental changes to StoryList * Restyling Download button and Card Size * Removing "Read more" links Entire card is now clickable To give visual clues regarding the clickability of card, title will change color to blue on card hover * Removing margins from elements under link and adding padding instead. Why this change? Margins are not "clickable". Having margins under <a> tag means there are minute dead areas where the mouse pointer will change shape, is not clickable and degrade user experience. Paddings are "clickable"
2020-06-14 10:48:13 +00:00
title: $:/_tw5.com-styles
type: text/vnd.tiddlywiki
Break the links up into separate tiddlers
2014-03-22 17:32:28 +00:00
Stylesheet cleanup
2019-10-06 13:59:08 +00:00
\rules only filteredtranscludeinline transcludeinline macrodef macrocallinline macrocallblock
Docs: Fixed PR for getting started tweaks (#7399) * Cherry picked from getting-started-tweaks-feb-2023 * Update tiddler modified dates
2023-04-10 14:52:10 +00:00
.tc-hero-heading a.tc-tiddlylink {
font-weight: bold;
}
Docs updates
2015-04-16 17:33:55 +00:00
.tc-double-spaced-list li {
Simplify styling of community resources Feedback from @ssokolow
2016-07-10 15:14:58 +00:00
padding-bottom: .5em;
padding-top: .5em;
Update tw5.com-styles.tid
2014-09-04 18:05:17 +00:00
}
Yet more "tw-*" -> "tc-*" Part of #764
2014-08-28 18:41:29 +00:00
.tc-link-info-item {
Tweak colours for link info items
2016-07-12 11:35:05 +00:00
border: 1px solid #ebefcd;
Simplify styling of community resources Feedback from @ssokolow
2016-07-10 15:14:58 +00:00
padding: 5px 10px;
margin-bottom: 10px;
Better readability for "Community" Tiddler with various ... (#4493) ... color palettes
2020-03-12 13:34:59 +00:00
background: <<colour code-background>>;
Simplify styling of community resources Feedback from @ssokolow
2016-07-10 15:14:58 +00:00
font-size: 0.8em;
line-height: 1.2;
Break the links up into separate tiddlers
2014-03-22 17:32:28 +00:00
}
Yet more "tw-*" -> "tc-*" Part of #764
2014-08-28 18:41:29 +00:00
.tc-link-info-item h1 {
Break the links up into separate tiddlers
2014-03-22 17:32:28 +00:00
font-weight: 500;
font-size: 16px;
}
Add scrollable widget A new widget to handle scrollable areas. We’ll use it both for the story river and the sidebar.
2014-03-25 14:26:54 +00:00
Yet more "tw-*" -> "tc-*" Part of #764
2014-08-28 18:41:29 +00:00
.tc-scrollable-demo {
Add scrollable widget A new widget to handle scrollable areas. We’ll use it both for the story river and the sidebar.
2014-03-25 14:26:54 +00:00
border: 1px solid <<colour message-border>>;
background-color: <<colour message-background>>;
padding: 1em;
height: 400px;
Add position: relative to scrollable widget So that popups within the scrollable behave correctly. Fixes #1679
2015-04-27 12:38:20 +00:00
position: relative;
Fix problem with scrollable widget in static rendering Fixes #1910
2016-03-21 21:59:57 +00:00
overflow: auto;
Add scrollable widget A new widget to handle scrollable areas. We’ll use it both for the story river and the sidebar.
2014-03-25 14:26:54 +00:00
}
Add banner soliciting documentation improvements A first pass
2014-08-20 10:25:56 +00:00
Final round of "tw-" -> "tc-" conversions Part of #764
2014-08-28 18:53:02 +00:00
.tc-improvement-banner {
Add banner soliciting documentation improvements A first pass
2014-08-20 10:25:56 +00:00
font-size: 0.7em;
Tweaks to the improvement banner I think it looks pretty terrible, and am minded not to include it in 5.0.15. Interested in other views.
2014-08-20 16:06:39 +00:00
background: #fcc;
padding-left: 5px;
Move improvement banner to the edit template Thanks to @xcazin for the most excellent suggestion.
2014-08-20 21:07:39 +00:00
margin-top: 6px;
margin-bottom: 12px;
Tweaks to the improvement banner I think it looks pretty terrible, and am minded not to include it in 5.0.15. Interested in other views.
2014-08-20 16:06:39 +00:00
<<box-shadow "2px 2px 2px rgba(0,0,0,0.4)">>
}
@media (max-width: {{$:/themes/tiddlywiki/vanilla/metrics/sidebarbreakpoint}}) {
Final round of "tw-" -> "tc-" conversions Part of #764
2014-08-28 18:53:02 +00:00
.tc-improvement-banner {
Tweaks to the improvement banner I think it looks pretty terrible, and am minded not to include it in 5.0.15. Interested in other views.
2014-08-20 16:06:39 +00:00
}
}
@media (min-width: {{$:/themes/tiddlywiki/vanilla/metrics/sidebarbreakpoint}}) {
Final round of "tw-" -> "tc-" conversions Part of #764
2014-08-28 18:53:02 +00:00
.tc-improvement-banner {
Tweak doc improvement banner
2014-09-05 09:06:46 +00:00
margin-right: -53px;
Tweaks to the improvement banner I think it looks pretty terrible, and am minded not to include it in 5.0.15. Interested in other views.
2014-08-20 16:06:39 +00:00
margin-left: -53px;
}
Final round of "tw-" -> "tc-" conversions Part of #764
2014-08-28 18:53:02 +00:00
.tc-improvement-banner:before {
Tweaks to the improvement banner I think it looks pretty terrible, and am minded not to include it in 5.0.15. Interested in other views.
2014-08-20 16:06:39 +00:00
display: block;
position: absolute;
width: 0;
height: 0;
content: " ";
margin-left: -5px;
margin-top: -10px;
border-top: 5px solid transparent;
border-left: 5px solid transparent;
border-right: 5px solid #C07E7E;
border-bottom: 5px solid #C07E7E;
}
Add banner soliciting documentation improvements A first pass
2014-08-20 10:25:56 +00:00
}
Final round of "tw-" -> "tc-" conversions Part of #764
2014-08-28 18:53:02 +00:00
.tc-improvement-banner svg {
Add banner soliciting documentation improvements A first pass
2014-08-20 10:25:56 +00:00
width: 1em;
height: 1em;
}
Visual changes to Saving Tiddler (#4640) * Styles and templates for visual changes to Saving methods listing * Color coding saver methods according to delivery * Changes to tags and few tiddlers - The tag InternetExplorer has been changed to [[Internet Explorer]] - A tag for Edge is added - Reclassified TiddlyServer as DIY instead of App The existing criteriion for classification is unclear. Here is my reasoning for the change. An app is something user can simply install and run. Like TiddlyDesktop or Tiddloid. A DIY is something user has to install additional runtimes for. Thus Nodejs is a DIY. In the same vein, TiddlyServer is a DIY * Adding Twexe * Reversing accidental changes to StoryList * Restyling Download button and Card Size * Removing "Read more" links Entire card is now clickable To give visual clues regarding the clickability of card, title will change color to blue on card hover * Removing margins from elements under link and adding padding instead. Why this change? Margins are not "clickable". Having margins under <a> tag means there are minute dead areas where the mouse pointer will change shape, is not clickable and degrade user experience. Paddings are "clickable"
2020-06-14 10:48:13 +00:00
.tc-wrapper-flex {
display: flex;
}
.tc-btn-download {
WIP
2022-07-31 14:34:31 +00:00
padding: 10px 30px;
Visual changes to Saving Tiddler (#4640) * Styles and templates for visual changes to Saving methods listing * Color coding saver methods according to delivery * Changes to tags and few tiddlers - The tag InternetExplorer has been changed to [[Internet Explorer]] - A tag for Edge is added - Reclassified TiddlyServer as DIY instead of App The existing criteriion for classification is unclear. Here is my reasoning for the change. An app is something user can simply install and run. Like TiddlyDesktop or Tiddloid. A DIY is something user has to install additional runtimes for. Thus Nodejs is a DIY. In the same vein, TiddlyServer is a DIY * Adding Twexe * Reversing accidental changes to StoryList * Restyling Download button and Card Size * Removing "Read more" links Entire card is now clickable To give visual clues regarding the clickability of card, title will change color to blue on card hover * Removing margins from elements under link and adding padding instead. Why this change? Margins are not "clickable". Having margins under <a> tag means there are minute dead areas where the mouse pointer will change shape, is not clickable and degrade user experience. Paddings are "clickable"
2020-06-14 10:48:13 +00:00
border-radius: 5px;
Allow the big download button to be defined using the colour palette values (#7064)
2022-11-26 11:15:47 +00:00
background: <<colour "download-background">>;
border: none;
box-shadow: 1px 2px 2px 0 <<colour muted-foreground>>;
Visual changes to Saving Tiddler (#4640) * Styles and templates for visual changes to Saving methods listing * Color coding saver methods according to delivery * Changes to tags and few tiddlers - The tag InternetExplorer has been changed to [[Internet Explorer]] - A tag for Edge is added - Reclassified TiddlyServer as DIY instead of App The existing criteriion for classification is unclear. Here is my reasoning for the change. An app is something user can simply install and run. Like TiddlyDesktop or Tiddloid. A DIY is something user has to install additional runtimes for. Thus Nodejs is a DIY. In the same vein, TiddlyServer is a DIY * Adding Twexe * Reversing accidental changes to StoryList * Restyling Download button and Card Size * Removing "Read more" links Entire card is now clickable To give visual clues regarding the clickability of card, title will change color to blue on card hover * Removing margins from elements under link and adding padding instead. Why this change? Margins are not "clickable". Having margins under <a> tag means there are minute dead areas where the mouse pointer will change shape, is not clickable and degrade user experience. Paddings are "clickable"
2020-06-14 10:48:13 +00:00
overflow: hidden;
cursor: pointer;
Allow the big download button to be defined using the colour palette values (#7064)
2022-11-26 11:15:47 +00:00
font-size: 1.2em;
line-height: 1.4em;
color: #fff;
fill: #fff;
Visual changes to Saving Tiddler (#4640) * Styles and templates for visual changes to Saving methods listing * Color coding saver methods according to delivery * Changes to tags and few tiddlers - The tag InternetExplorer has been changed to [[Internet Explorer]] - A tag for Edge is added - Reclassified TiddlyServer as DIY instead of App The existing criteriion for classification is unclear. Here is my reasoning for the change. An app is something user can simply install and run. Like TiddlyDesktop or Tiddloid. A DIY is something user has to install additional runtimes for. Thus Nodejs is a DIY. In the same vein, TiddlyServer is a DIY * Adding Twexe * Reversing accidental changes to StoryList * Restyling Download button and Card Size * Removing "Read more" links Entire card is now clickable To give visual clues regarding the clickability of card, title will change color to blue on card hover * Removing margins from elements under link and adding padding instead. Why this change? Margins are not "clickable". Having margins under <a> tag means there are minute dead areas where the mouse pointer will change shape, is not clickable and degrade user experience. Paddings are "clickable"
2020-06-14 10:48:13 +00:00
}
.tc-btn-download:active {
Allow the big download button to be defined using the colour palette values (#7064)
2022-11-26 11:15:47 +00:00
box-shadow: none;
[tw.com] Improve the saver cards (#6799) * [tw.com] Improve the saver cards * [tw.com] Improve the saver cards _ take 2 * Update tw5.com-styles.tid
2022-07-19 18:05:23 +00:00
}
Move fourcolumns CSS class as multicolumns to tw5-styles for reuse (#7318)
2023-03-03 21:25:12 +00:00
/* WikiText rules */
.multi-columns,
.fourcolumns {
display: block;
column-count: 4;
column-gap: 1em;
-moz-column-count: 4;
-moz-column-gap: 1em;
-webkit-column-count: 4;
-webkit-column-gap: 1em;
}
Adjust multi-columns CSS class to switch earlier for smaller displays (#8686)
2024-10-18 11:01:58 +00:00
/* Switch to 2 columns for 780x1280 displays which is 780p */
@media (max-width: 1279px) {
Move fourcolumns CSS class as multicolumns to tw5-styles for reuse (#7318)
2023-03-03 21:25:12 +00:00
.multi-columns {
column-count: 2;
}
GettingStarted styling fixes From @ericshulman see https://talk.tiddlywiki.org/t/gettingstarted-tiddler-on-tiddlywiki-com-not-showing-any-results/10864/7
2024-10-09 14:29:19 +00:00
}
Adjust multi-columns CSS class to switch earlier for smaller displays (#8686)
2024-10-18 11:01:58 +00:00
@media (max-width: {{$:/themes/tiddlywiki/vanilla/metrics/sidebarbreakpoint}}) {
.multi-columns {
column-count: 1;
}
}
GettingStarted styling fixes From @ericshulman see https://talk.tiddlywiki.org/t/gettingstarted-tiddler-on-tiddlywiki-com-not-showing-any-results/10864/7
2024-10-09 14:29:19 +00:00
.tc-saving-sidebar-category { margin-bottom:10px; }
.tc-saving-sidebar-category-title { margin-bottom:5px; font-weight:bold; }
.tc-saving-sidebar-category-item { margin-left:10px; white-space:nowrap; }
Reference in New Issue Copy Permalink